I have been using the Google API to get JSON data from my Blogger account and display and format blog posts on my own webiste.
It was working perfectly for weeks, and then suddenly, as of yesterday, the content stops displaying. The title, update (the date the post was updated), and the id, all come back just as they always have. Only the content stopped coming back.
I haven't changed the code in any way since first implementing it, and I looked for documentation to see if the API had changed, but didn't come across anything. So I am completely stumped as to why this one aspect of the code would suddenly stop working.
This is pretty much the entire Javascript that I use to get the JSON data. Is there something wroing with it?
function init() {
// Get your API key from http://code.google.com/apis/console
gapi.client.setApiKey('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
// Load the Blogger JSON API
gapi.client.load('blogger', 'v3', function() {
// Load the list of posts for code.blogger.com
var request = gapi.client.blogger.posts.list({
'blogId': 'xxxxxxxxxxxxxxxxxxx',
'fields': 'items(content,title,updated,id)'
});
request.execute(function(response) {
var blogger = document.getElementById("blogger");
var anchor = 0;
for (var i = 0; i < response.items.length; i++)
{
var bloggerDiv = document.createElement("div");
bloggerDiv.id = "blogger-" + i;
bloggerDiv.className = "bloggerItem";
$(bloggerDiv).append("<h2>" + response.items[i].title + "</h2>");
var date = response.items[i].updated;
date = date.replace("T", " ");
date = date.replace("+09:00", "");
var printDate = new moment(date);
$(bloggerDiv).append("<p><span class='byline'>" + printDate.format('dddd, MMMM Do YYYY, h:mm:ss a') + "</span></p>");
$(bloggerDiv).append(response.items[i].content)
bloggerAnchor = document.createElement("a");
bloggerAnchor.name = "blogger-" + response.items[i].id;
blogger.appendChild(bloggerAnchor);
blogger.appendChild(bloggerDiv);
anchor = anchor + 1;
}
// find out which anchor the user wanted...
var hashVal = window.location.hash.substr(1);
// ... then jump to that position:
location.hash = "#" + hashVal;
});
});
}
Now fetchBodies defaults is false instead of true. For this reason you need to add param fetchBodies=true.
Related
I'm trying to make a JSP that refresh itself every 2scd approximately and keep what the user tip in input form.
My idea was to save the input with javascript, add them to the URL and refresh the page, then retrieve and set the input.
This is my JS code :
$(document).ready(function () {
function refreshPage(){
var mapValue = new Array();
var mapName = new Array();
var i = 0;
$(".positionInput").each(function() {
mapValue[i] = $(this).val();
mapName[i] = $(this).attr("name");
i++;
});
var parameters = "";
for(i = 0; i < mapName.length; i++){
if(mapValue[i] != ""){
parameters += "?" + mapName[i] + "=" + mapValue[i];
}
}
window.location.href = "http://localhost:8080/drawinguess/waitingplayer.jsp" + parameters;
setTimeout(refreshPage, 2000); //execute itself every 2s
}
refreshPage();
});
But the timer get crazy (even with 1mn delay), it refresh itself as fast as he can with window.location.href (without this, it's working fine)
Thanks in advance if you have any other idea or if I'm making something wrong
You could try and use local storage for this. The best way would be that instead of refreshing the entire page, you only refresh what is needed by having services set up and using an async function like fetch() to hit those services and update the page.
I picked up this great javascript from MS-Potilas of http://yabtb.blogspot.com/ which gives me my next and previous blog titles appended to the prev and next icons by calling the title information from the blog feed. And if that somehow fails, it has a backup, which is to pull the information off the urls and turn that into the title in its PseudoTitle mode.
Thing is, it only works for about the newest half of my blog posts. After that, it switches into PseduoTitle mode.
Here's what I don't understand. It's supposed to work for 500 posts. My site only has 350+. So why does it seem to work properly for only the newest 100+ posts?
Also, is there something I can do so that I can increase the number of posts that this script will work for after I go past 500 posts?
Thanks a lot for your help.
Here's the script;
<script type='text/javascript'>
// Post titles to Older Post and Newer Post links (without stats skew)
// by MS-potilas 2012. See http://yabtb.blogspot.com/
//<![CDATA[
var urlToNavTitle = {};
function getTitlesForNav(json) {
for(var i=0 ; i < json.feed.entry.length ; i++) {
var entry = json.feed.entry[i];
var href = "";
for (var k=0; k<entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
href = entry.link[k].href;
break;
}
}
if(href!="") urlToNavTitle[href]=entry.title.$t;
}
}
document.write('<script type="text/javascript" src="//'+window.location.hostname+'/feeds/posts/summary?redirect=false&max-results=500&alt=json-in-script&callback=getTitlesForNav"/>');
function urlToPseudoTitle(href) {
var title=href.match(/\/([^\/_]+)(_.*)?\.html/);
if(title) {
title=title[1].replace(/-/g," ");
title=title[0].toUpperCase() + title.slice(1);
if(title.length > 28) title=title.replace(/ [^ ]+$/, "...")
}
return title;
}
$(window).load(function() {
window.setTimeout(function() {
var href = $("a.blog-pager-newer-link").attr("href");
if(href) {
href = href.replace(/\http\:[^/]+\//, "https");
var title=urlToNavTitle[href];
if(!title) title=urlToPseudoTitle(href);
if(title) $("a.blog-pager-newer-link").html("<< Newer<br />" + title);
}
href = $("a.blog-pager-older-link").attr("href");
if(href) {
href = href.replace(/\http\:[^/]+\//, "https");
var title=urlToNavTitle[href];
if(!title) title=urlToPseudoTitle(href);
if(title) $("a.blog-pager-older-link").html("Older >><br />" + title);
}
}, 500);
});
//]]>
</script>
Seems I managed to figure it out.
Apparently, even though the script says max-results=500, the script is really only pulling 150 posts. I don't know why that is.
So I just added more retrieval scripts like this to cover the rest.
document.write('<script type="text/javascript" src="//'+window.location.hostname+'/feeds/posts/summary?redirect=false&max-results=150&start-index=151&alt=json-in-script&callback=getTitlesForNav"/>');
function urlToPseudoTitle(href) {
var title=href.match(/\/([^\/_]+)(_.*)?\.html/);
if(title) {
title=title[1].replace(/-/g," ");
title=title[0].toUpperCase() + title.slice(1);
if(title.length > 28) title=title.replace(/ [^ ]+$/, "...")
}
return title;
}
Many thanks to Adam over at http://too-clever-by-half.blogspot.com/ for providing the solution to the &start-index=151 extension.
I enter to browser this link
https://google.com.vn;
Google redirect to https://www.google.com.vn;
I want alert full url redirect.
I used this code:
processNewURL: function(aURI) {
var tabIndex = gBrowser.tabContainer.selectedIndex;
var referredFromURI = gBrowser.tabContainer.childNodes[tabIndex].linkedBrowser.webNavigation.referringURI.spec;
alert(referredFromURI);
},
But it always alert https://www.google.com.vn,
and I tested with some short link example bit.ly/R9j52J . It isn't ok.
Please help me.
this works, i also show 2 methods to get to webNavigation. the second method is just longed winded way to teach other stuff, recommended way is method 1.
var processNewURL = function(e) {
console.log('e:', e);
var win = e.originalTarget.defaultView;
//start - method 1 to get to webNav:
var webNav = win.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIWebNavigation);
var referredFromURI = webNav.referringURI;
//end - method 1
//start - method 2 long winded way:
/*
var domWin = win.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIWebNavigation)
.QueryInterface(Ci.nsIDocShellTreeItem)
.rootTreeItem
.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIDOMWindow);
var tab = domWin.gBrowser._getTabForContentWindow(win);
//console.log('tab:', tab);
var referredFromURI = tab.linkedBrowser.webNavigation.referringURI;
*/
//end - method 2
if (referredFromURI != null) {
win.alert('referred from:' + referredFromURI.spec);
} else {
win.alert('not redirected');
}
}
gBrowser.addEventListener('DOMContentLoaded', processNewURL, false);
I am using a script i found here to dynamically generate short link for my Tweet buttons and it works perfectly well, but the only thing i cant seem to do is create the link to open in either a new tab or preferably a popup window.
I have tried several variations of the window.location section of the script but so far I've had no luck. If anybody could point me in the right direct I'd be very grateful.
This is the script I am using...
<script>
var TweetThisLink = {
shorten: function(e) {
// this stops the click, which will later be handled in the response method
e.preventDefault();
// find the link starting at the second 'http://'
var url = this.href.substr(this.href.indexOf('http:', 5));
BitlyClient.shorten(url, 'TweetThisLink.response');
},
response: function(data) {
var bitly_link = null;
for (var r in data.results) {
bitly_link = data.results[r]['shortUrl'];
break;
}
var tweet_text = "Text for the Tweet goes here"
window.location = "http://twitter.com/home?status=" + encodeURIComponent(tweet_text + ' ' + bitly_link + " #Hashtag1 #Hashtag2");
}
}
jQuery('.tweetlink').bind('click', TweetThisLink.shorten);
</script>
Many thanks in advance :)
Normally you could just do window.open:
window.open("http://twitter.com/home?status=" + encodeURIComponent(tweet_text + ' ' + bitly_link + " #Hashtag1 #Hashtag2");
BUT, since you are doing an ajax call before this happens, chances are that this window popup will be blocked by the browser, since the window.open command is no longer associated with the click (browsers allow a certain time before a window.open command falls under non-initiated "popup").
A solution would be to first open the window on click (in your shorten function):
var win = window.open('about:blank');
And then redirect in your response function:
win.location = 'http://twitter.com/etc...';
Demo: http://jsbin.com/usovik/1
Perhaps you're looking for
window.open("http://example.com");
I'm creating a project using Polymaps JS lybrary. I have to plot about 200,000 points. It takes a while to load the points into the browser and then navigazion is very sluggish.
I've read the documentation and there's no option for filtering a GeoJson before adding its data to the page.
Can someone suggest a better way then this:
var po = org.polymaps;
var map = po.map()
.container(document.body.appendChild(po.svg("svg")))
.center({lat: 45.468318, lon: 9.1709})
.zoom(13)
.add(po.interact());
//Skinning the map
map.add(po.image()
.url(po.url("http://{S}tile.cloudmade.com"
+ "/1a1b06b230af4efdbb989ea99e9841af" // http://cloudmade.com/register
+ "/998/256/{Z}/{X}/{Y}.png")
.hosts(["a.", "b.", "c.", ""])));
//Importing the geoJSON
map.add(po.geoJson()
.url("test_4sq.json")
.id("streets")
.on("load", loadAreas)
.tile(false));
map.add(po.compass()
.pan("none"));
// This function loads all the data and then do the filtering (very sluggish method)
function loadAreas(obj) {
for (var i = 0; i < obj.features.length; i++) {
var f = obj.features[i];
var e = obj.features[i].element;
var p = obj.features[i].data.properties;
e.setAttribute('r', 4);
e.setAttribute('id', f.data.id);
e.setAttribute('title', p.venueName);
//console.log(e);
// Displaying the data in August (month propriety = '8')
if (p.month != "08")
console.log(e);
else
e.setAttribute('display', 'none');
}
}
Using a geoJSON tiling server seems like the only way to go with that many elements. Check out TileStache. This may be helpful as well: http://goalfinch.com/blog/2011/03/building-interactive-maps-with-polymaps-tilestache-and-mongodb-part-2/
I figured out how to make the script faster.
First of all launching the app via localhost or server makes all work faster.
I always open the app via file (file:///pathTo_file/index.html)! That's WRONG. It's better use a server instead (www.pathTo_file.com/ or localhost://pathTo_file/index.html)
Second, I tried to minify the imported json. I leaved a lot of spaces and line breaks for better readability, but It' was quite heavy to load so I removed all this useless characters.
Third, I load a file only if a user use the daypicker. In this way the app loads all the tiles first and in a second time the user chosen data.
Here is a sample of the code if somone is interested.
$(document).ready(function() {
// DAY AND MONTH CORRECTION RELATED TO FILENAME
function addZero(num){
console.log("Function launched: addZero")
parseInt(num);
if(num>=1 && num<=9){
num="0"+num;
}
return num;
}
$("#datepicker").datepicker({
dateFormat: 'yy/mm/dd',
inline: true,
minDate: new Date(2011, 8 - 1, 20),
maxDate:new Date(2011, 12 - 1, 31),
altField: '#datepicker_value',
onSelect: function(){
var selDay = $("#datepicker").datepicker('getDate').getDate();
var selMonth = $("#datepicker").datepicker('getDate').getMonth() + 1;
var selYear = $("#datepicker").datepicker('getDate').getFullYear();
//PLOTTING THE MAP WITH THE USER'S SELECTION - DATEPICKER PARAMETERS -
plotMap(addZero(selDay), addZero(selMonth));
}
});
//INITIALISATING THE DATEPICKER
$("#datepicker").datepicker('setDate', new Date());
// JSON DATA IMPORT
var po = org.polymaps;
var map = po.map()
.container(document.body.appendChild(po.svg("svg")))
.center({lat: 45.468318, lon: 9.1709})
.zoom(13)
.add(po.interact());
map.add(po.image()
.url(po.url("http://{S}tile.cloudmade.com"
+ "/1a1b06b230af4efdbb989ea99e9841af" // http://cloudmade.com/register
+ "/998/256/{Z}/{X}/{Y}.png")
.hosts(["a.", "b.", "c.", ""])));
function plotMap(day, month){
var jsonUrl = "json/4sq_"+day+"_"+month+"_min.json";
map.add(po.geoJson()
.url(jsonUrl)
.on("load", loadSingleEvents));
console.log("Ho caricato il file:" + jsonUrl);
};
map.add(po.compass()
.pan("none"));
//LOADING THE DATA
function loadSingleEvents(obj) {
console.log("Function launched: loadSingleEvents")
singleEvents=true;
$.each (obj.features, function (i, feat){
var point = feat.element;
var propriety = feat.data.properties;
point.setAttribute('r', 3.5);
point.setAttribute('id', feat.data.id);
point.setAttribute('data-venueName', propriety.venueName);
point.setAttribute('data-hour', propriety.hour);
});
console.log("Numero di Elementi visualizzati: (dovrebbe essere sui 3500) "+ obj.features.length);
}
});