Javascript help

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
I am trying to get this little javascript to show an embedded flash movie but I can't get it to work for some reason. I have all of the specific files listed.

I have seen it implemented here but I can't get it to show up on my html page.
Code:
<script type="text/javascript">
<!--
    var FO = {    movie:"mp3player.swf",width:"400",height:"410",majorversion:"8",build:"0",bgcolor:"#FFFFFF",allowfullscreen:"true",id:"ongfapp1", name:"ongfapp1",
    flashvars:"file=HRplaylist.xml&image=poster.jpg&displayheight=80&showeq=true&lightcolor=0x6e788c&backcolor=0xffffff&frontcolor=0x42719E&shuffle=false&enablejs=true&javascriptid=ongfapp1" };
    UFO.create(    FO, "ngfapp1");
//-->
</script>
 
Last edited:

Twinkie

Banned
Messages
1,389
Reaction score
12
Points
0
You should post your page which you are trying to get it to work. Probably one of the flash variables are wrong, using an invalid url.
 
Last edited:

blobtech

New Member
Prime Account
Messages
17
Reaction score
0
Points
1
If would have read the script itself, you can see it uses the 'create' method of OOP object 'UFO'.

This was referenced at the top of the page with a <script ... src="/design/vlada2/javascript/ufo.js"> </script > tag.
You should download that onto your server and reference it too. And BTW, just copying classes like this is not recommended, mostly they are copyrighted.
 
Last edited:

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
On my page, I refrenced every script and link throught the page and I am still puzzled. I still get a blank page even with this new one I made.
HTML:
<html>
<head>
	<script type="text/javascript">
var UFO = {
	req: ["movie", "width", "height", "majorversion", "build"],
	opt: ["play", "loop", "menu", "quality", "scale", "salign", "wmode", "bgcolor", "base", "flashvars", "devicefont", "allowscriptaccess", "seamlesstabbing", "allowfullscreen"],
	optAtt: ["id", "name", "align"],
	optExc: ["swliveconnect"],
	ximovie: "ufo.swf",
	xiwidth: "215",
	xiheight: "138",
	ua: navigator.userAgent.toLowerCase(),
	pluginType: "",
	fv: [0,0],
	foList: [],
		
	create: function(FO, id) {
		if (!UFO.uaHas("w3cdom") || UFO.uaHas("ieMac")) return;
		UFO.getFlashVersion();
		UFO.foList[id] = UFO.updateFO(FO);
		UFO.createCSS("#" + id, "visibility:hidden;");
		UFO.domLoad(id);
	},

	updateFO: function(FO) {
		if (typeof FO.xi != "undefined" && FO.xi == "true") {
			if (typeof FO.ximovie == "undefined") FO.ximovie = UFO.ximovie;
			if (typeof FO.xiwidth == "undefined") FO.xiwidth = UFO.xiwidth;
			if (typeof FO.xiheight == "undefined") FO.xiheight = UFO.xiheight;
		}
		FO.mainCalled = false;
		return FO;
	},

	domLoad: function(id) {
		var _t = setInterval(function() {
			if ((document.getElementsByTagName("body")[0] != null || document.body != null) && document.getElementById(id) != null) {
				UFO.main(id);
				clearInterval(_t);
			}
		}, 250);
		if (typeof document.addEventListener != "undefined") {
			document.addEventListener("DOMContentLoaded", function() { UFO.main(id); clearInterval(_t); } , null); // Gecko, Opera 9+
		}
	},

	main: function(id) {
		var _fo = UFO.foList[id];
		if (_fo.mainCalled) return;
		UFO.foList[id].mainCalled = true;
		document.getElementById(id).style.visibility = "hidden";
		if (UFO.hasRequired(id)) {
			if (UFO.hasFlashVersion(parseInt(_fo.majorversion, 10), parseInt(_fo.build, 10))) {
				if (typeof _fo.setcontainercss != "undefined" && _fo.setcontainercss == "true") UFO.setContainerCSS(id);
				UFO.writeSWF(id);
			}
			else if (_fo.xi == "true" && UFO.hasFlashVersion(6, 65)) {
				UFO.createDialog(id);
			}
		}
		document.getElementById(id).style.visibility = "visible";
	},
	
	createCSS: function(selector, declaration) {
		var _h = document.getElementsByTagName("head")[0]; 
		var _s = UFO.createElement("style");
		if (!UFO.uaHas("ieWin")) _s.appendChild(document.createTextNode(selector + " {" + declaration + "}")); // bugs in IE/Win
		_s.setAttribute("type", "text/css");
		_s.setAttribute("media", "screen"); 
		_h.appendChild(_s);
		if (UFO.uaHas("ieWin") && document.styleSheets && document.styleSheets.length > 0) {
			var _ls = document.styleSheets[document.styleSheets.length - 1];
			if (typeof _ls.addRule == "object") _ls.addRule(selector, declaration);
		}
	},
	
	setContainerCSS: function(id) {
		var _fo = UFO.foList[id];
		var _w = /%/.test(_fo.width) ? "" : "px";
		var _h = /%/.test(_fo.height) ? "" : "px";
		UFO.createCSS("#" + id, "width:" + _fo.width + _w +"; height:" + _fo.height + _h +";");
		if (_fo.width == "100%") {
			UFO.createCSS("body", "margin-left:0; margin-right:0; padding-left:0; padding-right:0;");
		}
		if (_fo.height == "100%") {
			UFO.createCSS("html", "height:100%; overflow:hidden;");
			UFO.createCSS("body", "margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0; height:100%;");
		}
	},

	createElement: function(el) {
		return (UFO.uaHas("xml") && typeof document.createElementNS != "undefined") ?  document.createElementNS("http://www.w3.org/1999/xhtml", el) : document.createElement(el);
	},

	createObjParam: function(el, aName, aValue) {
		var _p = UFO.createElement("param");
		_p.setAttribute("name", aName);	
		_p.setAttribute("value", aValue);
		el.appendChild(_p);
	},
I'll have to post the rest below.
 

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
Here's the rest of the source:
HTML:
    uaHas: function(ft) {
        var _u = UFO.ua;
        switch(ft) {
            case "w3cdom":
                return (typeof document.getElementById != "undefined" && typeof document.getElementsByTagName != "undefined" && (typeof document.createElement != "undefined" || typeof document.createElementNS != "undefined"));
            case "xml":
                var _m = document.getElementsByTagName("meta");
                var _l = _m.length;
                for (var i = 0; i < _l; i++) {
                    if (/content-type/i.test(_m[i].getAttribute("http-equiv")) && /xml/i.test(_m[i].getAttribute("content"))) return true;
                }
                return false;
            case "ieMac":
                return /msie/.test(_u) && !/opera/.test(_u) && /mac/.test(_u);
            case "ieWin":
                return /msie/.test(_u) && !/opera/.test(_u) && /win/.test(_u);
            case "gecko":
                return /gecko/.test(_u) && !/applewebkit/.test(_u);
            case "opera":
                return /opera/.test(_u);
            case "safari":
                return /applewebkit/.test(_u);
            default:
                return false;
        }
    },
    
    getFlashVersion: function() {
        if (UFO.fv[0] != 0) return;  
        if (navigator.plugins && typeof navigator.plugins["Shockwave Flash"] == "object") {
            UFO.pluginType = "npapi";
            var _d = navigator.plugins["Shockwave Flash"].description;
            if (typeof _d != "undefined") {
                _d = _d.replace(/^.*\s+(\S+\s+\S+$)/, "$1");
                var _m = parseInt(_d.replace(/^(.*)\..*$/, "$1"), 10);
                var _r = /r/.test(_d) ? parseInt(_d.replace(/^.*r(.*)$/, "$1"), 10) : 0;
                UFO.fv = [_m, _r];
            }
        }
        else if (window.ActiveXObject) {
            UFO.pluginType = "ax";
            try { // avoid fp 6 crashes
                var _a = new ActiveXObject("ShockwaveFlash.ShockwaveFlash.7");
            }
            catch(e) {
                try { 
                    var _a = new ActiveXObject("ShockwaveFlash.ShockwaveFlash.6");
                    UFO.fv = [6, 0];
                    _a.AllowScriptAccess = "always"; // throws if fp < 6.47 
                }
                catch(e) {
                    if (UFO.fv[0] == 6) return;
                }
                try {
                    var _a = new ActiveXObject("ShockwaveFlash.ShockwaveFlash");
                }
                catch(e) {}
            }
            if (typeof _a == "object") {
                var _d = _a.GetVariable("$version"); // bugs in fp 6.21/6.23
                if (typeof _d != "undefined") {
                    _d = _d.replace(/^\S+\s+(.*)$/, "$1").split(",");
                    UFO.fv = [parseInt(_d[0], 10), parseInt(_d[2], 10)];
                }
            }
        }
    },

    hasRequired: function(id) {
        var _l = UFO.req.length;
        for (var i = 0; i < _l; i++) {
            if (typeof UFO.foList[id][UFO.req[i]] == "undefined") return false;
        }
        return true;
    },
    
    hasFlashVersion: function(major, release) {
        return (UFO.fv[0] > major || (UFO.fv[0] == major && UFO.fv[1] >= release)) ? true : false;
    },

    writeSWF: function(id) {
        var _fo = UFO.foList[id];
        var _e = document.getElementById(id);
        if (UFO.pluginType == "npapi") {
            if (UFO.uaHas("gecko") || UFO.uaHas("xml")) {
                while(_e.hasChildNodes()) {
                    _e.removeChild(_e.firstChild);
                }
                var _obj = UFO.createElement("object");
                _obj.setAttribute("type", "application/x-shockwave-flash");
                _obj.setAttribute("data", _fo.movie);
                _obj.setAttribute("width", _fo.width);
                _obj.setAttribute("height", _fo.height);
                var _l = UFO.optAtt.length;
                for (var i = 0; i < _l; i++) {
                    if (typeof _fo[UFO.optAtt[i]] != "undefined") _obj.setAttribute(UFO.optAtt[i], _fo[UFO.optAtt[i]]);
                }
                var _o = UFO.opt.concat(UFO.optExc);
                var _l = _o.length;
                for (var i = 0; i < _l; i++) {
                    if (typeof _fo[_o[i]] != "undefined") UFO.createObjParam(_obj, _o[i], _fo[_o[i]]);
                }
                _e.appendChild(_obj);
            }
            else {
                var _emb = "";
                var _o = UFO.opt.concat(UFO.optAtt).concat(UFO.optExc);
                var _l = _o.length;
                for (var i = 0; i < _l; i++) {
                    if (typeof _fo[_o[i]] != "undefined") _emb += ' ' + _o[i] + '="' + _fo[_o[i]] + '"';
                }
                _e.innerHTML = '<embed type="application/x-shockwave-flash" src="' + _fo.movie + '" width="' + _fo.width + '" height="' + _fo.height + '" pluginspage="http://www.macromedia.com/go/getflashplayer"' + _emb + '></embed>';
            }
        }
        else if (UFO.pluginType == "ax") {
            var _objAtt = "";
            var _l = UFO.optAtt.length;
            for (var i = 0; i < _l; i++) {
                if (typeof _fo[UFO.optAtt[i]] != "undefined") _objAtt += ' ' + UFO.optAtt[i] + '="' + _fo[UFO.optAtt[i]] + '"';
            }
            var _objPar = "";
            var _l = UFO.opt.length;
            for (var i = 0; i < _l; i++) {
                if (typeof _fo[UFO.opt[i]] != "undefined") _objPar += '<param name="' + UFO.opt[i] + '" value="' + _fo[UFO.opt[i]] + '" />';
            }
            var _p = window.location.protocol == "https:" ? "https:" : "http:";
            _e.innerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + _objAtt + ' width="' + _fo.width + '" height="' + _fo.height + '" codebase="' + _p + '//download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=' + _fo.majorversion + ',0,' + _fo.build + ',0"><param name="movie" value="' + _fo.movie + '" />' + _objPar + '</object>';
        }
    },
        
    createDialog: function(id) {
        var _fo = UFO.foList[id];
        UFO.createCSS("html", "height:100%; overflow:hidden;");
        UFO.createCSS("body", "height:100%; overflow:hidden;");
        UFO.createCSS("#xi-con", "position:absolute; left:0; top:0; z-index:1000; width:100%; height:100%; background-color:#fff; filter:alpha(opacity:75); opacity:0.75;");
        UFO.createCSS("#xi-dia", "position:absolute; left:50%; top:50%; margin-left: -" + Math.round(parseInt(_fo.xiwidth, 10) / 2) + "px; margin-top: -" + Math.round(parseInt(_fo.xiheight, 10) / 2) + "px; width:" + _fo.xiwidth + "px; height:" + _fo.xiheight + "px;");
        var _b = document.getElementsByTagName("body")[0];
        var _c = UFO.createElement("div");
        _c.setAttribute("id", "xi-con");
        var _d = UFO.createElement("div");
        _d.setAttribute("id", "xi-dia");
        _c.appendChild(_d);
        _b.appendChild(_c);
        var _mmu = window.location;
        if (UFO.uaHas("xml") && UFO.uaHas("safari")) {
            var _mmd = document.getElementsByTagName("title")[0].firstChild.nodeValue = document.getElementsByTagName("title")[0].firstChild.nodeValue.slice(0, 47) + " - Flash Player Installation";
        }
        else {
            var _mmd = document.title = document.title.slice(0, 47) + " - Flash Player Installation";
        }
        var _mmp = UFO.pluginType == "ax" ? "ActiveX" : "PlugIn";
        var _uc = typeof _fo.xiurlcancel != "undefined" ? "&xiUrlCancel=" + _fo.xiurlcancel : "";
        var _uf = typeof _fo.xiurlfailed != "undefined" ? "&xiUrlFailed=" + _fo.xiurlfailed : "";
        UFO.foList["xi-dia"] = { movie:_fo.ximovie, width:_fo.xiwidth, height:_fo.xiheight, majorversion:"6", build:"65", flashvars:"MMredirectURL=" + _mmu + "&MMplayerType=" + _mmp + "&MMdoctitle=" + _mmd + _uc + _uf };
        UFO.writeSWF("xi-dia");
    },

    expressInstallCallback: function() {
        var _b = document.getElementsByTagName("body")[0];
        var _c = document.getElementById("xi-con");
        _b.removeChild(_c);
        UFO.createCSS("body", "height:auto; overflow:auto;");
        UFO.createCSS("html", "height:auto; overflow:auto;");
    },

    cleanupIELeaks: function() {
        var _o = document.getElementsByTagName("object");
        var _l = _o.length
        for (var i = 0; i < _l; i++) {
            _o[i].style.display = "none";
            for (var x in _o[i]) {
                if (typeof _o[i][x] == "function") {
                    _o[i][x] = null;
                }
            }
        }
    }

};

