Trouble playing embeded video on ipad

Discussion Forums > WebViews and HTML for Mobile

Replies: 33 Views: 186

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	confirm \| cancel 09/02/12 06:39 AM (13 years ago) Trouble playing embeded video on ipad Hello Buzztouch gang, Right, I have this issue. I am making an offline website for a client that can be opened with an app. This website mirror his online site so my client can he show it around with his ipad without connection. His online website has a few youtube videos that cannot be launched offline (obviously). What I did is convert the video files to .mp4 and stick it on an iframe. Works perfectly on my computer but when read on a ipad the player disappear and the video doesn't play. Does anyone have an idea how to have the video play within the offline site? Thanks a lot, Farcat Title Comments Hello Buzztouch gang, Right, I have this issue. I am making an offline website for a client that can be opened with an app. This website mirror his online site so my client can he show it around with his ipad without connection. His online website has a few youtube videos that cannot be launched offline (obviously). What I did is convert the video files to .mp4 and stick it on an iframe. Works perfectly on my computer but when read on a ipad the player disappear and the video doesn't play. Does anyone have an idea how to have the video play within the offline site? Thanks a lot, Farcat

Paul Rogers Android Fan Posts: 2524 Reg: May 30, 2011 UK 35,740	09/02/12 07:12 AM (13 years ago) This should work. Use the html5 video tag to embed the video and store it in the project assets. You would just need to change the header declaration of the relevent html file to <!DOCTYPE HTML> if you haven't already. Code for video could be something like: <video width="320" height="240" controls="controls"> <source src="project_assets_location/movie.mp4" type="video/mp4" /> </video> More info here: http://www.w3schools.com/html5/tag_video.asp Comments This should work. Use the html5 video tag to embed the video and store it in the project assets. You would just need to change the header declaration of the relevent html file to <!DOCTYPE HTML> if you haven't already. Code for video could be something like: <video width="320" height="240" controls="controls"> <source src="project_assets_location/movie.mp4" type="video/mp4" /> </video> More info here: http://www.w3schools.com/html5/tag_video.asp

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/02/12 02:04 PM (13 years ago) Thanks Raveyd! OK, tried it. Now a player is showing but it seems that it cannot find the video. If the tag is : <source src="movie.mp4" type="video/mp4" /> then on my Xcode I just place "movie.mp4" in the video folder, right? Also, I was thinking is there a way to just cache the whole page (cache manifest), Youtube video and all? Thanks, Farcat Comments Thanks Raveyd! OK, tried it. Now a player is showing but it seems that it cannot find the video. If the tag is : <source src="movie.mp4" type="video/mp4" /> then on my Xcode I just place "movie.mp4" in the video folder, right? Also, I was thinking is there a way to just cache the whole page (cache manifest), Youtube video and all? Thanks, Farcat

Paul Rogers Android Fan Posts: 2524 Reg: May 30, 2011 UK 35,740	09/02/12 02:39 PM (13 years ago) Hi Farcat, I don't know about xcode, but an android url is something like: file:///android_asset/some_folder/movie.mp4 So it'd be: <source src="file:///android_asset/some_folder/movie.mp4" type="video/mp4" /> - Although I seem to remember a post on here that xcode doesn't need a url as such? You'll need to do some digging about that, unless someone see's the post and can help. Not sure about caching, you'll still have an issue with the iframe or youtube code I should think. Can't think of another way of doing it really. Without all the assets being in the project there will always be some issues or internet connection needed. Comments Hi Farcat, I don't know about xcode, but an android url is something like: file:///android_asset/some_folder/movie.mp4 So it'd be: <source src="file:///android_asset/some_folder/movie.mp4" type="video/mp4" /> - Although I seem to remember a post on here that xcode doesn't need a url as such? You'll need to do some digging about that, unless someone see's the post and can help. Not sure about caching, you'll still have an issue with the iframe or youtube code I should think. Can't think of another way of doing it really. Without all the assets being in the project there will always be some issues or internet connection needed.

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/03/12 01:40 AM (13 years ago) Thanks Raveyd, Yes, Xcode does not require an url and caching doesn't work, I just tried. It would have been cool if it did.... Anybody has an idea why the video is not playing? Thanks Farcat Comments Thanks Raveyd, Yes, Xcode does not require an url and caching doesn't work, I just tried. It would have been cool if it did.... Anybody has an idea why the video is not playing? Thanks Farcat

