Skip to content

Commit

Permalink
community page js
Browse files Browse the repository at this point in the history
  • Loading branch information
@arturoc
arturoc committed Dec 10, 2011
1 parent 50dcc8a commit 0bb2f1f
Show file tree
Hide file tree
Showing 3 changed files with 331 additions and 0 deletions.
42 changes: 42 additions & 0 deletions community/user/index.html.mako
View file
@@ -0,0 +1,42 @@
<%inherit file="base.mako" />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
${self.head()}
<script language="javascript" src="${bf.config.site.url}/js/jquery.tweet.js" type="text/javascript"></script>
<script src="http://www.google.com/jsapi?key=AIzaSyA5m1Nc8ws2BbmPRwKu5gFradvD_hgq6G0" type="text/javascript"></script>
<script type="text/javascript" src="${bf.config.site.url}/js/encoder.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript" src="${bf.config.site.url}/js/socialwidgets.js"> </script>
<script type="text/javascript" src="${bf.config.site.url}/js/community.js"> </script>

</head>

<body>
<div id="content">
${self.header()}
<div id="body-wrap">
<div class="page-wide">
<div class="tweet">
<div class="tweets"></div>
</div>
<div id="github"></div>
<div id="user"></div>
<br class="clearboth"/>
<hr/>
<br/>
<div id="media">
<h2>pictures and videos</h2>
<div id="flickr"></div>
<div id="vimeo"></div>
</div>
</div>
</div>
<div id="footer">
${self.footer()}
</div> <!-- End Footer -->
</div> <!-- End Content -->
</body>
</html>
155 changes: 155 additions & 0 deletions js/community.js
View file
@@ -0,0 +1,155 @@
var hasFlickr = false;
var hasVimeo = false;