if (typeof window.attachEvent != "undefined" && UFO.uaHas("ieWin")) {
    window.attachEvent("onunload", UFO.cleanupIELeaks);
}

    </script>
</head>
<body>
<script type="text/javascript">
<!--
    var FO = {    movie:"mp3player.swf",width:"400",height:"410",majorversion:"8",build:"0",bgcolor:"#FFFFFF",allowfullscreen:"true",id:"ongfapp1", name:"ongfapp1",
    flashvars:"file=HRplaylist.xml&image=poster.jpg&displayheight=80&showeq=true&lightcolor=0x6e788c&backcolor=0xffffff&frontcolor=0x42719E&shuffle=false&enablejs=true&javascriptid=ongfapp1" };
    UFO.create(    FO, "ngfapp1");
//-->
</script>
</body>
</html>
 

xav0989

Community Public Relation
Community Support
Messages
4,467
Reaction score
95
Points
0
could you provide a link to your page...
 

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
Check the error console when you visit the page (always the first thing you should do when debugging JS). In FF, the error you get is:
Error: document.getElementById(id) is null
Source File: http://podaci.selfip.net:8080/player.html
Line: 52
Line 52 is in method 'main(id)', which is called from 'domLoad(id)', which is called from 'create(FO, id)', which is called from the last embedded script as 'UFO.create( FO, "ngfapp1")'. However FO.id is "ongfapp1". It looks like you have a typo.

