how to retrieve location via json in Blogger - javascript

I use this script in Blogger to show labeled posts via JSON,
as you see through this code I can retrieve posts' titles, thumbnails and dates, etc
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json) {
document.write('<ul id="label_with_thumbs">');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
var commenttext = entry.link[k].title;
var commenturl = entry.link[k].href;
}
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
var thumburl;
try {
thumburl = entry.media$thumbnail.url;
} catch (error) {
s = entry.content.$t;
a = s.indexOf("<img");
b = s.indexOf("src=\"", a);
c = s.indexOf("\"", b + 5);
d = s.substr(b + 5, c - b - 5);
if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
thumburl = d;
} else thumburl = 'https://1.bp.blogspot.com/-etyXYLaEXP8/WrmiznwRzXI/AAAAAAAAAnQ/Pu4OVqzx_4kmgwnmxJGDuf6j-l6ARuHbgCLcBGAs/s1600/nothumbnailimage.png';
}
var postdate = entry.published.$t;
var cdyear = postdate.substring(0, 4);
var cdmonth = postdate.substring(5, 7);
var cdday = postdate.substring(8, 10);
var monthnames = new Array();
monthnames[1] = "January";
monthnames[2] = "February";
monthnames[3] = "March";
monthnames[4] = "April";
monthnames[5] = "May";
monthnames[6] = "June";
monthnames[7] = "July";
monthnames[8] = "August";
monthnames[9] = "September";
monthnames[10] = "October";
monthnames[11] = "November";
monthnames[12] = "December";
document.write('<li>');
if (showpostthumbnails == true)
document.write('<a class="posturl" href="' + posturl + '" target ="_top"><img class="label_thumb" src="' + thumburl + '"/></a>');
document.write('<a class="posturl" href="' + posturl + '" target ="_blank"><h3 class="posttitle">' + posttitle + '</h3><span class="dateposted">' + monthnames[parseInt(cdmonth, 10)] + ' ' + cdday + ', ' + cdyear + '></span></a>');
if ("content" in entry) {
var postcontent = entry.content.$t;
} else
if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write('');
document.write(postcontent);
document.write('');
} else {
document.write('');
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0, quoteEnd);
document.write(postcontent + '...');
document.write('');
}
}
var towrite = '';
var flag = 0;
if (showpostdate == true) {
flag = 1;
}
if (showcommentnum == true) {
if (flag == 1) {
towrite = towrite + ' | ';
}
if (commenttext == '1 Comments') commenttext = '1 Comment';
if (commenttext == '0 Comments') commenttext = 'No Comments';
commenttext = '' + commenttext + '';
towrite = towrite + commenttext;
flag = 1;;
}
if (displaymore == true) {
if (flag == 1) flag = 1;
}
document.write(towrite);
document.write('</li>');
if (displayseparator == true)
if (i != (numposts - 1))
document.write('');
}
document.write('</ul>');
}
//]]>
</script>
My question is that in every post in my blog does have Location Name that I can specify optionally eg: USA,etc.
So how can I retrieve the location as well via JSON?
P.S This is the HTML of location Name that appears in my blogger template
<span class='published-location' expr:title='data:post.location.name'><data:post.location.name/></span>

The location data entered via the post editor is available in the JSON feed via the key georss$featurename. You will have to include that in your code
..
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var location = entry.georss$featurename.$t;
var posturl;
..
And then you print it on the page via the document.write statement in the above code -
document.write('Location: ' + location + '<br/><a class="posturl" href="' + posturl + '" target ="_blank"><h3 class="posttitle">' + posttitle + '</h3><span class="dateposted">' + monthnames[parseInt(cdmonth, 10)] + ' ' + cdday + ', ' + cdyear + '></span></a>');

Related

How can I add the comment box to it

