[Done] 0.15 BTC to anyone who can fix my webapp

[MaliceRed]

Edit: Hey folks, I want to extend a thank you for everyone who came to help us out on the thread.

We're going to pull this bounty, as no one seems to know what's wrong. So we're just going to give up on it. Thanks for everyone swinging by again, and trying to take a crack at it!

We've come to the conclusion that kik's api is a buggy piece of shit, and we're no longer going to be using their service. Thanks and good luck to you all!


Alrighty, let's start with an introduction. I'm MaliceRed, a graphics designer some of you guys know me from my obnoxiously bumped thread. (Sorry)

I'm here today to make a complete fool of myself bounty regarding a project that I designed a concept of.

Let me start also by saying, I have 0 experience in js, Php, mysql, and basically programming in general.

The bounty is 0.15
Slightly low, but possibly enough to get someone's interest?

What is the bounty for?

Alright, this will take some time to explain.

Currently, I have a website: http://5.196.157.118/

It's designed to work within Kik's Browser. So if you have a phone, go check the website out through kik's browser.

On a browser outside of kik, this site works fine. The elements are properly in place, and it's responsive so everything stays in a neat format to accommodate for mobile users. The sliders work, everything good.
https://i.imgur.com/VhymM25.png

However! When you go to kik's browser, and open the page up. Everything is broken!
The format is completely gunked, the sliders and arrows don't work. Buttons do not consistently register clicks. What really makes this a nightmare, is that this is not always something we can replicate!

We have reports that sometimes it works just fine on mobile devices, and sometimes it just doesn't. Sometimes, if your phone supports horizontal and vertical views, just switching that out fixes it!

We've tried asking Kik developers, but as you can imagine, they gladly told us to fuck off and shrugged off our questions.

So if anyone can check it out, and possibly figure out what's the problem I will give you the bounty, and later on, will be more than happy to extend my appreciation with profits in the future if our app kicks off.

I will answer all questions to the best of my knowledge. And I will be escrowing the bounty with Blazedout419

I sincerely thank anyone who's willing to help, and thank you for reading up until now.

[1713934657]

1713934657

[1713934657]

1713934657

[1713934657]

1713934657

[MaliceRed]

Updated bounty to 0.1 courtesy of Yogg, thank you very much!

[Blazed]

Not that it is really needed, but I am holding the .1BTC in escrow.

I now have .15BTC in escrow.

[Bitcoined-Me]

Hi,

Just looked at your code. The problem lies with your nested tags. You have an unclosed tag which is conflicting with your nested layout structure.

Best,

If it helped: 17yd8aynNyzhtXAoPhf39MHgbg4qYgU9bU

EDIT:

Check all your '<ons>' tags close properly and make sure you don't do things like this:

<ons><div></ons></div>

Correct way should be:

<ons><div></div></ons>

or

<div><ons></ons></div>

[Bitcoined-Me]

Also found the following Javascript errors. Might not be related but still good to fix:


Failed to load resource: the server responded with a status of 404 (Not Found):
http://5.196.157.118/%7B%7B%20item.kik_profilepic%20%7D%7D


Failed to load resource: the server responded with a status of 403 (Forbidden)
kik.js:12 kik not found:
http://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-660758189238110…jl=u&srr=1&fu=0&bc=1&ifi=1&xpc=J19dnX1LIZ&p=http%3A//5.196.157.118&dtd=162


Failed to load resource: the server responded with a status of 403 (Forbidden):
http://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-660758189238110…jl=u&srr=1&fu=0&bc=1&ifi=1&xpc=J19dnX1LIZ&p=http%3A//5.196.157.118&dtd=162

[Bitcoined-Me]

Further inspection..

As a test:

Try replacing
<meta name="viewport" content="width=device-width, initial-scale=1">

With
<meta name="viewport" content="width=640, user-scalable=no" />

[MaliceRed]

Hi,

Just looked at your code. The problem lies with your nested tags. You have an unclosed tag which is conflicting with your nested layout structure.

Best,

If it helped: 17yd8aynNyzhtXAoPhf39MHgbg4qYgU9bU

EDIT:

Check all your '<ons>' tags close properly and make sure you don't do things like this:

<ons><div></ons></div>

Correct way should be:

<ons><div></div></ons>

or

<div><ons></ons></div>

We couldn't find the lines you are referring to, and we've tried looking in firefox, which usually tells you when you have an improper tags.
Additionally we ran through the code, line by line, looking for any mis-matched tags, as well as the W3 validity checker which usually finds improperly nested tags.