function getUrlVars(){
var location = window.location.href;
if(location.lastIndexOf("/")==location.length-1)
location = location.substr(0,location.length-1)
var vars = [], hash;
var hashes = location.slice(location.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++){
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}

function parseVimeo(xml){
if (!xml.error) {
/*console.log($(xml).find("rss"));
console.log("parse vimeo, channel: " + $(xml).find("rss").length + " items " + $(xml).find("item").length);
$(xml).find("item").each(function(){
console.log("item");
var url = $(this).find("link").text();
var id = url.substr(url.lastIndexOf("/")+1);
var vimHTML = $(document.createElement('iframe')).attr({src:vidURL, width:w, height:h, frameborder:0});
$("vimeo").append(vimHTML);
});*/

for(var i = 0; i < xml.xmlDocument.getElementsByTagName('item').length; i++){
var entry = xml.xmlDocument.getElementsByTagName('item')[i];
var url = entry.getElementsByTagName("link")[0].textContent;
var id = url.substr(url.lastIndexOf("/")+1);
var vidURL = 'http://player.vimeo.com/video/' + id + '?title=1&amp;byline=0&amp;portrait=0';

var w=440;
var h=300;
var vimHTML = $(document.createElement('iframe')).attr({src:vidURL, width:w, height:h, frameborder:0});
$("#vimeo").append(vimHTML);
}

$("#vimeo iframe").css( "margin-left", function(index, value){
if(hasFlickr){
if(index%2==0){
return "20px";
}else{
return "0px";
}
}else{
if((index+1)%2==0){
return "20px";
}else{
return "0px";
}
}
})
}
}

function parseFlickr(data) {
var added=0;
$.each(data.photos, function(i,photo){
if(i=="photo"){
$(photo).each(function(){
if($(this)[0].tags.indexOf("openframeworks")==-1){
return;
}
/*$("#flickr").append('<img src="http://farm' + $(this)[0].farm + '.staticflickr.com/' + $(this)[0].server + "/" + $(this)[0].id + "_" + $(this)[0].secret + '_z.jpg"/>');*/
var h3 = document.createElement("h3");
var a = document.createElement("a");
var aText = document.createElement("a");
var div = document.createElement("div");
var img = document.createElement("img");
var url = 'http://flickr.com/photos/' + $(this)[0].owner + '/' + $(this)[0].id;
img.src = 'http://farm' + $(this)[0].farm + '.staticflickr.com/' + $(this)[0].server + "/" + $(this)[0].id + "_" + $(this)[0].secret + '_z.jpg'
a.href = url;
aText.href = url;
aText.className="flickrTitle";
h3.appendChild(document.createTextNode(Encoder.htmlDecode($(this)[0].title)));
a.appendChild(img);
a.className = "img";
aText.appendChild(h3)
div.appendChild(a);
div.appendChild(aText);
div.className="imgContainer";
$("#flickr").append(div);
added++;
if(added==20) return false;
});
}
});
$('#flickr').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
}


function parseXML(xml){
member = $(xml).find("member");
$("#user").append("<h1>"+$(member).find("name").text());
$("#user").append('<img src="'+$(member).find("image").text()+'"/>');
$("#user").append('<p><a href="'+$(member).find("website").text()+'">'+$(member).find("website").text()+'</a></p>');

if($(member).find("twitter").text() != ""){
$(".tweet").prepend("<h3>twitter</h3>");
$(".tweets").tweet({
avatar_size: 32,
count: 4,
username: $(member).find("twitter").text(),
loading_text: "searching twitter...",
template: "{avatar} {text}"
});
}

if($(member).find("github").text() != ""){
var feedGithub = new google.feeds.Feed("https://github.com/" + $(member).find("github").text() + ".atom");
feedGithub.setNumEntries(10);
feedGithub.setResultFormat(google.feeds.Feed.XML_FORMAT);
// Calling load sends the request off. It requires a callback function.
feedGithub.load(feedGithubLoaded);
}

if($(member).find("flickr").text() != ""){
hasFlickr = true;
$("#flickr").show();
/*var feedFlickr = new google.feeds.Feed("http://api.flickr.com/services/feeds/photos_public.gne?id="+$(member).find("flickr").text()+"&lang=es-us&format=rss_200");
feedFlickr.setNumEntries(20);
feedFlickr.load(feedFlickrLoaded);*/
$.getJSON('http://api.flickr.com/services/rest/?method=flickr.people.getPublicPhotos&api_key=a5c91e7359870a3f328f7fb8b2ae1337&user_id='+$(member).find("flickr").text()+'&extras=tags&format=json&jsoncallback=?', parseFlickr);
}

if($(member).find("vimeo").text() != ""){
hasVimeo = true;
var feedVimeo = new google.feeds.Feed("http://vimeo.com/" + $(member).find("vimeo").text() + "/videos/rss");
feedVimeo.setNumEntries(5);
feedVimeo.setResultFormat(google.feeds.Feed.XML_FORMAT);
feedVimeo.load(parseVimeo);
}

if(hasVimeo || hasFlickr){
$("#media").show();
}
}

$(document).ready(
function(){
$("#flickr").hide();
$("#media").hide();
$.ajax({
type: "GET",
url: "http://forum.openframeworks.cc/chris_test/getUser.php?user="+getUrlVars()["user"],
//dataType: "xml",
success: parseXML
});
});
134 changes: 134 additions & 0 deletions js/socialwidgets.js
View file
@@ -0,0 +1,134 @@
google.load("feeds", "1");

// Our callback function, for when a feed is loaded.
function feedGithubLoaded(result) {
if (!result.error) {
// Grab the container we will put the results into
var container = document.getElementById("github");
container.innerHTML = '<h3>github</h3>';

// Loop through the feeds, putting the titles onto the page.
// Check out the result object for a list of properties returned in each entry.
// http://code.google.com/apis/ajaxfeeds/documentation/reference.html#JSON
var ul = document.createElement("ul");
var totalElements = 0;
for (var i = 0; i < result.xmlDocument.getElementsByTagName('entry').length && totalElements<4; i++) {
var entry = result.xmlDocument.getElementsByTagName('entry')[i];
var li = document.createElement("li");
var a = document.createElement("a");
var img = document.createElement("img");
var div = document.createElement("div");
div.className="github_avatar";
img.src = entry.getElementsByTagNameNS("*","thumbnail")[0].getAttribute("url");
a.href = entry.getElementsByTagName("link")[0].getAttribute("href");
var title = entry.getElementsByTagName("title")[0].textContent;
if(title.indexOf("Merge") == 0){
continue
}
a.appendChild(document.createTextNode(title));
//a.appendChild(document.createTextNode(entry.getElementsByTagNameNS("*","thumbnail")[0].getAttribute("url")));
/*for( p in entry.getElementsByTagName("link")){
a.appendChild(document.createTextNode(p.tagName));
a.appendChild(document.createElement("br"));
}*/
//a.appendChild(document.createTextNode(entry.textContent));
div.appendChild(img);
li.appendChild(div);
li.appendChild(a);
li.appendChild(document.createElement("br"));
//li.appendChild(document.createTextNode(entry.getElementsByTagName("updated")[0].textContent));
ul.appendChild(li);
totalElements++;
}
container.appendChild(ul);
}
}

// Our callback function, for when a feed is loaded.
function feedForumLoaded(result) {
if (!result.error) {
// Grab the container we will put the results into
var container = document.getElementById("forum");
container.innerHTML = '<h3>forum</h3>';



// Loop through the feeds, putting the titles onto the page.
// Check out the result object for a list of properties returned in each entry.
// http://code.google.com/apis/ajaxfeeds/documentation/reference.html#JSON
var ul = document.createElement("ul");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var li = document.createElement("li");
var a = document.createElement("a");
a.href = entry.link;
a.appendChild(document.createTextNode(Encoder.htmlDecode(entry.author) + ": " + Encoder.htmlDecode(entry.title)));
li.appendChild(a);
li.appendChild(document.createElement("br"));
li.appendChild(document.createTextNode(Encoder.htmlDecode(entry.contentSnippet.substr(0,100)+"...")));
ul.appendChild(li);
}
container.appendChild(ul);
}
}