I am using blogger. And I want to add the number of comments to my codes. I will share the code I use below. There is a code similar to this and I am adding this too.
I want to add the number of comments to my codes below. The example I found has the number of comments.
<div id='artikel-terbaru'>
<ol>
<script>
var jumlahnewpost = 5; //jumlah post yang ingin ditampilkan
var create = true;
</script>
<script>
//<![CDATA[
function showrecentposts(e) {
for (var t = 0; t < jumlahnewpost; t++) {
var r, n = e.feed.entry[t],
i = n.title.$t;
if (t == e.feed.entry.length) break;
for (var l = 0; l < n.link.length; l++)
if ("alternate" == n.link[l].rel) {
r = n.link[l].href;
break
}
i = i.link(r), create && document.write("<li>"), document.write(i)
}
create && document.write("</li>");
}
//]]>
</script>
<script src='/feeds/posts/summary/-/Mavi?alt=json-in-script&callback=showrecentposts'/>
</ol>
</div>
Example I found.
function labelthumbs(json) {
document.write('<ul class="label_with_thumbs">');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
var commenttext = entry.link[k].title;
var commenturl = entry.link[k].href;
}
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
var thumburl;
try {
thumburl = entry.media$thumbnail.url;
} catch (error) {
s = entry.content.$t;
a = s.indexOf("<img");
b = s.indexOf("src=\"", a);
c = s.indexOf("\"", b + 5);
d = s.substr(b + 5, c - b - 5);
if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
thumburl = d;
} else thumburl = 'http://3.bp.blogspot.com/-zP87C2q9yog/UVopoHY30SI/AAAAAAAAE5k/AIyPvrpGLn8/s1600/picture_not_available.png';
}
var postdate = entry.published.$t;
var cdyear = postdate.substring(0, 4);
var cdmonth = postdate.substring(5, 7);
var cdday = postdate.substring(8, 10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "June";
monthnames[7] = "July";
monthnames[8] = "Aug";
monthnames[9] = "Sept";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
document.write('<li class="clearfix">');
if (showpostthumbnails == true)
document.write('<img width="56" height="46" class="label_thumb" src="' + thumburl + '" alt="' + posttitle + '" title="' + posttitle + '"/>');
document.write('<div class="title-label">' + posttitle + '</div>');
if ("content" in entry) {
var postcontent = entry.content.$t;
} else
if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write('');
document.write(postcontent);
document.write('');
} else {
document.write('');
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0, quoteEnd);
document.write(postcontent + '...');
document.write('');
}
}
var towrite = '';
var flag = 0;
document.write('<br>');
if (showpostdate == true) {
towrite = towrite + monthnames[parseInt(cdmonth, 10)] + '-' + cdday + '-' + cdyear;
flag = 1;
}
if (showcommentnum == true) {
if (flag == 1) {
towrite = towrite + ' | ';
}
if (commenttext == '1 Comments') commenttext = '1 Comment';
if (commenttext == '0 Comments') commenttext = 'No Comments';
commenttext = '<a class="comment-label" href="' + commenturl + '" target ="_top">' + commenttext + '</a>';
towrite = towrite + commenttext;
flag = 1;;
}
if (displaymore == true) {
if (flag == 1) towrite = towrite + ' | ';
towrite = towrite + '<a class="more-label" href="' + posturl + '" class="url" target ="_top">More ยป</a>';
flag = 1;;
}
document.write(towrite);
document.write('</li>');
if (displayseparator == true)
if (i != (numposts - 1))
document.write('');
}
document.write('</ul>');
}
Above is the example I found.
I am not really sure the question, just simple thought, it may be what do you want, by adding the index i as
i = i.link(r), create && document.write("<li>" + i + ". "), document.write(i)

time diffrence in double digit

