Browse Source

Added storify as source and added ability to use instagram, frog, and twitpic as media.

pull/127/head
Zach Wise 13 years ago
parent
commit
996f12d1f8
  1. 48
      examples/example_storify.html
  2. 813
      source/js/Media/VMM.ExternalAPI.js
  3. 163
      source/js/Media/VMM.Media.js
  4. 193
      source/js/Media/VMM.MediaElement.js
  5. 397
      source/js/VMM.Timeline.DataObj.js

48
examples/example_storify.html

@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Storify Example</title>
<meta name="description" content="TimelineJS example">
<style>
html, body {
height:100%;
padding: 0px;
margin: 0px;
}
#timeline-embed{
margin:0px !important;
border:0px solid #CCC !important;
padding:0px !important;
-webkit-border-radius:0px !important;
-moz-border-radius:0px !important;
border-radius:0px !important;
-moz-box-shadow:0 0px 0px rgba(0, 0, 0, 0.25) !important;
-webkit-box-shadow:0 0px 0px rgba(0, 0, 0, 0.25) !important;
box-shadow:0px 0px 0px rgba(0, 0, 0, 0.25) !important;
}
</style>
</head>
<body>
<!-- BEGIN Timeline Embed -->
<div id="timeline-embed"></div>
<script type="text/javascript">
var timeline_config = {
width: "100%",
height: "100%",
source: 'http://storify.com/zachwise/test',
//font: 'Bevan-PotanoSans', //OPTIONAL
//start_at_end: true, //OPTIONAL
//hash_bookmark: true, //OPTIONAL
css: '../compiled/css/timeline.css', //OPTIONAL
js: '../compiled/js/timeline-min.js' //OPTIONAL
}
</script>
<script type="text/javascript" src="../compiled/js/timeline-embed.js"></script>
<!-- END Timeline Embed -->
</body>
</html>

813
source/js/Media/VMM.ExternalAPI.js