[someguy123]

Adding another BTC.05 to this bounty, making the total BTC.15

Further inspection..

As a test:

Try replacing
<meta name="viewport" content="width=device-width, initial-scale=1">

With
<meta name="viewport" content="width=640, user-scalable=no" />

Just modified the viewport to that, it made the layout work on my phone within Kik, but is still completely borked (but slightly less broken than before) in Bluestacks and on MaliceRed's phone. The arrows are still broken, strange bug: if you type something into the search box at the bottom, the arrows begin functioning (not a problem on desktop Chrome with the Kik Dev tools)

[RealPhotoshoper]

your website really in mess
i just can help you with design

[Bitcoined-Me]

Adding another BTC.05 to this bounty, making the total BTC.15

Further inspection..

As a test:

Try replacing
<meta name="viewport" content="width=device-width, initial-scale=1">

With
<meta name="viewport" content="width=640, user-scalable=no" />

Just modified the viewport to that, it made the layout work on my phone within Kik, but is still completely borked (but slightly less broken than before) in Bluestacks and on MaliceRed's phone. The arrows are still broken, strange bug: if you type something into the search box at the bottom, the arrows begin functioning (not a problem on desktop Chrome with the Kik Dev tools)

Ok.. a bit of progress I guess

Now try adding this to the top of your CSS file. Hopefully this will fix the arrows.

HTML {
    -webkit-text-size-adjust: none;
}

[MaliceRed]

Adding another BTC.05 to this bounty, making the total BTC.15

Further inspection..

As a test:

Try replacing
<meta name="viewport" content="width=device-width, initial-scale=1">

With
<meta name="viewport" content="width=640, user-scalable=no" />

Just modified the viewport to that, it made the layout work on my phone within Kik, but is still completely borked (but slightly less broken than before) in Bluestacks and on MaliceRed's phone. The arrows are still broken, strange bug: if you type something into the search box at the bottom, the arrows begin functioning (not a problem on desktop Chrome with the Kik Dev tools)

Ok.. a bit of progress I guess

Now try adding this to the top of your CSS file. Hopefully this will fix the arrows.

HTML {
    -webkit-text-size-adjust: none;
}

Hello, thanks again for trying to help out.
However, nothing has really changed after implementing this.

[roslinpl]

Adding another BTC.05 to this bounty, making the total BTC.15

Further inspection..

As a test:

Try replacing
<meta name="viewport" content="width=device-width, initial-scale=1">

With
<meta name="viewport" content="width=640, user-scalable=no" />

Just modified the viewport to that, it made the layout work on my phone within Kik, but is still completely borked (but slightly less broken than before) in Bluestacks and on MaliceRed's phone. The arrows are still broken, strange bug: if you type something into the search box at the bottom, the arrows begin functioning (not a problem on desktop Chrome with the Kik Dev tools)

Ok.. a bit of progress I guess

Now try adding this to the top of your CSS file. Hopefully this will fix the arrows.

HTML {
    -webkit-text-size-adjust: none;
}

Hello, thanks again for trying to help out.
However, nothing has really changed after implementing this.

Hey.

I will have a look later on.  Hopefully I will sort it out

Best regards.

[Bitcoined-Me]

Adding another BTC.05 to this bounty, making the total BTC.15

Further inspection..

As a test:

Try replacing
<meta name="viewport" content="width=device-width, initial-scale=1">

With
<meta name="viewport" content="width=640, user-scalable=no" />

Just modified the viewport to that, it made the layout work on my phone within Kik, but is still completely borked (but slightly less broken than before) in Bluestacks and on MaliceRed's phone. The arrows are still broken, strange bug: if you type something into the search box at the bottom, the arrows begin functioning (not a problem on desktop Chrome with the Kik Dev tools)

Ok.. a bit of progress I guess

Now try adding this to the top of your CSS file. Hopefully this will fix the arrows.

HTML {
    -webkit-text-size-adjust: none;
}

Hello, thanks again for trying to help out.
However, nothing has really changed after implementing this.

OK, I'll keep looking at the code to see if I can find the issue

[defcon23]

i will take a look to your code in the evening. i 'll come back to you soon,
regards,

[MaliceRed]

Thanks to everyone for posting and willing to take a look at the site. I can't put in words how much I appreciate the assistance.

Chatvine has been one of my dreams for a long time, and we put in a lot of effort into the draft and what we have so far. I really hope things work out.

We'll give this about a week before we start thinking outside the box.

[MaliceRed]

Terrible down time.