i want to display TravelTimeHoursDiff and TravelTimeMinutesDiff in double digit now my time is shown as 7:0 i want to display like 07:00
if ($scope.DispatchStatus.ArrivalTime != undefined){
var today = $rootScope.getSysDate().split(" ");
var timeArrival = new Date(today[0] + ' ' + $scope.DispatchStatus.ArrivalTime);
var TravelTime = new Date(today[0] + ' ' + $scope.Route.TravelTime);
var timeArrivalHours = timeArrival.getHours();
var TravelTimeHoursDiff = timeArrivalHours - TravelTime.getHours() ;
var TravelTimeMinutesDiff = (timeArrival.getMinutes() - TravelTime.getMinutes());
if(TravelTimeHoursDiff < 0 || (TravelTimeHoursDiff <= 0 && TravelTimeMinutesDiff < 0) || (TravelTimeHoursDiff == 0 && TravelTimeMinutesDiff == 0)){
$scope.formvalidationbit = $scope.DispatchStatusAddForm[fieldName].$invalid = true;
angular.element('#' + fieldName).addClass('ng-invalid');
angular.element('#' + fieldName).removeClass('ng-valid');
$scope.DispatchStatusAddForm.$valid = false;
var errorbit = 1;
}else{
if (isNaN(TravelTimeHoursDiff)) {
TravelTimeHoursDiff = '--';
}
if (isNaN(TravelTimeMinutesDiff)) {
TravelTimeMinutesDiff = '--';
}
if(TravelTimeMinutesDiff <0){
TravelTimeMinutesDiff = TravelTimeMinutesDiff * (-1);
}
$scope.TravelTime = TravelTimeHoursDiff + ':' + TravelTimeMinutesDiff;
}
}
Just add leading 0 to values smaller then 10, something like:
let addLeadingZero(v){
return v < 10 ? ("0" + v) : v;
}
$scope.TravelTime = addLeadingZero(TravelTimeHoursDiff) + ':' + addLeadingZero(TravelTimeMinutesDiff);

Invalid calling object IE 11 length of XML array (getElementsByTagName)