@ -0,0 +1,813 @@
/* External API
================================================== */
if(typeof VMM != 'undefined' && typeof VMM.ExternalAPI == 'undefined') {
VMM.ExternalAPI = {
pushQues: function() {
if (VMM.master_config.googlemaps.active) {
VMM.ExternalAPI.googlemaps.pushQue();
}
if (VMM.master_config.youtube.active) {
VMM.ExternalAPI.youtube.pushQue();
}
if (VMM.master_config.soundcloud.active) {
VMM.ExternalAPI.soundcloud.pushQue();
}
if (VMM.master_config.googledocs.active) {
VMM.ExternalAPI.googledocs.pushQue();
}
if (VMM.master_config.wikipedia.active) {
VMM.ExternalAPI.wikipedia.pushQue();
}
if (VMM.master_config.vimeo.active) {
VMM.ExternalAPI.vimeo.pushQue();
}
},
twitter: {
tweetArray: [],
getHTML: function(id) {
//var the_url = document.location.protocol + "//api.twitter.com/1/statuses/oembed.json?id=" + id+ "&callback=?";
var the_url = "http://api.twitter.com/1/statuses/oembed.json?id=" + id+ "&callback=?";
VMM.getJSON(the_url, VMM.ExternalAPI.twitter.onJSONLoaded);
},
onJSONLoaded: function(d) {
trace("TWITTER JSON LOADED");
var id = d.id;
VMM.attachElement("#"+id, VMM.Util.linkify_with_twitter(d.html) );
},
parseTwitterDate: function(d) {
var date = new Date(Date.parse(d));
/*
var t = d.replace(/(\d{1,2}[:]\d{2}[:]\d{2}) (.*)/, '$2 $1');
t = t.replace(/(\+\S+) (.*)/, '$2 $1');
var date = new Date(Date.parse(t)).toLocaleDateString();
var time = new Date(Date.parse(t)).toLocaleTimeString();
*/
return date;
},
prettyParseTwitterDate: function(d) {
var date = new Date(Date.parse(d));
return VMM.Date.prettyDate(date, true);
},
getTweets: function(tweets) {
var tweetArray = [];
var number_of_tweets = tweets.length;
for(var i = 0; i < tweets.length; i++) {
var twitter_id = "";
/* FIND THE TWITTER ID
================================================== */
if (tweets[i].tweet.match("status\/")) {
twitter_id = tweets[i].tweet.split("status\/")[1];
} else if (tweets[i].tweet.match("statuses\/")) {
twitter_id = tweets[i].tweet.split("statuses\/")[1];
} else {
twitter_id = "";
}
/* FETCH THE DATA
================================================== */
var the_url = "http://api.twitter.com/1/statuses/show.json?id=" + twitter_id + "&include_entities=true&callback=?";
VMM.getJSON(the_url, function(d) {
var tweet = {}
/* FORMAT RESPONSE
================================================== */
var twit = "<div class='twitter'><blockquote><p>";
var td = VMM.Util.linkify_with_twitter(d.text, "_blank");
twit += td;
twit += "</p>";
twit += "— " + d.user.name + " (<a href='https://twitter.com/" + d.user.screen_name + "'>@" + d.user.screen_name + "</a>) <a href='https://twitter.com/" + d.user.screen_name + "/status/" + d.id + "'>" + VMM.ExternalAPI.twitter.prettyParseTwitterDate(d.created_at) + " </a></blockquote></div>";
tweet.content = twit;
tweet.raw = d;
tweetArray.push(tweet);
/* CHECK IF THATS ALL OF THEM
================================================== */
if (tweetArray.length == number_of_tweets) {
var the_tweets = {tweetdata: tweetArray}
VMM.fireEvent(global, "TWEETSLOADED", the_tweets);
}
})
.success(function() { trace("second success"); })
.error(function() { trace("error"); })
.complete(function() { trace("complete"); });
}
},
getTweetSearch: function(tweets, number_of_tweets) {
var _number_of_tweets = 40;
if (number_of_tweets != null && number_of_tweets != "") {
_number_of_tweets = number_of_tweets;
}
var the_url = "http://search.twitter.com/search.json?q=" + tweets + "&rpp=" + _number_of_tweets + "&include_entities=true&result_type=mixed";
var tweetArray = [];
VMM.getJSON(the_url, function(d) {
/* FORMAT RESPONSE
================================================== */
for(var i = 0; i < d.results.length; i++) {
var tweet = {}
var twit = "<div class='twitter'><blockquote><p>";
var td = VMM.Util.linkify_with_twitter(d.results[i].text, "_blank");
twit += td;
twit += "</p>";
twit += "— " + d.results[i].from_user_name + " (<a href='https://twitter.com/" + d.results[i].from_user + "'>@" + d.results[i].from_user + "</a>) <a href='https://twitter.com/" + d.results[i].from_user + "/status/" + d.id + "'>" + VMM.ExternalAPI.twitter.prettyParseTwitterDate(d.results[i].created_at) + " </a></blockquote></div>";
tweet.content = twit;
tweet.raw = d.results[i];
tweetArray.push(tweet);
}
var the_tweets = {tweetdata: tweetArray}
VMM.fireEvent(global, "TWEETSLOADED", the_tweets);
});
},
prettyHTML: function(id, secondary) {
var id = id.toString();
var error_obj = {
twitterid: id
};
var the_url = "http://api.twitter.com/1/statuses/show.json?id=" + id + "&include_entities=true&callback=?";
var twitter_timeout = setTimeout(VMM.ExternalAPI.twitter.notFoundError, 4000, id);
VMM.getJSON(the_url, VMM.ExternalAPI.twitter.formatJSON)
.error(function(jqXHR, textStatus, errorThrown) {
trace("TWITTER error");
trace("TWITTER ERROR: " + textStatus + " " + jqXHR.responseText);
VMM.attachElement("#twitter_"+id, "<p>ERROR LOADING TWEET " + id + "</p>" );
})
.success(function(d) {
clearTimeout(twitter_timeout);
if (secondary) {
VMM.ExternalAPI.twitter.secondaryMedia(d);
}
});
},
notFoundError: function(id) {
trace("TWITTER JSON ERROR TIMEOUT " + id);
VMM.attachElement("#twitter_" + id, "<span class='messege'><p>Error loading tweet: " + id + "</p></span>" );
// CHECK RATE STATUS
VMM.getJSON("http://api.twitter.com/1/account/rate_limit_status.json", function(d) {
trace("REMAINING TWITTER API CALLS " + d.remaining_hits);
trace("TWITTER RATE LIMIT WILL RESET AT " + d.reset_time);
var mes = "";
if (d.remaining_hits == 0) {
mes = "<p>You've reached the maximum number of tweets you can load in an hour.</p>";
mes += "<p>You can view tweets again starting at: <br/>" + d.reset_time + "</p>";
} else {
mes = "<p>Tweet " + id + " was not found.</p>";
}
VMM.attachElement("#twitter_" + id, "<span class='messege'>" + mes + "</span>" );
});
},
formatJSON: function(d) {
var id = d.id_str;
var twit = "<blockquote><p>";
var td = VMM.Util.linkify_with_twitter(d.text, "_blank");
//td = td.replace(/(@([\w]+))/g,"<a href='http://twitter.com/$2' target='_blank'>$1</a>");
//td = td.replace(/(#([\w]+))/g,"<a href='http://twitter.com/#search?q=%23$2' target='_blank'>$1</a>");
twit += td;
twit += "</p></blockquote>";
twit += " <a href='https://twitter.com/" + d.user.screen_name + "/status/" + d.id_str + "' target='_blank' alt='link to original tweet' title='link to original tweet'>" + "<span class='created-at'></span>" + " </a>";
twit += "<div class='vcard author'>";
twit += "<a class='screen-name url' href='https://twitter.com/" + d.user.screen_name + "' data-screen-name='" + d.user.screen_name + "' target='_blank'>";
twit += "<span class='avatar'><img src=' " + d.user.profile_image_url + "' alt=''></span>";
twit += "<span class='fn'>" + d.user.name + "</span>";
twit += "<span class='nickname'>@" + d.user.screen_name + "</span>";
twit += "</a>";
twit += "</div>";
if (typeof d.entities.media != 'undefined') {
if (d.entities.media[0].type == "photo") {
twit += "<img src=' " + d.entities.media[0].media_url + "' alt=''>"
}
}
VMM.attachElement("#twitter_"+id.toString(), twit );
},
},
googlemaps: {
get: function(url, id) {
var timer;
var map_vars = VMM.Util.getUrlVars(url);
var api_key;
if (VMM.master_config.Timeline.api_keys.google != "") {
api_key = VMM.master_config.Timeline.api_keys.google;
} else {
api_key = Aes.Ctr.decrypt(VMM.master_config.api_keys_master.google, VMM.master_config.vp, 256);
}
var map_url = "http://maps.googleapis.com/maps/api/js?key=" + api_key + "&libraries=places&sensor=false&callback=VMM.ExternalAPI.googlemaps.onMapAPIReady";
var map = { url: url, vars: map_vars, id: id };
if (VMM.master_config.googlemaps.active) {
VMM.master_config.googlemaps.que.push(map);
} else {
VMM.master_config.googlemaps.que.push(map);
if (VMM.master_config.googlemaps.api_loaded) {
} else {
VMM.LoadLib.js(map_url, function() {
trace("Google Maps API Library Loaded");
});
}
}
},
create: function(m) {
var map_attribution = "";
var layer;
var map;
function mapProvider(name) {
if (name in VMM.ExternalAPI.googlemaps.map_providers) {
map_attribution = VMM.ExternalAPI.googlemaps.map_attribution[VMM.ExternalAPI.googlemaps.map_providers[name].attribution];
return VMM.ExternalAPI.googlemaps.map_providers[name];
} else {
if (VMM.ExternalAPI.googlemaps.defaultType(name)) {
trace("GOOGLE MAP DEFAULT TYPE");
return google.maps.MapTypeId[name.toUpperCase()];
} else {
trace("Not a maptype: " + name );
}
}
}
google.maps.VeriteMapType = function(name) {
if (VMM.ExternalAPI.googlemaps.defaultType(name)) {
return google.maps.MapTypeId[name.toUpperCase()];
} else {
var provider = mapProvider(name);
return google.maps.ImageMapType.call(this, {
"getTileUrl": function(coord, zoom) {
var index = (zoom + coord.x + coord.y) % VMM.ExternalAPI.googlemaps.map_subdomains.length;
return [
provider.url
.replace("{S}", VMM.ExternalAPI.googlemaps.map_subdomains[index])
.replace("{Z}", zoom)
.replace("{X}", coord.x)
.replace("{Y}", coord.y)
.replace("{z}", zoom)
.replace("{x}", coord.x)
.replace("{y}", coord.y)
];
},
"tileSize": new google.maps.Size(256, 256),
"name": name,
"minZoom": provider.minZoom,
"maxZoom": provider.maxZoom
});
}
};
google.maps.VeriteMapType.prototype = new google.maps.ImageMapType("_");
/* Make the Map
================================================== */
if (type.of(VMM.master_config.Timeline.maptype) == "string") {
if (VMM.ExternalAPI.googlemaps.defaultType(VMM.master_config.Timeline.maptype)) {
layer = google.maps.MapTypeId[VMM.master_config.Timeline.maptype.toUpperCase()];
} else {
layer = VMM.master_config.Timeline.maptype;
}
} else {
layer = "toner";
}
var location = new google.maps.LatLng(41.875696,-87.624207);
var latlong;
var zoom = 11;
var has_location = false;
var has_zoom = false;
var map_bounds;
if (type.of(VMM.Util.getUrlVars(m.url)["ll"]) == "string") {
has_location = true;
latlong = VMM.Util.getUrlVars(m.url)["ll"].split(",");
location = new google.maps.LatLng(parseFloat(latlong[0]),parseFloat(latlong[1]));
} else if (type.of(VMM.Util.getUrlVars(m.url)["sll"]) == "string") {
latlong = VMM.Util.getUrlVars(m.url)["sll"].split(",");
location = new google.maps.LatLng(parseFloat(latlong[0]),parseFloat(latlong[1]));
}
if (type.of(VMM.Util.getUrlVars(m.url)["z"]) == "string") {
has_zoom = true;
zoom = parseFloat(VMM.Util.getUrlVars(m.url)["z"]);
}
var map_options = {
zoom: zoom,
disableDefaultUI: true,
mapTypeControl: false,
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL,
position: google.maps.ControlPosition.TOP_RIGHT
},
center: location,
mapTypeId: layer,
mapTypeControlOptions: {
mapTypeIds: [layer]
}
}
var unique_map_id = m.id.toString() + "_gmap";
VMM.attachElement("#" + m.id, "<div class='google-map' id='" + unique_map_id + "' style='width=100%;height=100%;'></div>");
var map = new google.maps.Map(document.getElementById(unique_map_id), map_options);
if (VMM.ExternalAPI.googlemaps.defaultType(VMM.master_config.Timeline.maptype)) {
} else {
map.mapTypes.set(layer, new google.maps.VeriteMapType(layer));
// ATTRIBUTION
var map_attribution_html = "<div class='map-attribution'><div class='attribution-text'>" + map_attribution + "</div></div>";
VMM.appendElement("#"+unique_map_id, map_attribution_html);
}
loadKML();
// KML
function loadKML() {
var kml_url = m.url + "&output=kml";
kml_url = kml_url.replace("&output=embed", "");
var kml_layer = new google.maps.KmlLayer(kml_url, {preserveViewport:true});
var infowindow = new google.maps.InfoWindow();
kml_layer.setMap(map);
google.maps.event.addListenerOnce(kml_layer, "defaultviewport_changed", function() {
map.fitBounds(kml_layer.getDefaultViewport() );
if (has_location) {
map.panTo(location);
}
if (has_zoom) {
map.setZoom(zoom);
}
});
google.maps.event.addListener(kml_layer, 'click', function(kmlEvent) {
var text = kmlEvent.featureData.description;
showInfoWindow(text);
function showInfoWindow(c) {
infowindow.setContent(c);
infowindow.open(map);
}
});
}
},
pushQue: function() {
for(var i = 0; i < VMM.master_config.googlemaps.que.length; i++) {
VMM.ExternalAPI.googlemaps.create(VMM.master_config.googlemaps.que[i]);
}
VMM.master_config.googlemaps.que = [];
},
onMapAPIReady: function() {
VMM.master_config.googlemaps.map_active = true;
VMM.master_config.googlemaps.places_active = true;
VMM.ExternalAPI.googlemaps.onAPIReady();
},
onPlacesAPIReady: function() {
VMM.master_config.googlemaps.places_active = true;
VMM.ExternalAPI.googlemaps.onAPIReady();
},
onAPIReady: function() {
if (!VMM.master_config.googlemaps.active) {
if (VMM.master_config.googlemaps.map_active && VMM.master_config.googlemaps.places_active) {
VMM.master_config.googlemaps.active = true;
VMM.ExternalAPI.googlemaps.pushQue();
}
}
},
defaultType: function(name) {
if (name.toLowerCase() == "satellite" || name.toLowerCase() == "hybrid" || name.toLowerCase() == "terrain" || name.toLowerCase() == "roadmap") {
return true;
} else {
return false;
}
},
map_subdomains: ["", "a.", "b.", "c.", "d."],
map_attribution: {
"stamen": "Map tiles by <a href='http://stamen.com'>Stamen Design</a>, under <a href='http://creativecommons.org/licenses/by/3.0'>CC BY 3.0</a>. Data by <a href='http://openstreetmap.org'>OpenStreetMap</a>, under <a href='http://creativecommons.org/licenses/by-sa/3.0'>CC BY SA</a>.",
"apple": "Map data &copy; 2012 Apple, Imagery &copy; 2012 Apple"
},
map_providers: {
"toner": {
"url": "http://{S}tile.stamen.com/toner/{Z}/{X}/{Y}.png",
"minZoom": 0,
"maxZoom": 20,
"attribution": "stamen"
},
"toner-lines": {
"url": "http://{S}tile.stamen.com/toner-lines/{Z}/{X}/{Y}.png",
"minZoom": 0,
"maxZoom": 20,
"attribution": "stamen"
},
"toner-labels": {
"url": "http://{S}tile.stamen.com/toner-labels/{Z}/{X}/{Y}.png",
"minZoom": 0,
"maxZoom": 20,
"attribution": "stamen"
},
"sterrain": {
"url": "http://{S}tile.stamen.com/terrain/{Z}/{X}/{Y}.jpg",
"minZoom": 4,
"maxZoom": 20,
"attribution": "stamen"
},
"apple": {
"url": "http://gsp2.apple.com/tile?api=1&style=slideshow&layers=default&lang=en_US&z={z}&x={x}&y={y}&v=9",
"minZoom": 4,
"maxZoom": 14,
"attribution": "apple"
},
"watercolor": {
"url": "http://{S}tile.stamen.com/watercolor/{Z}/{X}/{Y}.jpg",
"minZoom": 3,
"maxZoom": 16,
"attribution": "stamen"
}
},
},
googledocs: {
get: function(url, id) {
var doc = {url: url, id: id};
VMM.master_config.googledocs.que.push(doc);
VMM.master_config.googledocs.active = true;
},
create: function(doc) {
var mediaElem = "";
if (doc.url.match(/docs.google.com/i)) {
mediaElem = "<iframe class='doc' frameborder='0' width='100%' height='100%' src='" + doc.url + "&amp;embedded=true'></iframe>";
} else {
mediaElem = "<iframe class='doc' frameborder='0' width='100%' height='100%' src='" + "http://docs.google.com/viewer?url=" + doc.url + "&amp;embedded=true'></iframe>";
}
VMM.attachElement("#"+doc.id, mediaElem);
},
pushQue: function() {
for(var i = 0; i < VMM.master_config.googledocs.que.length; i++) {
VMM.ExternalAPI.googledocs.create(VMM.master_config.googledocs.que[i]);
}
VMM.master_config.googledocs.que = [];
}
},
flickr: {
get: function(mid, id) {
var api_key;
if (VMM.master_config.Timeline.api_keys.flickr != "") {
api_key = VMM.master_config.Timeline.api_keys.flickr;
} else {
api_key = Aes.Ctr.decrypt(VMM.master_config.api_keys_master.flickr, VMM.master_config.vp, 256)
}
var the_url = "http://api.flickr.com/services/rest/?method=flickr.photos.getSizes&api_key=" + api_key + "&photo_id=" + mid + "&format=json&jsoncallback=?";
VMM.getJSON(the_url, VMM.ExternalAPI.flickr.create);
},
create: function(d) {
var flickr_id = d.sizes.size[0].url.split("photos\/")[1].split("/")[1];
var id = "flickr_" + flickr_id;
var flickr_large_id = id + "_large";
var flickr_thumb_id = id + "_thumb";
var flickr_img_size, flickr_img_thumb, flickr_size_found = false;
var flickr_best_size = "Large";
flickr_best_size = VMM.ExternalAPI.flickr.sizes(VMM.master_config.sizes.api.height);
for(var i = 0; i < d.sizes.size.length; i++) {
if (d.sizes.size[i].label == flickr_best_size) {
flickr_size_found = true;
flickr_img_size = d.sizes.size[i].source;
}
}
if (!flickr_size_found) {
flickr_img_size = d.sizes.size[d.sizes.size.length - 1].source;
}
flickr_img_thumb = d.sizes.size[0].source;
VMM.Lib.attr("#"+flickr_large_id, "src", flickr_img_size);
VMM.attachElement("#"+flickr_thumb_id, "<img src='" + flickr_img_thumb + "'>");
},
sizes: function(s) {
var _size = "";
if (s <= 75) {
_size = "Thumbnail";
} else if (s <= 180) {
_size = "Small";
} else if (s <= 240) {
_size = "Small 320";
} else if (s <= 375) {
_size = "Medium";
} else if (s <= 480) {
_size = "Medium 640";
} else if (s <= 600) {
_size = "Medium 800";
} else {
_size = "Large";
}
return _size;
}
},
instagram: {
get: function(mid, thumb) {
if (thumb) {
return "http://instagr.am/p/" + mid + "/media/?size=t";
} else {
return "http://instagr.am/p/" + mid + "/media/?size=" + VMM.ExternalAPI.instagram.sizes(VMM.master_config.sizes.api.height);
}
},
sizes: function(s) {
var _size = "";
if (s <= 150) {
_size = "t";
} else if (s <= 306) {
_size = "m";
} else {
_size = "l";
}
return _size;
}
},
soundcloud: {
get: function(url, id) {
var sound = {url: url, id: id};
VMM.master_config.soundcloud.que.push(sound);
VMM.master_config.soundcloud.active = true;
},
create: function(sound) {
var the_url = "http://soundcloud.com/oembed?url=" + sound.url + "&format=js&callback=?";
VMM.getJSON(the_url, function(d) {
VMM.attachElement("#"+sound.id, d.html);
});
},
pushQue: function() {
for(var i = 0; i < VMM.master_config.soundcloud.que.length; i++) {
VMM.ExternalAPI.soundcloud.create(VMM.master_config.soundcloud.que[i]);
}
VMM.master_config.soundcloud.que = [];
},
},
wikipedia: {
get: function(url, id) {
var api_obj = {url: url, id: id};
VMM.master_config.wikipedia.que.push(api_obj);
VMM.master_config.wikipedia.active = true;
},
create: function(api_obj) {
var the_url = "http://" + VMM.master_config.language.api.wikipedia + ".wikipedia.org/w/api.php?action=query&prop=extracts&redirects=&titles=" + api_obj.url + "&exintro=1&format=json&callback=?";
if ( VMM.Browser.browser == "Explorer" && parseInt(VMM.Browser.version, 10) >= 7 && window.XDomainRequest) {
var temp_text = "<h4><a href='http://" + VMM.master_config.language.api.wikipedia + ".wikipedia.org/wiki/" + api_obj.url + "' target='_blank'>" + api_obj.url + "</a></h4>";
temp_text += "<span class='wiki-source'>" + VMM.master_config.language.messages.wikipedia + "</span>";
temp_text += "<p>Wikipedia entry unable to load using Internet Explorer 8 or below.</p>";
VMM.attachElement("#"+api_obj.id, temp_text );
}
VMM.getJSON(the_url, function(d) {
if (d.query) {
var wiki_extract = VMM.Util.getObjectAttributeByIndex(d.query.pages, 0).extract;
var wiki_title = VMM.Util.getObjectAttributeByIndex(d.query.pages, 0).title;
var _wiki = "";
var wiki_text = "";
var wiki_text_array = wiki_extract.split("<p>");
var wiki_number_of_paragraphs = 1;
for(var i = 0; i < wiki_text_array.length; i++) {
if (i+1 <= wiki_number_of_paragraphs && i+1 < wiki_text_array.length) {
wiki_text += "<p>" + wiki_text_array[i+1];
}
}
_wiki = "<h4><a href='http://" + VMM.master_config.language.api.wikipedia + ".wikipedia.org/wiki/" + wiki_title + "' target='_blank'>" + wiki_title + "</a></h4>";
_wiki += "<span class='wiki-source'>" + VMM.master_config.language.messages.wikipedia + "</span>";
_wiki += VMM.Util.linkify_wikipedia(wiki_text);
if (wiki_extract.match("REDIRECT")) {
} else {
VMM.attachElement("#"+api_obj.id, _wiki );
}
}
});
},
pushQue: function() {
trace("WIKIPEDIA PUSH QUE");
for(var i = 0; i < VMM.master_config.wikipedia.que.length; i++) {
VMM.ExternalAPI.wikipedia.create(VMM.master_config.wikipedia.que[i]);
}
VMM.master_config.wikipedia.que = [];
},
},
youtube: {
get: function(id) {
var url = "http://gdata.youtube.com/feeds/api/videos/" + id + "?v=2&alt=jsonc&callback=?";
if (VMM.master_config.youtube.active) {
VMM.master_config.youtube.que.push(id);
} else {
VMM.master_config.youtube.que.push(id);
if (!VMM.master_config.youtube.api_loaded) {
VMM.LoadLib.js('http://www.youtube.com/player_api', function() {
trace("YouTube API Library Loaded");
});
}
}
// THUMBNAIL
VMM.getJSON(url, VMM.ExternalAPI.youtube.createThumb);
},
create: function(id) {
var p = {
active: false,
player: {},
name: 'youtube_'+id,
playing: false
};
p.player['youtube_'+id] = new YT.Player('youtube_'+id, {
height: '390',
width: '640',
playerVars: {
enablejsapi: 1,
color: 'white',
showinfo: 0,
theme: 'light',
rel: 0
},
videoId: id,
events: {
'onReady': VMM.ExternalAPI.youtube.onPlayerReady,
'onStateChange': VMM.ExternalAPI.youtube.onStateChange
}
});
VMM.master_config.youtube.array.push(p);
},
createThumb: function(d) {
if (typeof d.data != 'undefined') {
var thumb_id = "youtube_" + d.data.id + "_thumb";
VMM.attachElement("#" + thumb_id, "<img src='" + d.data.thumbnail.sqDefault + "'>");
}
},
pushQue: function() {
for(var i = 0; i < VMM.master_config.youtube.que.length; i++) {
VMM.ExternalAPI.youtube.create(VMM.master_config.youtube.que[i]);
}
VMM.master_config.youtube.que = [];
},
onAPIReady: function() {
VMM.master_config.youtube.active = true;
VMM.ExternalAPI.youtube.pushQue();
},
stopPlayers: function() {
for(var i = 0; i < VMM.master_config.youtube.array.length; i++) {
if (VMM.master_config.youtube.array[i].playing) {
var the_name = VMM.master_config.youtube.array[i].name;
VMM.master_config.youtube.array[i].player[the_name].stopVideo();
}
}
},
onStateChange: function(e) {
for(var i = 0; i < VMM.master_config.youtube.array.length; i++) {
var the_name = VMM.master_config.youtube.array[i].name;
if (VMM.master_config.youtube.array[i].player[the_name] == e.target) {
if (e.data == YT.PlayerState.PLAYING) {
VMM.master_config.youtube.array[i].playing = true;
}
}
}
},
onPlayerReady: function(e) {
}
},
vimeo: {
get: function(id) {
VMM.master_config.vimeo.que.push(id);
VMM.master_config.vimeo.active = true;
},
create: function(d) {
trace("VIMEO CREATE");
// THUMBNAIL
var url = "http://vimeo.com/api/v2/video/" + d + ".json";
VMM.getJSON(url, VMM.ExternalAPI.vimeo.createThumb);
},
createThumb: function(d) {
trace("VIMEO CREATE THUMB");
var thumb_id = "vimeo_" + d[0].id + "_thumb";
VMM.attachElement("#" + thumb_id, "<img src='" + d[0].thumbnail_small + "'>");
},
pushQue: function() {
for(var i = 0; i < VMM.master_config.vimeo.que.length; i++) {
VMM.ExternalAPI.vimeo.create(VMM.master_config.vimeo.que[i]);
}
VMM.master_config.vimeo.que = [];
}
}
}
}
/* YOUTUBE API READY
Can't find a way to customize this callback and keep it in the VMM namespace
Youtube wants it to be this function.
================================================== */
function onYouTubePlayerAPIReady() {
trace("GLOBAL YOUTUBE API CALLED")
VMM.ExternalAPI.youtube.onAPIReady();
}

