I am a newbi in JW and can't seem to implement to simplest player. Help me, please.
I have created an html and put it in my project. in the same place with the jwplayer.flash.swf, jwplayer.html5.js, jwplayer.js
My html file looks like this (Home.html):
<html>
<head>
<title>Title of the document</title>
<script type="text/javascript" src="jwplayer.js"></script>
<script type="text/javascript">jwplayer.key="myKey"</script>
</head>
<body>
<div id='player_8955'></div>
<script type='text/javascript'>
jwplayer('player_8955').setup({
file: "http://www.youtube.com/watch?v=ac7KhViaVqc",
width: "480",
height: "270",
image: "http://content.bitsontherun.com/thumbs/3XnJSIm4-640.jpg",
});
</script>
</body>
</html>
in the controller class:
- (void)viewDidLoad
{
[super viewDidLoad];
htmlPlayerWebView=[[UIWebView alloc]initWithFrame:CGRectMake(20, 51, 674,381)];
[self.view addSubview:htmlPlayerWebView];
}
-(void)loadVideo
{
NSString *path = [[NSBundle mainBundle] pathForResource:#"Home" ofType:#"html"];
NSString *HTMLString = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
[htmlPlayerWebView loadHTMLString:HTMLString baseURL:[NSURL URLWithString:path]];
}
The functions are called. But nothing happens.
You actually can access local files from within the HTML of a UIWebview. Just change your code as such:
-(void)loadVideo
{
NSString *basePath = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:basePath];
NSString *htmlPath = [[NSBundle mainBundle] pathForResource:#"Home" ofType:#"html"];
NSString *HTMLString = [NSString stringWithContentsOfFile:htmlPath encoding:NSUTF8StringEncoding error:nil];
[htmlPlayerWebView loadHTMLString:HTMLString baseURL:baseURL];
}
Any relative paths in your HTML will then be referenced from your project files.
I found the problem:
UIWebView doesn't have access to project files. So the jwplayer.js is not loaded.
So either load the player to some web server, or replace
<script type="text/javascript" src="jwplayer.js"></script>
with
<script type="text/javascript">
Content of the file jwplayer.js (right click on jwplayer.js -> view source -> copy -> paste to here)
</script>
In the years since this question was originally posted, JWPlayer has implemented a mobile SDK for iOS, which was at first freely available, and now is maintained exclusively for Enterprise users. There is also a new "Developer Class" account which gives full access for 6 months, free.
This post, and related issues, are perhaps the main motivator for such a move; exchanging the slippery moving target of web views, with their opaque implementation details, in favor of the controlled native environment available to a framework project was a clear win.
Related
I have managed to display html in a UIWebView, but my problem is that the images are not displaying in my HTML, although my images, css, and javascript are all located in the same project folder.
Here is the my HTML:
<html>
<head>
<meta name = "viewport" content = "initial-scale = 1.0, user-scalable = no, width = 320"/>
<link rel="stylesheet" type="text/css" href="site.css">
<script src="site.js" type="text/javascript" />
</head>
<body style="margin:0;padding:0;">
<div class="player"></div>
<div class="controller">
<div class="search"></div>
</div>
</body>
</html>
Here is my CSS:
body{
padding:0;
margin:0;
}
div.player{
width:320px;
height:180px;
}
div.controller{
float:left;
width:320px;
}
div.search{
float:left;
height:40px;
width:320px;
background-image:url('search.jpg');
}
And, finally, my Objective-C:
-(void)viewDidLoad {
NSString *path = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:path];
NSString *htmlFile = [[NSBundle mainBundle] pathForResource:#"index" ofType:#"html"];
NSString *htmlString = [NSString stringWithContentsOfFile:htmlFile encoding:NSUTF8StringEncoding error:nil];
[navigatorWindow loadHTMLString:htmlString baseURL:baseURL];
NSLog(#"%#",htmlString);
[super viewDidLoad];
}
Any idea what's going on here?
Make sure that search.jpg is adding to the Xcode Project. I believe that's the problem, because it is a local html file and not hosted on a server. Hope this helps.
background-image:url('search.jpg'); you have to give the full path of image here
I am trying to load a UIWebView with local HTML/CSS that is build to look like a nutrition label. The problem is, the data for the food lies inside of my iPhone app. Do I have to put all of my HTML into one enormous NSString object and concatenate my data into it, or is there a way to load the HTML from a local .html file, but somehow "inject" the data that is stored within Objective-C into it?
If the data to be injected is "safe", you could construct your "enormous NSString object" as a format string, sprinkled with %# markers, and use stringWithFormat: to perform the injection in a single move. This is how I construct the pages in the TidBITS News app, using pieces that all come from RSS. It's really quite painless.
You can load basic html using NSData's method dataWithContentsOfFile and then use javascript to modify html in the way you need.
Code would look something like this (using this example):
NSString *path = [[NSBundle mainBundle] pathForResource:#"food" ofType:#"html"];
NSData *data = [NSData dataWithContentsOfFile:path];
if (data) {
[webView loadData:data MIMEType:#"text/html" textEncodingName:#"UTF-8"];
}
[webView stringByEvaluatingJavaScriptFromString:#"var script = document.createElement('script');"
"script.type = 'text/javascript';"
"script.text = \"function myFunction() { "
"var field = document.getElementById('field_3');"
"field.value='Calling function - OK';"
"}\";"
"document.getElementsByTagName('head')[0].appendChild(script);"];
[webView stringByEvaluatingJavaScriptFromString:#"myFunction();"];
I would do a hybrid of both- have an HTML file in the app that you load, then replace certain strings in that before giving it to the UIWebView. So for example, you could have a file like this
<html>
<head>
<title><!--foodName--></title>
</head>
<body>
<h1><!--foodName--></h1>
<p>Calories / 100g: <!--foodCalories--></p>
</body>
</html>
You'd load that into Cocoa, then replace your special placeholder comments with the actual values you want.
NSDictionary *substitutions = [NSDictionary dictionaryWithObjectsAndKeys:
#"Carrots", #"foodName",
[NSNumber numberWithInt:20], #"foodCalories",
// add more as needed
nil];
NSMutableString *html = [NSMutableString stringWithContentsOfFile:[[NSBundle mainBundle] pathForResource:#"foodCard" ofType:#"html"]
encoding:NSUTF8StringEncoding
error:nil];
for(NSString *substitutionKey in substitutions)
{
NSString *substitution = [[substitution objectForKey:substitutionKey] description];
NSString *searchTerm = [NSString stringWithFormat:#"<!--%#-->", substitutionKey];
[html replaceOccurrencesOfString:searchTerm withString:substitution options:0 range:NSMakeRange(0, [html length])];
}
[webView loadHTMLString:html baseURL:[[NSBundle mainBundle] resourceURL]];
Since iOS 2 you can use - (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script within a UIWebView subclass to execute JS scripts in your webview. This is the best way to inject data from the "Objective-C part" of your application.
Cf: https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIWebView_Class/#//apple_ref/occ/instm/UIWebView/stringByEvaluatingJavaScriptFromString:
I've read many of the existing questions and answers for my problem but none seem to answer it specifically and simply.
I am displaying many HTML files in my app and want to use a CSS to help format them. The CSS file will be held locally together with the HTML files.
I think I want to add the CSS ref inline - presuming that's then right way to do it?
My code is
- (void)viewDidAppear:(BOOL)animated {
[super viewWillAppear:animated];
[adviceContent loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle]
pathForResource:[advice objectForKey:#"HTML"] ofType:#"html"]
isDirectory:NO]]];
[super viewDidAppear:animated];
}
And I've inserted my CSS reference in the HTML file thus within the head tags <
link rel="stylesheet" type="text/css" href="photovaluesCSS_2column.css" media="screen"/>
Can someone explain where I'm going wrong?
Thanks
When loading the HTML, you need to specify a base URL for the css file, so your controller will "know" where that CSS file is located.
Here's a code that loads a html string which uses a css file. You can load the entire css from a file, or modify it as you need.
// HTML files are stored in the main bundle
NSBundle *bundle = [NSBundle mainBundle];
NSString *path = [bundle bundlePath];
NSString *filename = #"none";
NSString *fullPath = [NSBundle pathForResource:filename ofType:#"html" inDirectory:path];
// load a HTML from a file
NSString *chapter_filename = [NSString stringWithFormat:#"Section%d", _chapter];
NSString *sectionHTMLPath = [[NSBundle mainBundle] pathForResource:chapter_filename ofType:#"html"];
NSString* htmlContent = [NSString stringWithContentsOfFile:sectionHTMLPath encoding:NSUTF8StringEncoding error:nil];
// add a generic template and the css file directive
NSString* htmlString = #"<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"> <html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"he\" lang=\"he\"><head><style type=\"text/css\" media=\"all\">#import \"styles.css\";</style><meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" /></head><body>%#</body></html>";
// load the html into a web view
NSURL *url = [NSURL fileURLWithPath:fullPath];
[_webView loadHTMLString:[NSString stringWithFormat:htmlString, htmlContent] baseURL:url];
I have web page having 1000's of images and values. Whenever I load the page to UIWebView it gets loaded with values but as there are so many images it takes time to download.
So is there any way, I can download the page from web but images from local.
Any help is really appreciated.
Thank you,
Ankita
If you have your HTML from webserver and images at local
yourBaseURL = [[NSURL alloc] initFileURLWithPath:[[NSBundle mainBundle] bundlePath]];
[webView loadHTMLString:#"YourHTML" baseURL:yourBaseURL]
and your HTML contains name of local image stored like
Image Tag like --> imgage src='fig1.jpg width=150 height=150 align="left"
Than this should work.
Not exactly as you required though this way you can load local images in webView.
Basically:
Download HTML from server.
NSURL *URL = [[NSURL alloc] initWithString:#"http://www.example.com/page.php"];
NSError *error = nil;
NSStringEncoding encoding;
NSString *theSource = [[NSString alloc] initWithContentsOfURL:URL usedEncoding:&encoding error:&error];
Replace the file references to load images locally.
Note the double slashes, this seems important.
// Replace:
<img src="File.png">
// By something like:
<img src="file://Path//To//Resources//File.png">
Detailed information how to do this (check post by Joe D'Andrea):
Link to resources inside WebView - iPhone
Finally make the UIWebView load the HTML:
[webView loadHTMLString:htmlString baseURL:baseURL];
Now it should load the 'fresh' HTML from the server with local images.
This works quite well for me.
NSURL *myBaseURL = [[NSURL alloc] initFileURLWithPath:[[NSBundle mainBundle] bundlePath]];
NSString *myString = [[managedObject valueForKey:#"long_presentation"] stringByReplacingOccurrencesOfString:#"/FooFolder/BarFolder" withString:[NSString stringWithFormat:#"%#/FooFolder/BarFolder", [[NSBundle mainBundle] bundlePath] ] ];
[attractionWebView loadHTMLString:myString baseURL:myBaseURL];
I had to include a replacement for the image source
img src="FooFolder/BarFolder/my_image.jpg" ...
to get the right path.
I've got some HTML and some images in my iPhone app, arranged something like:
html/
foo.html
images/
bar.png
I can get bar.png to appear in my UIWebView a couple of different ways -- either loading foo.html from an NSUrl, and walking back up the directory tree from the html directory:
<img src="../images/bar.png"/>
or by loading foo.html into a string, using loadHtmlString, and using [[NSBundle mainBundle] bundleURL] as the baseURL:
<img src="images/bar.png"/>
Both of these are kind of clumsy, though -- in the first case, if I move HTML files around I have to rejigger all the relative paths, and in the second case, I have to ignore the actual path structure of the HTML files.
What I'd like to make work is this --
<img src="/images/bar.png"/>
-- treating the bundleURL as the root of the "site". Is there any way to make this work, or am I doomed to have that translated into file:///images/bar.png and have the file not found?
Only way I can see for you to do this would be to embed a web server in your app. Matt Gallagher has a blog post on this you could start from. Alternatively, CocoaHTTPServer and Mongoose could be dropped into your project.
If I'm not mistaken, you have some files in your project bundle that you want to load in your web view. You can do it simply with these few lines of code:
NSString *imagePath = [[NSBundle mainBundle] pathForResource:#"bar" ofType:#"png"];
NSURL *imageURL = [NSURL fileURLWithPath:imagePath];
I'm assuming that you have a text/html file containing the pattern for your web view. You'll need to add the image as an object there (src="%#"...) and then add the imageURL to the pattern:
NSString *path = [[NSString alloc]initWithString:[[NSBundle mainBundle]pathForResource:#"htmlPattern" ofType:#"html"]];
NSError *error;
NSString *pattern = [[NSString alloc]initWithContentsOfFile:path
encoding:NSUTF8StringEncoding
error:&error];
htmlPage = [[NSString alloc]initWithFormat:pattern,
imageURL;
webView = [[UIWebView alloc] initWithFrame:WEBVIEW_FRAME];
[webView loadHTMLString:htmlPage baseURL:[NSURL URLWithString:path]];
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:pattern]]];