Added jgfeed plugin (delicious/backtype integration). Closes #8
h3rald h3rald@h3rald.com
Thu, 30 Jul 2009 16:34:51 +0200
4 files changed,
152 insertions(+),
109 deletions(-)
M
ui-dev/home.htm
→
ui-dev/home.htm
@@ -35,148 +35,151 @@ <script src="js/slider.js" type="text/javascript"></script>
<script src="js/jquery.timeago.js" type="text/javascript"></script> <script src="js/jquery.juitter.js" type="text/javascript"></script> <script src="js/jquery.juitter.system.js" type="text/javascript"></script> + <script src="js/jquery.jgfeed-min.js" type="text/javascript"></script> <script type="text/javascript"> - $(document).ready(function() { - $.slider(); - }); - </script> - <script type="text/javascript"> - Cufon.replace('#navigation'); - Cufon.replace('h3')('h2')('h4')('h5'); - </script> + +$(document).ready(function() { + $.slider(); + }); +Cufon.replace('#navigation'); +Cufon.replace('h3')('h2')('h4')('h5'); +</script> </head> <body> - <div id="wrapper"> - <a name="top"></a> - <div id="header"> - <!--[if lte IE 6]> - <div id="ie-warning"> - This site is not compatible with Internet Explorer 6 or lower. You should consider using a more modern browser for a better – and <em>safer</em> – web experience. [<a href="http://browsehappy.com/browsers/">Read More...</a>] - </div> - <![endif]--> - <!-- HEADER START --> - <div id="header-container"> - <div id="header-left"> - <h1><img alt="H3RALD" src="images/logo.png"></h1> + <div id="wrapper"> + <a name="top"></a> + <div id="header"> + <!--[if lte IE 6]> + <div id="ie-warning"> + This site is not compatible with Internet Explorer 6 or lower. You should consider using a more modern browser for a better – and <em>safer</em> – web experience. [<a href="http://browsehappy.com/browsers/">Read More...</a>] </div> - <div id="header-right"> - <ul id="navigation"> - <li>/ <a href="#latest" class="cross-link">latest</a></li> - <li>/ <a href="#popular" class="cross-link">popular</a></li> - <li>/ <a href="#tags" class="cross-link">tags</a></li> - <li>/ <a href="#projects" class="cross-link">projects</a></li> - <li>/ <a href="#about" class="cross-link">about</a></li> - </ul> + <![endif]--> + <!-- HEADER START --> + <div id="header-container"> + <div id="header-left"> + <h1><img alt="H3RALD" src="images/logo.png"></h1> + </div> + <div id="header-right"> + <ul id="navigation"> + <li>/ <a href="#latest" class="cross-link">latest</a></li> + <li>/ <a href="#popular" class="cross-link">popular</a></li> + <li>/ <a href="#tags" class="cross-link">tags</a></li> + <li>/ <a href="#projects" class="cross-link">projects</a></li> + <li>/ <a href="#about" class="cross-link">about</a></li> + </ul> + </div> </div> </div> - </div> - <!-- HEADER END --> + <!-- HEADER END --> - <!-- CONTAINER START --> - <div id="container"> - <ul id="palette"> - <li><a href="#top"><img alt="^" src="images/arrow_up.gif" title="scroll up"></a></li> + <!-- CONTAINER START --> + <div id="container"> + <ul id="palette"> + <li><a href="#top"><img alt="^" src="images/arrow_up.gif" title="scroll up"></a></li> - <li><a href="http://www.h3rald.com/rss"><img alt="#" src="images/feed.png" title="subscribe"></a></li> + <li><a href="http://www.h3rald.com/rss"><img alt="#" src="images/feed.png" title="subscribe"></a></li> - <li><a target="_blank" href="http://www.addthis.com/bookmark.php" onclick="addthis_url = location.href; addthis_title = document.title; return addthis_click(this);" rel="external"> - <img alt="*" src="images/bookmark.gif" title="bookmark"></a></li> - <li><a href="#" onclick="location.href='mailto:?SUBJECT='+document.title+'&BODY='+escape(document.title)+'\n['+escape(location.href)+']'"><img alt="@" src="images/mail_back.gif" title="mail"></a></li> + <li><a target="_blank" href="http://www.addthis.com/bookmark.php" onclick="addthis_url = location.href; addthis_title = document.title; return addthis_click(this);" rel="external"> + <img alt="*" src="images/bookmark.gif" title="bookmark"></a></li> + <li><a href="#" onclick="location.href='mailto:?SUBJECT='+document.title+'&BODY='+escape(document.title)+'\n['+escape(location.href)+']'"><img alt="@" src="images/mail_back.gif" title="mail"></a></li> + + <li><a href="#" onclick="window.print()"><img alt="P" src="images/printer.gif" title="print"></a></li> + <li><a href="#footer"><img alt="v" src="images/arrow_down.gif" title="scroll down"></a></li> + </ul> + <!-- CONTENT START --> + <div id="content"> + <h2>Home</h2> + <div id="intro"> + <p>Welcome to <span class="caps">H3RALD</span>.com, Fabio Cevasco’s personal web site.</p> + </div> - <li><a href="#" onclick="window.print()"><img alt="P" src="images/printer.gif" title="print"></a></li> - <li><a href="#footer"><img alt="v" src="images/arrow_down.gif" title="scroll down"></a></li> - </ul> - <!-- CONTENT START --> - <div id="content"> - <h2>Home</h2> - <div id="intro"> - <p>Welcome to <span class="caps">H3RALD</span>.com, Fabio Cevasco’s personal web site.</p> - </div> + <div id="slider"> + <div class="scroll"> + <div class="scrollContainer"> - <div id="slider"> - <div class="scroll"> - <div class="scrollContainer"> + <div class="panel" id="latest"> + <h3>Latest Articles</h3> + TODO + </div> + <div class="panel" id="popular"> + <h3>Popular Articles</h3> + TODO - <div class="panel" id="latest"> - <h3>Latest Articles</h3> - TODO - </div> - <div class="panel" id="popular"> - <h3>Popular Articles</h3> - TODO + </div> + <div class="panel" id="tags"> + <h3>Tags</h3> + <ul> + <li><a href="#">Ruby</a></li> + <li><a href="#">Programming</a></li> + <li><a href="#">RedBook</a></li> + <li><a href="#">Productivity</a></li> + <li><a href="#">Test #1</a></li> + <li><a href="#">Test #2</a></li> + <li><a href="#">Test #3</a></li> + <li><a href="#">Test #4</a></li> + </ul> - </div> - <div class="panel" id="tags"> - <h3>Tags</h3> - <ul> - <li><a href="#">Ruby</a></li> - <li><a href="#">Programming</a></li> - <li><a href="#">RedBook</a></li> - <li><a href="#">Productivity</a></li> - <li><a href="#">Test #1</a></li> - <li><a href="#">Test #2</a></li> - <li><a href="#">Test #3</a></li> - <li><a href="#">Test #4</a></li> - </ul> + </div> + <div class="panel" id="projects"> + <h3>Projects</h3> + </div> + <div class="panel" id="about"> + <h3>About</h3> + </div> - </div> - <div class="panel" id="projects"> - <h3>Projects</h3> - </div> - <div class="panel" id="about"> - <h3>About</h3> - </div> + </div><!-- .scrollContainer --> + </div><!-- .scroll --> + </div><!-- #slider --> - </div><!-- .scrollContainer --> - </div><!-- .scroll --> - </div><!-- #slider --> + <h3>Bookmarks</h3> + <div id="delicious"> + </div> + <h3>Comments</h3> + <div id="backtype"> + </div> - <h3>Bookmarks</h3> - <div id="delicious"> - </div> + <h3>Thoughts</h3> + <div id="twitter"> + </div> - <h3>Thoughts</h3> - <div id="twitter"> </div> + <!-- CONTENT END --> - + <div id="push"></div> </div> - <!-- CONTENT END --> + <!-- CONTAINER END --> + </div> <!-- WRAPPER END --> + <div id="footer"> + <div id="footer-container"> - <div id="push"></div> - </div> - <!-- CONTAINER END --> - </div> <!-- WRAPPER END --> - <div id="footer"> - <div id="footer-container"> - - <div class="footer-div">Interesting Places: - <a href="http://www.cyberarmy.net/" class="link">CyberArmy</a> | - <a href="http://andreagandino.com/" class="link">Andrea Gandino</a> | - <a href="http://www.webmasterwords.com/" class="link">Webmaster Words</a> | - </div> - <div class="footer-div">Sponsored Links: + <div class="footer-div">Interesting Places: + <a href="http://www.cyberarmy.net/" class="link">CyberArmy</a> | + <a href="http://andreagandino.com/" class="link">Andrea Gandino</a> | + <a href="http://www.webmasterwords.com/" class="link">Webmaster Words</a> | + </div> + <div class="footer-div">Sponsored Links: - <a href="http://www.hardstand.com.br/" class="link">Codigo de barras</a> | <a href="http://www.seelikepat.com/" class="link">Crystalens | St. Louis Surgery</a> | <a href="http://www.rapidsupplies.com/" class="link">Discount Computer Accessories</a> + <a href="http://www.hardstand.com.br/" class="link">Codigo de barras</a> | <a href="http://www.seelikepat.com/" class="link">Crystalens | St. Louis Surgery</a> | <a href="http://www.rapidsupplies.com/" class="link">Discount Computer Accessories</a> + </div> + <div class="footer-div">H3RALD Web Site v7.1.2 <em>"PlainText"</em> – © 2004-2009 <strong>Fabio Cevasco</strong> – <a class="link" href="http://creativecommons.org/licenses/by-nc-nd/3.0/">Some rights reserved</a> | <img alt="Valid" src="images/tick.gif"> <a href="http://validator.w3.org/check?uri=referer" class="link">XHTML 1.0 Strict</a> <img alt="Valid" src="images/tick.gif"> <a href="http://jigsaw.w3.org/css-validator/" class="link">CSS 2.1</a></div> </div> - <div class="footer-div">H3RALD Web Site v7.1.2 <em>"PlainText"</em> – © 2004-2009 <strong>Fabio Cevasco</strong> – <a class="link" href="http://creativecommons.org/licenses/by-nc-nd/3.0/">Some rights reserved</a> | <img alt="Valid" src="images/tick.gif"> <a href="http://validator.w3.org/check?uri=referer" class="link">XHTML 1.0 Strict</a> <img alt="Valid" src="images/tick.gif"> <a href="http://jigsaw.w3.org/css-validator/" class="link">CSS 2.1</a></div> </div> - </div> - <script type="text/javascript"> - Cufon.now(); - </script> - </body> -</html> + <script src="js/feeds.js" type="text/javascript"></script> + <script type="text/javascript"> + Cufon.now(); + </script> + </body> + </html>
A
ui-dev/js/feeds.js
@@ -0,0 +1,24 @@
+function feed_entry(entry){ + var published_at = $("<span>["+$.timeago(entry.publishedDate)+"] </span>").addClass('published_at'); + var link = $("<a>"+entry.title+"</a>").attr('href', entry.link); + return $("<li></li>").html(published_at.append(link)); +}; +function display_feed(feed, element){ + if(!feed){ + return false; + } + var feed_list = $("<ul></ul>") + for(var i=0; i<feed.entries.length; i++){ + var entry = feed.entries[i]; + feed_entry(entry).appendTo(feed_list); + } + feed_list.appendTo(element) +}; +var delicious_feed = function(feed){ + display_feed(feed, "#delicious") +}; +var backtype_feed = function(feed){ + display_feed(feed, "#backtype") +}; +$.jGFeed('http://feeds.delicious.com/v2/rss/h3rald', delicious_feed, 10) +$.jGFeed('http://feeds.backtype.com/home/21105', backtype_feed, 10)
A
ui-dev/js/jquery.jgfeed-min.js
@@ -0,0 +1,16 @@
+/* + * jGFeed 1.0 - Google Feed API abstraction plugin for jQuery + * + * Copyright (c) 2009 jQuery HowTo + * + * Licensed under the GPL license: + * http://www.gnu.org/licenses/gpl.html + * + * URL: + * http://jquery-howto.blogspot.com + * + * Author URL: + * http://me.boo.uz + * + */ +(function($){$.extend({jGFeed:function(url,fnk,num,key){if(url==null){return false;}var gurl="http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q="+url;if(num!=null){gurl+="&num="+num;}if(key!=null){gurl+="&key="+key;}$.getJSON(gurl,function(data){if(typeof fnk=="function"){fnk.call(this,data.responseData.feed);}else{return false;}});}});})(jQuery);
M
ui-dev/js/jquery.timeago.js
→
ui-dev/js/jquery.timeago.js
@@ -79,7 +79,7 @@ return $.trim([prefix, words, suffix].join(" "));
}, parse: function(iso8601) { var s = $.trim(iso8601); - s = s.replace(/-/,"/").replace(/-/,"/"); + //s = s.replace(/-/,"/").replace(/-/,"/"); s = s.replace(/\d(T)\d/," ").replace(/Z/," UTC"); s = s.replace(/([\+-]\d\d)\:?(\d\d)/," $1$2"); // -04:00 -> -0400 return new Date(s);