163
source/js/Media/VMM.Media.js

@ -0,0 +1,163 @@
/* Media
================================================== */
if(typeof VMM != 'undefined' && typeof VMM.Media == 'undefined') {
// something = new VMM.Media(parent, w, h, {thedata});
VMM.Media = function(parent, w, h, thedata) {
/* PRIVATE VARS
================================================== */
var data = {}; // HOLDS DATA
var _valid = false;
var config = {
width: 720,
height: 400,
content_width: 720,
content_height: 400,
ease: "easeInOutExpo",
duration: 1000,
spacing: 15
};
/* ELEMENTS
================================================== */
var $media = "";
var $container = "";
var $mediacontainer = "";
var $mediaelement = "";
var layout = parent; // expecting media div
if (w != null && w != "") {config.width = w};
if (h != null && h != "") {config.height = h};
/*
if (typeof thedata != "undefined") {
data = thedata;
this.init(data);
}
*/
/* PUBLIC FUNCTIONS
================================================== */
this.init = function(d) {
if(typeof d != 'undefined') {
this.setData(d);
} else {
trace("WAITING ON DATA");
}
};
var build = function(media, caption, credit) {
$media = VMM.appendAndGetElement(layout, "<div>", "media");
$container = VMM.appendAndGetElement($media, "<div>", "container");
$mediacontainer = VMM.appendAndGetElement($container, "<div>", "media-container");
if (data.media != null && data.media != "") {
_valid = true;
var m = {};
m = VMM.MediaType(data.media); //returns an object with .type and .id
if (m.type == "image") {
VMM.appendElement($mediacontainer, "<img src='" + m.id + "'>");
} else if (m.type == "youtube") {
VMM.appendElement($mediacontainer, "<iframe frameborder='0' src='http://www.youtube.com/embed/" + m.id + "?&rel=0&theme=light&showinfo=0&hd=1&autohide=0&color=white' allowfullscreen>");
} else if (m.type == "vimeo") {
VMM.appendElement($mediacontainer, "<iframe frameborder='0' src='http://player.vimeo.com/video/" + m.id + "?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff'>");
} else {
}
// CREDIT
if (data.credit != null && data.credit != "") {
VMM.appendElement($container, VMM.createElement("div", data.credit, "credit"));
}
// CAPTION
if (data.caption != null && data.caption != "") {
VMM.appendElement($container, VMM.createElement("div", data.caption, "caption"));
}
}
};
/* GETTERS AND SETTERS
================================================== */
this.setData = function(d) {
if(typeof d != 'undefined') {
data = d;
build();
} else{
trace("NO DATA");
}
};
/* RESIZE
================================================== */
function reSize() {
}
}
// Less expensive to use prototype
VMM.Media.prototype.height = function(h) {
if (h != null && h != "") {
config.height = h;
reSize();
} else {
return config.height;
}
};
VMM.Media.prototype.width = function(w) {
if (w != null && w != "") {
config.width = w;
reSize();
} else {
return config.width;
}
};
/* GETTERS AND SETTERS
================================================== */
VMM.Media.prototype.getData = function() {
return data;
};
VMM.Media.prototype.setConfig = function(d) {
if(typeof d != 'undefined') {
config = d;
} else{
trace("NO CONFIG DATA");
}
};
VMM.Media.prototype.getConfig = function() {
return config;
};
VMM.Media.prototype.setSize = function(w, h) {
if (w != null) {config.width = w};
if (h != null) {config.height = h};
if (_active) {
reSize();
}
}
VMM.Media.prototype.active = function() {
return _active;
};
}