Paul Rogers Android Fan Posts: 2524 Reg: May 30, 2011 UK 35,740	09/03/12 04:52 AM (13 years ago) Found this which should help a lot: http://developer.apple.com/library/safari/#documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html Comments Found this which should help a lot: http://developer.apple.com/library/safari/#documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/03/12 04:54 AM (13 years ago) I have the same issue on the iPhone. As far as I can see (iFile) there is no video file in the app's directory on the iPhone. After running the app everything seems to be installed, also the html file where I put the video tags (also tried with embed tags) is in the directory....but no video file (in my case a mp4 file). Conclusion: Although I manually added the BT_Video directory and the video file to my xcode project, the file won't come with the install on my iPhone......strange it is..... Comments I have the same issue on the iPhone. As far as I can see (iFile) there is no video file in the app's directory on the iPhone. After running the app everything seems to be installed, also the html file where I put the video tags (also tried with embed tags) is in the directory....but no video file (in my case a mp4 file). Conclusion: Although I manually added the BT_Video directory and the video file to my xcode project, the file won't come with the install on my iPhone......strange it is.....

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/03/12 06:01 AM (13 years ago) Thanks Raveyd, try as I might offline caching doesn't work in this particular case. It looks like using Cache manifest for a youtube video is not an option. @GJvanWijk, it looks like we have exactly the same issue. Wish I could help you but we are in the same boat. I keep looking and will let you know. Farcat Comments Thanks Raveyd, try as I might offline caching doesn't work in this particular case. It looks like using Cache manifest for a youtube video is not an option. @GJvanWijk, it looks like we have exactly the same issue. Wish I could help you but we are in the same boat. I keep looking and will let you know. Farcat

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/03/12 06:29 AM (13 years ago) I have also experienced the same issue. I have a bunch of videos that I would prefer to have offline. I have tried both the html5 video tag and just linking via rel url, neither worked. Have made several posts here but seems noone has a definitive solution :S I have now succumbed to the fact that the app will need stream videos online. Not ideal for me Comments I have also experienced the same issue. I have a bunch of videos that I would prefer to have offline. I have tried both the html5 video tag and just linking via rel url, neither worked. Have made several posts here but seems noone has a definitive solution :S I have now succumbed to the fact that the app will need stream videos online. Not ideal for me

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/03/12 06:41 AM (13 years ago) All these amazing things that can be done with a buzztouch app and a video cannot be played locally? The app I make needs to be 100% offline so streaming is not an option for me. Any wizard out there with a tip for us? Cheers, Comments All these amazing things that can be done with a buzztouch app and a video cannot be played locally? The app I make needs to be 100% offline so streaming is not an option for me. Any wizard out there with a tip for us? Cheers,

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/03/12 06:48 AM (13 years ago) I agree. The strange thing to me is that the custom html screen is using just that, html and that I presumed all tags would be valid? I got real frustrated over this and was suprised to be (at the time) the only person experiencing this issue. Comments I agree. The strange thing to me is that the custom html screen is using just that, html and that I presumed all tags would be valid? I got real frustrated over this and was suprised to be (at the time) the only person experiencing this issue.

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/03/12 06:54 AM (13 years ago) Well as a matter of fact I managed to play the vid perfectly.......The only problem is that I have to copy the vid manually to the app dir on my iPhone. (I have a jailbroken iphone so that's rather easy to do). The technique works only xcode doesn't include the video into the install package somehow... Comments Well as a matter of fact I managed to play the vid perfectly.......The only problem is that I have to copy the vid manually to the app dir on my iPhone. (I have a jailbroken iphone so that's rather easy to do). The technique works only xcode doesn't include the video into the install package somehow...

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/03/12 06:54 AM (13 years ago) haven't tried it on android yet Comments haven't tried it on android yet

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/03/12 06:56 AM (13 years ago) I have tried all video tags known to mankind without positive results. Maybe it has nothing to do with the HTML page itself. Maybe something needs to be adjusted on the DSK, is your app on xcode? Comments I have tried all video tags known to mankind without positive results. Maybe it has nothing to do with the HTML page itself. Maybe something needs to be adjusted on the DSK, is your app on xcode?

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/03/12 06:59 AM (13 years ago) strange as I have packaged videos offline by using the BT_Video dir and the streaming video screen, however, that was in BT 1.5. My issue was getting custom html scrren to recognise locally stored video, I have ended up streaming the content but it has had a real negative impact on my apps functionality. Comments strange as I have packaged videos offline by using the BT_Video dir and the streaming video screen, however, that was in BT 1.5. My issue was getting custom html scrren to recognise locally stored video, I have ended up streaming the content but it has had a real negative impact on my apps functionality.

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/03/12 06:59 AM (13 years ago) Ha ha, there is some light at the end of that tunnel then! Congratulations on sorting out your issue. My app is a one-off for a (non-jailbroken) ipad, any idea how to include the video? Comments Ha ha, there is some light at the end of that tunnel then! Congratulations on sorting out your issue. My app is a one-off for a (non-jailbroken) ipad, any idea how to include the video?

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/03/12 07:01 AM (13 years ago) "I have tried all video tags known to mankind without positive results" - ditto :( Comments "I have tried all video tags known to mankind without positive results" - ditto :(

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/03/12 07:08 AM (13 years ago) @farcat Nope....that's my problem I proved that it is possible to play video's by using a html file containing a tag like this: <video width="320" height="240" controls="controls"> <source src="ff.mp4" type="video/mp4" /> </video> When you use a tool like iFile on a jailbroken phone it is possible to see the content of an app directory. In my case, after installing the app in Xcode to the iPhone, I could only see the html file (which is located in the BT_Docs dir) but not the video file (located in the BT_video dir). So copying the file manually to the iphone's app dir solved the problem......well it didn't solve my problem it only showed that the video is playing.....so again the solution is fine. The only question remaining is: Why the f* won't xcode include the video file in the install package??? Comments @farcat Nope....that's my problem I proved that it is possible to play video's by using a html file containing a tag like this: <video width="320" height="240" controls="controls"> <source src="ff.mp4" type="video/mp4" /> </video> When you use a tool like iFile on a jailbroken phone it is possible to see the content of an app directory. In my case, after installing the app in Xcode to the iPhone, I could only see the html file (which is located in the BT_Docs dir) but not the video file (located in the BT_video dir). So copying the file manually to the iphone's app dir solved the problem......well it didn't solve my problem it only showed that the video is playing.....so again the solution is fine. The only question remaining is: Why the f* won't xcode include the video file in the install package???

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/03/12 08:02 AM (13 years ago) @GJvanWijk, sorry to be slow but what do you mean by "So copying the file manually to the iphone's app dir solved the problem"? Thanks for your guidance. Farcat Comments @GJvanWijk, sorry to be slow but what do you mean by "So copying the file manually to the iphone's app dir solved the problem"? Thanks for your guidance. Farcat

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/03/12 08:29 AM (13 years ago) Well normally you put the files like images, html docs, maybe pdf's in the BT_xxx folders (docs, video, images, sound). When you install (run) your xcode project having your iPhone selected in the scheme selector as your output device, all those files would be included and part of the installation on your iPhone. In this case the video file doesn't come with the installation, although it is present in the BT_Video folder (and also as a file item in my BT-server project). So I manually (by using ftp tool and iFile on my iPhone) copied the video file into the root of the application directory on my iPhone. That did the trick for playing the video. So all I have to solve is how xcode includes the video file into the installation package. I'm dutch so english isn't one of my talents.....Hopefully I made myself clear Comments Well normally you put the files like images, html docs, maybe pdf's in the BT_xxx folders (docs, video, images, sound). When you install (run) your xcode project having your iPhone selected in the scheme selector as your output device, all those files would be included and part of the installation on your iPhone. In this case the video file doesn't come with the installation, although it is present in the BT_Video folder (and also as a file item in my BT-server project). So I manually (by using ftp tool and iFile on my iPhone) copied the video file into the root of the application directory on my iPhone. That did the trick for playing the video. So all I have to solve is how xcode includes the video file into the installation package. I'm dutch so english isn't one of my talents.....Hopefully I made myself clear

Paul Rogers Android Fan Posts: 2524 Reg: May 30, 2011 UK 35,740	09/03/12 08:38 AM (13 years ago) I'm on shaky ground here as I know nothing about xcode, but isn't there an option to compile or not compile assets in the project? Can compiled vs not compiled be tested to see if one option works? Comments I'm on shaky ground here as I know nothing about xcode, but isn't there an option to compile or not compile assets in the project? Can compiled vs not compiled be tested to see if one option works?

Fred@mySkylla com Android Fan Posts: 5259 Reg: Oct 03, 2011 location unknow... 62,560	09/03/12 08:48 AM (13 years ago) I think the issue is the browser. Comments I think the issue is the browser.

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/03/12 08:56 AM (13 years ago) @raveyd I don't know about that but i'll check it out But.......I found out something new. When I put a video file with the extension .mov into the project..xcode does include the file with the installation. So it seems that xcode doesn't include mp4 files automatically....... I will search on this subject....but I have a proper solution now for playing embedded vids....YEAHHHH Comments @raveyd I don't know about that but i'll check it out But.......I found out something new. When I put a video file with the extension .mov into the project..xcode does include the file with the installation. So it seems that xcode doesn't include mp4 files automatically....... I will search on this subject....but I have a proper solution now for playing embedded vids....YEAHHHH

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/03/12 11:43 AM (13 years ago) @GJvanWijk - Keep at it, perhaps you are onto something! @Fred - im not convinced it's the browser because it runs fine downloading from server, just wont recognise locally stored mp4. The browser cannot play embedded but launches native video function. It would be a crime in this day and age for a web browser NOT to be able to play mp4 :) Comments @GJvanWijk - Keep at it, perhaps you are onto something! @Fred - im not convinced it's the browser because it runs fine downloading from server, just wont recognise locally stored mp4. The browser cannot play embedded but launches native video function. It would be a crime in this day and age for a web browser NOT to be able to play mp4 :)

ATRAIN53 Code is Art Posts: 1755 Reg: Nov 17, 2011 Chicago 26,450	09/04/12 07:44 AM (13 years ago) file formats could be a problem too. Apple devices are very picky about video encoding. drives me crazy. i use handbrake and pick the Apple Legacy setting and that has proven to crank out vids that play on all the Apple devices I've tried. but with any luck- my solution for playing local/embedded video using native iOS MediaPlayer will get thru the BT review team soon and you'll have a plug-in option to play local videos offline! There is such an big difference in web/vs off line experience when it comes to video. speed is everything when trying to make a presentation. That's why I looked for an option for local video too. The browser/webview is bottleneck that can be easily eliminated. iphone/ipads were made to play local videos instantly without delay. (another HUGE bonus of using MediaPlayer framework is the ability to go around Apple DRM. I'd almost rather make my own app and use my plug-in than try to deal with iTunes anymore!) Comments file formats could be a problem too. Apple devices are very picky about video encoding. drives me crazy. i use handbrake and pick the Apple Legacy setting and that has proven to crank out vids that play on all the Apple devices I've tried. but with any luck- my solution for playing local/embedded video using native iOS MediaPlayer will get thru the BT review team soon and you'll have a plug-in option to play local videos offline! There is such an big difference in web/vs off line experience when it comes to video. speed is everything when trying to make a presentation. That's why I looked for an option for local video too. The browser/webview is bottleneck that can be easily eliminated. iphone/ipads were made to play local videos instantly without delay. (another HUGE bonus of using MediaPlayer framework is the ability to go around Apple DRM. I'd almost rather make my own app and use my plug-in than try to deal with iTunes anymore!)

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/04/12 08:17 AM (13 years ago) I solved the problem. In xcode it is possible to add files to a copy section. I noticed that javascript wasn't working either and found out that some file-extensions are put into a compile section instead of the copy section. So I manually put the javascript files in the copy section and for the fun of it I also put my mp4 file there...and guess what...xcode includes the mp4 in the install package so everything working right now.. I'm a happy guy cause now i can play my vids, no matter what extension, locally on a mobile device... Comments I solved the problem. In xcode it is possible to add files to a copy section. I noticed that javascript wasn't working either and found out that some file-extensions are put into a compile section instead of the copy section. So I manually put the javascript files in the copy section and for the fun of it I also put my mp4 file there...and guess what...xcode includes the mp4 in the install package so everything working right now.. I'm a happy guy cause now i can play my vids, no matter what extension, locally on a mobile device...

ATRAIN53 Code is Art Posts: 1755 Reg: Nov 17, 2011 Chicago 26,450	09/04/12 09:01 AM (13 years ago) very cool work-around. useful info for sure. I made one of these with jquery a while back and liked it - but didn't like the performace or the controls for the video. How do the video controls work in your method? What buttons do you get? can you pause/seek/scrub videos? is it fluid? Comments very cool work-around. useful info for sure. I made one of these with jquery a while back and liked it - but didn't like the performace or the controls for the video. How do the video controls work in your method? What buttons do you get? can you pause/seek/scrub videos? is it fluid?

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/04/12 09:30 AM (13 years ago) @GJvanWijk - Good work :) "In xcode it is possible to add files to a copy section" - could you please elaborate? I had issues early on with getting js files to execute also so a solution to this is great Comments @GJvanWijk - Good work :) "In xcode it is possible to add files to a copy section" - could you please elaborate? I had issues early on with getting js files to execute also so a solution to this is great

