Dheeraj Chahar Dheeraj Chahar - 3 months ago 13
CSS Question

How to use JavaScripts inside xml for my ebook reader in ios uiwebview?

I'm able to load JavaScripts tag in HTML with this code:

function loadjscssfile(filename, filetype){

if (filetype=="js"){ //if filename is a external JavaScript file
var fileref = document.createElement('script');
fileref.src = filename;
fileref.async = false;
}
else if (filetype=="css"){ //if filename is an external CSS file
var fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet")
fileref.setAttribute("type", "text/css")
fileref.setAttribute("href", filename)
}
if (typeof fileref!="undefined"){
document.head.appendChild(fileref);
}
}
loadjscssfile("jquery.min.js", "js") //dynamically load and add this .js file
loadjscssfile("annotator.min.css", "css") ////dynamically load and add this .css file


But i want to use this in epub reader where it breaks down to xml/html. I want same js to get executed while opening my ebook reader in ios uiwebview.

Sample xml:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>CHAPTER 13 - DR. SEWARD'S DIARY&#8212;cont. | Dracula</title>
<link rel="stylesheet" href="css/book.css" type="text/css"/>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
<meta name="EPB-UUID" content="01D8803E-6BF7-1014-BF2E-F46A8E11922F"/>
</head>
<body>
<div class="body">
<div class="chapter">
<h3 class="chapter-title">CHAPTER 1</h3>
<h4 class="chapter-subtitle">DR. DIARY&#8212;cont.</h4>
<p>"She makes a very beautiful corpse, sir. It's quite a privilege to attend on her. It's not too much to say that she will do credit to our establishment!"</p>
</div>
</div>
</body>
</html>

Answer

You need to simply add these two functions for JS and CSS:

    - (void) addJSScripts
{
    NSString *jsFilePath = [[NSBundle mainBundle] pathForResource:@"jquery.min" ofType:@"js"];
    NSURL *jsURL = [NSURL fileURLWithPath:jsFilePath];
    NSString *javascriptCode1 = [NSString stringWithContentsOfFile:jsFilePath encoding:NSUTF8StringEncoding error:nil];

jsFilePath = [[NSBundle mainBundle] pathForResource:@"annotator.offline.min" ofType:@"js"];
jsURL = [NSURL fileURLWithPath:jsFilePath];
NSString *javascriptCode2 = [NSString stringWithContentsOfFile:jsFilePath encoding:NSUTF8StringEncoding error:nil];

jsFilePath = [[NSBundle mainBundle] pathForResource:@"offlinejs" ofType:@"js"];
jsURL = [NSURL fileURLWithPath:jsFilePath];
NSString *javascriptCode3 = [NSString stringWithContentsOfFile:jsFilePath encoding:NSUTF8StringEncoding error:nil];

jsFilePath = [[NSBundle mainBundle] pathForResource:@"startjs" ofType:@"js"];
jsURL = [NSURL fileURLWithPath:jsFilePath];
NSString *javascriptCode4 = [NSString stringWithContentsOfFile:jsFilePath encoding:NSUTF8StringEncoding error:nil];

[_webview stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"%@\n%@\n%@\n%@",javascriptCode1, javascriptCode2, javascriptCode3, javascriptCode4]];

}

- (void)webViewDidFinishLoad:(UIWebView *)webView {
NSString *path = [[NSBundle mainBundle] pathForResource:@"annotator.min" ofType:@"css"];
NSString *javascriptString = @"var link = document.createElement('link'); link.href = '%@'; link.rel = 'stylesheet'; document.head.appendChild(link)";
NSString *javascriptWithPathString = [NSString stringWithFormat:javascriptString, path];
[_webview stringByEvaluatingJavaScriptFromString:javascriptWithPathString];

path = [[NSBundle mainBundle] pathForResource:@"annotator.touch" ofType:@"css"];
javascriptString = @"var link = document.createElement('link'); link.href = '%@'; link.rel = 'stylesheet'; document.head.appendChild(link)";
javascriptWithPathString = [NSString stringWithFormat:javascriptString, path];
    [_webview stringByEvaluatingJavaScriptFromString:javascriptWithPathString];
[self addJSScripts];

}

Comments