This function is not taking these two website feeds, Only first url is taken
function OnLoad() {
// Create a feed instance that will grab Digg's feed.
var feed = new google.feeds.Feed("http://www.tricks10.com/feed","http://liveurlifehere.com/blog/feed/");
feed.setNumEntries(25);
feed.includeHistoricalEntries();
// Calling load sends the request off. It requires a callback function.
feed.load(feedLoaded);
}
The answer is simple, you need 2 feed objects because the constructor for a Feed takes a simple url. Try that:
function loadFeed(url) {
var feed = new google.feeds.Feed(url);
feed.setNumEntries(25);
feed.includeHistoricalEntries();
feed.load(feedLoaded);
}
function OnLoad() {
["http://www.tricks10.com/feed", "http://liveurlifehere.com/blog/feed/"].map(loadFeed);
}
It worked for me. I only had to merge google's code with the answer above.
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function loadFeed(url) //for multiple urls
{
var feed = new google.feeds.Feed(url); //for multiple urls
feed.includeHistoricalEntries(); //include old stuff
feed.setNumEntries(15); //number of entries
feed.load(function (result) {
if (!result.error)
{
result.feed.entries.forEach(function(entry)
{
var findImg = entry.content;
var img = $(findImg).find('img').eq(0).attr('src'); //i use jquery to find 1st img src
$('#feed').append('<div>your html here</div>');
});
}
});
}
google.setOnLoadCallback( function OnLoad() {
["http://firstURL.com/category/categoryname/feed/", "http://secondURL.com/category/categoryname/feed/, http://thirdURL.com/category/categoryname/feed/"].map(loadFeed);
});
</script>
Related
In recently, Google upgrade its cast receiver to version V3.
There is a simple demo in google demo page as below:
<html>
<head>
</head>
<body>
<cast-media-player id="player"></cast-media-player>
<style>
#player {
--theme-hue: 210;
--splash-image: url("my.png");
}
</style>
<script type="text/javascript" src="//www.gstatic.com/cast/sdk/libs/caf_receiver/v3/cast_receiver_framework.js">
</script>
<script>
const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
// intercept the LOAD request to be able to read in a contentId and get data
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, loadRequestData => {
if (loadRequestData.media && loadRequestData.media.contentId) {
return thirdparty.getMediaById(loadRequestData.media.contentId)
.then(media => {
if (media) {
loadRequestData.media.contentUrl = media.url;
loadRequestData.media.contentType = media.contentType;
loadRequestData.media.metadata = media.metadata;
}
return loadRequestData;
});
}
return loadRequestData;
});
// listen to all Core Events
playerManager.addEventListener(cast.framework.events.category.CORE,
event => {
console.log(event);
});
const MyCastQueue = class extends cast.framework.QueueBase {
initialize(loadRequestData) {
const media = loadRequestData.media;
const items = [];
items.push(myCreateItem(media)); // your custom function logic
const queueData = new cast.framework.messages.QueueData();
queueData.items = items;
return queueData;
}
nextItems(itemId) {
return [myCreateNextItem()]; // your custom function logic
}
};
const playbackConfig = new cast.framework.PlaybackConfig();
// Sets the player to start playback as soon as there are five seconds of
// media contents buffered. Default is 10.
playbackConfig.autoResumeDuration = 5;
const myCastQueue = new MyCastQueue(); // create instance of queue Object
context.start({queue: myCastQueue, playbackConfig: playbackConfig});
</script>
</body>
</html>
From:
https://developers.google.com/cast/docs/caf_receiver_features#styling-the-player
But when I debugged it, there is an error that 'thirdparty' is undefined.
Does anyone can show me how to create a CAF receiver?
This is example code. You are supposed to provide those extra functions yourself.
The example shows how to override the queueing system to perform receiver based queueing. It isn't a great example IMHO as it doesn't provide an example of asynchronously fetching server based queues.
If you don't need receiver managed queues you can start with the minimal CAF receiver shown on the previous page. This is enough to get the remote debugger working which is at least one good reason to have a custom receiver.
https://developers.google.com/cast/docs/caf_receiver_basic
I've made a more complete example. https://gist.github.com/jcable/45c65a72074763a9ec30ddb1ff217517
I'm getting the images with the media/search endopoint passing a lat and lon like this
url = Instagram.Config.apiHost + "/v1/media/search?lat=28.46555600&lng=-16.25113310&distance=5000&callback=?&client_id=" + Instagram.Config.clientID;
and then I'm gettin only the pics with a certain tag #instabeachpro,if the pic is not found I go trough the next set of pics adding the last pic created_time to the url with the max_timestamp parameter, here is the code I'm using
(function(){
var url,tags,menos,photos = new Array(),i=90;
function search(){
generateResource(tag;
$.getJSON(url, toScreen);
}
function init(){
bindEventHandlers();
}
function generateResource(){
url = Instagram.Config.apiHost + "/v1/media/search?lat=28.46555600&lng=-16.25113310&distance=5000&callback=?&client_id=" + Instagram.Config.clientID;
return url;
}
function toScreen(){
var next_url=url+"&max_timestamp="+data.data[data.data.length - 1].created_time;
$.each(data.data, function(index, photo){
i--;
tags=photo.tags;
menos=jQuery.inArray( "instabeachpro", tags );
if(menos!=-1)
{
$('div#photos-wrap').append("<div id='"+i+"' ><a href='"+photo.link+"'><img src='"+photo.images.low_resolution.url+"'/></a></div><div><img class='second' src='"+photo.user.profile_picture+"'/></div>");
}
else{
i++;
}
});
if(next_url!=undefined+"&callback=?" && i>=0){
console.log(i);
pagination(next_url);
}
}
function pagination(url)
{
$.getJSON(url, toScreen);
}
Instagram.App = {
search: search,
init: init
};
function bindEventHandlers(){
$('body').on('click', '#loadObject', function(){
url=$(this).attr('data-next-url');
i=90;
if(url=='undefined')
{
alert("undefined");
}
else{
pagination(url);
return false;
}
});
}
}());
$(function(){
Instagram.App.init();
Instagram.App.search();
});
This works but it's extremely slow and I have no idea what to do to speed it up, because the api doesn't support searching like I want to do, and i need to get al the pcitures with a certain tag IN a certain location, I have been told a number of times this is the only way to do it, but there has to be a faster way.Thank you.
Your method is extremely inefficient, since the tag you are searching is not popular and very small percentage of people use it, so getting API around location and then filtering by tag is expensive on number of API calls.
Search the other way round, make API call for the tag and then check for location for that photo. Check this implementation: http://www.gramfeed.com/instagram/tags#instabeachpro
You can get the tag photos and maps it on Google Maps, scroll to load more photos and see that very few of the #instabeachpro photos are tagged with location
I have this code to have random background images, I need to make sure that when someone clicks on the picture to open a web page, one for each image. Can you help me please?
this is the code:
</head><body onLoad="LoadRandomBackground(); StartBackgroundRefreshTimer()">
</body>
</head>
<body onLoad="LoadRandomBackground()">
</body>
<script type="text/javascript">
var bgImages = [];
bgImages[1]="/img/sfondi/bg-stanem.jpg";
bgImages[2]="/img/sfondi/booking.jpg";
function LoadRandomBackground()
{
var randomImageIndex = Math.floor(Math.random()*bgImages.length)
document.body.background = bgImages[randomImageIndex];
}
function StartBackgroundRefreshTimer()
{
var timer = setInterval('LoadRandomBackground()',1000); // millisecondi
}
</script>
thank's
can someone help me?
you could create a second array ...
var bgImagesUrls=[];
then assign the urls to the array using the same indexes for the bgImages
you could then place in LoadRandomBackground
document.<someelement>.href=bgImagesUrls[randomImageIndex];
Here a short possible script http://jsfiddle.net/d2Dmh/3/
bgImages[0]= {url: ...
here you can place the url you want as destination as another parameter (destination : "url")
And with
window.location = "http://www.google.com/";
you can navigate to the new page in the document click function.
You need jquery for my example.
Hi People and thanks for reading.
I am building a small (one-page) site for my friends band, and am using a tumblr feed instead of news section. The only thing is, I'm a total novice at JS / JQuery.
I've managed to get the posts showing fine, but at the moment the feed pulls the post title, some blurb, and the date (in that order). Because I want to display the date before the title, I'm crudely using some CSS to move the date above the title (position: relative).
So far I have this in the header:
<script src="http://www.google.com/jsapi" type="text/javascript"> </script>
And this in the body just before the closing body tag:
<script type="text/javascript">
google.load("feeds", "1");
function OnLoad() {
var feedControl = new google.feeds.FeedControl();
feedControl.setNumEntries(3);
feedControl.addFeed("http://xxxxxxxxxx.tumblr.com/rss");
feedControl.draw(document.getElementById("recentPosts"));
}
google.setOnLoadCallback(OnLoad);
</script>
Does anyone know how I can customise the output so that the date comes before the title?
Thanks,
John
I think you need to hack the html rendered by Google' script; you could try to use jquery in order to make things easier. Just remember to apply your changes after the
google.setOnLoadCallback(OnLoad);
Could be something like this (not tested):
<script language="Javascript">
google.load("feeds", "1");
function loadFeeds()
{
var feedControl = new google.feeds.FeedControl();
feedControl.setNumEntries(3);
var html;
var feed = new google.feeds.Feed("http://www.digg.com/rss/index.xml");
feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
html+=entry.date+"<p>"+entry.title+"</p>"+entry.description+"<br>";
document.getElementById("feed").innerHTML =html;
}
}
});
}
google.setOnLoadCallback(loadFeeds);
</script>
I am aware that when coding an extension, there is no way we can delay a function call except for using a setTimeout call but here's what I am trying to achieve in a plugin that I am developing for Firefox (this is not for Javascript embedded into a web page by the way):
for (var i = 0; i < t.length ; i++) {
//Load a URL from an array
//On document complete, get some data
}
The idea is simple. I have an array of URLs that I want to parse and extract some data out of. Each of these URLs take some time to load. So, if I try to get some data from the current page without waiting for the page to load, I will get an error. Now, the only way to do this as I know is as follows:
firstfunction: function() {
//Load the first url
setTimeout("secondfunction", 5000);
}
secondfunction: function() {
//Load the second url
setTimeout("thirdfunction", 5000);
}
And so on... I know this is obviously wrong.. I was just wondering how people achieve this in Javascript...
EDIT: Sorry about not being more detailed...
I'm not convinced that this type of foolery is necessary but I'm not an extension dev so who knows. If this is the approach you want, then just have the setTimeout call refer to the same function:
var index;
firstfunction: function() {
// do something with `index` and increment it when you're done
// check again in a few seconds (`index` is persisted between calls to this)
setTimeout("firstfunction", 5000);
}
I am not sure how to do this from a plugin, but what I've done with iframes in the past is attach a callback to the target document's onLoad event.
Maybe something like:
var index = 0;
var urls = [ ..... ];
function ProcessDocument() { ....; LoadNextDocument(); }
function LoadNextDocument() { index++; /* Load urls[index] */; }
document.body.onLoad = ProcessDocument;
Somewhere in there you'd need to test for index > urls.length too for your end condition.
I had same problem but I used recursion instead of looping.
Below is the running code which changes the innerHTML of an element by looping through the list. Hope its helpful.
<Script type="text/javascript">
var l;
var a;
function call2()
{
l = document.getElementById('listhere').innerHTML;
a = l.split(",");
call1(0);
}
function call1(counter)
{
if(a.length > counter)
{
document.getElementById('here').innerHTML = a[counter];
counter++;
setTimeout("call1("+counter+")",2000);
}
}
</Script>
<body onload="call2()">
<span id="listhere">3,5,2,8</span><Br />
<span id="here">here</span>