HTML5 video on iOS5 not loading/showing - uiwebview

I have an HTML/JS app running in a webview in an iPad app. The app uses the HTML5 video tag. Videos work fine in iOS4.3 but today I've tested on iOS5 and the videos simply do not show up.
I have verified that it is not a layout related issue by setting background color and borders on the video element.
The same behaviour is evident irrespective of whether the app is run directly in mobile safari /from the home screen or within the webview.
The template for the video is simply:
<video controls src='{url}'></video> //where {url} is substituted at runtime.
The relevant video url plays correctly directly in the mobile Safari on iOS5.
I have tried to proxy the app comms and it seems that it does start loading the video but then stops, no video controls show and only the background color I have set shows thru.
Any ideas would be greatly appreciated. Thanks.

Have you tried create an empty webview, without additional parameters and scripts and make sure that you call it only once? I had the same issue when i call it twice without clearing previously created one - just audio was played.

Try to look at http://blog.millermedeiros.com/2011/03/html5-video-issues-on-the-ipad-and-how-to-solve-them/ and see if the fix works for you...
he he - should have read the fine print - did not notice you had answered yourself - remember to tick the thread off as answered

I've fixed this in code by changing the width and height by a pixel once the video element is created. Must invoke a repaint or something to that effect

Related

images taken with iphone appearing sideways when displayed in desktop browser

I'm building a feature in my app that makes use of input type file like this...
<input type="file" onChange={this.loadFile} accept="image/*" capture="camera" />
So when this input is activated on a phone it launches the phone camera. The resulting image is then saved in the file input. I then use HTML5 to base64 encode that image to a string and send it up to the server in an async post.
Here is the problem...
I then display these images taken by the camera in a list in a different part of the app. When I view these photos on the same device it looks fine. However, if I load the application into a desktop browser like chrome, the images appear sideways.
All the research I've done points to the fact that the phone is assuming I am taking a landscape picture when I'm really trying to take a portrait. It makes sense then that it would be displayed sideway, but it doesn't explain to me when it appears differently in different browsers. Also, the solution that I keep on hearing is that if I want to fix this, I need to open the image in a third party desktop app like photoshop, rotate it and save it. But that in the context I mentioned above is obviously not possible?
Is there a way to fix the orientation of the camera in the app? Or any other way to avoid this silly problem?
Thanks

Chrome extension, play sound in background script

