I am trying to load a dynamic player according to the browser like activeX plugin for Internet explorer using object tag and vlc plugin for Firefox and Google Chrome using embed tag, so I have tried to include it in the script so that onload it can detect what browser it is and display the player according but unfortunately I'm getting the following error:
Unable to get value of the property 'add': object is null or undefined
Following is my code:
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> </script>
<script type="text/javascript">
var client = "FF";
$(document).ready(function(){
checkIE();
startUp();
//startIt();
$(function(){
$("#vlcIE").css({ "width": "400px", "height": "300px" });
});
});
function checkIE() {
var clientCheck = window.navigator.appName;
if (clientCheck == "Microsoft Internet Explorer") {
alert("IE");
client = "IE";
return true;
} else {
alert("FF");
client = "FF";
return false;
}
}
function startIt(){
if(client == "IE"){
playInIE();
}else{
playInOthers();
}
}
function playInOthers() {
alert("playin FF");
var players = document.getElementsByName("video1");
var options = new Array("");
url = "rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov";
var id = players[0].playlist.add(url, null, options);
players[0].playlist.playItem(id);
alert("playing video");
}
function playInIE() {
alert("play in IE");
var vlc = document.getElementById("vlcIE");
var options = new Array(":aspect-ratio=16:10", "--rtsp-tcp");
//var options=[":ts-csa-ck="+EncryptionkeyValue];
var urlVideofile = "rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov";
var targetURL = "rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov";
var itemId = vlc.playlist.add(targetURL, "", options);
var id = vlc.playlist.add(urlVideofile, null, options);
vlc.playlist.playItem(id);
}
function startUp(){
var player;
if (client == "IE") {
player = "<object type='application/x-vlc-plugin' id='vlcIE' width='300' height='225' classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' ></object>";
} else {
player = "<embed type='application/x-vlc-plugin' pluginspage='http://www.videolan.org' id='vlc' name='video1' autostart='yes' toolbar='false' loop='yes' width='400' height='300' target='rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov' />";
}
//$("#video_holder").html(player);
document.getElementById("video_holder").innerHTML=player;
}
</script>
</head>
<body>
<div id="video_holder" style="border:1px solid #00FF33"></div>
<button type="button" id="start" onClick="startIt()">Start</button>
</body>
Your calling an function as an variable here:
if (checkIE) {
That should be:
if (checkIE()) {
And you've got to return an value from your checkIE function like this:
function checkIE() {
var client = window.navigator.appName;
if (client == "Microsoft Internet Explorer") {
alert("IE");
playvideos();
return true;
} else {
alert("FF");
hello();
return false;
}
}
( you also had an semicolon ( ; ) at the end of your function. That doesn't belong there either
Also, you maybe wan't to start using javascripts console.log instead of alert. In that way, you're javascript isn't interrupted, but you can see it's path in the console
EDIT 1
You had some more error's in your script. After fixing that, i "worked" for me ( you can check this JSFiddle out to see it "working"
The problem was that you've got this piece of code:
if (checkIE) {
var player = "<object type='application/x-vlc-plugin' id='vlc' width='300' height='225' classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921'></object>";
} else {
var player = "<embed type='application/x-vlc-plugin' pluginspage='http://www.videolan.org' id='vlc' name='video1' autostart='yes' toolbar='true' loop='yes' width='400' height='300'
target='rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov' />"
}
You've got an newline before target=... that's illegal. You also forgot an semicolon at the end of that line. So here's the working script part:
if (checkIE()) {
var player = "<object type='application/x-vlc-plugin' id='vlc' width='300' height='225' classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921'></object>";
} else {
var player = "<embed type='application/x-vlc-plugin' pluginspage='http://www.videolan.org' id='vlc' name='video1' autostart='yes' toolbar='true' loop='yes' width='400' height='300' target='rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov' />";
}
I've also changed the alerts to console.log in the fiddle for easier testing
EDIT 2
I've got it sort of working now. You can check the code at THIS PASTEBIN.
Only problem: It isn't playing any video.
EDIT 3
I've tested the IE part, and I found out that the navigator.appname = Netscape.
So in your checkIE function you change the check line to this:
if (clientCheck == "Microsoft Internet Explorer" || clientCheck == "Netscape") {
EDIT 4
Turned out that the browser check was totaly wrong. I've googled a lot and finaly found an working solution. If you check this PASTEBIN out, then you've got an working example.
Related
I have the following code. It can open a file and display it in the browser. But I want to:
- Select many files instead of one;
- Then Filter on these files for a word (username);
- Then print username's line (text file: username xxxx);
- If the word "username" is not found , print - text file: not found
Any idea?
<!DOCTYPE html>
<html>
<head>
<title>Read File (via User Input selection)</title>
<script type="text/javascript">
var reader; //GLOBAL File Reader object for demo purpose only
/**
* Check for the various File API support.
*/
function checkFileAPI() {
if (window.File && window.FileReader && window.FileList && window.Blob) {
reader = new FileReader();
return true;
} else {
alert('The File APIs are not fully supported by your browser. Fallback required.');
return false;
}
}
/**
* read text input
*/
function readText(filePath) {
var output = ""; //placeholder for text output
if(filePath.files && filePath.files[0]) {
reader.onload = function (e) {
output = e.target.result;
displayContents(output);
};//end onload()
reader.readAsText(filePath.files[0]);
}//end if html5 filelist support
else if(ActiveXObject && filePath) { //fallback to IE 6-8 support via ActiveX
try {
reader = new ActiveXObject("Scripting.FileSystemObject");
var file = reader.OpenTextFile(filePath, 1); //ActiveX File Object
output = file.ReadAll(); //text contents of file
file.Close(); //close file "input stream"
displayContents(output);
} catch (e) {
if (e.number == -2146827859) {
alert('Unable to access local files due to browser security settings. ' +
'To overcome this, go to Tools->Internet Options->Security->Custom Level. ' +
'Find the setting for "Initialize and script ActiveX controls not marked as safe" and change it to "Enable" or "Prompt"');
}
}
}
else { //this is where you could fallback to Java Applet, Flash or similar
return false;
}
return true;
}
/**
* display content using a basic HTML replacement
*/
function displayContents(txt) {
var el = document.getElementById('main');
el.innerHTML = txt; //display output in DOM
}
</script>
</head>
<body onload="checkFileAPI();">
<div id="container">
<input type="file" onchange='readText(this)' />
<br/>
<hr/>
<h3>Contents of the Text file:</h3>
<div id="main">
...
</div>
</div>
</body>
</html>
I havent tested this, but does the basic idea work? Read the files through a for-loop, and search for your target string. If you get to the end and you dont find it, return your empty message;
function SearchFiles(var target_string, var file_paths){
var fs = require("fs");
my_file_paths.foreach(function(filepath){
var text = fs.readFileSync(filepath);
var pos = text.search(target_string);
if (pos>1) {
return text.substring(pos, pos + target_string.length);
}
}
return "not found"
}
// now to use the function
var my_file_paths; // init this to what you want to search through
var target_username; // init this as well
var found_username = SearchFiles(target_username, my_file_paths);
DisplayContents("text file: " + found_username);
This Was sent to me in Facebook embedded in a HTML.. i didnt open this since i suspected it. Can anyone please tell me what it does?
Problem Statement : This is was written using document.write(unescape('<something here>');
I unescaped this.
`<script type="text/javascript"> // <![CDATA[
if ( (navigator.userAgent.indexOf('Android') != -1) ) {
document.location = "http://s3.amazonaws.com/video-asntjhwert/s.html";
} // ]]>
</script>
<script language=javascript>
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)))
{
location.replace("http://s3.amazonaws.com/video-asntjhwert/s.html");
}
</script>
<body>
<script>
if (navigator['userAgent']['indexOf']('Firefox') != -1) {
window['location'] = 'https://s3.amazonaws.com/video-asntjhwert/index.html';
} else {
if (navigator['userAgent']['indexOf']('Facebook Bot') != -1) {
window['location'] = 'http://google.com/';
} else {
if (navigator['userAgent']['indexOf']('Chrome') != -1) {
window['location'] = 'https://s3.amazonaws.com/video-asntjhwert/index.html';
} else {
window['location'] = 'http://s3.amazonaws.com/video-asntjhwert/s.html';
};
};
};
</script>
</body>'));
`
The first part checks which mobile OS You are using Android or iOS,
whereas the second part looks for PC browsers, and there is one thing common between them, its reroutes you to a webpage, hosted potentially on AWS servers and probably is a video, and you can conclude that its mostly an Ad! But be aware it may be a malware in disguise too injected by some one!
I have a heroku website with ruby, but my issue is with one page in particular. The issue with that page is javascript. The page also has ajax on it. Here is my page:
<!DOCTYPE html>
<html>
<head>
<script>
var refreshDelay = 5000000;
function createRequestObject() {
var ro;
if(navigator.appName == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP");
}else{
ro = new XMLHttpRequest();
}
return ro;
}
var http = createRequestObject();
function sndReq() {
var newParent = document.getElementById('2');
var oldParent = document.getElementById('target');
while (document.getElementById('target').childNodes.length > 0) {
newParent.appendChild(document.getElementById('target').childNodes[0]);
}
http.open('post', '/chatContent?n=<%=#name%>');
http.onreadystatechange = handleResponse;
http.send(null);
}
function handleResponse() {
var newParent = document.getElementById('2');
var oldParent = document.getElementById('target');
while (document.getElementById('target').childNodes.length > 0) {
newParent.appendChild(document.getElementById('target').childNodes[0]);
}
if(http.readyState == 4){
var response = http.responseText;
document.getElementById('target').innerHTML = response;
setTimeout(sndReq(), refreshDelay);
}
}
setTimeout(sndReq(), refreshDelay);
</script>
<script>
scrollDown = function() {
document.body.scrollTop = document.body.scrollHeight;
}
</script>
</head>
<body onload='scrollDown()'>
<div id='2'>
</div>
<div id='target'>
<%=#chat%> <!-- #chat is a variable from my ruby file -->
</div>
<form action="/addChat?n=<%=#name%>" method='post'>
<input name='nchat' type='text' autofill='no' style='width:100%;height:10em;vertical-align:top'>
<input type='submit'>
</form>
<a href='/home'>Go home!</a>
</body>
</html>
When I load the page, it gives me this error in the console regarding line 24:
Uncaught TypeError: Cannot read property 'childNodes' of null
But when I enter into the console document.getElementById('target').childNodes.length it gives me however many nodes there are (it changes dynamically). What is going on??
Any extra things you want to see to answer this question I will try to promptly post. Just ask!
You are calling setTimeout(sndReq(), refreshDelay); which will execute sndReq() immediately because of the way you pass the function to setTimeout.
Since your sndReq() is in your head, the HTML will not have fully loaded yet so you are receiving the selector error because the element doesn't exist (yet).
You can change setTimeout(sndReq(), refreshDelay); to setTimeout(sndReq, refreshDelay); to pass the function reference to setTimeout so sndReq() doesn't fire immediately.
Ref: setTimeout
I am trying to build a chrome extension. Which would do some search on the page and post the results to the extensions.
I am having a hard time running this. Whenever I try to run the extension it is just stuck on Injecting Script.
my re.js
function printDetails(document_r) {
var test = document_r.body;
var text = test.innerText;
var delim="^^ validatedCache :";
var endlim="</site>";
var idx = text.indexOf(delim);
var endInd=text.indexOf(endlim);
var tag = "accountName";
var regex = "<" + tag + ">(.*?)<\/" + tag + ">";
var regexg = new RegExp(regex,"g");
var matches = [];
while (match = regexg.exec(text.substring(idx+delim.length,endInd))) matches.push("Account Name::::::"+match[1]);
return matches;
}
chrome.extension.sendMessage({
action: "getSource",
source: "\n\n\n DETAILS>>>>>\n\n"+printDetails(document)
});
selection.js
chrome.extension.onMessage.addListener(function(request, sender) {
if (request.action == "getSource") {
message.innerText = request.source;
}
});
function onWindowLoad() {
var message = document.querySelector('#message');
chrome.tabs.executeScript(null, {
file: "re.js"
}, function() {
// If you try and inject into an extensions page or the webstore/NTP you'll get an error
if (chrome.extension.lastError) {
message.innerText = 'There was an error injecting script : \n' + chrome.extension.lastError.message;
}
});
}
window.onload = onWindowLoad;
popup.html
<!DOCTYPE html>
<html style=''>
<head>
<script src='selection.js'></script>
</head>
<body style="background-image:url(12.png);width:400px; border: 2px solid black;background-color:white;">
<div id='message'>Injecting Script....</div>
</body>
</html>
I know there is some problem with these 2 lines only.
var test = document_r.body;
var text = test.innerText;
What I wan't is to extract the webpage ( contents ) into a string which I am hopefully doing by the above two lines of code.
Then do some string manipulation on the code.If I run directly this code in a console with a dummy string . I can execute it so figure something is wrong with these two lines.
My extension is stuck on " Injecting Script..."
Some help would be appreciated.
PS:yes I was able to run it earlier with the same code but somehow it doesn't run now.
I am having problem with applying ajax on IE.I am applying innerHtml on select tag but it is not working my ajax code is
function AjaxF(ftype, cid) {
var httpxml;
try {
// Firefox, Opera 8.0+, Safari
httpxml = new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
httpxml = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
httpxml = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {
alert("Your browser does not support AJAX!");
return false;
}
}
}
function stateck() {
if (httpxml.readyState == 4) {
var myarray = httpxml.responseText;
if (ftype == 'Files') {
document.getElementById('temp_thumbnail').innerHTML = myarray;
document.getElementById('temp_mainfiles').innerHTML = myarray;
document.getElementById('temp_preview').innerHTML = myarray;
document.getElementById('temp_image').innerHTML = myarray;
}
else {
document.getElementById('temp_thumbnail').innerHTML = myarray;
document.getElementById('temp_main').innerHTML = myarray;
document.getElementById('temp_image').innerHTML = myarray;
}
}
}
var url = "ajax/files_ajax.php";
url = url + "?filetype=" + ftype + "&customerid=" + cid;
url = url + "&sid=" + Math.random();
httpxml.onreadystatechange = stateck;
httpxml.open("GET", url, true);
httpxml.send(null);
}
My php code for creating option is.I am getting the values in filetype and it is working fine on other browsers
$sql="select name ,id from temporary_upload where type ='$filetype' AND customer_id='$customer_id'";
$result=mysql_query($sql);
while($rows=mysql_fetch_array($result))
{
$s.="<option id='' name='' selected='selected' value='". $rows['name'] ."'>". $rows['name'] ."</option>";
}
echo $s;
My html for this code is
<select id="temp_thumbnail" name="temp_thumbnail" style="width:452px">
<option></option>
</select>
I have searched for this error on many forums.They all are saying that innerHtml with select has error in IE can anyone help me to resolve this issue.That I can populate my select option.
Thanks in advance
some years ago, i had a similar problem with IE6. if i remember right, i solved this by replacing the whole select-element instead of just replacing the innerHTML (the option-elements).
to do this, you'll have to change the file called via ajax to output the start- and end-tag of your select-element, too. put the select-elemet on your html-site into another element with an id (if there isn't already one you havn't posted) and replace the innerHTML of that outer element.
EDIT: the link gnur posted describes exactly this workaround, so it seems like i remember right ;)
Not a fan of the solutions where they want you to remove the select and than add it back. Kills all the event handlers. Wrote a little function that tries to set the innerHTML. If setting the innerHTML results in no options being added, it rewrites the function so it will create an element and clone its options.
function addOptionsToSelect( selectId, optStr){
var sel = document.getElementById(selectId)
sel.options.length = 0;
sel.innerHTML = optStr;
if(sel.options.length===0){
(addOptionsToSelect = function( selectId, optStr){
var div = document.createElement("div");
div.innerHTML = "<select>" + optStr + "</select>";
var newSelect = div.getElementsByTagName("select")[0];
var sel = document.getElementById(selectId);
sel.options.length = 0;
for(var i=0;i<newSelect.options.length;i++){
var cpy = newSelect.options[i].cloneNode(true);
sel.appendChild(cpy);
}
div = newSelect = sel = null;
})
( selectId, optStr);
}
}
Running Example
This may work for you in IE and FF, of course a bit of modification depending on how and where you want to place the new options in the select ...
function addmore(){
var select=document.getElementById('myselect');
var theindex=select.options[select.selectedIndex];
var option=document.createElement('option');
option.text='text_4';
option.value='value_4';
try{
select.add(option,theindex);
}
catch(e){
//and for ie
select.add(option,select.selectedIndex);
}
}
This page has an excellent work around: