|
JavaScript - Problems Getting Xml Nodes...
I have your typical AJAX function that doesn't seem to be working quite well. :<
Here's the relevant portion of the StateChange function: Code: function StateChange()
{
if(ttajax.readyState==4)
{
xmlDoc=ttajax.responseXML;
if (!xmlDoc) {return;}
var x=xmlDoc.documentElement.childNodes;
var AlertVal = '';
for (var i=0;i<x.length;i++)
{
if (x[i].nodeType==1)
{
AlertVal += x[i].nodeName + ": " + x[i].firstChild.nodeValue + "\n";
// AlertVal += x[i].nodeName + ": " + x[i].childNodes[0].nodeValue + "\n";
}
}
alert(AlertVal);
var gameid = xmlDoc.getElementsByTagName('gameid')[0].childNodes[0].nodeValue;
// Other ****
}
}
Note the testing function there... It DOES return the Node Name! However, the firstChild/childNodes[0] is "null", and I cannot pull the nodeValue from it. :< Here is a sample XML bit it's being tested on: Code: <?xml version="1.0" encoding="ISO-8859-1"?>
<game>
<gameid>16</gameid>
<turn>24262</turn>
<notturn>15010</notturn>
<dateline>1275511672</dateline>
<hcount>6</hcount>
<ccount>4</ccount>
<turn_html><![CDATA[
--Snipped--
]]></turn_html>
<board_html><![CDATA[
--Snipped--
]]></logs_html>
<cactivate>60580</cactivate>
<cactivate>65401</cactivate>
<cactivate>78720</cactivate>
<cactivate>80275</cactivate>
<sactivate>0</sactivate>
<sactivate>1</sactivate>
<sactivate>2</sactivate>
<sactivate>3</sactivate>
<sactivate>4</sactivate>
<sactivate>5</sactivate>
<sactivate>6</sactivate>
<sactivate>7</sactivate>
<sactivate>8</sactivate>
</game>
Any help would be appreciated, thanks. Similar TutorialsI'm developing a simple game that involves a system of interconnected nodes with unidirectional travel between nodes (similar to the circulation system!). The goal of the game is to get from a starting node to an ending node, which can be a variable number of nodes away. The program picks a random starting point, then randomly chooses one of its connecting nodes (cNodes) and pushes it onto a pathArray. A cNode is randomly chosen from this new node and it is pushed onto the pathArray. This continues for a designated number of turns, thus generating a pathArray (invisible to the player). The last element in the pathArray is the endNode and the goal of the puzzle. At each node the player is given two options of travel (though there may be more than two ways to go). One of these options MUST be the correct way if the player has not deviated from the path up until that point. If the player has deviated, this option can be any cNode. The other node is any cNode that does not lead to the endNode. The following code contains a simplified list of nodes that represents the content in my game. The function, however, is taken word for word. In this snippet, the pathArray & startNode have already been generated and I am trying to resolve how to assign "nodeChoice" as either the correct direction of travel (for a player on the correct path) or any random cNode (for a player who has deviated from the path). Keep in mind that the pathArray and cNodes lengths can be any size. Code: <script>
//NODES:
var nodeA = {name:"A"};
var nodeB = {name:"B"};
var nodeC = {name:"C"};
var nodeD = {name:"D"};
var nodeE = {name:"E"};
var nodeF = {name:"F"};
var nodeG = {name:"G"};
var nodeH = {name:"H"};
var nodeI = {name:"I"};
var nodeJ = {name:"J"};
var nodeK = {name:"K"};
//An array of all nodes in the system:
var systemArray = [nodeA, nodeB, nodeC, nodeD, nodeE, nodeF, nodeG, nodeH, nodeI, nodeJ, nodeK];
//Connecting Nodes (cNodes):
//(uni-directional, but cyclical)
nodeA.cNodes = [nodeB, nodeC];
nodeB.cNodes = [nodeD, nodeE, nodeF];
nodeC.cNodes = [nodeF, nodeG];
nodeD.cNodes = [nodeI, nodeH];
nodeE.cNodes = [nodeJ];
nodeF.cNodes = [nodeK];
nodeG.cNodes = [nodeK];
nodeJ.cNodes = [nodeA];
nodeK.cNodes = [nodeA];
nodeI.cNodes = [nodeA];
nodeH.cNodes = [nodeA];
//The path chosen (generated from code not included here)
var pathArray = [nodeA, nodeB, nodeE, nodeJ];
//nodeChoice will represent a cNode from any given node
var nodeChoice;
//chooseNode is supposed to assign nodeChoice the next element in pathArray if the player on on the right path (if at nodeB, nodeChoice = nodeE).
//However, if the user has taken a different path, its cNodes will not be in pathArray in which case a random cNode is assigned to nodeChoice
function chooseNode(_node) {
//check each cNode to see if any are in pathArray
for (var j = 0; j < _node.cNodes.length; j++) {
//if a cNode is in pathArray, then we know to assign it nodeChoice...
if (_node.cNodes[j] in pathArray) {
nodeChoice = _node.cNodes[j];
console.log("choiceNode CORRECT: " + nodeChoice.name); //(for debugging purposes only)
}
//...otherwise don't do anything in this forLoop/ifStatement
};
//if by this point nodeChoice is still undefined, meaning none of the current node's cNodes are in pathArray, assign it any one of its cNodes.
if (nodeChoice == undefined) {
nodeChoice = _node.cNodes[Math.floor(Math.random()* _node.cNodes.length)];
console.log("choiceNode INCORRECT: " + nodeChoice.name);//(for debugging purposes only)
};
};
//Runtime:
chooseNode(nodeB);
//Result should be only nodeE.name since nodeD is not in the pathArray...
console.log(nodeChoice.name);
</script>
...however, nodeChoice is assigned either D, E or F randomly and we are given the troubleshooting statement "choiceNode INCORRECT: D (or) E (or) F", indicating that the if-in statement is always ignored. I know that the if-in statement doesn't work but am not sure how else to write it so that each cNode is compared the each element in pathArray, both of which can be of variable lengths... I need to get the ID of all the nodes withing a DIV. How do I do that? Thanks, C what's the fastest or easiest way to get all comment nodes into an Array? the solution only needs to work in ie8/w3 if that helps. I got this code Code: Div= document.createElement("div");
Table= document.createElement("table");
Table.setAttribute("style","width:100px;height:100px;background-color : #708090;");
Table.setAttribute("bgColor","#708090");
tr=document.createElement("tr");
td=document.createElement("td");
text=document.createTextNode(aText);
myTableBody = document.createElement("TBODY")
td.appendChild(text);
tr.appendChild(td);
myTableBody.appendChild(tr);
Table.appendChild(myTableBody);
Div.appendChild(Table);
document.getElementsByTagName('body').item(0).appendChild(Div);
Now it all works fine with the exception of the Code: Table.setAttribute("style","width:100px;height:100px;background-color : #708090;");
so I was wondering how do I set the style attribute in the table node? I am trying to write a little Greasemonkey script to insert links to open mp3s in the Google Player. It is supposed to insert "(play)" next to these links. (play) is a span element consisting of a text node "(", a link/"a" element, and another text node ")". However, instead of inserting these new links next to each old link, it is putting them all in a row next to the very first mp3 link! For example, if there are 3 mp3 links found on the page, the following is inserted next to the first links: (play(play(play))) When the loop iterates over the whole array (i < links.length), the browser hangs until Firefox's slow script notification pops up and I click "Stop script"; then I see the nested links all next to the first mp3 link. Additionally, the url itself is strange. Just looking at it, you'd think I was running a recursive function, but I'm not! The URL with a limited for loop (x < 21): http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=http://www.hackerpublicradio.org/eps/hpr0924.mp3&autoPlay=true&autoPlay=true&autoPlay=true&autoPlay=true&autoPlay=true&autoPlay=true&autoPlay=tru e. Here is the script. I have been using the site http://www.hackerpublicradio.org for my testing. Code: var links = document.getElementsByTagName('a');
for (var i=0; i < links.length; i++) {
var x = links[i];
var url=x.href;
if (url.search(/.*\.mp3/i) != -1) {
var plink = document.createElement("a");
plink.href = "http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=" + url + "&autoPlay=true";
plink.target = "_blank"; //open in new tab
plink.appendChild(document.createTextNode("play"));
var pspan = document.createElement("span");
pspan.style.fontSize = "90%";
var openb = document.createTextNode("(");
var closeb = document.createTextNode(")");
pspan.appendChild(openb);
pspan.appendChild(plink);
pspan.appendChild(closeb);
x.parentNode.insertBefore(pspan, x.nextSibling);
}
}
No errors are showing up in the console. I've only tested it in Firefox 10. Please help me figure out where I'm going wrong! So there is this string i need to parse as xml: Code: <station><code>GB0923A</code><city>ABERDEEN</city><population>215.000</population><component><name>Nitrogen dioxide (air)</name><unit>_micro;g/m3</unit></component><component><name>Nitrogen oxides (air)</name><unit>_micro;g NO2/m3</unit></component></station> Now what I do is: -use this function to create xml doc from string Code: function stringToXML(text){
if (window.DOMParser)
{
parser=new DOMParser();
xmlDoc=parser.parseFromString(text,"text/xml");
}
else // Internet Explorer
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.loadXML(text);
}
return xmlDoc;
}
-display it in that if statement: Code: if (xmlhttp.readyState==4 && xmlhttp.status==200){
var response= xmlhttp.responseText;
xmlDoc= stringToXML(response);
var text="";
text= text+ xmlDoc.getElementsByTagName("city")[0].nodeValue + "<br/>";
text= text+ xmlDoc.getElementsByTagName("code")[0].nodeValue + "<br/>";
text= text+ xmlDoc.getElementsByTagName("population")[0].nodeValue + "<br/>";
document.getElementById("test").innerHTML = text;
document.getElementById("loading").style.display = "none";
}
the stirng shown at the beggining is passed to "response" (var response= xmlhttp.responseText. Now for some reason all 3 values displayed are null... I am trying to figure why for last 2hrs but i cnt see any reason why they shouldnt be the actual values of nodes in the string... Any help would be appreciated. i am interested in using RaphaelJS for creating VML/SVG rounded corners etc, but unless i physically put the <script> right after the element to which it needs to be applied, i have to rely on the single DOM load() event. which causes a delay before any script is executed,...thus a FOUC (flash of unstyled content). i'm guessing there is no way to track when individual elements are loaded into the DOM via a CSS filter or similar, or another way around this other than having <script> in the body or just dealing the the load delay? thanks, Leon hi am studying for a exam an i have some problems. Just wanted to get an idea when is it more appropriate to use a for than a while loop? how much work is a loop performing? what is the fewest times a loop will perform its body? how many times will a loop perform its body? (as a function of a constant and of a variable) insidehb.com/main/imageofday/aug16to31/aug16to31.htm 1. the "visit henrbuilt" link is in the wrong position (its supposed to be centered) 2. there are too many thumbnails for "aug 16 - 31" so i had to redo "thumbs_mask.gif" (which makes the gray and clear thing at the bottom that moves) so that it was longer and covered all the thumbnails. now that is is 400 px longer, the center of it moved 200px to the right and i cant get it to move 200px to the left. i would i guess it has to do with my style sheet (insidehb.com/main/imageofday/aug16to31/style13.css) but it could also have to do with my main html page (insidehb.com/main/imageofday/aug16to31/aug16to31.htm) 3. its still being messed up in IE even with a new doctype i have 3 different problems: 1. I was trying to make is display Kentucky Resident yes is the box is checked and nothing if it is not checked. 2. while trying to add this in I messed something up and not the alert will not display anything at all. 3. last time I click the button the play load a page error and i have no idea why. any and all help would be appreciated. thanks. Code: <?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>EKU</title>
<script type="text/javascript">
//<![CDATA[
function valStudent()
{
var lastName = document.frmStudentInfo.txtLastName.value;
var firstname = document.frmStudentInfo.txtFirstName.value;
var mi = document.frmStudentInfo.txtS_Mi.value;
var address = document.frmStudentInfo.txtS_Add.value;
var city = document.frmStudentInfo.txtS_City.value;
var state = document.frmStudentInfo.txtS_State.value;
var zip = document.frmStudentInfo.txtS_Zip.value;
var phone = document.frmStudentInfo.txtS_Phone.value;
var dob = new Date (document.frmStudentInfo.txtS_Dob.value);
var selectAdvisor = document.frmStudentInfo.lstF_ID.selectIndex;
var res = document.frmStudentInfo.chkResident.value;
var stuClass;
var classChecked = false;
for (var i=0; i < document.frmStudentInfo.optS_Class.length; i++)
{
if (document.frmStudentInfo.optS_Class[i].checked)
{
classChecked = true;
stuClass = document.frmStudentInfo.optS_Class[i].value;
}
}
if (lastName == "")
{
alert ("Please enter a last name");
document.frmStudentInfo.txtLastName.select();
return false;
} else if (firstname == "")
{
alert ("Please enter a first name");
document.frmStudentInfo.txtFirstName.select();
return false;
}else if (address == "")
{
alert ("Please enter a address");
document.frmStudentInfo.txtS_Add.select();
return false;
} else if (city == "")
{
alert ("Please enter a city");
document.frmStudentInfo.txtS_City.select();
return false;
} else if (state == "")
{
alert ("Please enter a state");
document.frmStudentInfo.txtS_State.select();
return false;
} else if (zip == "")
{
alert ("Please enter a zip");
document.frmStudentInfo.txtS_Zip.select();
return false;
} else if (phone == "")
{
alert ("Please enter a phone");
document.frmStudentInfo.txtS_Phone.select();
return false;
}else if (dob == "NaN")
{
alert ("Date of Birth is not valid, use MM/DD/YYYY to enter data");
document.frmStudentInfo.txtS_Dob.select();
return false;
}else
{
alert ("Last name: " + lastName + "\n" + "First Name: " + firstname + "\n" +
"mi: " + mi + "\n" + "Address: " + address + "\n" + "City: " + city + "\n" +
"State: " + state + "\n" + "Zip: " + zip + "\n" + "phone: " + phone + "\n" +
"Date of Birth: " + dob + "\n" +
"Advisor " + document.frmStudentInfo.lstF_ID.text(selectAdvisor).text +
"\n" + "classfication " + stuClass);
return true;
}
}
//]]>
</script>
</head>
<body>
<table width="70%" align="center">
<tr>
<td><img src="nwlogo.jpg" width="196" height="93" alt="** PLEASE DESCRIBE THIS IMAGE **" /></td>
<td>
<h2>Student Information</h2>
</td>
</tr>
</table>
<form name="frmStudentInfo" action="action%20marker" id="frmStudentInfo">
<table align="center">
<tr>
<td> Last Name:</td>
<td><input type="text" name="txtLastName" size="20" /></td>
<td></td>
<td> </td>
<td>
<h4>Class:</h4>
</td>
<td></td>
</tr>
<tr>
<td> First Name:</td>
<td><input type="text" name="txtFirstName" size="20" /></td>
<td> </td>
<td><input type="radio" name="optS_Class" value="Freshman" /></td>
<td>Freshman</td>
</tr>
<tr>
<td> MI:</td>
<td><input type="text" name="txtS_Mi" size="5" /></td>
<td> </td>
<td><input type="radio" name="optS_Class" value="Sophomore" /></td>
<td>Sophomore</td>
</tr>
<tr>
<td> Address:</td>
<td><input type="text" name="txtS_Add" size="20" /></td>
<td> </td>
<td><input type="radio" name="optS_Class" value="Junior" /></td>
<td>Junior</td>
</tr>
<tr>
<td> City:</td>
<td><input type="text" name="txtS_City" size="20" /></td>
<td> </td>
<td><input type="radio" name="optS_Class" value="Senior" /></td>
<td>Senior</td>
</tr>
<tr>
<td> State:</td>
<td><input type="text" name="txtS_State" size="5" /></td>
<td> </td>
<td><input type="radio" name="optS_Class" value="Graduate" /></td>
<td>Graduate</td>
</tr>
<tr>
<td> ZIP Code:</td>
<td><input type="text" name="txtS_Zip" size="20" /></td>
<td> </td>
<td></td>
<td></td>
</tr>
<tr>
<td> Phone:</td>
<td><input type="text" name="txtS_Phone" size="20" /></td>
<td> </td>
<td>:<input name="chkResident" type="checkbox" /></td>
<td> Kentucky Resident</td>
</tr>
<tr>
<td> Date of Birth:</td>
<td><input type="text" name="txtS_Dob" size="20" /></td>
<td> </td>
<td>Advisor</td>
<td><select size="1" name="lstF_ID">
<option selected="selected">1 (Chuck Lin)</option>
<option>2 (Chris Blades)</option>
<option>3 (Steve Loy)</option>
<option>4 (Bob Mahaney)</option>
<option>5 (Ted Randles)</option>
</select></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="Submit" onclick="valStudent()" /></td>
</tr>
</table>
</form>
</body>
</html>
Hi: Code below works fine in Firefox and Firebug shows no problems. Code:
function changePlaylist(newplaylist,no_of_items)
{
playerConfig.playlist = [];
for(var i = 0; i < no_of_items; i++)
{
playerConfig.playlist[i] = newplaylist;
}
setTimeout("createPlayer()",1); //delay create player to allow playlist to "stabilize"
mediaPlayer.play(); // play the newly loaded playlist sequence*
}
IE9 script debugging (attached file) indicates problems with mediaplayer.play(). Even so it plays a movie. When I try playing a different movie in IE 9 nothing happens. Like I said works fine in Firefox and worked fine in IE 8. I called MS about problems with IE 9 security stuff etc. Talked with a guy in Bangladesh or some place over a bad connection who said they were gathering bug information (as usual with MS). All the dialogs where you can "allow scripting" etc. etc. have been replaced with some mindless stuff (as usual for MS). Anyway, are there some workarounds for IE9 problems? I am putting together a quiz in the form of a game, and I have tested the code for problems, and found a big one. Here is a part of my code that doesn't work- it always goes to "Sorry, incorrect", even when I type in 2.37. Code: var x=document.getElementById("varsource1");
if (x==="2.37")
{
alert("Correct.");
(More code here)
}
else if(x !== "2.37")
{
alert("Sorry, incorrect.");
}
If anyone wants my whole code, I can put it up later, if you ask me for it. Hey all. I am trying to remove a child node from an XML document and running into issues. I keep getting errors about not being able to find the child node, even though it very clearly exists. This is my XML http://www.digitalswordsmen.com/at/map11.xml I have tried the code //XML is a reference to my XML, go figure. var ID = 0; var y=XML.getElementsByTagName("id")[ID]; //This line works... alert(y.childNodes[0].nodeValue); //This fails XML.documentElement.removeChild(y); This is the exact error: Error: uncaught exception: [Exception... "Node was not found" code: "8" nsresult: "0x80530008 (NS_ERROR_DOM_NOT_FOUND_ERR)" location: "http://www.digitalswordsmen.com/at/mapFunctions.js Line: 373"] but to no avail. I think the issue is that most examples I've tried to follow only have the root element, then the nodes, but I have a root element, then another level (mapSettings & mapObjects). I don't know how to tell the remove child command that it needs to look in the mapObjects section. I'm totally stuck. Any help is appreciated. Thanks. i am building/coding a simple calculator and i have this Code: function addDigit() {
if(id=7) {
document.getElementById("display").value="7";
}
if(id=8) {
document.getElementById("display").value="8";
}
if(id=9) {
document.getElementById("display").value="9";
}
}
function clearAll() {
document.getElementById("display").value="";
}
as the code but when i press the 7 8 or 9 buttons it only shows up as a 9. go to http://www.mightypeacock.com/Practice/calculator.html to see what i mean. Bear with me as this is my first post but i am not sure what this is about. My computer seems to have problems with its javascript when opening new windows from certain sites that are either audio or video files. I simply have not got a clue where to begin. Any help ould be most grateful. Hey guys, I'm trying to hide a TR if a TD within it has only specific html in it. Why would this not work: Code: if(document.getElementById('website1').innerHTML.toLowerCase()=="<a href='' title=''></a>")
{
document.getElementById('website-row').style.display='none';
}
Any help would be greatly appreciated! I'm using javascript to create a slideshow of images with thumbnails. The slideshow works fine, the titles show up great, but my problem arises when I try to replace the href source of a div. [larger], specified in the js is supposed to be replacing the current a href source, but it isn't working. This is the javascript that controls the slideshow: Code: var current = 0;
function swapimg( show ){
var piece = new Array();
var title = new Array();
var larger = new Array();
var meta = new Array();
piece[0] = '../assets/images/nokia/nokia01.jpg';
title[0] = '[ One ]';
larger[0] = '../assets/images/nokia/nokia01_big.jpg';
piece[1] = '../images/nokia/nokia02.png';
title[1] = '[ Two ]';
larger[1] = '../assets/images/nokia/nokia02_big.jpg';
piece[2] = '../assets/images/nokia/nokia03.png';
title[2] = '[ Three ]';
larger[2] = '../assets/images/nokia/nokia02_big.jpg';
piece[3] = '../assets/images/nokia/nokia04.png';
title[3] = '[ Four ]';
larger[3] = '../assets/images/nokia/nokia02_big.jpg';
document.getElementById( 'featured' ).src = piece[show];
document.getElementById( 'featured' ).alt = title[show];
document.getElementById( 'featuretitle' ).innerHTML = title[show];
document.getElementById( 'featuremeta' ).innerHTML = meta[show];
document.getElementById( 'featurelarger' ).href = larger[show];
for( i = 0; i < meta.length; i++ ){
document.getElementById( 'item' + i ).style.opacity = '.5';
}
document.getElementById( 'item' + ( show ) ).style.opacity = '.99';
current = ( show );
}
And this is the portion of the html that is supposed to be working with the [larger], but I'm having troubles with: Code: <div class="featurelarger"><a href="../assets/images/nokia/nokia01_big.jpg" id="featurelarger" class="thickbox" title="Windowcling" rel="gallery-art" >view larger</a></div> Any help would be greatly appreciated, thank you in advance! Hi there! Here's my problems: The problem 1 is about making triangle with "*", but i must not use <center> so the triangle must be on the left side.. Here's my code: var x = parseInt(prompt("Your value","")); var A= ""; var B=[" "]; for (i=0; i<x; i++) B[i+1]=B[i]+" "; for (i=0; i<x; i++) { A = A+"*"; document.write("<br>" + B[x-i] + A) } How can i make this code more basic? The problem 2 is about taking random different elements from Array. Here's code: var items = Array(0,1,2,3,4,5,6,7,8,9), a; document.write("Secilen elemanlar: "); for (i=0; i<5; i++) { a= Math.floor(Math.random()*items.length); document.write(items[a]); items.splice(a,1); } In that problem how can i do the same thing without splice. And the problem 3 is about number triangle like this 1 232 34543 I couldn't write any code,and cane you give some advices like "what methods i must use"? Reply With Quote 02-04-2015, 07:34 PM #2 felgall View Profile View Forum Posts Visit Homepage Master Coder Join Date Sep 2005 Location Sydney, Australia Posts 6,745 Thanks 0 Thanked 666 Times in 655 Posts splice is about the only command there that you should consider using. Yuo are misusing parseInt() where you should be using Number() and the prompt() and document.write() should never be used at all - they became obsolete many years ago. Hi everyone.. I am using the script below to run a rating plugin... it works on all browsers except ie6 and 7.. any help would be greatly appreciated.. thanks in advance.. $.fn.rater = function(options) { var opts = $.extend({}, $.fn.rater.defaults, options); return this.each(function() { var $this = $(this); var $on = $this.find('.ui-rater-starsOn'); var $off = $this.find('.ui-rater-starsOff'); opts.size = $on.height(); if (opts.rating == undefined) opts.rating = $on.width() / opts.size; if (opts.id == undefined) opts.id = $this.attr('id'); $off.mousemove(function(e) { var left = e.clientX - $off.offset().left; var width = $off.width() - ($off.width() - left); width = Math.ceil(width / (opts.size / opts.step)) * opts.size / opts.step; $on.width(width); }).hover(function(e) { $on.addClass('ui-rater-starsHover'); }, function(e) { $on.removeClass('ui-rater-starsHover'); $on.width(opts.rating * opts.size); }).click(function(e) { var r = Math.round($on.width() / $off.width() * (opts.units * opts.step)) / opts.step; $off.unbind('click').unbind('mousemove').unbind('mouseenter').unbind('mouseleave'); $off.css('cursor', 'default'); $on.css('cursor', 'default'); $.fn.rater.rate($this, opts, r); }).css('cursor', 'pointer'); $on.css('cursor', 'pointer'); }); }; $.fn.rater.defaults = { postHref: location.href, guid: 0, units: 5, step: 1, }; $.fn.rater.rate = function($this, opts, rating) { var $on = $this.find('.ui-rater-starsOn'); var $off = $this.find('.ui-rater-starsOff'); $off.fadeTo(600, 0.4, function() { $.ajax({ url: opts.postHref, type: "POST", data: 'id=' + opts.id + '&guid=' + opts.guid + '&rating=' + rating, complete: function(req) { if (req.status == 200) { //success opts.rating = parseFloat(req.responseText); $off.fadeTo(600, 0.1, function() { $on.removeClass('ui-rater-starsHover').width(opts.rating * opts.size); var $count = $this.find('.ui-rater-rateCount'); $count.text(parseInt($count.text()) + 1); $this.find('.ui-rater-rating').text(opts.rating.toFixed(1)); $off.fadeTo(600, 1); $this.attr('title', 'Your rating: ' + rating.toFixed(1)); }); } else { //failure alert(req.responseText); $on.removeClass('ui-rater-starsHover').width(opts.rating * opts.size); $this.rater(opts); $off.fadeTo(2200, 1); } } }); }); }; -Carlos |
|||||||