I want to play a sound from a Chrome Extension, but I read that Content Scripts cannot play sounds. So I put this code in my background script:
var audio = new Audio("alert.ogg");
audio.play();
but still no sound. From the Console of the _generated_backgound_page.html I was able to inspect the Network tab and see that the sound file is loaded successfully, but I hear nothing.
Also, in another HTML page, I could load another Javascript, which has the above code, and it works (I can hear the sound.)
The fact that it is in the background script seems to have made it fail. Also, note that I do not have a background PAGE associated with the background SCRIPT. Does that matter?
edit: problem solved. The above code works but I forgot to listen to the right sound output channel.
You can generate the background page with javascript. I think the sound must be in a html page to be loaded and played.
This should work:
document.write('<audio id="player" src="data:audio/wav;base64,UklGRhwMAABXQVZFZm10IBAAAAABAAEAgD4AAIA+AAABAAgAZGF0Ya4LAACAgICAgICAgICAgICAgICAgICAgICAgICAf3hxeH+AfXZ1eHx6dnR5fYGFgoOKi42aloubq6GOjI2Op7ythXJ0eYF5aV1AOFFib32HmZSHhpCalIiYi4SRkZaLfnhxaWptb21qaWBea2BRYmZTVmFgWFNXVVVhaGdbYGhZbXh1gXZ1goeIlot1k6yxtKaOkaWhq7KonKCZoaCjoKWuqqmurK6ztrO7tbTAvru/vb68vbW6vLGqsLOfm5yal5KKhoyBeHt2dXBnbmljVlJWUEBBPDw9Mi4zKRwhIBYaGRQcHBURGB0XFxwhGxocJSstMjg6PTc6PUxVV1lWV2JqaXN0coCHhIyPjpOenqWppK6xu72yxMu9us7Pw83Wy9nY29ve6OPr6uvs6ezu6ejk6erm3uPj3dbT1sjBzdDFuMHAt7m1r7W6qaCupJOTkpWPgHqAd3JrbGlnY1peX1hTUk9PTFRKR0RFQkRBRUVEQkdBPjs9Pzo6NT04Njs+PTxAPzo/Ojk6PEA5PUJAQD04PkRCREZLUk1KT1BRUVdXU1VRV1tZV1xgXltcXF9hXl9eY2VmZmlna3J0b3F3eHyBfX+JgIWJiouTlZCTmpybnqSgnqyrqrO3srK2uL2/u7jAwMLFxsfEv8XLzcrIy83JzcrP0s3M0dTP0drY1dPR1dzc19za19XX2dnU1NjU0dXPzdHQy8rMysfGxMLBvLu3ta+sraeioJ2YlI+MioeFfX55cnJsaWVjXVlbVE5RTktHRUVAPDw3NC8uLyknKSIiJiUdHiEeGx4eHRwZHB8cHiAfHh8eHSEhISMoJyMnKisrLCszNy8yOTg9QEJFRUVITVFOTlJVWltaXmNfX2ZqZ21xb3R3eHqAhoeJkZKTlZmhpJ6kqKeur6yxtLW1trW4t6+us7axrbK2tLa6ury7u7u9u7vCwb+/vr7Ev7y9v8G8vby6vru4uLq+tri8ubi5t7W4uLW5uLKxs7G0tLGwt7Wvs7avr7O0tLW4trS4uLO1trW1trm1tLm0r7Kyr66wramsqaKlp52bmpeWl5KQkImEhIB8fXh3eHJrbW5mYGNcWFhUUE1LRENDQUI9ODcxLy8vMCsqLCgoKCgpKScoKCYoKygpKyssLi0sLi0uMDIwMTIuLzQ0Njg4Njc8ODlBQ0A/RUdGSU5RUVFUV1pdXWFjZGdpbG1vcXJ2eXh6fICAgIWIio2OkJGSlJWanJqbnZ2cn6Kkp6enq62srbCysrO1uLy4uL+/vL7CwMHAvb/Cvbq9vLm5uba2t7Sysq+urqyqqaalpqShoJ+enZuamZqXlZWTkpGSkpCNjpCMioqLioiHhoeGhYSGg4GDhoKDg4GBg4GBgoGBgoOChISChISChIWDg4WEgoSEgYODgYGCgYGAgICAgX99f398fX18e3p6e3t7enp7fHx4e3x6e3x7fHx9fX59fn1+fX19fH19fnx9fn19fX18fHx7fHx6fH18fXx8fHx7fH1+fXx+f319fn19fn1+gH9+f4B/fn+AgICAgH+AgICAgIGAgICAgH9+f4B+f35+fn58e3t8e3p5eXh4d3Z1dHRzcXBvb21sbmxqaWhlZmVjYmFfX2BfXV1cXFxaWVlaWVlYV1hYV1hYWVhZWFlaWllbXFpbXV5fX15fYWJhYmNiYWJhYWJjZGVmZ2hqbG1ub3Fxc3V3dnd6e3t8e3x+f3+AgICAgoGBgoKDhISFh4aHiYqKi4uMjYyOj4+QkZKUlZWXmJmbm52enqCioqSlpqeoqaqrrK2ur7CxsrGys7O0tbW2tba3t7i3uLe4t7a3t7i3tre2tba1tLSzsrKysbCvrq2sq6qop6alo6OioJ+dnJqZmJeWlJKSkI+OjoyLioiIh4WEg4GBgH9+fXt6eXh3d3V0c3JxcG9ubWxsamppaWhnZmVlZGRjYmNiYWBhYGBfYF9fXl5fXl1dXVxdXF1dXF1cXF1cXF1dXV5dXV5fXl9eX19gYGFgYWJhYmFiY2NiY2RjZGNkZWRlZGVmZmVmZmVmZ2dmZ2hnaGhnaGloZ2hpaWhpamlqaWpqa2pra2xtbGxtbm1ubm5vcG9wcXBxcnFycnN0c3N0dXV2d3d4eHh5ent6e3x9fn5/f4CAgIGCg4SEhYaGh4iIiYqLi4uMjY2Oj5CQkZGSk5OUlJWWlpeYl5iZmZqbm5ybnJ2cnZ6en56fn6ChoKChoqGio6KjpKOko6SjpKWkpaSkpKSlpKWkpaSlpKSlpKOkpKOko6KioaKhoaCfoJ+enp2dnJybmpmZmJeXlpWUk5STkZGQj4+OjYyLioqJh4eGhYSEgoKBgIB/fn59fHt7enl5eHd3dnZ1dHRzc3JycXBxcG9vbm5tbWxrbGxraWppaWhpaGdnZ2dmZ2ZlZmVmZWRlZGVkY2RjZGNkZGRkZGRkZGRkZGRjZGRkY2RjZGNkZWRlZGVmZWZmZ2ZnZ2doaWhpaWpra2xsbW5tbm9ub29wcXFycnNzdHV1dXZ2d3d4eXl6enp7fHx9fX5+f4CAgIGAgYGCgoOEhISFhoWGhoeIh4iJiImKiYqLiouLjI2MjI2OjY6Pj46PkI+QkZCRkJGQkZGSkZKRkpGSkZGRkZKRkpKRkpGSkZKRkpGSkZKRkpGSkZCRkZCRkI+Qj5CPkI+Pjo+OjY6Njo2MjYyLjIuMi4qLioqJiomJiImIh4iHh4aHhoaFhoWFhIWEg4SDg4KDgoKBgoGAgYCBgICAgICAf4CAf39+f35/fn1+fX59fHx9fH18e3x7fHt6e3p7ent6e3p5enl6enl6eXp5eXl4eXh5eHl4eXh5eHl4eXh5eHh3eHh4d3h4d3h3d3h4d3l4eHd4d3h3eHd4d3h3eHh4eXh5eHl4eHl4eXh5enl6eXp5enl6eXp5ent6ent6e3x7fHx9fH18fX19fn1+fX5/fn9+f4B/gH+Af4CAgICAgIGAgYCBgoGCgYKCgoKDgoOEg4OEg4SFhIWEhYSFhoWGhYaHhoeHhoeGh4iHiIiHiImIiImKiYqJiYqJiouKi4qLiouKi4qLiouKi4qLiouKi4qLi4qLiouKi4qLiomJiomIiYiJiImIh4iIh4iHhoeGhYWGhYaFhIWEg4OEg4KDgoOCgYKBgIGAgICAgH+Af39+f359fn18fX19fHx8e3t6e3p7enl6eXp5enl6enl5eXh5eHh5eHl4eXh5eHl4eHd5eHd3eHl4d3h3eHd4d3h3eHh4d3h4d3h3d3h5eHl4eXh5eHl5eXp5enl6eXp7ent6e3p7e3t7fHt8e3x8fHx9fH1+fX59fn9+f35/gH+AgICAgICAgYGAgYKBgoGCgoKDgoOEg4SEhIWFhIWFhoWGhYaGhoaHhoeGh4aHhoeIh4iHiIeHiIeIh4iHiIeIiIiHiIeIh4iHiIiHiIeIh4iHiIeIh4eIh4eIh4aHh4aHhoeGh4aHhoWGhYaFhoWFhIWEhYSFhIWEhISDhIOEg4OCg4OCg4KDgYKCgYKCgYCBgIGAgYCBgICAgICAgICAf4B/f4B/gH+Af35/fn9+f35/fn1+fn19fn1+fX59fn19fX19fH18fXx9fH18fXx9fH18fXx8fHt8e3x7fHt8e3x7fHt8e3x7fHt8e3x7fHt8e3x7fHt8e3x8e3x7fHt8e3x7fHx8fXx9fH18fX5+fX59fn9+f35+f35/gH+Af4B/gICAgICAgICAgICAgYCBgIGAgIGAgYGBgoGCgYKBgoGCgYKBgoGCgoKDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KDgoOCg4KCgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGCgYKBgoGBgYCBgIGAgYCBgIGAgYCBgIGAgYCBgIGAgYCBgIGAgYCAgICBgIGAgYCBgIGAgYCBgIGAgYCBgExJU1RCAAAASU5GT0lDUkQMAAAAMjAwOC0wOS0yMQAASUVORwMAAAAgAAABSVNGVBYAAABTb255IFNvdW5kIEZvcmdlIDguMAAA" >');
document.getElementById('player').play();
I used a base64 audio file but you can use a normal file too.