Get Firebug and learn how to use it. It was possible to diagnose this problem without it by reading the error and examining the code, but Firebug makes it easier.

Also, the definition of the UFO object should be placed in an external JS file rather than embedded in player.html.

Edit: xav0989 asked for a link to the page not because the code might be different but because it's the live version. We need to see the source in case there's something obviously wrong with it, but we need the live version to see its behavior. We shouldn't have to go through the busywork of creating our own page containing the source you posted unless we need to make alterations. It's all part of being precise and informative.
 
Last edited:

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
I fixed the typo but I'm not really familiar with Javascript and don't know exactly what to do now. I am still getting the same error from the error console.
 

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
Perfect time to try out Firebug. What languages are you familiar with?
 

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
I'm kinda familiar with PHP and I want to learn ASP.NET. Really all I know is securing stuff and setting up my own web server out of Vista. I just started learning about coding and I'm only 15 so I really don't know much. I learn mostly by reading other sites' code.
 

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
Studying other code is helpful, but you miss out on principles. Find a good javascript tutorial (I wish I had a link to recommend, but I learned another way) or book (O'Reilly publishes good quality books). JS is a fun language to program in, so I highly recommend learning it.

JS has a number of similarities with PHP and some big differences. A minor difference is the syntax to access object properties. In JS, there are two ways to do it:
  1. use the dot operator ('.'). It's just like '->' in PHP
  2. use the index operator ('[]') and give the property name as the index.
The two are equivalent. You can use "obj.property" or "obj['property']".

Two big differences are that functions are first class data in JS (just like strings, numbers and objects), . You can assign a function to a variable or pass it to another function.
Code:
function bind(f, x) {
  return function (y) {
    return f(x, y);
  }
}
var add = function(a,b) {return a+b; }
var addOne = bind(add, 1);

The other big difference is JS uses prototype based inheritance rather than class based inheritance.
 
Last edited:

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
Is there a way to pass all the same variables in an html embedded object to get the same result?
 

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
Is there a way to pass all the same variables in an html embedded object to get the same result?

All you need to do is put everything in the first script tag in a file named "ufo.js" in a subdirectory named "js":
Code:
var UFO = {
...
};

if (typeof window.attachEvent != "undefined" && UFO.uaHas("ieWin")) {
    window.attachEvent("onunload", UFO.cleanupIELeaks);
}

player.html becomes very simple:
HTML:
<html>
<head>
    <title></title>
    <script type="text/javascript" src="js/ufo.js"></script>
</head>
<body>
<p id="ngfapp1"></p>
<script type="text/javascript">
<!--
    var FO = {    movie:"mp3player.swf",width:"400",height:"410",majorversion:"8",build:"0",bgcolor:"#FFFFFF",allowfullscreen:"true",id:"ongfapp1", name:"ongfapp1",
    flashvars:"file=HRplaylist.xml&image=poster.jpg&displayheight=80&showeq=true&lightcolor=0x6e788c&backcolor=0xffffff&frontcolor=0x42719E&shuffle=false&enablejs=true&javascriptid=ongfapp1" };
    UFO.create(    FO, "ngfapp1");
//-->
</script>
</body>
</html>
 
Last edited:

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
Thanks:biggrin:. I got the player to show and the playlist to load but its not playing. I guess I'll just mess with the xml some. Here's what I have so far:
Code:
<playlist version="1">
<trackList>
<track>
<title>
 - Mathematics
</title>
<creator>14.05.09.</creator>
<location>
http://podaci.selfip.net:8080/test_files/mathematics.mp3
</location>
<info>
http://podaci.selfip.net:8080/test_files/mathematics.mp3
</info>
</track>
</trackList>
</playlist>
It's just a shorter version than what's on the site I saw it at. The player on my page shows the date but not the name and will not play.
Edit:
I got it to fully work. I guess my xml was off. Thanks everybody for the help!
 
Last edited:

merrillmck

New Member
Messages
134
Reaction score
0
Points
0
I'm kinda familiar with PHP and I want to learn ASP.NET. Really all I know is securing stuff and setting up my own web server out of Vista. I just started learning about coding and I'm only 15 so I really don't know much. I learn mostly by reading other sites' code.

Most Visual Studio tools (ASP.NET, C#, VB, C++) can be self-taught just be simply going to their Help - Search routine and searching for different sets of keywords. They'll have abundant sample code, both stand-alone, and routines simply to illustrate a specific function. Look for "Getting Started" writeups and "How Do I" writeups on anything out there. Add to that maybe one textbook (visit your public library and they'll have ASP.NET, C#, and whatever else books) and you'll be good to go.

Ever since they released Visual Studio 2005 I'd rate their documentation an A+ for their programming languages.

One final comment. If you install Studio from DVDs, often the documentation isn't defaulted to be installed on your computer. You'll need to ensure all the documentation is "checked" as you're not going to use it if it is on a DVD hidden in your closet.
 

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
Thanks for the advice. I've been to the asp.net site and have a bunch of e-books on asp.net with visual web developer but I find PHP much more natural and I've tried to install ASP.Net on my laptop (aka server) but it didn't work out.
 
Top