|
JavaScript - Rss Feed Display Using Rssdisplayer.js - Remove Hyperlinks
I'm using JavaScript (rssplayer.js) to display a feed from a Blogger blog. I want the feed to be displayed as plain text without the hyperlink to the original posts. Does anyone know how to do this?
Thanks rssplayer: http://www.javascriptkit.com/dhtmltu...jaxfeed3.shtml Here's the code in my page: Code: <script type="text/javascript">
//USAGE SYNTAX: new rssdisplayer("divid", "rssurl", numberofitems, "displayoptions")
new rssdisplayer("rssdiv", "http://jms8bscience-assignments.blogspot.com/feeds/posts/default?alt=rss", 6, "")</script>
Here's the code for the rssdisplayer.js Code: google.load("feeds", "1") //Load Google Ajax Feed API (version 1)
function rssdisplayer(divid, url, feedlimit, showoptions){
this.showoptions=showoptions || "" //get string of options to show ("date" and/or "description")
var feedpointer=new google.feeds.Feed(url) //create new instance of Google Ajax Feed API
feedpointer.setNumEntries(feedlimit) //set number of items to display
document.write('<div id="'+divid+'">Loading feed...</div>')
this.feedcontainer=document.getElementById(divid)
var displayer=this
feedpointer.load(function(r){displayer.formatoutput(r)}) //call Feed.load() to retrieve and output RSS feed
}
rssdisplayer.prototype.formatdate=function(datestr){
var itemdate=new Date(datestr)
return "<span style='color:gray; font-size: 90%'>"+itemdate.toLocaleString()+"</span>"
}
rssdisplayer.prototype.formatoutput=function(result){
if (!result.error){ //if RSS feed successfully fetched
var thefeeds=result.feed.entries //get all feed entries as a JSON array
var rssoutput="<ul>"
for (var i=0; i<thefeeds.length; i++){ //loop through entries
var itemtitle="<a href=\"" + thefeeds[i].link + "\">" + thefeeds[i].title + "</a>"
var itemdate=/date/i.test(this.showoptions)? this.formatdate(thefeeds[i].publishedDate) : ""
var itemdescription=/description/i.test(this.showoptions)? "<br />"+thefeeds[i].content : ""
rssoutput+="<li>" + itemtitle + " " + itemdate + itemdescription + "</li>"
}
rssoutput+="</ul>"
this.feedcontainer.innerHTML=rssoutput
}
else //else, output error
alert("Error fetching feeds: "+result.error.message)
}
//USAGE SYNTAX: new rssdisplayer("divid", "rssurl", numberofitems, "displayoptions")
//new rssdisplayer("adiv", "http://www.cssdrive.com/index.php/news/rss_2.0/", 5, "date, description")
Similar TutorialsHello, Ive used feed.informer to display recent updates to my blog but it only seems to allow for them to be displayed vertically. I am looking for a way to display my recent blog posts horizontally on my site in a manner similar to how feed.informer works. Thank you for your help! Hi, I noticed that RSS Feed entries are linked to their source when using rssdisplayer.js (see "A robust RSS Feed displayer" in Javascriptkit.com). Can anyone show me how to link the the source url provided in the feed to something different, like linkTarget_blank. The option takes a string and will be used to specify the link target of the image. Please PM the modified rssdisplayer.js script. I really need your help guys. Thanks Bastos The rssdisplayer.js code works well enough, however, clicking on the generated rss news link updates the current html page with the feed. Not a good idea since I don't want people leaving my website. So, the script that builds the href link looks like this: var itemtitle="<a href=\"" + thefeeds[i].link + "\">" + thefeeds[i].title + "</a>" I want to add target="_blank" for obvious reasons. Can anyone tell me how to do this? A noob needs some help. I'm using a combination of Yahoo Pipes and rssdisplayer.js to display some snippets from several RSS feeds on a new site I'm building. The trouble I'm having is that (i) the feeds don't update when I refresh the page, I think because a cached version of the page is being loaded, and (ii) I'd like to have the div containing the feeds auto-refresh at a given time interval. I've got a Twitter javascript working that does both these things, but can't work out how to get the rssdisplayer.js working this way. The rssdisplayer code is: Code: google.load("feeds", "1") //Load Google Ajax Feed API (version 1)
function rssdisplayer(divid, url, feedlimit, showoptions){
this.showoptions=showoptions || "" //get string of options to show ("date" and/or "description")
var feedpointer=new google.feeds.Feed(url) //create new instance of Google Ajax Feed API
feedpointer.setNumEntries(feedlimit) //set number of items to display
document.write('<div id="'+divid+'">Loading feed...</div>')
this.feedcontainer=document.getElementById(divid)
var displayer=this
feedpointer.load(function(r){displayer.formatoutput(r)}) //call Feed.load() to retrieve and output RSS feed
}
rssdisplayer.prototype.formatdate=function(datestr){
var itemdate=new Date(datestr)
return "<span style='color:gray; font-size: 90%'>"+itemdate.toLocaleString()+"</span>"
}
rssdisplayer.prototype.formatoutput=function(result){
if (!result.error){ //if RSS feed successfully fetched
var thefeeds=result.feed.entries //get all feed entries as a JSON array
var rssoutput="<ul>"
for (var i=0; i<thefeeds.length; i++){ //loop through entries
var itemtitle="<a href=\"" + thefeeds[i].link + "\">" + thefeeds[i].title + "</a>"
var itemdate=/date/i.test(this.showoptions)? this.formatdate(thefeeds[i].publishedDate) : ""
var itemdescription=/description/i.test(this.showoptions)? "<br />"+thefeeds[i].content : ""
rssoutput+="<li>" + itemtitle + " " + itemdate + itemdescription + "</li>"
}
rssoutput+="</ul>"
this.feedcontainer.innerHTML=rssoutput
}
else //else, output error
alert("Error fetching feeds: "+result.error.message)
}
//USAGE SYNTAX: new rssdisplayer("divid", "rssurl", numberofitems, "displayoptions")
//new rssdisplayer("adiv", "http://www.cssdrive.com/index.php/news/rss_2.0/", 5, "date, description")
Following are my script to toggle b/w two different links, <html lang="en-US"> <head> <title>toggle b/w 2 different links</title> <script type="text/javascript"><!-- display=1; function displayvalue() { document.getElementById("sv1").style.display = "block"; document.getElementById("dw1").style.display = "none"; } function ShowHide() { if (display==1) { document.getElementById("sv1").style.display = "none"; document.getElementById("dw1").style.display = "block"; //document.getElementById('javaFun') calling java func from javascript display=2; } else { document.getElementById("sv1").style.display = "block"; document.getElementById("dw1").style.display = "none"; //document.getElementById('javaFun1') calling java func from javascript display=1; } } function Func1Delay() { document.getElementById("sv1").style.display = "none"; document.getElementById("loadimage").innerHTML="<input type='image' src='Loading.gif'>"; setTimeout("LoadImage()", 300); } function LoadImage() { document.getElementById("loadimage").innerHTML=""; ShowHide(); } --></script> </head> <body background="GsNJNwuI-UM.gif"onload="displayvalue()"> <div id="sv1" > <a onclick ="Func1Delay()" href="javascript:;">click me</a> </div> <div id="loadimage"></div> <div id="dw1" > <a onclick ="ShowHide()" href="javascript:;">Download me</a> </div> </body> </html> whenever we call a java method , (consider this line:- document.getElementById('javaFun');)after the completion of java call the page is reloading, how control this reloading after the server completing the request....? I have been trying to develop a script that creates a slideshow that adds hyperlinks to the images. I'm a beginner at Javascript, so I've made a bastardisation of 3 different scripts I've found that, by my reckoning, should work. This is the slideshow code: Code: window.onload = initAll;
var gallery_url = new Array('<a href="http://www.optionstradingaustralia.com.au" target=_blank>', '<a href="http://home.iprimus.com.au/thebyrnes5/splats/index.html">')
var thisUrl = 0;
var gallery = new Array("portfolio_ota.jpg", "portfolio_bashbrothers.jpg");
var thisImage = 0;
var gallery_title = new Array("Options Trading Australia Website", "The Bash Brothers Website");
var thisTitle = 0;
var gallery_number = new Array("1", "2");
var thisNumber = 0;
function initAll() {
document.getElementById("previous").onclick = processPrevious;
document.getElementById("next").onclick = processNext;
}
function processPrevious () {
if (thisUrl == 0) {
thisUrl = gallery_url.length;
}
thisImage--;
document.getElementById("view_portfolio").src = gallery_url[thisUrl]+'<img src="'+thisImage+'"></a>';
document.getElementById("portfolio_title").innerHTML = gallery_title[thisUrl];
document.getElementById("portfolio_number").innerHTML = gallery_number[thisUrl];
return false;
}
function processNext () {
thisImage++;
if (thisUrl == gallery_url.length) {
thisUrl = 0;
}
document.getElementById("view_portfolio").src = gallery_url[thisUrl]+'<img src="'+thisImage+'"></a>';
document.getElementById("portfolio_title").innerHTML = gallery_title[thisUrl];
document.getElementById("portfolio_number").innerHTML = gallery_number[thisUrl];
return false;
}
I know that for the most part, this script works. It was only when I tried to add the component that involved adding a hyperlink that it broke. The bit of code in the HTML that it directly affects is <div id="view_portfolio"> </div> Does anyone know why the javascript doesn't work? I have a feeling it's because I haven't applied the id tag in the HTML properly, but I don't know what exactly is wrong about it. I am hoping someone here can shed some light on the situation! The gallery I have made so far is at http://www.clarebyrnedesign.com.au/portfolio.html, except that at the moment, the images don't show. I've attached the javascript & html code. Thanks! I am working with an InDesign CS3 document, with multiple books, and what I want to do is search for a string and turn that string or some how attach an InDesign Hyperlink object to that string. I can find the string using the findText() method var myFoundItems = app.documents.item(0).findText(); And it is returned as a TextStyleRange with its parent being a Story object. What I'm having trouble with is either replacing or attaching a Hyperlink object to string or TextStyleRange. Hyperlink objects to not have a contructor so I don't know how to instantiate a new one and once I get a new one created and the fields populated I don't know how to replace or attach the Hyperlink to that TextStyleRange. I'm new to programming, Here's my problem: I'm using a for loop to generate a list of hyperlinks for(i = 100; i < 200; i++) { var str = "link"; document.write(str.link('http://someWebsite.com/' + i +'.html')); document.write("<br />"); } so the list that is generated looks like... link link link ---------and so on until the loop is finished. My question: is it possible for each links text to be dependent on the pages title? for example instead of the the text "link", the program would follow the URL and know in the pages header was the title "Bob's website" or whatever the pages title was and would generate the list. Example: bobs website daves website rons website susies website betsys website ______________________________ Any help to differentiate the links text based on following the URL would be helpful Thank you! I have been using this sideshow example which works great but I want to be able to click on the slideshow picture to take me to another link (hyperlink) I also wanted to have links next to the slidehsow which would go to a certain picture in the slideshow for example by pressing link "go to picture 3" it would scroll automatically to picture 3 in the slideshow I have been using examples from: http://www.dynamicdrive.com/dynamici...nslideshow.htm this but I am willing to change to another version if I can't do that with this slideshow scrit hi there, I'm looking for a method to use several hyperlinks to submit a form and then return the page within the link for example Code: <a href="thispage.php?mode=1" Onclick="javascript:form.submit();"> <a href="thispage.php?mode=2" Onclick="javascript:form.submit();"> the reason for this is so that no matter which link a user navigates to the form will be submitted and no data lost. however the above code obviously loses the POST info as the form action will be different from the a tag. Therefore I think maybe a way of creating a variable that changes the form action to match the a link selected (as the form(s) are submitted to the same php page. hope someone can think clearer than me! cheers I need someone who can help me create javascript code which will create a hyperlink string with a changing variable: This script should write and execute a hyperlink string which opens a separate pop-up window, nothing more. No image files, no subfolders, forget all that stuff. JUST A HYPERLINK. The hyperlink SYNTAX does all the work in loading and selecting the images, NOT THE SCRIPT. There is only one changing variable, the value following clipart_id= Here is the basic hyperlink syntax: <a href="http://www.websitename.com/clipart/manipulate? clipart_id= 00000 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a> THERE ARE ALWAYS 2 WINDOWS: ONE WINDOW HOLDS THE HTML; THE OTHER IS A POP-UP WINDOW (The opened hyperlink) The basic html page will contain only 2 objects, an input box and a NEXT BUTTON. Step 1: Initialize the variable from an input box, this variable is used to set the value following clipart_id= which is part of the hyperlink syntax Step 2: The user inputs the initial variable which is used to write the first hyperlink string; click NEXT to launch the first pop-up window Step 3: For each subsequent action Click NEXT - OnClick - This ADDS +1 to the initial variable, this variable is passed to be inserted in a new hyperlink string AND then launches a NEW hyperlink to open a NEW popup window. This is an infinite type of action which advances the value of clipart_id= every time the NEXT button is clicked. Each time you click the NEXT button it advances a counter which executes a NEW hyperlink in a NEW popup window. The only thing that ever changes is the variable after clipart_id=, BUT the entire url syntax of the hyperlink string must be maintained exactly as shown below. If you change the syntax it will not work. So, if the first value to start with is lets say 13000 ; this is input in a box; then the first hyperlink string will automatically be written and open using this: <a href="http://www.websitename.com/clipart/manipulate?clipart_id= 13000 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a> Click the NEXT BUTTON and now a new hyperlink window will open which reads like this: <a href="http://www.websitename.com/clipart/manipulate?clipart_id= 13001 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a> click the NEXT BUTTON and now a new hyperlink hyperlink window will open reads like this: <a href="http://www.websitename.com/clipart/manipulate?clipart_id= 13002 &path=%2Fclipart%2Feps%2F&lockRatio=true&width=500&height=500"></a> And so on and so on... Nothing else changes. So the "nextpath" after a CLICK is a complete new hyperlink string which contains a vew variable for the value following clipart_id= All I am trying to do is execute a standardized hyperlink string with one changing variable. CAN ANYONE HELP ME TO WRITE THIS CODE? Consider the following piece of code: PHP Code: <form method='post' name='myform'> <input type='submit' name='sub' value='submit 1' /> <input type='submit' name='sub' value='submit 2' /> <a href='javascript:document.myform.submit();'>submit 3</a> </form> <?php echo "You clicked ".$_POST["sub"]; ?> So if you click "submit 1", the output will be You clicked submit 1. And if you click "submit 2", the output will be You clicked submit 2. That's obvious. But ... what do I need to do to pass the key/value pair "sub" = "submit 3" to the server via POST when I click on the hyperlink showing "submit 3" - so that the output is You clicked submit 3 (i.e. so that $_POST contains "submit 3" referenced to index "sub"). I've tried <a href='javascript: a = {"x" : 1}; document.myform.submit(a);'>submit 3</a>, but that doesn't cause a to be passed via POST. Hi there, this is my first post so forgive me if it is frustrating to those who try to help. I am trying to create a side navigation menu that I want to just be a heading then once clicked it toggles on a list. Each item must be a link to a different webpage. so far i have only managed to create a toggle list but cannot control each item to make it a unique link. I'll post the script I have so far; -------------------------------------------------------------------------- <script language="javascript" type="text/javascript"> function list_colours() { var i=0; var colours = new Array(); colours[0]=<a href="../Yellow Inventory.html"> Yellow </a>; colours[1]=<a href="../Orange Inventory.html">"Orange"</a>; colours[2]=<a href="../Pink Inventory.html">"Pink"</a>; colours[3]=<a href="../Green Inventory.html">"Green"</a>; colours[4]=<a href="../Blue Inventory.html">"Blue"</a>; colours[5]=<a href="../Red Inventory.html">"Red"</a>; var text=""; for(var i=0; i < colours.length; i++) { text = text + colours[i] + "</a><br/>"; } return text; } //creating a toggle menu var onOff = "off" function insertText() { if(onOff == "off") { var paragraph = document.getElementById("colour-items"); var colours_list = list_colours(); paragraph.innerHTML=colours_list; onOff="on" } else { var paragraph = document.getElementById("colour-items"); var colours_list=""; paragraph.innerHTML=colours_list; onOff="off" } } </script> <div id="left-container"> <div id="Nav-title"><h3 onmouseover="insertText();">Colours</h3></div> <p id="colour-items"></p> </div> ------------------------------------------------------------------------- It is my guess that you make the array lists a list of a links, though I can't seem to find the correct way how. The second problem I have is that I have a large number of images of products on my page. I would like 4 headings that contain all my images, like the toggle menu above. so I click the heading and only those images come up. I will be happy to answer any questions that may help. Thanks all. Hi guys.. I am just starting to learn JavaScript. I wanted to know how to have multiple hyperlinks (Containing links to Youtube Videos) that when clicked, cause the corresponding videos to play on the Youtube Player Embedded on the site. I hope my question is not too confusing. Thank you in advance! P.S. I saw some Source Code relating to this on StackOverflow and copied it and couldn't get it to work.. Here's my source code. Code: <html>
<head>
<title> Sample Page </title>
<script>
// Get element holding the video (embed or object)
var player = document.getElementById("MOVIE");
//Create a simple function and check if player exists
function play() {
if(player) {
player.playVideo();
}
}
</script>
</head>
<body>
<object width="420" height="315"><param name="MOVIE" value="http://www.youtube.com/v/HsQIoPyfQzM?version=3&hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/HsQIoPyfQzM?version=3&hl=en_US" type="application/x-shockwave-flash" width="420" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>
</br></br>
<a href="http://youtu.be/sPvqNMb4StI" onclick="play()"> THIS IS FIRST Video Link </a></br></br>
<a href="http://youtu.be/w7_Ccu21QVs" onclick="play()"> THIS IS SECOND Video Link </a>
</body>
</html>
I'm trying to get two RSS feeds to display on a page. I'm trying to be good about it and re-use the same code for each by calling the function twice using different parameters for the feed url, feed limit (number of posts to display), and which div to display the output in (cupcake-feed and pie-feed). It works for either of the two feeds, but not both at the same time. If I try calling both, only the second one displays. If I pick just one to call, either one will display. I'm new to object-oriented concepts (if that's even what you would call this?). What am I doing wrong here? Code: function rssfeedsetup(feedurl, feedlimit, feeddivi) {
var feedpointer=new google.feeds.Feed(feedurl) //Google Feed API method
feedpointer.setNumEntries(feedlimit) //Google Feed API method
feedpointer.load(displayfeed) //Google Feed API method
feeddiv=feeddivi //sets output div name as a global variable for use below
}
function displayfeed(result) {
if (!result.error) {
var thefeeds=result.feed.entries
//convert date to friendly format
var date=new Date(thefeeds[0].publishedDate)
var dateString=date.toLocaleDateString()
//create output content and display it in div
for (var i=0; i<thefeeds.length; i++) {
var rssoutput='<div class="feed-date">' + dateString + '</div>' + '<div class="feed-title"><a href="' + thefeeds[i].link + '">' + thefeeds[i].title + '</a></div>' + '<div id="cupcake-menu" class="hidden">' + thefeeds[i].content + '</div>'
document.getElementById(feeddiv).innerHTML=rssoutput
}
}
else {
alert("Error fetching feeds!")
}
}
//call function on load for each feed to be displayed
window.onload=function(){
rssfeedsetup("http://www.site1.com/feed/", 1, "cupcake-feed");
rssfeedsetup("http://www.site2.com/feed/", 1, "pie-feed");
}
Sorry, relative newbie here with what is probably a silly question. When I include the code to create a slideshow found here and then later in the page use the feed informer code to display posts from my blog ( <script type="text/javascript" src="http://app.feed.informer.com/digest3/39SQ9SPCHY.js">...) I am getting a syntax error message at the feedinformer code in dreamweaver and I can not figure out the problem. Any help would be appreciated, thank you I have this piece of javascript code, which enables me to get my Picasa photos without link back feature, in my webpage. The issue is with the hardcoded RSS url feed. I want this to be dynamically passed as a variable to the java script. I use a PHP code, where this javascript is coded. In the below code, if I say var samples = <?php $url_code ?>, the javascript does not recognize. Can someone help on this, as I use the same PHP code, with different url feeds, to display different picasa photo albums ? Code: <script type="text/javascript">
function load() {
var samples = "https://picasaweb.google.com/data/feed/base/user/......................../........./.........?alt=rss&kind=photo&authkey=.....................&hl=en_US"
var options = {
numresults: 2,
scaleimages: true,
maintainAspectRatio : false,
displayTime: 1000,
transistionTime: 300,
//linkTarget : google.feeds.LINK_TARGET_BLANK
};
new GFslideShow(samples, "slideshow", options);
}
google.load("feeds", "1");
google.setOnLoadCallback(load);
</script>
I'm a new app developer who's in the process of developing a simple Android application using Titanium Studio. I'm trying to implement an RSS feed in one of my windows, but I keep getting the following error messages when I run the app on my device: [ERROR] : TiExceptionHandler: (main) [107,107] ----- Titanium Javascript Runtime Error ----- [ERROR] : TiExceptionHandler: (main) [0,107] - In ui/common/NewsWindow.js:1,69 [ERROR] : TiExceptionHandler: (main) [0,107] - Message: Uncaught TypeError: Cannot call method 'add' of null [ERROR] : TiExceptionHandler: (main) [0,107] - Source: fontSize:14},message:"Loading...",style:style,top:20,left:100});win.add(activi [ERROR] : V8Exception: Exception occurred at ui/common/NewsWindow.js:1: Uncaught TypeError: Cannot call method 'add' of null The code for my NewsWindow.js file is below. Any help would be greatly appreciated! Code: var win = Titanium.UI.currentWindow;
var style;
if (Ti.Platform.name === 'iPhone OS'){
style = Ti.UI.iPhone.ActivityIndicatorStyle.DARK;
} else {
style = Ti.UI.ActivityIndicatorStyle.DARK;
}
var activityIndicator = Ti.UI.createActivityIndicator({
color: 'black',
font: {fontFamily:'Helvetica Neue', fontSize:14},
message: 'Loading...',
style: style,
top: 20,
left: 100
});
win.add(activityIndicator);
activityIndicator.show();
var xmlFeed = 'http://feeds.bbci.co.uk/news/video_and_audio/news_front_page/rss.xml?edition=uk#';
var xhr = Ti.Network.createHTTPClient();
xhr.onload = function()
{
activityIndicator.hide();
var xml = this.responseXML;
Ti.API.info(this.responseText);
var channelTitle = xml.documentElement.getElementsByTagName("title").item(0).textContent;
var channelLabel = Ti.UI.createLabel({
top: 20,
text: channelTitle,
color: '#39f'
});
win.add(channelLabel);
var data = [];
var itemsTable = Ti.UI.createTableView({
top: 70,
left: 0
});
win.add(itemsTable);
var items = xml.documentElement.getElementsByTagName("item");
for(var i = 0; i < items.length; i++)
{
// create a table row for each item
var row = Ti.UI.createTableViewRow({
title: items.item(i).getElementsByTagName("title").item(0).textContent,
link: items.item(i).getElementsByTagName("link").item(0).textContent,
height: 'auto',
hasChild: true
});
data.push(row);
}
// bind the data to the itemsTable
itemsTable.data = data;
// when the user clicks on a row
itemsTable.addEventListener('click', function(e)
{
// create and open a new window
var webView = Titanium.UI.createWebView({
backgroundColor:'#fff',
url: e.rowData.link
});
var newWindow = Titanium.UI.createWindow({
backgroundColor:'#fff',
backButtonTitle: 'Back',
title: e.source.title,
});
newWindow.add(webView);
Ti.UI.currentTab.open(newWindow);
});
};
xhr.onerror = function()
{
activityIndicator.hide();
alert(this.status + ': ' + this.statusText);
return false;
};
// open the remote feed
xhr.open('GET', xmlFeed);
// execute the call to the remote feed
xhr.send();
|
|||||||