Images in J2me Lwuit

I have developed an LWUIT app. I have two types of images dispayed in the app. One coming from server side that need to displayed (like a photo posted and saved to server side) and one packaged in my jar and displayed mainly as icons (like a music icon, loading animation gif etc). I need to display all images according to the sreen size and resolution. The first kind is displayed by taking the screen display height and width and then use scale method and show a scaled version of the image. But however I have no idea how to show the second kind. i.e. icons. Example, my loading image looks good in most of the phones but for some phones like samsung, it looks blurred and over-sized. How to do this. My basic idea is to keep 3 types of images of icons like icon_width_lowXheight_low.png, icon_width_mediumXheight_medium.png and image_width_highXheight_high.png and show it based on the screen size. Please let me know the bets way to achieve this?
Thanks,
Parvathy
You should use MultiImages which were added in LWUIT 1.5. I don't have a link for this in LWUIT but our work in Codename One is pretty close to this so check out the How Do I? on multi images (and I suggest migration to Codename One regardless).
I think that you will need to use this
Image i = Image.createImage("your image path here");
i = i.scaled(widthValue, heightValue);
And put this values in relation to the Display.getInstance().getDisplayHeight() and Display.getInstance().getDisplayWidth()
Right?

adobe edge animation not rendering in iOS 6