MacApple Apple Fan Posts: 4675 Reg: Oct 25, 2010 USA 61,150	09/04/12 09:34 AM (13 years ago) @BassProfessor It's about the files being compiled or copied at runtime. On phone so tricky right now but think this should explain the process. http://stackoverflow.com/questions/2017937/how-to-add-js-file-to-my-xcode-project There are a couple of posts right here on BT about it as well, will have a peek. Hope some of that helps. Comments @BassProfessor It's about the files being compiled or copied at runtime. On phone so tricky right now but think this should explain the process. http://stackoverflow.com/questions/2017937/how-to-add-js-file-to-my-xcode-project There are a couple of posts right here on BT about it as well, will have a peek. Hope some of that helps.

Walms Code is Art Posts: 235 Reg: Aug 24, 2011 Derby 3,300	09/04/12 10:07 AM (13 years ago) sweet! thanks :) Comments sweet! thanks :)

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	09/07/12 01:35 AM (13 years ago) Thanks all for great tips. @GJvanWijk, you hit my issue bang on the head, I followed your advice and now it works! That's another problem solved by experimenting and sharing knowledge, I love Buzztouch forum!! Farcat Comments Thanks all for great tips. @GJvanWijk, you hit my issue bang on the head, I followed your advice and now it works! That's another problem solved by experimenting and sharing knowledge, I love Buzztouch forum!! Farcat