193
source/js/Media/VMM.MediaElement.js

@ -0,0 +1,193 @@
/* MediaElement
================================================== */
if(typeof VMM != 'undefined' && typeof VMM.MediaElement == 'undefined') {
VMM.MediaElement = ({
init: function() {
return this;
},
thumbnail: function(data, w, h) {
_w = 16;
_h = 24;
if (w != null && w != "") {_w = w};
if (h != null && h != "") {_h = h};
if (data.media != null && data.media != "") {
_valid = true;
var mediaElem = "";
var m = VMM.MediaType(data.media); //returns an object with .type and .id
// CREATE MEDIA CODE
if (m.type == "image") {
//mediaElem = "<div class='thumbnail thumb-photo'><img src='" + m.id + "' width='" + _w + "px' height='" + _h + "px'></div>";
mediaElem = "<div class='thumbnail thumb-photo'></div>";
return mediaElem;
} else if (m.type == "flickr") {
mediaElem = "<div class='thumbnail thumb-photo' id='flickr_" + m.id + "_thumb'></div>";
return mediaElem;
} else if (m.type == "instagram") {
mediaElem = "<div class='thumbnail thumb-instagram' id='instagram_" + m.id + "_thumb'><img src='" + VMM.ExternalAPI.instagram.get(m.id, true) + "'></div>";
return mediaElem;
} else if (m.type == "youtube") {
mediaElem = "<div class='thumbnail thumb-youtube' id='youtube_" + m.id + "_thumb'></div>";
return mediaElem;
} else if (m.type == "googledoc") {
mediaElem = "<div class='thumbnail thumb-document'></div>";
return mediaElem;
} else if (m.type == "vimeo") {
mediaElem = "<div class='thumbnail thumb-vimeo' id='vimeo_" + m.id + "_thumb'></div>";
return mediaElem;
} else if (m.type == "dailymotion") {
mediaElem = "<div class='thumbnail thumb-video'></div>";
return mediaElem;
} else if (m.type == "twitter"){
mediaElem = "<div class='thumbnail thumb-twitter'></div>";
return mediaElem;
} else if (m.type == "twitter-ready") {
mediaElem = "<div class='thumbnail thumb-twitter'></div>";
return mediaElem;
} else if (m.type == "soundcloud") {
mediaElem = "<div class='thumbnail thumb-audio'></div>";
return mediaElem;
} else if (m.type == "google-map") {
mediaElem = "<div class='thumbnail thumb-map'></div>";
return mediaElem;
} else if (m.type == "wikipedia") {
mediaElem = "<div class='thumbnail thumb-wikipedia'></div>";
return mediaElem;
} else if (m.type == "storify") {
mediaElem = "<div class='thumbnail thumb-storify'></div>";
return mediaElem;
} else if (m.type == "quote") {
mediaElem = "<div class='thumbnail thumb-quote'></div>";
return mediaElem;
} else if (m.type == "unknown") {
if (m.id.match("blockquote")) {
mediaElem = "<div class='thumbnail thumb-quote'></div>";
} else {
mediaElem = "<div class='thumbnail thumb-plaintext'></div>";
}
return mediaElem;
} else if (m.type == "website") {
mediaElem = "<div class='thumbnail thumb-website'></div>";
//mediaElem = "<div class='thumbnail'><img src='http://api.snapito.com/free/sc?url=" + m.id + "' width='" + _w + "px' height='" + _h + "px'></div>";
return mediaElem;
} else {
mediaElem = "<div class='thumbnail thumb-plaintext'></div>";
return mediaElem;
}
}
},
create: function(data, secondary) {
//$mediacontainer = element;
var _valid = false;
if (data.media != null && data.media != "") {
var mediaElem = "", captionElem = "", creditElem = "", _id = "", isTextMedia = false;
var m = VMM.MediaType(data.media); //returns an object with .type and .id
_valid = true;
// CREDIT
if (data.credit != null && data.credit != "") {
creditElem = "<div class='credit'>" + VMM.Util.linkify_with_twitter(data.credit, "_blank") + "</div>";
}
// CAPTION
if (data.caption != null && data.caption != "") {
captionElem = "<div class='caption'>" + VMM.Util.linkify_with_twitter(data.caption, "_blank") + "</div>";
}
// IMAGE
if (m.type == "image") {
mediaElem = "<div class='media-image media-shadow'><img src='" + m.id + "' class='media-image'></div>";
// FLICKR
} else if (m.type == "flickr") {
_id = "flickr_" + m.id;
mediaElem = "<div class='media-image media-shadow'><a href='" + m.link + "' target='_blank'><img id='" + _id + "_large" + "'></a></div>";
VMM.ExternalAPI.flickr.get(m.id, "#" + _id);
// INSTAGRAM
} else if (m.type == "instagram") {
_id = "flickr_" + m.id;
mediaElem = "<div class='media-image media-shadow'><a href='" + m.link + "' target='_blank'><img src='" + VMM.ExternalAPI.instagram.get(m.id) + "'></a></div>";
// GOOGLE DOCS
} else if (m.type == "googledoc") {
_id = "googledoc_" + VMM.Util.unique_ID(5);
mediaElem = "<div class='media-frame media-shadow doc' id='" + _id + "'><span class='messege'><p>Loading Document</p></span></div>";
VMM.ExternalAPI.googledocs.get(m.id, _id);
// YOUTUBE
} else if (m.type == "youtube") {
mediaElem = "<div class='media-shadow'><div class='media-frame video youtube' id='youtube_" + m.id + "'><span class='messege'><p>Loading YouTube video</p></span></div></div>";
VMM.ExternalAPI.youtube.get(m.id);
// VIMEO
} else if (m.type == "vimeo") {
mediaElem = "<div class='media-shadow'><iframe class='media-frame video vimeo' autostart='false' frameborder='0' width='100%' height='100%' src='http://player.vimeo.com/video/" + m.id + "?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff'></iframe></div>";
VMM.ExternalAPI.vimeo.get(m.id);
// DAILYMOTION
} else if (m.type == "dailymotion") {
mediaElem = "<div class='media-shadow'><iframe class='media-frame video dailymotion' autostart='false' frameborder='0' width='100%' height='100%' src='http://www.dailymotion.com/embed/video/" + m.id + "'></iframe></div>";
// TWITTER
} else if (m.type == "twitter"){
mediaElem = "<div class='twitter' id='" + "twitter_" + m.id + "'><span class='messege'><p>Loading Tweet</p></span></div>";
isTextMedia = true;
VMM.ExternalAPI.twitter.prettyHTML(m.id, secondary);
// TWITTER
} else if (m.type == "twitter-ready") {
isTextMedia = true;
mediaElem = m.id;
// SOUNDCLOUD
} else if (m.type == "soundcloud") {
_id = "soundcloud_" + VMM.Util.unique_ID(5);
mediaElem = "<div class='media-frame media-shadow soundcloud' id='" + _id + "'><span class='messege'><p>Loading Sound</p></span></div>";
VMM.ExternalAPI.soundcloud.get(m.id, _id);
// GOOGLE MAPS
} else if (m.type == "google-map") {
_id = "googlemap_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='media-frame media-shadow map' id='" + _id + "'><span class='messege'><p>Loading Map</p></span></div>";
VMM.ExternalAPI.googlemaps.get(m.id, _id);
// WIKIPEDIA
} else if (m.type == "wikipedia") {
_id = "wikipedia_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='wikipedia' id='" + _id + "'><span class='messege'><p>Loading Wikipedia</p></span></div>";
isTextMedia = true;
VMM.ExternalAPI.wikipedia.get(m.id, _id);
// STORIFY
} else if (m.type == "storify") {
isTextMedia = true;
mediaElem = "<div class='plain-text-quote'>" + m.id + "</div>";
// QUOTE
} else if (m.type == "quote") {
isTextMedia = true;
mediaElem = "<div class='plain-text-quote'>" + m.id + "</div>";
// UNKNOWN
} else if (m.type == "unknown") {
trace("NO KNOWN MEDIA TYPE FOUND TRYING TO JUST PLACE THE HTML");
isTextMedia = true;
mediaElem = "<div class='plain-text'><div class='container'>" + VMM.Util.properQuotes(m.id) + "</div></div>";
// WEBSITE
} else if (m.type == "website") {
//mediaElem = "<div class='media-shadow'><iframe class='media-frame website' frameborder='0' autostart='false' width='100%' height='100%' scrolling='yes' marginheight='0' marginwidth='0' src='" + m.id + "'></iframe></div>";
//mediaElem = "<a href='" + m.id + "' target='_blank'>" + "<img src='http://api.snapito.com/free/lc?url=" + m.id + "'></a>";
mediaElem = "<div class='media-shadow website'><a href='" + m.id + "' target='_blank'>" + "<img src='http://api1.thumbalizr.com/?url=" + m.id.replace(/[\./]$/g, "") + "&width=300' class='media-image'></a></div>";
// NO MATCH
} else {
trace("NO KNOWN MEDIA TYPE FOUND");
trace(m.type);
}
// WRAP THE MEDIA ELEMENT
mediaElem = "<div class='media-container' >" + mediaElem + creditElem + captionElem + "</div>";
// RETURN
if (isTextMedia) {
return "<div class='text-media'><div class='media-wrapper'>" + mediaElem + "</div></div>";
} else {
return "<div class='media-wrapper'>" + mediaElem + "</div>";
}
};
}
}).init();
}

397
source/js/VMM.Timeline.DataObj.js

@ -12,24 +12,24 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
getData: function(raw_data) {
VMM.Timeline.DataObj.data_obj = {};
data = VMM.Timeline.DataObj.data_obj;
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, VMM.Timeline.Config.language.messages.loading_timeline);
if (type.of(raw_data) == "object") {
trace("DATA SOURCE: JSON OBJECT");
VMM.Timeline.DataObj.parseJSON(raw_data);
} else if (type.of(raw_data) == "string") {
if (raw_data.match("%23")) {
trace("DATA SOURCE: TWITTER SEARCH");
VMM.Timeline.DataObj.model_Tweets.getData("%23medill");
VMM.Timeline.DataObj.model.tweets.getData("%23medill");
} else if ( raw_data.match("spreadsheet") ) {
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, VMM.Timeline.Config.language.messages.loading_timeline);
trace("DATA SOURCE: GOOGLE SPREADSHEET");
VMM.Timeline.DataObj.model_GoogleSpreadsheet.getData(raw_data);
VMM.Timeline.DataObj.model.googlespreadsheet.getData(raw_data);
} else if (raw_data.match("storify.com")) {
trace("DATA SOURCE: STORIFY");
VMM.Timeline.DataObj.model.storify.getData(raw_data);
//http://api.storify.com/v1/stories/number10gov/g8-and-nato-chicago-summit
} else {
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, VMM.Timeline.Config.language.messages.loading_timeline);
trace("DATA SOURCE: JSON");
trace("raw data" + raw_data);
VMM.getJSON(raw_data, VMM.Timeline.DataObj.parseJSON);
}
} else if (type.of(raw_data) == "html") {
@ -142,20 +142,15 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
parseJSON: function(d) {
if (d.timeline.type == "default") {
trace("DATA SOURCE: JSON STANDARD TIMELINE");
VMM.fireEvent(global, VMM.Timeline.Config.events.data_ready, d);
} else if (d.timeline.type == "twitter") {
trace("DATA SOURCE: JSON TWEETS");
VMM.Timeline.DataObj.model_Tweets.buildData(d);
} else {
trace("DATA SOURCE: UNKNOWN JSON");
trace(type.of(d.timeline));
};
},
@ -163,117 +158,317 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
New Types of Data can be formatted for the timeline here
================================================== */
model_Tweets: {
model: {
type: "twitter",
buildData: function(raw_data) {
VMM.bindEvent(global, VMM.Timeline.DataObj.model_Tweets.onTwitterDataReady, "TWEETSLOADED");
VMM.ExternalAPI.twitter.getTweets(raw_data.timeline.tweets);
},
getData: function(raw_data) {
VMM.bindEvent(global, VMM.Timeline.DataObj.model_Tweets.onTwitterDataReady, "TWEETSLOADED");
VMM.ExternalAPI.twitter.getTweetSearch(raw_data);
},
onTwitterDataReady: function(e, d) {
var _data_obj = VMM.Timeline.DataObj.data_template_obj;
for(var i = 0; i < d.tweetdata.length; i++) {
googlespreadsheet: {
getData: function(raw) {
var _key = VMM.Util.getUrlVars(raw)["key"];
var _url = "https://spreadsheets.google.com/feeds/list/" + _key + "/od6/public/values?alt=json";
VMM.getJSON(_url, VMM.Timeline.DataObj.model.googlespreadsheet.buildData);
},
buildData: function(d) {
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, "Parsing Data");
var _data_obj = VMM.Timeline.DataObj.data_template_obj;
var _date = {
"type":"tweets",
"startDate":"",
"headline":"",
"text":"",
"asset":
{
"media":"",
"credit":"",
"caption":""
},
"tags":"Optional"
for(var i = 0; i < d.feed.entry.length; i++) {
var dd = d.feed.entry[i];
if (dd.gsx$titleslide.$t.match("start")) {
_data_obj.timeline.startDate = dd.gsx$startdate.$t;
_data_obj.timeline.headline = dd.gsx$headline.$t;
_data_obj.timeline.asset.media = dd.gsx$media.$t;
_data_obj.timeline.asset.caption = dd.gsx$mediacaption.$t;
_data_obj.timeline.asset.credit = dd.gsx$mediacredit.$t;
_data_obj.timeline.text = dd.gsx$text.$t;
_data_obj.timeline.type = "google spreadsheet";
} else {
var _date = {
"type": "google spreadsheet",
"startDate": dd.gsx$startdate.$t,
"endDate": dd.gsx$enddate.$t,
"headline": dd.gsx$headline.$t,
"text": dd.gsx$text.$t,
"asset": {
"media": dd.gsx$media.$t,
"credit": dd.gsx$mediacredit.$t,
"caption": dd.gsx$mediacaption.$t
},
"tags": "Optional"
};
if (typeof dd.gsx$tag != 'undefined') {
_date.tag = dd.gsx$tag.$t;
}
_data_obj.timeline.date.push(_date);
}
};
// pass in the 'created_at' string returned from twitter //
// stamp arrives formatted as Tue Apr 07 22:52:51 +0000 2009 //
VMM.fireEvent(global, VMM.Timeline.Config.events.data_ready, _data_obj);
}
},
storify: {
getData: function(raw) {
//http://storify.com/number10gov/g8-and-nato-chicago-summit
//http://api.storify.com/v1/stories/number10gov/g8-and-nato-chicago-summit
//var twit_date = VMM.ExternalAPI.twitter.parseTwitterDate(d.tweetdata[i].raw.created_at);
//trace(twit_date);
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, "Loading Storify...");
var _key = raw.split("storify.com\/")[1];
var _url = "http://api.storify.com/v1/stories/" + _key + "?per_page=300&callback=?";
_date.startDate = d.tweetdata[i].raw.created_at;
var storify_timeout = setTimeout(function() {
trace("STORIFY timeout");
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, "Storify is not responding");
}, 6000);
if (type.of(d.tweetdata[i].raw.from_user_name)) {
_date.headline = d.tweetdata[i].raw.from_user_name + " (<a href='https://twitter.com/" + d.tweetdata[i].raw.from_user + "'>" + "@" + d.tweetdata[i].raw.from_user + "</a>)" ;
} else {
_date.headline = d.tweetdata[i].raw.user.name + " (<a href='https://twitter.com/" + d.tweetdata[i].raw.user.screen_name + "'>" + "@" + d.tweetdata[i].raw.user.screen_name + "</a>)" ;
VMM.getJSON(_url, VMM.Timeline.DataObj.model.storify.buildData)
.error(function(jqXHR, textStatus, errorThrown) {
trace("STORIFY error");
trace("STORIFY ERROR: " + textStatus + " " + jqXHR.responseText);
})
.success(function(d) {
clearTimeout(storify_timeout);
});
},
buildData: function(d) {
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, "Parsing Data");
var _data_obj = VMM.Timeline.DataObj.data_template_obj;
_data_obj.timeline.startDate = new Date(d.content.date.created);;
_data_obj.timeline.headline = d.content.title;
//d.permalink
var tt = "";
if (typeof d.content.description != 'undefined' && d.content.description != null) {
tt += d.content.description;
}
tt += "<div class='storify'><div class='vcard author'><a class='screen-name url' href='" + d.content.author.permalink + "' target='_blank'>";
tt += "<span class='avatar'><img src='" + d.content.author.avatar + "' style='max-width: 32px; max-height: 32px;'></span>"
tt += "<span class='fn'>" + d.content.author.username + "</span>";
tt += "<span class='nickname'><div class='thumb-storify-full'></div></span>";
tt += "</a>";
//tt += "<span class='nickname'>" + d.content.author.stats.stories + " Stories</span>";
//tt += "<span class='nickname'>" + d.content.author.stats.subscribers + " Subscribers</span>";
tt += "</div></div>";
_date.asset.media = d.tweetdata[i].content;
_data_obj.timeline.date.push(_date);
_data_obj.timeline.text = tt;
_data_obj.timeline.asset.media = d.content.thumbnail;
};
VMM.fireEvent(global, VMM.Timeline.Config.events.data_ready, _data_obj);
}
},
model_GoogleSpreadsheet: {
// TEMPLATE CAN BE FOUND HERE
// https://docs.google.com/previewtemplate?id=0AppSVxABhnltdEhzQjQ4MlpOaldjTmZLclQxQWFTOUE&mode=public
type: "google spreadsheet",
getData: function(raw_data) {
//_data_obj.timeline.asset.media = dd.gsx$media.$t;
//_data_obj.timeline.asset.caption = dd.gsx$mediacaption.$t;
//_data_obj.timeline.asset.credit = dd.gsx$mediacredit.$t;
_data_obj.timeline.type = "storify";
for(var i = 0; i < d.content.elements.length; i++) {
var dd = d.content.elements[i];
var is_text = false;
var d_date = new Date(dd.posted_at);
//trace(tempdat);
trace(dd.type);
//trace(dd);
var _date = {
"type": "storify",
"startDate": dd.posted_at,
"endDate": dd.posted_at,
"headline": " ",
"slug": "",
"text": "",
"asset": {
"media": "",
"credit": "",
"caption": ""
}
};
/* MEDIA
================================================== */
if (dd.type == "image") {
if (typeof dd.source.name != 'undefined') {
if (dd.source.name == "flickr") {
_date.asset.media = "http://flickr.com/photos/" + dd.meta.pathalias + "/" + dd.meta.id + "/";
_date.asset.credit = "<a href='" + _date.asset.media + "'>" + dd.attribution.name + "</a>";
_date.asset.credit += " on <a href='" + dd.source.href + "'>" + dd.source.name + "</a>";
} else if (dd.source.name == "instagram") {
_date.asset.media = dd.permalink;
_date.asset.credit = "<a href='" + dd.permalink + "'>" + dd.attribution.name + "</a>";
_date.asset.credit += " on <a href='" + dd.source.href + "'>" + dd.source.name + "</a>";
} else {
_date.asset.credit = "<a href='" + dd.permalink + "'>" + dd.attribution.name + "</a>";
if (typeof dd.source.href != 'undefined') {
_date.asset.credit += " on <a href='" + dd.source.href + "'>" + dd.source.name + "</a>";
}
_date.asset.media = dd.data.image.src;
}
} else {
_date.asset.credit = "<a href='" + dd.permalink + "'>" + dd.attribution.name + "</a>";
_date.asset.media = dd.data.image.src;
}
_date.slug = dd.attribution.name;
if (typeof dd.data.image.caption != 'undefined') {
if (dd.data.image.caption != 'undefined') {
_date.asset.caption = dd.data.image.caption;
_date.slug = dd.data.image.caption;
}
}
} else if (dd.type == "quote") {
if (dd.permalink.match("twitter")) {
_date.asset.media = dd.permalink;
_date.slug = VMM.Util.untagify(dd.data.quote.text);
} else if (dd.permalink.match("storify")) {
is_text = true;
_date.asset.media = "<blockquote>" + dd.data.quote.text.replace(/<\s*\/?\s*b\s*.*?>/g,"") + "</blockquote>";
}
} else if (dd.type == "link") {
_date.headline = dd.data.link.title;
_date.text = dd.data.link.description;
if (dd.data.link.thumbnail != 'undefined' && dd.data.link.thumbnail != '') {
_date.asset.media = dd.data.link.thumbnail;
} else {
_date.asset.media = dd.permalink;
}
//_date.asset.media = dd.permalink;
_date.asset.caption = "<a href='" + dd.permalink + "' target='_blank'>" + dd.data.link.title + "</a>"
_date.slug = dd.data.link.title;
} else if (dd.type == "text") {
if (dd.permalink.match("storify")) {
is_text = true;
var asset_text = "<div class='storify'><blockquote><p>" + dd.data.text.replace(/<\s*\/?\s*b\s*.*?>/g,"") + "</p></blockquote>";
asset_text += "<div class='vcard author'><a class='screen-name url' href='" + dd.attribution.href + "' target='_blank'>";
asset_text += "<span class='avatar'><img src='" + dd.attribution.thumbnail + "' style='max-width: 32px; max-height: 32px;'></span>"
asset_text += "<span class='fn'>" + dd.attribution.username + "</span>";
asset_text += "<span class='nickname'><div class='thumb-storify-full'></div></span>";
asset_text += "</a></div></div>";
_date.text = asset_text;
// Try and put it before the element where it is expected on storify
if ( (i+1) >= d.content.elements.length ) {
_date.startDate = d.content.elements[i-1].posted_at;
} else {
if (d.content.elements[i+1].type == "text" && d.content.elements[i+1].permalink.match("storify")) {
if ( (i+2) >= d.content.elements.length ) {
_date.startDate = d.content.elements[i-1].posted_at;
} else {
if (d.content.elements[i+2].type == "text" && d.content.elements[i+2].permalink.match("storify")) {
if ( (i+3) >= d.content.elements.length ) {
_date.startDate = d.content.elements[i-1].posted_at;
} else {
if (d.content.elements[i+3].type == "text" && d.content.elements[i+3].permalink.match("storify")) {
_date.startDate = d.content.elements[i-1].posted_at;
} else {
trace("LEVEL 3");
_date.startDate = d.content.elements[i+3].posted_at;
}
}
} else {
trace("LEVEL 2");
_date.startDate = d.content.elements[i+2].posted_at;
}
}
} else {
trace("LEVEL 1");
_date.startDate = d.content.elements[i+1].posted_at;
}
}
_date.endDate = _date.startDate
}
} else if (dd.type == "video") {
_date.headline = dd.data.video.title;
_date.asset.caption = dd.data.video.description;
_date.asset.caption = dd.source.username;
_date.asset.media = dd.data.video.src;
} else {
trace("NO MATCH ");
trace(dd);
}
if (is_text) {
_date.slug = VMM.Util.untagify(dd.data.text);
}
_data_obj.timeline.date.push(_date);
};
var _key = VMM.Util.getUrlVars(raw_data)["key"];
var _url = "https://spreadsheets.google.com/feeds/list/" + _key + "/od6/public/values?alt=json";
VMM.fireEvent(global, VMM.Timeline.Config.events.data_ready, _data_obj);
}
VMM.getJSON(_url, VMM.Timeline.DataObj.model_GoogleSpreadsheet.buildData);
},
buildData: function(d) {
VMM.fireEvent(global, VMM.Timeline.Config.events.messege, "Parsing Data");
var _data_obj = VMM.Timeline.DataObj.data_template_obj;
tweets: {
type: "twitter",
buildData: function(raw_data) {
VMM.bindEvent(global, VMM.Timeline.DataObj.model.tweets.onTwitterDataReady, "TWEETSLOADED");
VMM.ExternalAPI.twitter.getTweets(raw_data.timeline.tweets);
},
getData: function(raw_data) {
VMM.bindEvent(global, VMM.Timeline.DataObj.model.tweets.onTwitterDataReady, "TWEETSLOADED");
VMM.ExternalAPI.twitter.getTweetSearch(raw_data);
},
onTwitterDataReady: function(e, d) {
var _data_obj = VMM.Timeline.DataObj.data_template_obj;
for(var i = 0; i < d.tweetdata.length; i++) {
for(var i = 0; i < d.feed.entry.length; i++) {
var dd = d.feed.entry[i];
if (dd.gsx$titleslide.$t.match("start")) {
_data_obj.timeline.startDate = dd.gsx$startdate.$t;
_data_obj.timeline.headline = dd.gsx$headline.$t;
_data_obj.timeline.asset.media = dd.gsx$media.$t;
_data_obj.timeline.asset.caption = dd.gsx$mediacaption.$t;
_data_obj.timeline.asset.credit = dd.gsx$mediacredit.$t;
_data_obj.timeline.text = dd.gsx$text.$t;
_data_obj.timeline.type = "google spreadsheet";
} else {
var _date = {
"type": "google spreadsheet",
"startDate": dd.gsx$startdate.$t,
"endDate": dd.gsx$enddate.$t,
"headline": dd.gsx$headline.$t,
"text": dd.gsx$text.$t,
"asset": {
"media": dd.gsx$media.$t,
"credit": dd.gsx$mediacredit.$t,
"caption": dd.gsx$mediacaption.$t
},
"tags": "Optional"
"type":"tweets",
"startDate":"",
"headline":"",
"text":"",
"asset":
{
"media":"",
"credit":"",
"caption":""
},
"tags":"Optional"
};
if (typeof dd.gsx$tag != 'undefined') {
_date.tag = dd.gsx$tag.$t;
// pass in the 'created_at' string returned from twitter //
// stamp arrives formatted as Tue Apr 07 22:52:51 +0000 2009 //
//var twit_date = VMM.ExternalAPI.twitter.parseTwitterDate(d.tweetdata[i].raw.created_at);
//trace(twit_date);
_date.startDate = d.tweetdata[i].raw.created_at;
if (type.of(d.tweetdata[i].raw.from_user_name)) {
_date.headline = d.tweetdata[i].raw.from_user_name + " (<a href='https://twitter.com/" + d.tweetdata[i].raw.from_user + "'>" + "@" + d.tweetdata[i].raw.from_user + "</a>)" ;
} else {
_date.headline = d.tweetdata[i].raw.user.name + " (<a href='https://twitter.com/" + d.tweetdata[i].raw.user.screen_name + "'>" + "@" + d.tweetdata[i].raw.user.screen_name + "</a>)" ;
}
_date.asset.media = d.tweetdata[i].content;
_data_obj.timeline.date.push(_date);
}
};
};
VMM.fireEvent(global, VMM.Timeline.Config.events.data_ready, _data_obj);
VMM.fireEvent(global, VMM.Timeline.Config.events.data_ready, _data_obj);
}
}
},
/* TEMPLATE OBJECTS
================================================== */
data_template_obj: { "timeline": { "headline":"", "description":"", "asset": { "media":"", "credit":"", "caption":"" }, "date": [] } },

Loading…
Cancel
Save