radiaSVG/radia.js
2012-02-14 15:01:11 +05:30

273 lines
7.7 KiB
JavaScript

// var R;
function supportsSvg() {
return !!document.createElementNS && !!document.createElementNS("http://www.w3.org/2000/svg", "svg").createSVGRect;
}
function getNode(nodeKey) {
var ret = false;
$('text').each(function() {
var $this = $(this);
if (typeof($(this).data("key")) != 'undefined') {
if ($this.data("key") == nodeKey) {
ret = $this;
}
}
});
return ret;
}
$(function() {
if (!supportsSvg) {
$('body').text("Sorry, your browser does not support Scalable Vector Graphics (SVG), which were used to make this page. Please use Firefox 4.0+ or Google Chrome if you wish to see this page. Thanks! Sorry for the trouble...");
return;
}
$(window).resize(function() {
var svgAspect = 1220 / 560;
var windowWidth = $(window).width();
var svgWidth = windowWidth - 20;
var svgHeight = parseInt(svgWidth / svgAspect);
$('svg').attr("width", svgWidth);
$('svg').attr("height", svgHeight);
});
$(window).resize();
$.getJSON("radia.json", {}, function(data) {
var highlightCSS = {
'opacity': "1.0"
// 'fontWeight': 'bold',
// 'backgroundColor': '#ffff00'
}
var unhighlightCSS = {
'opacity': "0.7"
// 'fontWeight': 'normal',
// 'backgroundColor': '#ffffff'
}
var R = data;
var $texts = [];
$('g').each(function() {
// console.log("hi");
if (typeof($(this).attr("id")) === 'undefined') {
return;
}
$(this).click(function() {
// console.log($(this).attr("id"));
});
$(this).hover(function() {
// console.log("hovered " + $(this).attr("id"));
var $this = $(this);
var id = $this.attr("id");
if (id.indexOf("box") != -1) {
return; //FIXME: handle box hovers
}
if (RIDS.hasOwnProperty(id)) {
$this.highlightLine();
// console.log(id);
if (LINES.hasOwnProperty(id)) {
var nodes = LINES[id];
// console.log(nodes);
for (var i=0; i<nodes.length; i++) {
// console.log(nodes[i]);
var $node = getNode(nodes[i]);
$node.highlightNode();
}
}
}
// console.log($(this).attr("id"));
}, function() {
var $this = $(this);
var id = $this.attr("id");
if (id.indexOf("box") != -1) {
return; //FIXME: handle box hovers
}
if (RIDS.hasOwnProperty(id)) {
$this.unhighlightLine();
// console.log(id);
if (LINES.hasOwnProperty(id)) {
var nodes = LINES[id];
// console.log(nodes);
for (var i=0; i<nodes.length; i++) {
// console.log(nodes[i]);
var $node = getNode(nodes[i]);
$node.unhighlightNode();
}
}
}
});
});
$('#heartpng').hover(function() {
// console.log("HEART damnit");
// $('#rajakani').find('line').css({'stroke': '#ff00ff'});
$('#loveline').css({'stroke': '#ff00ff'});
}, function() {
$('#loveline').css({'stroke': '#666666'});
});
// $('#heartpng').click(function() { alert("foo") });
$('text').each(function() {
$(this).css({'cursor': 'pointer'});
var $tspan = $(this).children('tspan').eq(0);
var key = $.trim($tspan.text());
if (R.hasOwnProperty(key)) {
thisData = R[key];
var $this = $(this);
if (key == 'Journalists') {
J = $this;
}
// $this.data("r", thisData);
$this.data("key", key);
$this.data("name", thisData.name);
$this.data("type", thisData.type);
$this.data("link", thisData.link);
if (thisData.hasOwnProperty("lines")) {
$this.data("lines", thisData.lines.split(", "));
} else {
$this.data("lines", []);
}
// $this.addClass(thisData.type);
// console.log($this.data("key"));
// console.log($this.hasTooltip());
if (!$this.isLegend()) {
$this.tooltip({
'delay': 0,
'showURL': false,
'bodyHandler': function() {
var html = "<div class='ttWrapper'>";
html += "<div class='tooltipName'>" + $(this).data("name") + "</div>";
html += "<div class='padmaPosters'>" + getPostersHTML(PADMA[$(this).data("key")]) + "</div>";
html += "</div>";
return html;
}
});
} else {
// console.log(key);
}
$texts.push($this);
// var highlightShadow = '2px 2px 1px #666';
$this.mouseover(function(e) {
var typ = $(this).data("type");
if (typ === "") { return }
for (var i=0; i<$texts.length;i++) {
var $t = $texts[i];
if ($t.data("type") == typ) {
$t.highlightNode();
}
}
var lines = $(this).data("lines");
if (lines.length > 0) {
for (var i=0; i<lines.length; i++) {
var thisLine = lines[i];
var $line = $('#' + thisLine);
$line.highlightLine();
}
}
// $('.' + cls).addClass("highlighted");
// console.log($('.' + cls).length);
});
$this.mouseout(function(e) {
var typ = $(this).data("type");
if (typ === '') { return; }
for (var i=0; i<$texts.length;i++) {
var $t = $texts[i];
if ($t.data("type") == typ) {
$t.unhighlightNode();
}
}
var lines = $(this).data("lines");
if (lines.length > 0) {
for (var i=0; i<lines.length; i++) {
var thisLine = lines[i];
var $line = $('#' + thisLine);
$line.unhighlightLine();
}
}
// $('.' + cls).removeClass("highlighted");
});
$this.click(function() {
if ($this.isLegend()) {
return;
}
window.open($(this).data("link"));
// console.log($(this).data("link"));
});
}
});
});
});
function getPostersHTML(padma_ids) {
if (typeof(padma_ids) === 'undefined') {
return '';
}
var limit = 0; //limit is the no of posters to show minus one
var html = '';
for (var i=0; i<padma_ids.length; i++) {
if (i>limit) { break; }
var posterLink = "http://next.pad.ma/" + padma_ids[i] + "/icon320.jpg";
html += "<img src='" + posterLink + "' />";
}
return html;
}
jQuery.fn.isLegend = function() {
if (typeof(this.data("key")) == 'undefined') {
return true;
}
// console.log(parseInt(this.attr("x")));
if (parseInt(this.attr("x")) > 1200) {
if ($.inArray(this.data("key"), ["Journalists", "Corporates", "Vaishnavi", "Politicians", "Issues", "Mention of,"]) != -1) {
return true;
} else {
return false;
}
}
return false;
}
jQuery.fn.highlightLine= function() {
this.find('line, polyline, path').css({'stroke': '#000000'});
this.find('path').css({'strokeDasharray': '0'});
}
jQuery.fn.unhighlightLine = function() {
this.find('line, polyline, path').css({'stroke': '#666666'});
this.find("path").css({'strokeDasharray': '4'});
}
jQuery.fn.highlightNode = function() {
this.css({'opacity': '1.0'});
if (this.data("type") == 'rivalgroup') {
this.css({'fontWeight': 'bold'});
} else {
var prev = this.prev();
if (prev.is('rect')) {
this.prev().css({'fill': '#FAFF3E'});
}
}
}
jQuery.fn.unhighlightNode = function() {
this.css({'opacity': '0.7'});
if (this.data("type") == 'rivalgroup') {
this.css({'fontWeight': 'normal'});
} else {
var prev = this.prev();
if (prev.is('rect')) {
this.prev().css({'fill': '#ffffff'});
}
}
}