The following was included in a separate (and already long) thread. I've moved it here for clarity. Note: This is not guaranteed to satisfy the requirements of Apple, as they tend to insist on Native App code. Beyond that, it definitely DOES work on iOS, in addition to Android, just a matter of Apple engineer whim probably. One day we may be able to determine this for sure. ============================================================ 1) Go to "jplayer.org/download/" and download the "demos Zip" file 2) Extract the archive and open each demo .htm file until you find one that would like to use as a base for your own player. Note: I chose "demo-02-bm.htm" as my base, since i just want a music player with full controls. 3) The next few steps may vary depending on your use case, your hosting capabilities, and what you want to achieve. For me, I have 10+ songs that I wanted to use in a single App Music player. And I did not want to embed them in the app, for 2 reasons (app size and access control so the music is only available through the app). After all, Apps can be decompiled, thus granting access to music offline and without your control. However, for a measure of increased performance I am using an HTML5 Screen to render the contents of the .htm file (i.e. the markup) - as opposed to creating a Custom URL Screen, and hosting EVERYTHING online. I said a measure of increased performance only because I have not looked into packaging the entire player into the app yet. Still new here. For now, everything EXCEPT the .htm file is being hosted on my web server (i.e. the skin, JS, CSS, and MP3 files). You will want to do the same if your use case is similar. Simply upload all the files to your web server in a meaningful location (i.e. www.mwebsite.com/music directory). 4) Next, within your .htm file, you will need to modify the "src" of your JS and CSS files to where they actually live (i.e. online, or within the app itself) Such as: <link href="http://mywebsite.com/mobile/skin/blue.monday/jplayer.blue.monday.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script> <script type="text/javascript" src="http://mywebsite.com/mobile/js/jquery.jplayer.min.js"></script> <script type="text/javascript" src="http://mywebsite.com/mobile/js/jplayer.playlist.min.js"></script> <script type="text/javascript"> 5) Next, modify the MP3 file locations to match where you have them hosted. Such as: mp3:"http://mywebsite.com/music/song1.mp3" Just make sure the last bracket containing your last MP3 does not end with a comma (since its the last item in the array, there should not be a comma). Such as: { title:"Song #10", mp3:"http://mywebsite.com/music/song10.mp3" } 6) Next, copy the entire contents of your modified .htm file into an HTML5 Screen. At this point, the player will render correctly in the App were you to build it, excluding any further CSS/HTML tweaks of course. It renders all your songs as expected in the player. However, the songs dont play! This is partly by design. The player is setup to try different formats should the first pass not succeed (this is one facet of it's CROSS-PLATFORM intelligence). In this case, you may notice in my example above I've ommitted any reference to .ogg files - because I dont have ogg versions of my songs, just mp3. However, if you left the ogg references in the code, without the files actually existing where you say they do, the player doesnt play the mp3 songs either. Simply remove the ogg references, and your player WILL play the MP3 songs. That's basically it. There are some further tweaks and customization you can do from there, but that is all gravy at this point if you came this far. Hope this helps!

"I said a measure of increased performance only because I have not looked into packaging the entire player into the app yet" The whole shebang can go in the assets directory of the project in the same structure as a regular website project would be. Can be opened with a customURL - file:\\\android-asset\meaningful-location. Just make sure url's to javascripts, css etc are relative.

thanks for the tut Stormy2021, some good tips in there. the local storage/vs streaming is always a consideration when making app and including ANY content. decompiling and pilfering content. suprised i don't see more stories about that on major sites..... i've got a multi-instanced jplayer video screen i've been playing with to make my own youtube looking screen/feed. thanks to the tip from paddy on folders to exclude from compiling - it's working pretty nice in my ios app for streaming vids. i LOVE the 'poster' image for the video feature.

Hey Raveyd, I've been trying to setup the player within the app as you outlined, but I'm running into a few issues. At the root, I think I'm unable to determine what my root is.. to base all other relative paths from. I have a HTML5 Screen for the markup html. I created a "Player" directory in xcode, and it contains all the files that were previously hosted online. I am then trying to reference the CSS/JS files as such: file:\\\projectname\Player\js\javafiles.js or file:\\\Player\skin\cssfiles.css etc. Neither seems to work as the player isnt rendering any CSS or JS, just the markup. Also, worth noting, I had to remove the references to the several JS files that were automatically added to my projects "Compile Sources" - which was throwing invalid arm7 architecture errors. After deleting the references, those errors did go away. Now just to get the right paths. Any ideas?

You're iOS??!? I don't know why, but I assumed you were working with Android... I'm sorry, I've got no idea with xcode, but with Android you can put the whole project into the assets directory, for example, in the BT_Docs sub directory and treat it like a regular server: file:///android_asset/BT_Docs/Player/index.html file:///android_asset/BT_Docs/Player/js/javafiles.js file:///android_asset/BT_Docs/Player/skin/cssfiles.css etc etc. index.html can then reference relative locations: /js/javafiles.js /skin/cssfiles.css etc Apologies for the backslashes in my first post, think my memory's fading!

Yes, iOS.. for now (Android next). No worries, it prompted me to try and figure this out! I think it's all sorted now. To embed the other files there was a few things I had to do: 1) Remove the extra folder structures. In other words files in /BT_Docs/js/ will not load, for example, but any file in /BT_Docs/ will, so move all your files in to the root. I guess this is still a limitation of BT? (http://www.buzztouch.com/forum/thread.php?tid=7009E8D230DD1CA982B0256). 2) Even with the files being referenced correctly, the player was still not working as it should.. weird display/control issues. So I added each file into "Copy Bundle Resources" under your Target > Build Phases. That addressed the rest of the display issues i was seeing for the css and js. In retrospect this makes sense. 3) I also had to change the references in the html file to reflect the new directories: <link href="./jplayer.blue.monday.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="./jplayer.playlist.min.js"></script> etc. 4) Also, instead of using an HTML5 screen for the html, I embedded an html file into the BT_Docs directory, and referenced it using the HTML Doc Screen. 5) Lastly, embedding JS files into xcode automatically adds them into the Build Phases > Compile Sources... which xcode doesn't know what to do with. Remove them, and you wont see those arm7 architecture errors. After all of this, the player is completely self contained, minus my externally hosted mp3 files. ;)

Do you have an app on the app store that I can see this player running in?

I do not.. I haven't had the time to polish the app up, yet. I have suspicions that Apple will not accept the jplayer... but I hope I'm wrong.

They will or at least they did in April. I have a simplified JPlayer in my app but it needs revision but I just haven't had time as of yet.

Not really happy with the skin I have with my player that includes a playlist.