Can somebody please tell me what is wrong with the JavaScript in this code? It said "Unexpected end of input", but I do not see any errors. All my statements seem to be ended at some point, and every syntax checker says that no errors were detected.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<title>Slide Editor</title>
<style>
#font-face {
font-family: SegoeUILight;
src: url(Segoe_UI_Light.ttf);
}
* {
font-family: SegoeUILight;
}
</style>
<script src="Slide/RevealJS/lib/js/html5shiv.js"></script>
<script src="Slide/RevealJS/lib/js/head.min.js"></script>
</head>
<body onload="editSlideshow()">
<div id="sl">
<span id="sls"></span>
</div>
<span id="slt"></span>
<div id="editor">
</div>
<script>
function getURLParameters(paramName) {
var sURL = window.document.URL.toString();
if (sURL.indexOf("?") > 0) {
var arrParams = sURL.split("?");
var arrURLParams = arrParams[1].split("&");
var arrParamNames = new Array(arrURLParams.length);
var arrParamValues = new Array(arrURLParams.length);
var i = 0;
for (i = 0; i < arrURLParams.length; i++) {
var sParam = arrURLParams[i].split("=");
arrParamNames[i] = sParam[0];
if (sParam[1] != "")
arrParamValues[i] = unescape(sParam[1]);
else
arrParamValues[i] = "No Value";
}
for (i = 0; i < arrURLParams.length; i++) {
if (arrParamNames[i] == paramName) {
//alert("Parameter:" + arrParamValues[i]);
return arrParamValues[i];
}
}
return "No Parameters Found";
}
}
var name = getURLParameters("show");
var slideCount = 1;
function editSlideshow() {
if (localStorage.getItem("app_slide_doc_" + name) == null) {
$("#sls").append('<button onclick = "loadSlide\'1\')" id = "slide_1">Slide 1</button>');
$("#sl").append('button onclick = "newSlide()">New Slide</button>');
slideCount = 1;
} else {
var textArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
slideCount = textArray.length;
var slideCnt = textArray.length - 1;
for (var i = 0; i <= slideCnt; i++) {
$("#sls").append('<button onclick = "loadSlide\'' + (i + 1) + '\')" id = "slide_' + (i + 1) + '">Slide ' + (i + 1) + '</button>');
};
$("sl").append('<button onclick = "newSlide()">New Slide</button>');
};
};
function loadSlide(num) {
var array = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
if (array == null) {
document.getElementById("editor").innerHTML = "<p><textarea rows = '15' cols = '100' id = 'editTxt'></textarea></p>";
document.getElementById("slt").innerHTML = "Slide " + num;
$("#editor").append("<p><button onclick = 'saveSlide(\"" + num + "\")'>Save Slide</button><button onclick = 'deleteSlide(\"" + num + "\")'>Delete Slide</button></p>");
} else if (array[num - 1] == null) {
document.getElementById("editor").innerHTML = "<p><textarea rows = '15' cols = '100' id = 'editTxt'></textarea></p>";
document.getElementById("slt").innerHTML = "Slide " + num;
$("#editor").append("<p><button onclick = 'saveSlide(\"" + num + "\")'>Save Slide</button><button onclick = 'deleteSlide(\"" + num + "\")'>Delete Slide</button></p>");
} else {
var slideArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
var text = slideArray[num - 1];
document.getElementById("editor").innerHTML = "<p><textarea rows = '15' cols = '100' id = 'editTxt'></textarea></p>";
document.getElementById("editTxt").value = text;
document.getElementById("slt").innerHTML = "Slide " + num;
$("#editor").append("<p><button onclick = 'saveSlide(\"" + num + "\")'>Save Slide</button><button onclick = 'deleteSlide(\"" + num + "\")'>Delete Slide</button></p>");
};
};
function saveSlide(num) {
if (localStorage.getItem("app_slide_doc_" + name) == null) {
var text = document.getElementById("editTxt").value;
var textArray = new Array();
textArray[num - 1] = text;
localStorage.setItem("app_slide_doc_" + name, JSON.stringify(textArray));
} else {
var textArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
var text = document.getElementById("editTxt").value;
textArray[num - 1] = text;
localStorage.setItem("app_slide_doc_" + name, JSON.stringify(textArray));
};
};
function newSlide() {
var nextSlide = slideCount + 1;
$("#sls").append('<button onclick = "loadSlide(\'' + nextSlide + '\')" id = "slide_' + nextSlide.toString() + '">Slide ' + nextSlide.toString() + '</button>');
slideCount = nextSlide;
};
function deleteSlide(num) {
if (localStorage.getItem("app_slide_doc_" + name) == null) {
if (num !== "1") {
$("#slide_" + num).remove();
document.getElementById("editor").innerHTML = "";
document.getElementById("slt").innerHTML = "";
slideCount = slideCount - 1;
location.reload();
} else {
alert("The first slide cannot be deleted.");
};
} else {
var textArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
if (num !== "1") {
$("#slide_" + num).remove();
document.getElementById("editor").innerHTML = "";
document.getElementById("slt").innerHTML = "";
slideCount = slideCount - 1;
textArray.splice((num - 1), 1);
localStorage.setItem("app_slide_doc_" + name, JSON.stringify(textArray));
location.reload();
} else {
alert("The first slide cannot be deleted.");
};
};
};
</script>
</body>
</html>
You've gotten the punctuation wrong in more than one of your onclick attributes, for instance here:
$("#sls").append('<button onclick = "loadSlide\'1\')" id = "slide_1">Slide 1</button>');
It's missing the opening parenthesis. The reason syntax checks don't immediately catch this is because you're putting code inside a string. Which you should not do.
Since you're using jQuery, how about using .click(function() { ... }) instead of inline attributes? Just be careful to get your captured variables correct.
The problem at line 63
$("#sl").append('button onclick = "newSlide()">New Slide</button>');
Should be:
$("#sl").append('<button onclick = "newSlide()">New Slide</button>');
Related
function displayEvent(array) {
var vOutput = "";
var ind = 0;
for(var i = 0; i < array.length; i++) {
ind += 1;
vOutput += "Name " + ind + ": " + array[i].name + ", Age " + array[i].age + "<br />";
}
document.getElementById("output").innerHTML = vOutput;
}
function init() {
var arrEvent = [];
var objEvent = {};
objEvent.name = prompt("Enter name of Event");
objEvent.age = prompt("Enter number of Guests");
arrEvent.push(objEvent);
while(objEvent.name.length > 0) {
objEvent.name = prompt("Enter name of Event");
objEvent.age = prompt("Enter number of Guests");
if(objEvent.name.length > 0) {
arrEvent.push(objEvent);
}
}
displayEvent(arrEvent);
}
window.onload = init;
Trying to print an object array into the HTML paragraph id and whenever I execute the code above I get the correct output but the array elements just show as blank.
You are always pushing the same object into your array.
Change to:
function displayEvent(array) {
var vOutput = "";
var ind = 0;
for(var i = 0; i < array.length; i++) {
ind += 1;
vOutput += "Name " + ind + ": " + array[i].name + ", Age " + array[i].age + "<br />";
}
document.getElementById("output").innerHTML = vOutput;
}
function init() {
var arrEvent = [];
var name = '';
var age = '';
name = prompt("Enter name of Event");
age = prompt("Enter number of Guests");
arrEvent.push({name: name, age: age});
while(name.length > 0) {
name = prompt("Enter name of Event");
age = prompt("Enter number of Guests");
if(name.length > 0) {
arrEvent.push({name: name, age: age});
}
}
displayEvent(arrEvent);
}
window.onload = init;
I created a list of buttons from code behind, and append them on some div, how ever each button has an onclick java script function
here is how I did it:
string[] messages = CM.GetMessages(Session["USER_EMAIL"].ToString()).Split(new string[] { "$STARTCHAT$" }, StringSplitOptions.None);
string[] usersalone = CM.GetChaters(Session["USER_EMAIL"].ToString()).Split(new string[] { "$NEWUSER$" }, StringSplitOptions.None);
string[] username = CM.GetUserNames(Session["USER_EMAIL"].ToString()).Split(new string[] { "$NEWUSER$" }, StringSplitOptions.None);
for (int i = messages.Length-2; i>=0; i--)
{
Button b = new Button();
b.ID = Session["USER_EMAIL"].ToString()+username[i];
b.Text = "Chat With: " + usersalone[i] ;
b.Width = 250;
b.Height = 100;
b.OnClientClick = "return DisplayMessage('" + messages[i+1] + "','" + username[i] + "','" + Session["USER_EMAIL"].ToString() + "')";
b.Style.Add("background-color", "rgb(246, 246, 246)");
// lblChatwith.Text = username[i];
NewMsgNotArrow.Controls.Add(b);
}
and here is my java script function:
function DisplayMessage(messages, from, username) {
document.getElementById("AllMessages").innerText ="";
document.getElementById("DivDisplayMessage").style.visibility = "visible";
document.getElementById("lblChatwith").innerText = from;
var MessageForEachUser = messages.split("$SAMECHATNEWTEXT$");
for (var i = 0; i < MessageForEachUser.length; i++)
{
var ck = MessageForEachUser[i].indexOf("$" + from.toUpperCase() + "$") > -1;
if (ck == true) {
document.getElementById("AllMessages").innerText += from.toUpperCase() + ":\n";
var temp = MessageForEachUser[i].split("$" + from.toUpperCase() + "$");
MessageForEachUser[i] = temp[0];
}
if (ck == false) {
document.getElementById("AllMessages").innerText += username.toUpperCase() + ":\n";
var temp = MessageForEachUser[i].split("$" + username.toUpperCase() + "$");
MessageForEachUser[i] = temp[0];
}
document.getElementById("AllMessages").innerText += MessageForEachUser[i] + "\n______________________________________________________" + "\n";
}
return false;
}
every thing is working well but, when i want to use one of the labels like "lblchatwith" from code behind it return an empty string.
The following Jquery code works well in Firefox but throws exception in IE. Please help. The following code will render a multi select box where you can drag and drop values from one box to other. The code when run in IE throws an object expected expception. As it in inside a large page, the actual place of bug can not be identified.
$(document).ready(function() {
//adding combo box
$(".combo").each(function() {
var name = "to" + $(this).attr('name');
var $sel = $("<select>").addClass("multi_select");
$sel.addClass("combo2");
$sel.attr('id', $(this).attr('id') + "_rec");
$(this).after($sel);
});
$(".multi_select").hide();
var $tab;
var i = 0;
var temp = 0;
//creating different div's to accomodate different elements
$(".multi_select").each(function() {
var $cont = $("#container");
var $input;
if ($(this).hasClass("combo") || $(this).hasClass("combo2")) {
var $col = null;
if ($(this).hasClass("combo")) {
$tab = $("<table>");
$cont = ($tab).appendTo($cont);
var idT = $(this).attr('id');
var $row = $("<tr id='" + idT + "_row1'>").appendTo($tab);
$col = $("<td id='" + idT + "_col1'>").appendTo($row);
$input = $("<input class='searchOpt'></input><img src='images/add.png' class='arrow1'/> ");
$("<div>").addClass('ip_outer_container combo').attr('id', $(this).attr('id') + "out_div").append("<h3 class='header_select'>Tasks</h3>").appendTo($col);
($row).after("<tr><td></td><td><textarea name='" + $(this).attr("name") + "Text' id='" + $(this).attr("id") + "Text'></textarea> </td></tr>");
$cont = $tab;
} else {
var idTm = $(this).attr('id');
var $row2 = $("<tr id='" + idTm + "_row2'>").appendTo($tab);
var $col2 = $("<td id='" + idTm + "_col2'>").appendTo($row2);
$input = $("<input class='searchOpt'></input>");
$("<div>").addClass('ip_outer_container combo2').attr('id', $(this).attr('id') + "out_div").append("<h3 class='header_select'>Tasks</h3>").appendTo($col2);
}
} else {
$("<div>").addClass('ip_outer_container' + classSelect).attr('id', $(this).attr('id') + "out_div").append("<h3 class='header_select'>Tasks</h3>").appendTo($cont);
}
$("<div>").addClass('outer_container').attr('id', $(this).attr('id') + "_div").appendTo('#' + $(this).attr('id') + "out_div");
$($input).appendTo("#" + $(this).attr('id') + "out_div");
});
//adding options from select box to accomodate different //elements
$(".multi_select option").each(function() {
$(this).attr('id', $(this).parent().attr('id') + "option_" + i);
var val = $(this).val().replace("#comment#", "");
var $d = $("<div class='multi_select_div'>" + val + "</div>").attr('id', $(this).parent().attr('id') + 'option_div_' + i);
$d.appendTo("#" + $(this).parent().attr('id') + "_div");
i++;
});
//delete function
$(".delete").click(function() {
$(this).parent().remove();
});
//input
$(".searchOpt").keyup(function() {
$(this).prev().children().show();
var val = $(this).val();
if (val != "") {
var selId = $(this).prev().attr('id');
selId = selId.replace("_div", "option_div");
$(this).prev().children().not("div[id^=" + selId + "]:contains(" + val + ")").hide();
//var $d=$('div[id^="multi_select_senoption_div"]');
//$('div[id^="multi_select_senoption_div"]').not('div[id^="multi_select_senoption_div"]:contains("xls")').hide();
}
});
var optionId = 0;
$(".arrow1").click(function() {
var divId = $(this).parent().attr("id");
divId = divId.replace("out_div", "");
var textValue = "#comment#" + $("#" + divId + "Text").val();
var selToId = divId + "_rec";
$("#" + divId + " option[selected='selected']").each(function() {
var idOpt = $("#" + selToId).attr("id") + "option_" + optionId;
$opt = $("<option>");
$opt.attr("id", idOpt).attr("value", $(this).val() + textValue);
$("#" + selToId).append($opt);
var value = $(this).val().replace("#comment#", "");
var divId = $("#" + selToId).attr('id') + 'option_div_' + optionId;
var $de = $("<div class='multi_select_div'><img class='delete' src='images/delete.png'></img>" + value + "</div>").attr('id', divId);
$de.appendTo("#" + $("#" + selToId).attr('id') + "_div");
$("#" + divId).bind("click", handler);
var optId = divToOption($(this).attr("id"));
var optValue = $(optId).val();
var comment = optValue.substring(optValue.indexOf("#comment#") + 9);
$("#" + divId).attr("title", textValue.replace("#comment#", ""));
//$("#"+divId).bind("mouseenter",handler2);
//$("#"+divId).bind("mouseleave",handler3);
$(".delete").bind("click", handler1);
optionId++;
});
// function code
//
});
$(".multi_select_div").click(function() {
var id = divToOption($(this).attr('id'));
var selected = $(id + "[selected]");
if (selected.length > 0) {
$(id).attr('selected', false);
var cssObj = {
'background-color': 'black'
};
$(this).css(cssObj);
}
else {
$(id).attr('selected', 'selected');
var cssObj = {
'background-color': 'orange'
};
$(this).css(cssObj);
}
});
function handler(event) {
var id = divToOption($(this).attr('id'));
var selected = $(id + "[selected]");
if (selected.length > 0) {
$(id).attr('selected', false);
var cssObj = {
'background-color': 'black'
};
$(this).css(cssObj);
}
else {
$(id).attr('selected', 'selected');
var cssObj = {
'background-color': 'orange'
};
$(this).css(cssObj);
}
}
function handler1(event) {
$(this).parent().remove();
}
function handler2(event) {
var optId = divToOption($(this).attr("id"));
var optValue = $(optId).val();
var comment = optValue.substring(optValue.indexOf("#comment#") + 9);
var pos = $(this).position();
var cssObj = {
top: pos.top - 100,
left: pos.left + 200
};
var $divImg = $("<td>");
var $divCl = $("<div class='comment'>" + comment + "</div>").css(cssObj);
$divImg.append($divCl);
$(this).parent().parent().parent().parent().append($divImg);
}
function handler3(event) {
$(".comment").remove();
}
});
function optionToDiv(option) {
var id_div = option.replace('option_', 'option_div_');
id_div = "#" + id_div;
return id_div;
}
function divToOption(div) {
var id_opt = div.replace('div_', '');
id_opt = "#" + id_opt;
return id_opt;
}
IE browsers do not support indexOf for an array, which arises issue with javascript.
Add the below javascript in the head of the page, it might resolve your issue:
//
// IE browsers do not support indexOf method for an Array. Hence
// we add it below after performing the check on the existence of
// the same.
//
if (!Array.prototype.indexOf)
{
Array.prototype.indexOf = function (obj, start)
{
for (var i = (start || 0), j = this.length; i < j; i++)
{
if (this[i] === obj)
{
return i;
}
}
return -1;
};
}
I am stuck trying to convert a javascript file that ran perfectly in d6 to d7, I have been searching through the info about drupal behaviours but cannot seem to find the correct manner to resolve this.
The following script returns an unexpected token error ), for the closing bracket before (jQuery).
(function($){
var VAT = 0.2;
var QUANTITY_SUFFIX = "field-po-quantity";
var PRICE_SUFFIX = "field-po-price";
var SUBTOTAL_SUFFIX = "field-po-item-st";
var VAT_SUFFIX = "field-po-item-vat";
var TOTAL_SUFFIX = "field-po-item-total";
var quantityFields;
var priceFields;
var fieldsValid = false;
function isNumber(value) {
return !isNaN(parseFloat(value)) &&
isFinite(value);
}
function validValue(value) {
return isNumber(value) &&
parseFloat(value) > 0;
}
function addCommas(nStr) {
nStr += '';
var x = nStr.split('.');
var x1 = x[0];
var x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
function decimalise(value) {
if (isNumber(value)) {
var numericValue = parseFloat(value);
return numericValue.toFixed(2);
}
}
function validateFields() {
var fieldsValid = true;
var allFields = new Array();
quantityFields = jQuery('input[id*="' + QUANTITY_SUFFIX + '"]');
priceFields = jQuery('input[id*="' + PRICE_SUFFIX + '"]');
allFields.push.apply(allFields, quantityFields);
allFields.push.apply(allFields, priceFields);
for (i=0; i<allFields.length; i++) {
var field = allFields[i];
var valueString = field.value;
if (!validValue(valueString)) {
field.style.borderStyle="solid";
field.style.border="inset 1px red";
fieldsValid = false;
} else {
field.style.borderStyle="none";
}
}
this.fieldsValid = fieldsValid;
}
jQuery(document).click(function() {
validateFields();
if (fieldsValid) {
var subTotalSum = 0;
var vatSum = 0;
var totalSum = 0;
jQuery('#field-po-items-values tbody tr:not(.content-multiple-removed-row)').each(function(){
var quantityString = jQuery(this).find('input[id*="' + QUANTITY_SUFFIX + '"]').val();
var numericQuantity = decimalise(quantityString);
var priceString = jQuery(this).find('input[id*="' + PRICE_SUFFIX + '"]').val();
var numericPrice = decimalise(priceString);
var subtotal = parseFloat(numericPrice * numericQuantity);
jQuery(this).find('input[id*="' + SUBTOTAL_SUFFIX + '"]').val(addCommas(decimalise(subtotal)));
var vat = subtotal * VAT;
jQuery(this).find('input[id*="' + VAT_SUFFIX + '"]').val(addCommas(decimalise(vat)));
var total = subtotal + vat;
jQuery(this).find('input[id*="' + TOTAL_SUFFIX + '"]').val(addCommas(decimalise(total)));
subTotalSum += subtotal;
vatSum += vat;
totalSum += parseFloat(total);
});
jQuery('input[id*="edit-field-po-subtotal"]').val(addCommas(decimalise(subTotalSum)));
jQuery('input[id*="edit-field-po-vat"]').val(addCommas(decimalise(vatSum)));
jQuery('input[id*="edit-field-po-total"]').val(addCommas(decimalise(totalSum)));
}
}
})(jQuery);
The file is being called from template.php, using drupal_add_js inserted in the top of the file, not under pre-process or anything.
I understand that the jQuery(document).click(function() { might also be causing an issue and may ultimately be the reason for the unexpected token error?
Thank you in advance
I don`t know whether your code is correct but it is highly recommended to use JavaScript in Drupal>7 this way:
(function ($) {
Drupal.behaviors.yourFunction = {
attach: function(context, settings) {
var VAT = 0.2;
var QUANTITY_SUFFIX = "field-po-quantity";
var PRICE_SUFFIX = "field-po-price";
var SUBTOTAL_SUFFIX = "field-po-item-st";
var VAT_SUFFIX = "field-po-item-vat";
var TOTAL_SUFFIX = "field-po-item-total";
var quantityFields;
var priceFields;
var fieldsValid = false;
function isNumber(value) {
return !isNaN(parseFloat(value)) &&
isFinite(value);
}
function validValue(value) {
return isNumber(value) &&
parseFloat(value) > 0;
}
function addCommas(nStr) {
nStr += '';
var x = nStr.split('.');
var x1 = x[0];
var x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
function decimalise(value) {
if (isNumber(value)) {
var numericValue = parseFloat(value);
return numericValue.toFixed(2);
}
}
function validateFields() {
var fieldsValid = true;
var allFields = new Array();
quantityFields = $('input[id*="' + QUANTITY_SUFFIX + '"]');
priceFields = $('input[id*="' + PRICE_SUFFIX + '"]');
allFields.push.apply(allFields, quantityFields);
allFields.push.apply(allFields, priceFields);
for (i=0; i<allFields.length; i++) {
var field = allFields[i];
var valueString = field.value;
if (!validValue(valueString)) {
field.style.borderStyle="solid";
field.style.border="inset 1px red";
fieldsValid = false;
} else {
field.style.borderStyle="none";
}
}
this.fieldsValid = fieldsValid;
}
$(document).click(function() {
validateFields();
if (fieldsValid) {
var subTotalSum = 0;
var vatSum = 0;
var totalSum = 0;
$('#field-po-items-values tbody tr:not(.content-multiple-removed-row)').each(function(){
var quantityString = $(this).find('input[id*="' + QUANTITY_SUFFIX + '"]').val();
var numericQuantity = decimalise(quantityString);
var priceString = $(this).find('input[id*="' + PRICE_SUFFIX + '"]').val();
var numericPrice = decimalise(priceString);
var subtotal = parseFloat(numericPrice * numericQuantity);
$(this).find('input[id*="' + SUBTOTAL_SUFFIX + '"]').val(addCommas(decimalise(subtotal)));
var vat = subtotal * VAT;
$(this).find('input[id*="' + VAT_SUFFIX + '"]').val(addCommas(decimalise(vat)));
var total = subtotal + vat;
$(this).find('input[id*="' + TOTAL_SUFFIX + '"]').val(addCommas(decimalise(total)));
subTotalSum += subtotal;
vatSum += vat;
totalSum += parseFloat(total);
});
$('input[id*="edit-field-po-subtotal"]').val(addCommas(decimalise(subTotalSum)));
$('input[id*="edit-field-po-vat"]').val(addCommas(decimalise(vatSum)));
$('input[id*="edit-field-po-total"]').val(addCommas(decimalise(totalSum)));
}
}
}
};
})(jQuery);
More info about Drupal Behaviours:
Drupal behaviors
Theming, jQuery, DRupal Behaviours
I have developed the following user script which will show the html element under mouse on mouseover in the tooltip.
Earlier I was using the same script as a content script in a Chrome Extension and it is working absolutely fine there.
I am getting the following error:
Uncaught TypeError: Cannot read property 'timer' of undefined
// ==UserScript==
// #name Tooltip
// #author Saurabh Saxena
// #version 1.0
// ==/UserScript==
var id = 'tt';
var top = 3;
var left = 3;
var maxw = 300;
var speed = 10;
var timer = 20;
var endalpha = 95;
var alpha = 0;
var tt, t, c, b, h;
var ie = document.all ? true : false;
document.onmouseover = function(e,w)
{
var link = document.location.toString();
link = link.split('.');
if(!link[1].match(/facebook/) && !link[1].match(/google/) && !link[1].match(/youtube/) && !link[2].match(/google/))
{
if (tt == null) {
tt = document.createElement('div');
tt.setAttribute('id', id);
t = document.createElement('div');
t.setAttribute('id', id + 'top');
c = document.createElement('div');
c.setAttribute('id', id + 'cont');
b = document.createElement('div');
b.setAttribute('id', id + 'bot');
tt.appendChild(t);
tt.appendChild(c);
tt.appendChild(b);
document.body.appendChild(tt);
tt.style.opacity = 0;
tt.style.zIndex = 10000000;/*Important Dont Change it or the tooltip will move below the stack*/
tt.style.filter = 'alpha(opacity=0)';
document.onmousemove = function(e) {
var u = ie ? event.clientY + document.documentElement.scrollTop : e.pageY;
var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX;
tt.style.top = (u - h) + 'px';
tt.style.left = (l + left) + 'px';};
}
tt.style.display = 'block';
var str = "";
var currenttag = "";
var parenttag = "";
var tooltip = "";
var flag = 0;
var chk = e.srcElement.parentNode;
/*creating contents of parent tag if it exists*/
if(chk != null)
{
var parenttag = "<" + chk.nodeName;
for (var i = 0; i < chk.attributes.length; i++) {
var attrib = chk.attributes[i];
if(attrib.value == "")
parenttag = parenttag + " " + attrib.name;
else
parenttag = parenttag + " " + attrib.name + ' ="' + attrib.value + '"';
parenttag = parenttag + " ";
}
parenttag = trim(parenttag);
tooltip = parenttag + ">" + "\n\n";
}
/*creating contents of current tag*/
currenttag = "<" + e.srcElement.nodeName;
if(e.srcElement.attributes.length == 0)
flag = 0;
for (var i = 0; i < e.srcElement.attributes.length; i++)
{
var attrib = e.srcElement.attributes[i];
if(attrib.value == "")
currenttag = currenttag + " " + attrib.name;
else
{
flag = 1;
currenttag = currenttag + " " + attrib.name + ' ="' + attrib.value + '"';
currenttag = currenttag + " ";
}
}
currenttag = trim(currenttag);
currenttag = currenttag + ">";
currenttag = currenttag + e.srcElement.innerHTML;
currenttag = currenttag + "</" ;
currenttag = currenttag + e.srcElement.nodeName;
currenttag = currenttag + ">";
tooltip = tooltip + currenttag;
tooltip = tooltip.toLowerCase();
if(currenttag == "" || flag == 0)
return;
c.innerText = tooltip;
tt.style.width = w ? w + 'px' : 'auto';
tt.style.width = tt.offsetWidth;
t.style.display = 'block';
b.style.display = 'block';
if (tt.offsetWidth > maxw) { tt.style.width = maxw + 'px' }
h = parseInt(tt.offsetHeight);
clearInterval(tt.timer);
tt.timer = setInterval(function ()
{
var a = alpha;
var d = 1;
if ((a != endalpha && d == 1) || (a != 0 && d == -1)) {
var i = speed;
if (endalpha - a < speed && d == 1) {
i = endalpha - a;
} else if (alpha < speed && d == -1) {
i = a;
}
alpha = a + (i * d);
tt.style.opacity = alpha * .01;
tt.style.filter = 'alpha(opacity=' + alpha + ')';
} else {
clearInterval(tt.timer);
if (d == -1) { tt.style.display = 'none' }
} }, timer);
}
}//end onmousedown
document.onmouseout = function()
{
clearInterval(tt.timer);
tt.timer = setInterval(function () {
var a = alpha;
var d = -1;
if ((a != endalpha && d == 1) || (a != 0 && d == -1)) {
var i = speed;
if (endalpha - a < speed && d == 1) {
i = endalpha - a;
} else if (alpha < speed && d == -1) {
i = a;
}
alpha = a + (i * d);
tt.style.opacity = alpha * .01;
tt.style.filter = 'alpha(opacity=' + alpha + ')';
} else {
clearInterval(tt.timer);
if (d == -1) { tt.style.display = 'none'; }
} }, timer);
}
function trim(s) {
s = s.replace(/(^\s*)|(\s*$)/gi,"");
s = s.replace(/[ ]{2,}/gi," ");
s = s.replace(/\n /,"\n");
return s;
}
// ==UserScript==
// name Tooltip
// author Saurabh Saxena
// version 1.0.0
// description Show Google Rich Snippet Markup Tooltip
// ==/UserScript==
var id = 'tt';
var top = 3;
var left = 3;
var maxw = 300;
var speed = 10;
var timer = 20;
var endalpha = 95;
var alpha = 0;
var tt, t, c, b, h;
var ie = document.all ? true : false;
document.onmouseover = function(e,w)
{
var link = document.location.toString();
link = link.split('.');
if(!link[1].match(/facebook/) && !link[0].match(/workflow/) && !link[1].match(/google/) && !link[1].match(/youtube/) && !link[2].match(/google/) && !link[0].match(/eveforeval/) && !link[0].match(/trax/) && !link[0].match(/b/))
{
if (tt == null) {
tt = document.createElement('div');
tt.setAttribute('id', id);
tt.style.position = 'absolute';
tt.style.display = 'block';
t = document.createElement('div');
t.setAttribute('id', id + 'top');
t.style.display = 'block';
t.style.height = '5px';
t.style.marginLeft = '5px';
t.style.overflow = 'hidden';
c = document.createElement('div');
c.setAttribute('id', id + 'cont');
c.style.display = 'block';
c.style.padding = '2px 12px 3px 7px';
c.style.marginLeft = '5px';
c.style.background = '#666';
c.style.color = '#FFF';
b = document.createElement('div');
b.setAttribute('id', id + 'bot');
b.style.display = 'block';
b.style.height = '5px';
b.style.marginLeft = '5px';
b.style.overflow = 'hidden';
tt.appendChild(t);
tt.appendChild(c);
tt.appendChild(b);
document.body.appendChild(tt);
tt.style.opacity = 0;
tt.style.zIndex = 10000000;/*Important Dont Change it or the tooltip will move below the stack*/
tt.style.filter = 'alpha(opacity=0)';
document.onmousemove = function(e) {
var u = ie ? event.clientY + document.documentElement.scrollTop : e.pageY;
var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX;
tt.style.top = (u - h) + 'px';
tt.style.left = (l + left) + 'px';};
}
tt.style.display = 'block';
var str = "";
var currenttag = "";
var parenttag = "";
var tooltip = "";
var flag = 0;
// var chk = getRootElement(e.srcElement.parentNode);
var chk = e.srcElement.parentNode;
/*creating contents of parent tag if it exists*/
if(chk != null)
{
var parenttag = "<" + chk.nodeName;
for (var i = 0; i < chk.attributes.length; i++) {
var attrib = chk.attributes[i];
if(attrib.value == "")
parenttag = parenttag + " " + attrib.name;
else
parenttag = parenttag + " " + attrib.name + ' ="' + attrib.value + '"';
parenttag = parenttag + " ";
}
parenttag = trim(parenttag);
tooltip = parenttag + ">" + "\n\n";
}
/*creating contents of current tag*/
currenttag = "<" + e.srcElement.nodeName;
if(e.srcElement.attributes.length == 0)
flag = 0;
for (var i = 0; i < e.srcElement.attributes.length; i++)
{
var attrib = e.srcElement.attributes[i];
if(attrib.value == "")
currenttag = currenttag + " " + attrib.name;
else
{
flag = 1;
currenttag = currenttag + " " + attrib.name + ' ="' + attrib.value + '"';
currenttag = currenttag + " ";
}
}
currenttag = trim(currenttag);
currenttag = currenttag + ">";
currenttag = currenttag + e.srcElement.innerHTML;
currenttag = currenttag + "</" ;
currenttag = currenttag + e.srcElement.nodeName;
currenttag = currenttag + ">";
tooltip = tooltip + currenttag;
tooltip = tooltip.toLowerCase();
if(currenttag == "" || flag == 0)
return;
c.innerText = tooltip;
tt.style.width = w ? w + 'px' : 'auto';
if (!w && ie) {
t.style.display = 'none';
b.style.display = 'none';
tt.style.width = tt.offsetWidth;
t.style.display = 'block';
b.style.display = 'block';
}
if (tt.offsetWidth > maxw) { tt.style.width = maxw + 'px' }
h = parseInt(tt.offsetHeight);
clearInterval(tt.timer);
tt.timer = setInterval(function ()
{ var a = alpha;
var d = 1;
if ((a != endalpha && d == 1) || (a != 0 && d == -1)) {
var i = speed;
if (endalpha - a < speed && d == 1) {
i = endalpha - a;
} else if (alpha < speed && d == -1) {
i = a;
}
alpha = a + (i * d);
tt.style.opacity = alpha * .01;
tt.style.filter = 'alpha(opacity=' + alpha + ')';
} else {
clearInterval(tt.timer);
if (d == -1) { tt.style.display = 'none' }
} }, timer);
}
}//end onmousedown
document.onmouseout = function()
{
clearInterval(tt.timer);
tt.timer = setInterval(function () {
var a = alpha;
var d = -1;
if ((a != endalpha && d == 1) || (a != 0 && d == -1)) {
var i = speed;
if (endalpha - a < speed && d == 1) {
i = endalpha - a;
} else if (alpha < speed && d == -1) {
i = a;
}
alpha = a + (i * d);
tt.style.opacity = alpha * .01;
tt.style.filter = 'alpha(opacity=' + alpha + ')';
} else {
clearInterval(tt.timer);
if (d == -1) { tt.style.display = 'none'; }
} }, timer);
}
function trim(s) {
s = s.replace(/(^\s*)|(\s*$)/gi,"");
s = s.replace(/[ ]{2,}/gi," ");
s = s.replace(/\n /,"\n");
return s;
}