I've created a very simple animation in Adobe Edge Animate that animates a box moving from the bottom right to the top left.
I've imported this file (html + all other files) into my Xcode (v4.5.2) project but get a blank white screen in the simulator. I know my project is fine because if I copy a static html page into the project it renders correctly.
Any ideas?
since the difference between your project and the test page is that your project links to javascript files while the test page did not, maybe you should run a test with a page that calls a simple javascript library.
There are a few threads on adobe forum about some problems with projects opened on ios 6 devices. Maby this also concerns your project.
http://forums.adobe.com/message/4767681
Try to call this method and add some js code to your webview's document:
[webView stringByEvaluatingJavaScriptFromString:#"window.requestAnimationFrame = window.setTimeout;"];

Does ActionBar Sherlock cause problems with MediaRecorder?

I have a problem using MediaRecorder to record video with ActionBar Sherlock. I have a base app that sets up and records video files without any problem, but as soon as I add ABS, it stops working.
Right now I have a non-ABS app that can record video with no problems at all and the same app (in all other respects) with ABS that doesnt work.
Initialising the video recorder using the CAMCORDER settings gets through the MediaRecorder setup OK, but when I stop recording, I get a '-1' error in the logcat and the resulting .MP4 file has no audio or video track (although the file size looks OK).
If I try setting MediaRecorder with maunaul setups (i.e., format, frame rate, size etc), the setup keeps falling over at 'setVideoSource...CAMERA'.
Does anyone know if there's any reason why ABS would upset MediaRecorder this way?
Added 01/01/13:The application I'm working on is being upgraded from a photo-taking app to a video-recording app. The preview for the camera was previously done with a ImageView frame, which works OK for providing an image preview, but not for use as the video preview on MediaRecorder. For MediaRecorder, I needed to use a SurfaceView. Once I switched to a SurfaceView, all was good!

Resources