I'm not sure how I am supposed to work around this Invalid calling object error in IE. It appears as though IE won't allow me to use the global emoticon in other functions?
var emoticon = new Array();
var emote_page;
var emote_pages;
getPaginateEmoticons(1);
function navigateEmoticons(page){
var i = ((page - 1) * 37);
var p_emotes = page * 37;
var emotes_div = document.getElementById('emoticons');
if(page == 1){
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page > 1 && page < emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page == emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'none';
}
emotes_div.innerHTML = '';
while(i < p_emotes && i <= emoticon.length){
i++;
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
}
emote_page = page;
}
function getPaginateEmoticons(page){
var emotes_div = document.getElementById('emoticons');
var emote_pages_sel = document.getElementById('emote_page');
var i;
function handler(){
if(this.status == 200 && this.responseXML != null){
emoticon = this.responseXML.getElementsByTagName('file');
emote_pages = Math.floor(emoticon.length / 37);
emote_page = page;
for(i = 0; i < 37; i++){
if(i == 1)
emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option value="' + i + '" selected="selected">Page ' + i + '</option>');
else if(i <= emote_pages && i > 1)
emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option value="' + i + '">Page ' + i + '</option>');
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
}
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('loadingIcon').style.display = 'none';
}
else{
// something went wrong
}
}
var client = new XMLHttpRequest();
client.onload = handler;
client.open("GET", "resources/emo_catalog.xml");
client.send();
}
The Invalid calling object error occurs at the while(i < p_emotes && i <= emoticon.length){ line. Any help would be greatly appreciated.
I do not know about IE 11 but lower versions not support var client = new XMLHttpRequest(); but need to write some think like this ActiveXObject.
This can be 1 of problem.
function getXmlHttp(){
var xmlhttp;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
The possible problem number 2
document.addEventListener("DOMContentLoaded", function() {
getPaginateEmoticons(1);
});
IE 8 say Object not support this property
Code is here. I do not know if it work because no file to download and parse. Let me know if it work
var emoticon = new Array();
var emote_page;
var emote_pages;
/*
document.addEventListener("DOMContentLoaded", function() { // show error addEventListener is not supported
getPaginateEmoticons(1);
});
*/
/* Cahge here *****************************************/
if (document.addEventListener){
document.addEventListener("DOMContentLoaded", function() {
getPaginateEmoticons(1); });
}
else if (document.attachEvent){
document.attachEvent("DOMContentLoaded", function() {
getPaginateEmoticons(1); });
}
/****************************************************/
function navigateEmoticons(page){
var i = ((page - 1) * 37);
var p_emotes = page * 37;
var emotes_div = document.getElementById('emoticons');
if(page == 1){
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page > 1 && page < emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page == emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'none';
}
emotes_div.innerHTML = '';
while(i < p_emotes && i <= emoticon.length){
i++;
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
}
emote_page = page;
}
function getPaginateEmoticons(page){
var emotes_div = document.getElementById('emoticons');
var emote_pages_sel = document.getElementById('emote_page');
var i;
function handler(){
if(this.status == 200 && this.responseXML != null){
emoticon = this.responseXML.getElementsByTagName('file');
emote_pages = Math.floor(emoticon.length / 37);
emote_page = page;
for(i = 0; i < 37; i++){
if(i == 1)
emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option value="' + i + '" selected="selected">Page ' + i + '</option>');
else if(i <= emote_pages && i > 1)
emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option value="' + i + '">Page ' + i + '</option>');
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
}
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('loadingIcon').style.display = 'none';
}
else{
// something went wrong
}
}
/* Cahge here *****************************************/
var client = new XMLHttpRequest(); /*I think bad, but no error show*/
/****************************************************
client.onload = handler;
client.open("GET", "resources/emo_catalog.xml");
client.send();
}
This code receive xml document in IE8.
var emoticon = new Array();
var emote_page;
var emote_pages;
function getPaginateEmoticons(page){
var emotes_div = document.getElementById('emoticons');
var emote_pages_sel = document.getElementById('emote_page');
var i;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
myFunction(xhttp);
}
};
xhttp.open("GET", "http://victoria.ru/a.xml", true);
xhttp.send();
function myFunction(xml) {
var xmlDoc = xml.responseXML; alert(xmlDoc);
emoticon = xmlDoc.getElementsByTagName("file")[0].childNodes[0].nodeValue;
emote_pages = Math.floor(emoticon.length / 37);
emote_page = page;
for(i = 0; i < 37; i++){
/* ... HERE ALSO ERRORS */
/*
if(i == 1) emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option value="' + i + '" selected="selected">Page ' + i + '</option>');
else if(i <= emote_pages && i > 1) emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option value="' + i + '">Page ' + i + '</option>');
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
*/
}
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('loadingIcon').style.display = 'none';
}
}
I ultimately had to put the contents into a string and store it in a hidden division element, then I had to convert the string back into an array every time I iterate. Kind of defeats the whole purpose of using an XML file though :(
var emoticon = new Array();
var emote_page;
var emote_pages;
function navigateEmoticons(page){
page = page - 1;
page = page + 1;
if(!page)
page = 1;
var i = (page - 1) * 37;
var p_emotes = page * 37;
var emotes_div = document.getElementById('emoticons');
var emote_pages_sel = document.getElementById('emote_page');
var page_num = "";
//IE11
if(window.location.hash = !!window.MSInputMethodContext && !!document.documentMode){
var it = 0;
var ie11_shit = document.getElementById('ie11_shit');
var tmp = "";
var ie11_tmp = "";
var emoticon11 = new Array();
ie11_tmp = ie11_shit.innerHTML;
if(page == 1){
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page > 1 && page < emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page == emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'none';
}
emotes_div.innerHTML = '';
while(it < ie11_tmp.length){
if(ie11_tmp.charAt(it) == ','){
emoticon11.push(tmp);
tmp = "";
}
else
tmp = tmp.concat(ie11_tmp.charAt(it));
it++;
}
while(i < p_emotes && i <= emoticon11.length){
i++;
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon11[i].split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon11[i] + '"></button>');
}
emotes_div.innerHTML = emotes_div.innerHTML.concat('<div id="ie11_shit" style="display: none;">').concat(ie11_tmp).concat('</div>');
emote_page = page;
page_num = page + '_page';
document.getElementById(page_num).selected = true;
}
else{
if(page == 1){
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page > 1 && page < emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'inline';
}
else if(page == emote_pages){
document.getElementById('previous_emo_p').style.display = 'inline';
document.getElementById('next_emo_p').style.display = 'none';
}
emotes_div.innerHTML = '';
if(document.selection){//IE8
while(i < p_emotes && i <= emoticon.length){
i++;
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].getElementsByTagName('file')[0].childNodes[0].nodeValue.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' +
emoticon[i].getElementsByTagName('file')[0].childNodes[0].nodeValue + '"></button>');
}
emote_page = page;
emote_pages_sel.selectedIndex = page;
}
else{
while(i < p_emotes && i <= emoticon.length){
i++;
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
}
emote_page = page;
page_num = page + '_page';
document.getElementById(page_num).selected = true;
}
}
}
function getPaginateEmoticons(page){
var emotes_div = document.getElementById('emoticons');
var emote_pages_sel = document.getElementById('emote_page');
var i;
if(document.selection){//IE8
if(window.XMLHttpRequest)//IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
else//IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.open("GET", "resources/emo_catalog.xml", false);
xmlhttp.send();
xmlDocument = xmlhttp.responseXML;
emoticon = xmlDocument.getElementsByTagName('emoticon');
emote_pages = Math.floor(emoticon.length / 37);
emote_page = page;
for(i = 0; i < 37; i++){
if(i <= emote_pages)
emote_pages_sel.options[emote_pages_sel.options.length] = new Option('Page ' + i, i);
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].getElementsByTagName('file')[0].childNodes[0].nodeValue.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].getElementsByTagName('file')[0].childNodes[0].nodeValue + '"></button>');
}
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('loadingIcon').style.display = 'none';
}
else{
function handler(){
if(this.status == 200 && this.responseXML != null){
//IE11
if(window.location.hash = !!window.MSInputMethodContext && !!document.documentMode){
emotes_div.innerHTML = '<div id="ie11_shit"></div>';
var ie11_shit = document.getElementById('ie11_shit');
ie11_shit.style.display = "none";
emoticon = this.responseXML.getElementsByTagName('file');
for(i = 0; i < emoticon.length; i++){
ie11_shit.innerHTML = ie11_shit.innerHTML.concat(emoticon[i].textContent).concat(',');
}
}
else
emoticon = this.responseXML.getElementsByTagName('file');
emote_pages = Math.floor(emoticon.length / 37);
emote_page = page;
for(i = 0; i < 37; i++){
if(i <= emote_pages && i >= 1)
emote_pages_sel.innerHTML = emote_pages_sel.innerHTML.concat('<option id="' + i + '_page" value="' + i + '">Page ' + i + '</option>');
emotes_div.innerHTML = emotes_div.innerHTML.concat('<button class="emobutton" onclick="insertEmote(document.getElementById(' + i + ').alt);"><img id="' + i + '" alt=":' +
emoticon[i].textContent.split('\\').pop().split('/').pop().split('.').shift() + ':" src="' + emoticon[i].textContent + '"></button>');
}
document.getElementById('previous_emo_p').style.display = 'none';
document.getElementById('loadingIcon').style.display = 'none';
}
else{
// something went wrong
}
}
var client = new XMLHttpRequest();
client.onload = handler;
client.open("GET", "resources/emo_catalog.xml");
client.send();
}
}

Unexpected end of input JavaScript

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>');

User Script for Displaying Tooltip is not working

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;
}

Categories