GJvanWijk I hate code! Posts: 95 Reg: Dec 19, 2011 location unknow... 6,000	09/07/12 04:39 AM (13 years ago) @farcat: Yep this forum is great! Happy to close another problem thread. Comments @farcat: Yep this forum is great! Happy to close another problem thread.

Ankita Lost but trying Posts: 3 Reg: Jan 07, 2013 India 30	01/08/13 12:51 AM (13 years ago) i have css, js, video file kept in a different folders. Then these entire folders are kept in another folder named "test". I dragged the folder "test" into 'support file' and wrote the below code into the viewdidload method: - (void)viewDidLoad { [super viewDidLoad]; NSString path= [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html" inDirectory:@"LANDING-PAGE-01"]; NSURL url=[NSURL fileURLWithPath:path]; NSURLRequest request=[NSURLRequest requestWithURL:url]; [WebV3 loadRequest:request]; } but video was not getting displayed.So i followed the above mentioned solution and copied css, js and video files separately into the "copy bundle resource" build phase. When i again run the code video was not shown. Please suggest solution. Thanks Comments i have css, js, video file kept in a different folders. Then these entire folders are kept in another folder named "test". I dragged the folder "test" into 'support file' and wrote the below code into the viewdidload method: - (void)viewDidLoad { [super viewDidLoad]; NSString path= [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html" inDirectory:@"LANDING-PAGE-01"]; NSURL url=[NSURL fileURLWithPath:path]; NSURLRequest request=[NSURLRequest requestWithURL:url]; [WebV3 loadRequest:request]; } but video was not getting displayed.So i followed the above mentioned solution and copied css, js and video files separately into the "copy bundle resource" build phase. When i again run the code video was not shown. Please suggest solution. Thanks

farcat buzztouch Evangelist Posts: 1008 Reg: Jan 27, 2012 France 13,230	01/08/13 04:56 AM (13 years ago) Hi @Ankita, Welcome to the forum. I think that you might want to start a fresh thread for this one. You would also need to give more info. The css file need to be in your "Doc" folder on xcode, along with the HTML page it is referred from. Please use the link given by MacApple to learn about placing the js. http://stackoverflow.com/questions/2017937/how-to-add-js-file-to-my-xcode-project Good luck! Farcat Comments Hi @Ankita, Welcome to the forum. I think that you might want to start a fresh thread for this one. You would also need to give more info. The css file need to be in your "Doc" folder on xcode, along with the HTML page it is referred from. Please use the link given by MacApple to learn about placing the js. http://stackoverflow.com/questions/2017937/how-to-add-js-file-to-my-xcode-project Good luck! Farcat

Login + Screen Name Required to Post Login to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.

Discussion Forums > WebViews and HTML for Mobile

Trouble playing embeded video on ipad

Title

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments