Web page not loading properly on iPod 5 - ios

In our app we've got an ordinary UIWebView showing a web page. And it works perfectly on any type of device except iPod 5. When being executed on that device the page is showed just partly, without images, just few lines of text and that's it. The more interesting is that the same thing happens even if you open this page in Safari on this iPod. We've already tried using different types of NSURLRequestCachePolicy and also using custom NSURLCache objects but all in vain. Can anybody suggest a solution?

Related

iPhone web application : the virtual keyboard opens unexpectedly

I am having a very weird issue on an iPhone and I would like to have suggestions on the best way to troubleshoot. My web application works fine for a moment then suddenly all text fields and buttons will have no effect, but only to open the virtual keyboard.
For example, a "delete" button which used to display a "yes/Cancel" modal will only make the keyboard open, the modal won't show up... When I reload the page, everything is working as expected again.
I am testing with an iPhone 6 and Chrome.
Did someone already encountered an issue like that?
I have absolutely no idea how to track down this behaviour and all suggestions are welcomed, What do you suggest I should look in priority?
This issue was coming from a bug in a version of Chrome I was using at that moment (I have no idea which one, since my phone has regular automatic updates).
I strongly advise to have always at lease two different platforms when testing websites!

NSLog (or other monitoring event) within UIWebView operations

I'm moderately experienced with iOS, but I'm using UIWebView for the first time on this project.
I'm wondering, is there a way to monitor the line-by-line, internal operations of a UIWebView in Xcode? Maybe drop some NSLogs in there, or some breakpoints? The delegate methods cover the pre- and post-load stuff, but there doesn't seem to be any interface to actually track what the WebView itself does when it loads a page.
Specifically, I'd like to be able to track the app's behavior as each image from a webpage is downloaded and stored. I'm getting some weird errors around an image being unusable on iOS 7, but my PHP/JavaScript swears that everything is fine on its end, and the image seems fine on desktops and on iOS 6. I'm increasingly certain that the problem has to do with the WebView itself, (an answer to a related question seems to suggest it could be about WebKit calls on different threads), and I'd love to breakpoint my way through, or NSLog some key points or something, just to rule some stuff out.
Is anything like this possible? Or is UIWebView a private party that you can only hear about once it's over?
Does it break in Mobile Safari or only in your app?
You can point Safari's web inspector on OS X at Mobile Safari running in the iOS simulator or even on an iOS device (it has to be enabled in settings).
This will allow you to view all the HTTP headers and so on.
Another option is to use something like wireshark to monitor TCP traffic, but that's a lot more complicated.
http://webdesign.tutsplus.com/tutorials/workflow-tutorials/quick-tip-using-web-inspector-to-debug-mobile-safari/

Web development for iPad: how to make safari view non-draggable

I'm making a web project that is fitted to the iPad screen. I'm trying to make it look as much like a native app as possible. It is loaded in safari or atomic browser. What I'm trying to find out is if it's possible to eliminate the drag and even the zoom functions of one of those browsers for just that site.
To rephrase, I want to make my site fixed on the screen at all times. The issue is, a user will try to hit a button and it will drag the screen.
PS. An additional question is how I can make it so images don't have the "save as" functionality if held down I tried putting a span over the images, and that worked for firefox, but not iPad safari.
If you can solve any or all of these, you would have my biggest thanks!
Turns out that there are several metatags that you can put in your js file which keep the screen fixed. Good stuff on that is here:
http://jakeboyles.com/2011/01/16/how-to-build-an-iphone-and-ipad-web-app/
As far as the "save as" issue, I don't know yet, that part of my app development hasn't been solved.

iPad Limitations on Canvas Tag; Webpage Crashses on Canvas Tag Animation

Does anyone know if the iPad has any limitations on the canvas tag?
Currently I'm working on a creative that uses a flipbook and audio tag combination to simulate inline video content. The animations are drawn to the canvas element and synced with the audio content being played. There are 4 short video clips that get played when someone clicks on the four buttons below.
http://cs.sandbox.millennialmedia.com/~tkirchner/rich/K/kungfupanda2_test/
The problem I'm having though is in iPad. After playing a few animations, mobile safari just suddenly crashes. It never happens when I play it on my iPhone but it happens every time on the iPad. Its not one particular animation either because if I click a different combination of buttons, the previous clip that it crashed on plays fine, and then it decides to crash on another clip.
I think the problem might have to do with the amount of memory Safari gives individual page views. I found a blog post that explains that problem pretty well.
http://roblaplaca.com/blog/2010/05/05/ipad-safari-image-limit-workaround/
According to that post, once mobile Safari reaches a particular threshold of memory, images begin to return blank. This is consistant with my finds so far. The iPad that I'm testing this all on is running iOS 3.2.1 (and before anyone tells me that I should just explain to my boss that nobody uses 3.X anymore, I tried... they still want me to investigate this). I borrowed a co-workers iPad running iOS 4.2.1 and that device didn't crash, but some of the images weren't being drawn to the canvas.
I'm pretty sure its a problem with the canvas tag too, because I tried experimenting with running the animation without drawing anything to the canvas element, and the page never crashed.
Thats why I think maybe its a limitation with Safari's support of the canvas tag. Of course, I'm open to anybody else's suggestions.
Feels kinda weird answering my own question again, buuuut I figured if anyone did a search on this kind of question, an answer would be helpful.
I believe my original hypothesis was correct. The total amount of images that the aniamtions were using was around 600+. I think the older iPad loaded as many as it could and then when it ran out of cache and the canvas tag was trying to draw images that weren't really there anymore, it crashed.
Eventually we ended up serving the ad to devices with iOS 4.2 and higher, since the problem didn't seem to occur on those newer devices. Plus, we compressed the image sizes further, so that helped reduce the amount of images we were storing into memory.
If anybody knows approximately what the cache threshold in iOS 4.2 or higher browsers are, I'd appreciate it if you commented. Just want to get an idea of how many KB of image data I can safely load.

iOS 4.2.1 Mobile Safari won't show poster image

I've been working on an iPad-specific site that uses HTML5 video and though I've got video playback working, I can't for the life of me get the poster image to appear. It looks fine on Desktop Safari. Here's the code:
<video src="video/about_the_man.mp4" controls height=360 width=480 poster="video/posters/about_the_man.jpg"></video>
I've using this link as a reference (listing 1.2): https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html#//apple_ref/doc/uid/TP40009523-CH2-SW6
It says that on iOS the poster image will be shown until the user initiates playback, but right now all I'm getting is a black video-sized screen with a big play button in the center. I've looked at other postings on this top (here and here) but neither solution has worked for me. The only thing that's a little bit unconventional about the site is that the video element is in an inline lightbox, so initially on pageload it's not visible, but I don't know why that would make a difference.
I had the exact same problem. I decided to try my code on other iPad's, and it worked fine. The poster image showed up.
After scratching my head for a bit, the solution was to hard reset the iPad and try again. After a reboot, my iPad displayed the poster image as it should.
Maybe it will work for you?
I found there is a limit to the amount of images you can load on an iPad
Here is what it says:
I hit a mobile Safari limitation recently when building an AJAX-y site
on the iPad. If you load a ton of images eventually mobile Safari cuts
you off and will display a [?] instead of the image. After doing some
tests it appears that this limit is around 6.5 MB. Here’s a test page
I made that attempts to load 20 500kb images. When opening this page
on an iPad, 7 of the images don’t appear, even though in Charles they
are returning 200 – success. I’m assuming this is similar to the way
autoplay is disabled for the video tag on iPad/iPhone. Apple probably
wants to make sure users don’t get overloaded with downloads when
browsing on 3G.
Anyhow, 6.5 MB is a hefty load and wouldn’t fare well on 3G, but for one reason or another you may want to work around this limitation. I found the easiest way to patch my code was to load the image into a canvas tag using drawImage(). The canvas tag appears to be immune to the limitation.
Here’s another test page using the canvas tag, all the images should load.

Resources