// Our callback function, for when a feed is loaded.
function feedFlickrLoaded(result) {
if (!result.error) {
// Grab the container we will put the results into
var container = document.getElementById("flickr");
container.innerHTML = '';

// Loop through the feeds, putting the titles onto the page.
// Check out the result object for a list of properties returned in each entry.
// http://code.google.com/apis/ajaxfeeds/documentation/reference.html#JSON
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
if(entry["mediaGroups"]==undefined || entry.mediaGroups.length<1 || entry.mediaGroups[0].length < 1 || ("" + entry.mediaGroups[0].contents[0].type).indexOf("image")!=0){
console.log("entry with no media " + entry.mediaGroups[0].contents[0].type);
continue;
}
var h3 = document.createElement("h3");
var a = document.createElement("a");
var aText = document.createElement("a");
var div = document.createElement("div");
var img = document.createElement("img");
a.href = entry.link;
aText.href = entry.link;
aText.className="flickrTitle";
h3.appendChild(document.createTextNode(Encoder.htmlDecode(entry.title + " by " + entry.author.substr(entry.author.indexOf('(')+1, entry.author.indexOf(')')-entry.author.indexOf('(')-1))))
a.appendChild(img);
a.className = "img";
aText.appendChild(h3)
div.appendChild(a);
div.appendChild(aText);
div.className="imgContainer";
img.src = entry.mediaGroups[0].contents[0].url;

container.appendChild(div);
}
}
$('#flickr').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
}

// Our callback function, for when a feed is loaded.
function feedVimeoLoaded(result) {
if (!result.error && result.xmlDocument.getElementsByTagName('item').length>0) {
// Grab the container we will put the results into
var container = document.getElementById("vimeo");
container.innerHTML = '';
var numEntry = Math.floor(Math.random()*result.xmlDocument.getElementsByTagName('item').length)
var entry = result.xmlDocument.getElementsByTagName('item')[numEntry];
var url = entry.getElementsByTagName("link")[0].textContent;
var id = url.substr(url.lastIndexOf("/")+1);
var vidURL = 'http://player.vimeo.com/video/' + id + '?title=1&amp;byline=0&amp;portrait=0';

var w=440;
var h=300;

var vimHTML = $(document.createElement('iframe')).attr({src:vidURL, width:w, height:h, frameborder:0});
$('#vimeo').append(vimHTML);
}
}

0 comments on commit 0bb2f1f

Please sign in to comment.