glenux-contrib/metamaps--metamaps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

major code refactor

Browse source
This commit is contained in:
Connor Turland 2014-07-29 13:34:10 -04:00
parent de2c7372fd
commit ae8c711d27
40 changed files with 4118 additions and 17665 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1416
app/assets/javascripts/Jit/excanvas.js
View file

File diff suppressed because it is too large Load diff

588
app/assets/javascripts/Jit/graphsettings-event-handlers.js
View file

@ -1,588 +0,0 @@
function selectEdgeOnClickHandler(adj, e) {
if (Mconsole.busy) return;
// catch right click on mac, which is often like ctrl+click
if (navigator.platform.indexOf("Mac") != -1 && e.ctrlKey) {
selectEdgeOnRightClickHandler(adj, e)
return;
}
if (synapseWasDoubleClicked()) {
synapseDoubleClickHandler(adj, e);
return;
}
var edgeIsSelected = MetamapsModel.selectedEdges.indexOf(adj);
if (edgeIsSelected == -1) edgeIsSelected = false;
else if (edgeIsSelected != -1) edgeIsSelected = true;
if (edgeIsSelected && e.shiftKey) {
//deselecting an edge with shift
deselectEdge(adj);
} else if (!edgeIsSelected && e.shiftKey) {
//selecting an edge with shift
selectEdge(adj);
} else if (edgeIsSelected && !e.shiftKey) {
//deselecting an edge without shift - unselect all
deselectAllEdges();
} else if (!edgeIsSelected && !e.shiftKey) {
//selecting an edge without shift - unselect all but new one
deselectAllEdges();
selectEdge(adj);
}
Mconsole.plot();
} //selectEdgeOnClickHandler
function selectEdgeOnRightClickHandler(adj, e) {
// the 'node' variable is a JIT node, the one that was clicked on
// the 'e' variable is the click event
e.preventDefault();
e.stopPropagation();
if (Mconsole.busy) return;
selectEdge(adj);
// delete old right click menu
$('.rightclickmenu').remove();
// create new menu for clicked on node
var rightclickmenu = document.createElement("div");
rightclickmenu.className = "rightclickmenu";
// add the proper options to the menu
var menustring = '<ul>';
if (userid != null) menustring += '<li class="rc-delete">Delete</li>';
if (mapid && userid != null) menustring += '<li class="rc-remove">Remove from map</li>';
menustring += '<li class="rc-hide">Hide until refresh</li>';
if (userid) {
var options = '<ul><li class="changeP toCommons">commons</li> \
<li class="changeP toPublic">public</li> \
<li class="changeP toPrivate">private</li> \
</ul>';
menustring += '<li class="rc-permission">Change permissions' + options + '</li>';
}
menustring += '</ul>';
rightclickmenu.innerHTML = menustring;
// position the menu where the click happened
$(rightclickmenu).css({
left: e.clientX,
top: e.clientY
});
//add the menu to the page
$('#center-container').append(rightclickmenu);
// attach events to clicks on the list items
// delete the selected things from the database
$('.rc-delete').click(function () {
$('.rightclickmenu').remove();
var n = MetamapsModel.selectedNodes.length;
var e = MetamapsModel.selectedEdges.length;
var ntext = n == 1 ? "1 topic" : n + " topics";
var etext = e == 1 ? "1 synapse" : e + " synapses";
var text = "You have " + ntext + " and " + etext + " selected. ";
var r = confirm(text + "Are you sure you want to permanently delete them all? This will remove them from all maps they appear on.");
if (r == true) {
deleteSelectedEdges();
deleteSelectedNodes();
}
});
// remove the selected things from the map
$('.rc-remove').click(function () {
$('.rightclickmenu').remove();
removeSelectedEdges();
removeSelectedNodes();
});
// hide selected nodes and synapses until refresh
$('.rc-hide').click(function () {
$('.rightclickmenu').remove();
hideSelectedEdges();
hideSelectedNodes();
});
// change the permission of all the selected nodes and synapses that you were the originator of
$('.rc-permission li').click(function () {
$('.rightclickmenu').remove();
// $(this).text() will be 'commons' 'public' or 'private'
updateSelectedPermissions($(this).text());
});
} //selectEdgeOnRightClickHandler
function synapseDoubleClickHandler(adj, e) {
editEdge(adj, e);
}
/*
* Returns a boolean saying if the synapse was double clicked in our understanding of the word
*/
function synapseWasDoubleClicked() {
//grab the timestamp of the click
var storedTime = MetamapsModel.lastSynapseClick;
var now = Date.now(); //not compatible with IE8 FYI
MetamapsModel.lastSynapseClick = now;
if (now - storedTime < MetamapsModel.DOUBLE_CLICK_TOLERANCE) {
return true;
} else {
return false;
}
} //synapseWasDoubleClicked;
function nodeDoubleClickHandler(node, e) {
openNodeShowcard(node);
}
function enterKeyHandler(event) {
//var selectedNodesCopy = MetamapsModel.selectedNodes.slice(0);
//var len = selectedNodesCopy.length;
//for (var i = 0; i < len; i += 1) {
// n = selectedNodesCopy[i];
// keepFromCommons(n);
//}//for
//Mconsole.plot();
} //enterKeyHandler
function escKeyHandler() {
deselectAllEdges();
deselectAllNodes();
} //escKeyHandler
/*
* Make a node "in the commons" (with a green circle) lose its
* green circle so it stays on the console/map/...
*/
function keepFromCommons(event, id) {
if (userid == null) {
return;
}
$('#topic_addSynapse').val("false");
$('#topic_x').val(0);
$('#topic_y').val(0);
$('#topic_grabTopic').val(id);
$('.new_topic').submit();
event.preventDefault();
event.stopPropagation();
return false;
} //doubleClickNodeHandler
/*
* Returns a boolean saying if the node was double clicked in our understanding of the word
*/
function nodeWasDoubleClicked() {
//grab the timestamp of the click
var storedTime = MetamapsModel.lastNodeClick;
var now = Date.now(); //not compatible with IE8 FYI
MetamapsModel.lastNodeClick = now;
if (now - storedTime < MetamapsModel.DOUBLE_CLICK_TOLERANCE) {
return true;
} else {
return false;
}
} //nodeWasDoubleClicked;
function selectNodeOnClickHandler(node, e) {
if (Mconsole.busy) return;
// catch right click on mac, which is often like ctrl+click
if (navigator.platform.indexOf("Mac") != -1 && e.ctrlKey) {
selectNodeOnRightClickHandler(node, e)
return;
}
// if on a topic page, let alt+click center you on a new topic
if (!mapid && e.altKey) {
centerOn(node.id);
return;
}
var check = nodeWasDoubleClicked();
if (check) {
nodeDoubleClickHandler(node, e);
return;
} else {
// wait a certain length of time, then check again, then run this code
setTimeout(function () {
if (!nodeWasDoubleClicked()) {
if (!e.shiftKey) {
Mconsole.graph.eachNode(function (n) {
if (n.id != node.id) {
deselectNode(n);
}
});
}
if (node.selected) {
deselectNode(node);
} else {
selectNode(node);
}
//trigger animation to final styles
Mconsole.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 500
});
Mconsole.plot();
}
}, MetamapsModel.DOUBLE_CLICK_TOLERANCE);
}
} //selectNodeOnClickHandler
function selectNodeOnRightClickHandler(node, e) {
// the 'node' variable is a JIT node, the one that was clicked on
// the 'e' variable is the click event
e.preventDefault();
e.stopPropagation();
if (Mconsole.busy) return;
selectNode(node);
// delete old right click menu
$('.rightclickmenu').remove();
// create new menu for clicked on node
var rightclickmenu = document.createElement("div");
rightclickmenu.className = "rightclickmenu";
// add the proper options to the menu
var menustring = '<ul>';
if (userid != null) menustring += '<li class="rc-delete">Delete</li>';
if (mapid && userid != null) menustring += '<li class="rc-remove">Remove from map</li>';
menustring += '<li class="rc-hide">Hide until refresh</li>';
if (!mapid) menustring += '<li class="rc-center">Center this topic</li>';
menustring += '<li class="rc-popout">Open in new tab</li>';
if (userid) {
var options = '<ul><li class="changeP toCommons">commons</li> \
<li class="changeP toPublic">public</li> \
<li class="changeP toPrivate">private</li> \
</ul>';
menustring += '<li class="rc-permission">Change permissions' + options + '</li>';
}
menustring += '</ul>';
rightclickmenu.innerHTML = menustring;
// position the menu where the click happened
$(rightclickmenu).css({
left: e.clientX,
top: e.clientY
});
//add the menu to the page
$('#center-container').append(rightclickmenu);
// attach events to clicks on the list items
// delete the selected things from the database
$('.rc-delete').click(function () {
$('.rightclickmenu').remove();
var n = MetamapsModel.selectedNodes.length;
var e = MetamapsModel.selectedEdges.length;
var ntext = n == 1 ? "1 topic" : n + " topics";
var etext = e == 1 ? "1 synapse" : e + " synapses";
var text = "You have " + ntext + " and " + etext + " selected. ";
var r = confirm(text + "Are you sure you want to permanently delete them all? This will remove them from all maps they appear on.");
if (r == true) {
deleteSelectedEdges();
deleteSelectedNodes();
}
});
// remove the selected things from the map
$('.rc-remove').click(function () {
$('.rightclickmenu').remove();
removeSelectedEdges();
removeSelectedNodes();
});
// hide selected nodes and synapses until refresh
$('.rc-hide').click(function () {
$('.rightclickmenu').remove();
hideSelectedEdges();
hideSelectedNodes();
});
// when in radial, center on the topic you picked
$('.rc-center').click(function () {
$('.rightclickmenu').remove();
centerOn(node.id);
});
// open the entity in a new tab
$('.rc-popout').click(function () {
$('.rightclickmenu').remove();
var win = window.open('/topics/' + node.id, '_blank');
win.focus();
});
// change the permission of all the selected nodes and synapses that you were the originator of
$('.rc-permission li').click(function () {
$('.rightclickmenu').remove();
// $(this).text() will be 'commons' 'public' or 'private'
updateSelectedPermissions($(this).text());
});
} //selectNodeOnRightClickHandler
function canvasDoubleClickHandler(canvasLoc, e) {
//grab the location and timestamp of the click
var storedTime = MetamapsModel.lastCanvasClick;
var now = Date.now(); //not compatible with IE8 FYI
MetamapsModel.lastCanvasClick = now;
// if on a public map, disable topic creation
if (userid && (mapperm || !mapid)) {
if (now - storedTime < MetamapsModel.DOUBLE_CLICK_TOLERANCE) {
//pop up node creation :)
$('#topic_grabTopic').val("null");
$('#topic_addSynapse').val("false");
$('#new_topic').css('left', e.clientX + "px");
$('#new_topic').css('top', e.clientY + "px");
$('#topic_x').val(canvasLoc.x);
$('#topic_y').val(canvasLoc.y);
$('#new_topic').fadeIn('fast');
$('#topic_name').typeahead('setQuery', '').focus();
return;
}
}
if (!MetamapsModel.didPan) {
$('#new_topic').fadeOut('fast');
$('#new_synapse').fadeOut('fast');
$('.rightclickmenu').remove();
// reset the draw synapse positions to false
MetamapsModel.synapseStartCoord = false;
MetamapsModel.synapseEndCoord = false;
deselectAllNodes();
tempInit = false;
tempNode = null;
tempNode2 = null;
Mconsole.plot();
}
} //canvasDoubleClickHandler
function handleSelectionBeforeDragging(node, e) {
// four cases:
// 1 nothing is selected, so pretend you aren't selecting
// 2 others are selected only and shift, so additionally select this one
// 3 others are selected only, no shift: drag only this one
// 4 this node and others were selected, so drag them (just return false)
//return value: deselect node again after?
if (MetamapsModel.selectedNodes.length == 0) {
selectNode(node);
return 'deselect';
}
if (MetamapsModel.selectedNodes.indexOf(node) == -1) {
if (e.shiftKey) {
selectNode(node);
return 'nothing';
} else {
return 'only-drag-this-one';
}
}
return 'nothing'; //case 4?
}
function onDragMoveTopicHandler(node, eventInfo, e) {
if (node && !node.nodeFrom) {
$('#new_synapse').fadeOut('fast');
$('#new_topic').fadeOut('fast');
var pos = eventInfo.getPos();
var newPosComplex = new $jit.Complex(pos.x, pos.y);
// if it's a left click, or a touch, move the node
if (e.touches || (e.button == 0 && !e.altKey && (e.buttons == 0 || e.buttons == 1 || e.buttons == undefined))) {
//if the node dragged isn't already selected, select it
var whatToDo = handleSelectionBeforeDragging(node, e);
if (whatToDo == 'only-drag-this-one' || whatToDo == 'deselect') {
if (gType == "centered") {
var rho = Math.sqrt(pos.x * pos.x + pos.y * pos.y);
var theta = Math.atan2(pos.y, pos.x);
node.pos.setp(theta, rho);
} else {
node.setPos(newPosComplex, 'start');
node.setPos(newPosComplex, 'current');
node.setPos(newPosComplex, 'end');
node.setData('xloc', pos.x);
node.setData('yloc', pos.y);
}
} else {
var len = MetamapsModel.selectedNodes.length;
//first define offset for each node
var xOffset = new Array();
var yOffset = new Array();
for (var i = 0; i < len; i += 1) {
var n = MetamapsModel.selectedNodes[i];
if (gType == "centered") {
xOffset[i] = n.pos.toComplex().x - node.pos.toComplex().x;
yOffset[i] = n.pos.toComplex().y - node.pos.toComplex().y;
} else {
xOffset[i] = n.pos.x - node.pos.x;
yOffset[i] = n.pos.y - node.pos.y;
}
} //for
for (var i = 0; i < len; i += 1) {
var n = MetamapsModel.selectedNodes[i];
if (gType == "centered") {
var x = pos.x + xOffset[i];
var y = pos.y + yOffset[i];
var rho = Math.sqrt(x * x + y * y);
var theta = Math.atan2(y, x);
n.pos.setp(theta, rho);
} else {
newPosComplex = new $jit.Complex(pos.x + xOffset[i], pos.y + yOffset[i]);
n.setPos(newPosComplex, 'start');
n.setPos(newPosComplex, 'current');
n.setPos(newPosComplex, 'end');
n.setData('xloc', pos.x + xOffset[i]);
n.setData('yloc', pos.y + yOffset[i]);
}
} //for
} //if
if (whatToDo == 'deselect') {
deselectNode(node);
}
dragged = node.id;
Mconsole.plot();
}
// if it's a right click or holding down alt, start synapse creation ->third option is for firefox
else if ((e.button == 2 || (e.button == 0 && e.altKey) || e.buttons == 2) && userid != null) {
// if on a public map, disable synapse creation
if (mapid && !mapperm) return;
if (tempInit == false) {
tempNode = node;
tempInit = true;
// set the draw synapse start position
MetamapsModel.synapseStartCoord = {
x: node.pos.getc().x,
y: node.pos.getc().y
};
}
//
temp = eventInfo.getNode();
if (temp != false && temp.id != node.id) { // this means a Node has been returned
tempNode2 = temp;
// set the draw synapse end position
MetamapsModel.synapseEndCoord = {
x: temp.pos.getc().x,
y: temp.pos.getc().y
};
Mconsole.plot();
// before making the highlighted one bigger, make sure all the others are regular size
Mconsole.graph.eachNode(function (n) {
n.setData('dim', 25, 'current');
});
temp.setData('dim', 35, 'current');
Mconsole.fx.plotNode(tempNode, Mconsole.canvas);
Mconsole.fx.plotNode(temp, Mconsole.canvas);
} else if (!temp) {
tempNode2 = null;
Mconsole.graph.eachNode(function (n) {
n.setData('dim', 25, 'current');
});
//pop up node creation :)
$('#topic_grabTopic').val("null");
var myX = e.clientX - 110;
var myY = e.clientY - 30;
$('#new_topic').css('left', myX + "px");
$('#new_topic').css('top', myY + "px");
$('#new_synapse').css('left', myX + "px");
$('#new_synapse').css('top', myY + "px");
$('#topic_x').val(eventInfo.getPos().x);
$('#topic_y').val(eventInfo.getPos().y);
// set the draw synapse end position
MetamapsModel.synapseEndCoord = {
x: eventInfo.getPos().x,
y: eventInfo.getPos().y
};
Mconsole.plot();
Mconsole.fx.plotNode(tempNode, Mconsole.canvas);
}
}
}
}
var lastDist = 0;
function getDistance(p1, p2) {
return Math.sqrt(Math.pow((p2.x - p1.x), 2) + Math.pow((p2.y - p1.y), 2));
}
function touchPanZoomHandler(eventInfo, e) {
if (e.touches.length == 1) {
var thispos = touchPos,
currentPos = eventInfo.getPos(),
canvas = Mconsole.canvas,
ox = canvas.translateOffsetX,
oy = canvas.translateOffsetY,
sx = canvas.scaleOffsetX,
sy = canvas.scaleOffsetY;
currentPos.x *= sx;
currentPos.y *= sy;
currentPos.x += ox;
currentPos.y += oy;
//var x = currentPos.x - thispos.x,
// y = currentPos.y - thispos.y;
var x = currentPos.x - thispos.x,
y = currentPos.y - thispos.y;
touchPos = currentPos;
Mconsole.canvas.translate(x * 1 / sx, y * 1 / sy);
} else if (e.touches.length == 2) {
var touch1 = e.touches[0];
var touch2 = e.touches[1];
var dist = getDistance({
x: touch1.clientX,
y: touch1.clientY
}, {
x: touch2.clientX,
y: touch2.clientY
});
if (!lastDist) {
lastDist = dist;
}
var scale = dist / lastDist;
console.log(scale);
if (8 >= Mconsole.canvas.scaleOffsetX * scale && Mconsole.canvas.scaleOffsetX * scale >= 1) {
Mconsole.canvas.scale(scale, scale);
}
if (Mconsole.canvas.scaleOffsetX < 0.5) {
Mconsole.canvas.viz.labels.hideLabels(true);
} else if (Mconsole.canvas.scaleOffsetX > 0.5) {
Mconsole.canvas.viz.labels.hideLabels(false);
}
lastDist = dist;
}
}

66
app/assets/javascripts/Jit/graphsettings-model.js
View file

@ -1,66 +0,0 @@
/*
* @file
* This file holds the Model object that is referenced in other graphsettings
* files. It lists selected nodes, selected edges, and stores data about
* double clicks on the canvas
*/
var MetamapsModel = new Object();
MetamapsModel.embed = false;
// if you're on a map, this will be an object that has a reference to each user that has loaded the map, and whether they are
// in realtime or not
MetamapsModel.mappersOnMap = {};
MetamapsModel.metacodeScrollerInit = false; // indicates whether the scrollbar in the custom metacode set space has been init
MetamapsModel.selectedMetacodeSet = null;
MetamapsModel.selectedMetacodeSetIndex = null;
MetamapsModel.selectedMetacodeNames = new Array();
MetamapsModel.newSelectedMetacodeNames = new Array();
MetamapsModel.selectedMetacodes = new Array();
MetamapsModel.newSelectedMetacodes = new Array();
//array of all selected edges, same for nodes
MetamapsModel.selectedEdges = new Array();
MetamapsModel.selectedNodes = new Array();
//this stores a value that indicates whether the user panned or simply clicked without panning
// used for purposes of knowing whether to close the open card or not (don't if panned)
MetamapsModel.didPan = false;
//is any showcard open right now? which one?
MetamapsModel.showcardInUse = null;
MetamapsModel.widthOfLabel = null;
//is an edge card open right now? which one (the id)?
MetamapsModel.edgecardInUse = null;
//is the mouse hovering over an edge? which one?
MetamapsModel.edgeHoveringOver = false;
//coordinates of shift click for using box select
MetamapsModel.boxStartCoordinates = false;
MetamapsModel.boxEndCoordinates = false;
//coordinates for drawing edge that's not created yet
MetamapsModel.synapseStartCoord = false;
MetamapsModel.synapseEndCoord = false;
//double clicking of nodes or canvas
MetamapsModel.lastSynapseClick = 0;
MetamapsModel.lastNodeClick = 0;
MetamapsModel.lastCanvasClick = 0;
MetamapsModel.DOUBLE_CLICK_TOLERANCE = 300;
//pop-up permission editors timers
MetamapsModel.edgePermTimer1 = null;
MetamapsModel.edgePermTimer2 = null;
MetamapsModel.edgePermSliding = false;
MetamapsModel.topicPermTimer1 = null;
MetamapsModel.topicPermTimer2 = null;
MetamapsModel.topicPermSliding = false;

606
app/assets/javascripts/Jit/graphsettings.js
View file

@ -1,606 +0,0 @@
/*
* @file
* This function defines all settings and event callbacks for the JIT graph. Some are found in other files
* First is the common settings (the same as arranged or chaotic)
* Then if it's a centred graph additional settings are added.
*/
function graphSettings(type, embed) {
var t = {
//id of the visualization container
injectInto: 'infovis',
//Enable zooming and panning
//by scrolling and DnD
Navigation: {
enable: true,
//Enable panning events only if we're dragging the empty
//canvas (and not a node).
panning: 'avoid nodes',
zooming: 28 //zoom speed. higher is more sensible
},
// Change node and edge styles such as
// color and width.
// These properties are also set per node
// with dollar prefixed data-properties in the
// JSON structure.
Node: {
overridable: true,
color: '#2D6A5D',
type: 'customNode',
dim: 25
},
Edge: {
overridable: true,
color: '#222222',
type: 'customEdge',
lineWidth: 2,
alpha: 0.4
},
//Native canvas text styling
Label: {
type: 'Native', //Native or HTML
size: 20,
family: 'arial',
textBaseline: 'hanging',
color: '#DDD'
//style: 'bold'
},
//Add Tips
Tips: {
enable: false,
onShow: function (tip, node) {}
},
// Add node events
Events: {
enable: true,
enableForEdges: true,
onMouseMove: function (node, eventInfo, e) {
onMouseMoveHandler(node, eventInfo, e);
},
//Update node positions when dragged
onDragMove: function (node, eventInfo, e) {
onDragMoveTopicHandler(node, eventInfo, e);
},
onDragEnd: function (node, eventInfo, e) {
onDragEndTopicHandler(node, eventInfo, e, false);
},
onDragCancel: function (node, eventInfo, e) {
onDragCancelHandler(node, eventInfo, e, false);
},
//Implement the same handler for touchscreens
onTouchStart: function (node, eventInfo, e) {
//$jit.util.event.stop(e); //stop default touchmove event
//Mconsole.events.onMouseDown(e, null, eventInfo);
Mconsole.events.touched = true;
touchPos = eventInfo.getPos();
var canvas = Mconsole.canvas,
ox = canvas.translateOffsetX;
oy = canvas.translateOffsetY,
sx = canvas.scaleOffsetX,
sy = canvas.scaleOffsetY;
touchPos.x *= sx;
touchPos.y *= sy;
touchPos.x += ox;
touchPos.y += oy;
touchDragNode = node;
},
//Implement the same handler for touchscreens
onTouchMove: function (node, eventInfo, e) {
if (touchDragNode) onDragMoveTopicHandler(touchDragNode, eventInfo, e);
else {
touchPanZoomHandler(eventInfo, e);
Mconsole.labels.hideLabel(Mconsole.graph.getNode(MetamapsModel.showcardInUse));
}
},
//Implement the same handler for touchscreens
onTouchEnd: function (node, eventInfo, e) {
},
//Implement the same handler for touchscreens
onTouchCancel: function (node, eventInfo, e) {
},
//Add also a click handler to nodes
onClick: function (node, eventInfo, e) {
if (MetamapsModel.boxStartCoordinates) {
Mconsole.busy = false;
MetamapsModel.boxEndCoordinates = eventInfo.getPos();
selectNodesWithBox();
return;
}
if (e.target.id != "infovis-canvas") return false;
//clicking on a edge, node, or clicking on blank part of canvas?
if (node.nodeFrom) {
selectEdgeOnClickHandler(node, e);
} else if (node && !node.nodeFrom) {
selectNodeOnClickHandler(node, e);
} else {
//topic and synapse editing cards
if (!MetamapsModel.didPan) {
hideCards();
}
canvasDoubleClickHandler(eventInfo.getPos(), e);
} //if
},
onRightClick: function (node, eventInfo, e) {
e.preventDefault();
e.stopPropagation();
if (node && !node.nodeFrom) {
selectNodeOnRightClickHandler(node, e);
} else if (node && node.nodeFrom) { // the variable 'node' is actually an edge/adjacency
// open right click menu
selectEdgeOnRightClickHandler(node, e);
} else {
// right click on open canvas, options here?
}
}
},
//Number of iterations for the FD algorithm
iterations: 200,
//Edge length
levelDistance: 200
};
if (embed) {
t.Edge.type = 'customEdgeEmbed';
}
if (type == "centered") {
t.background = {
CanvasStyles: {
strokeStyle: '#333',
lineWidth: 1.5
}
};
t.levelDistance = 280;
t.Events.enableForEdges = true;
t.Events.onDragEnd = function (node, eventInfo, e) {
//different because we can't go realtime
onDragEndTopicHandler(node, eventInfo, e, false);
};
t.Events.onDragCancel = function (node, eventInfo, e) {
//different because we're centred
onDragCancelHandler(node, eventInfo, e, true);
};
} //if
return t;
} //graphSettings
function hideCards() {
$('#edit_synapse').hide();
MetamapsModel.edgecardInUse = null;
hideCurrentCard();
// delete right click menu
$('.rightclickmenu').remove();
}
// defining code to draw edges with arrows pointing in one direction
var renderMidArrow = function (from, to, dim, swap, canvas, placement, newSynapse) {
var ctx = canvas.getCtx();
// invert edge direction
if (swap) {
var tmp = from;
from = to;
to = tmp;
}
// vect represents a line from tip to tail of the arrow
var vect = new $jit.Complex(to.x - from.x, to.y - from.y);
// scale it
vect.$scale(dim / vect.norm());
// compute the midpoint of the edge line
var newX = (to.x - from.x) * placement + from.x;
var newY = (to.y - from.y) * placement + from.y;
var midPoint = new $jit.Complex(newX, newY);
// move midpoint by half the "length" of the arrow so the arrow is centered on the midpoint
var arrowPoint = new $jit.Complex((vect.x / 0.7) + midPoint.x, (vect.y / 0.7) + midPoint.y);
// compute the tail intersection point with the edge line
var intermediatePoint = new $jit.Complex(arrowPoint.x - vect.x, arrowPoint.y - vect.y);
// vector perpendicular to vect
var normal = new $jit.Complex(-vect.y / 2, vect.x / 2);
var v1 = intermediatePoint.add(normal);
var v2 = intermediatePoint.$add(normal.$scale(-1));
if (newSynapse) {
ctx.strokeStyle = "#222222";
ctx.lineWidth = 2;
ctx.globalAlpha = 0.4;
}
ctx.beginPath();
ctx.moveTo(from.x, from.y);
ctx.lineTo(to.x, to.y);
ctx.stroke();
ctx.beginPath();
ctx.moveTo(v1.x, v1.y);
ctx.lineTo(arrowPoint.x, arrowPoint.y);
ctx.lineTo(v2.x, v2.y);
ctx.stroke();
};
// defining custom node type
var nodeSettings = {
'customNode': {
'render': function (node, canvas) {
var pos = node.pos.getc(true),
dim = node.getData('dim'),
cat = node.getData('metacode'),
whiteCircle = node.getData('whiteCircle'),
ctx = canvas.getCtx();
// if the topic is on the Canvas draw a white circle around it
if (whiteCircle) {
ctx.beginPath();
ctx.arc(pos.x, pos.y, dim + 3, 0, 2 * Math.PI, false);
if (!MetamapsModel.embed) ctx.strokeStyle = 'white';
if (MetamapsModel.embed) ctx.strokeStyle = '#999';
ctx.lineWidth = 2;
ctx.stroke();
}
ctx.drawImage(imgArray[cat], pos.x - dim, pos.y - dim, dim * 2, dim * 2);
},
'contains': function (node, pos) {
var npos = node.pos.getc(true),
dim = node.getData('dim');
return this.nodeHelper.circle.contains(npos, pos, dim);
}
}
}
var renderEdgeArrows = function (edgeHelper, adj) {
var canvas = Mconsole.canvas;
var directionCat = adj.getData('category');
var direction = adj.getData('direction');
var pos = adj.nodeFrom.pos.getc(true);
var posChild = adj.nodeTo.pos.getc(true);
//plot arrow edge
if (directionCat == "none") {
edgeHelper.line.render({
x: pos.x,
y: pos.y
}, {
x: posChild.x,
y: posChild.y
}, canvas);
} else if (directionCat == "both") {
renderMidArrow({
x: pos.x,
y: pos.y
}, {
x: posChild.x,
y: posChild.y
}, 13, true, canvas, 0.7);
renderMidArrow({
x: pos.x,
y: pos.y
}, {
x: posChild.x,
y: posChild.y
}, 13, false, canvas, 0.7);
} else if (directionCat == "from-to") {
var direction = adj.data.$direction;
var inv = (direction && direction.length > 1 && direction[0] != adj.nodeFrom.id);
renderMidArrow({
x: pos.x,
y: pos.y
}, {
x: posChild.x,
y: posChild.y
}, 13, inv, canvas, 0.7);
renderMidArrow({
x: pos.x,
y: pos.y
}, {
x: posChild.x,
y: posChild.y
}, 13, inv, canvas, 0.3);
}
} //renderEdgeArrow
// defining custom edges
var edgeSettings = {
'customEdge': {
'render': function (adj, canvas) {
//get nodes cartesian coordinates
var pos = adj.nodeFrom.pos.getc(true);
var posChild = adj.nodeTo.pos.getc(true);
var directionCat = adj.getData("category");
//label placement on edges
renderEdgeArrows(this.edgeHelper, adj);
//check for edge label in data
var desc = adj.getData("desc");
var showDesc = adj.getData("showDesc");
if (desc != "" && showDesc) {
// '&amp;' to '&'
desc = decodeEntities(desc);
//now adjust the label placement
var ctx = canvas.getCtx();
ctx.font = 'bold 14px arial';
ctx.fillStyle = '#FFF';
ctx.textBaseline = 'hanging';
// helper function to determine how many lines are needed
// Line Splitter Function
// copyright Stephen Chapman, 19th April 2006
// you may copy this code but please keep the copyright notice as well
function splitLine(st, n) {
var b = '';
var s = st;
while (s.length > n) {
var c = s.substring(0, n);
var d = c.lastIndexOf(' ');
var e = c.lastIndexOf('\n');
if (e != -1) d = e;
if (d == -1) d = n;
b += c.substring(0, d) + '\n';
s = s.substring(d + 1);
}
return b + s;
}
var arrayOfLabelLines = splitLine(desc, 30).split('\n');
var index, lineWidths = [];
for (index = 0; index < arrayOfLabelLines.length; ++index) {
lineWidths.push(ctx.measureText(arrayOfLabelLines[index]).width)
}
var width = Math.max.apply(null, lineWidths) + 8;
var height = (16 * arrayOfLabelLines.length) + 8;
var x = (pos.x + posChild.x - width) / 2;
var y = ((pos.y + posChild.y) / 2) - height / 2;
var radius = 5;
//render background
ctx.beginPath();
ctx.moveTo(x + radius, y);
ctx.lineTo(x + width - radius, y);
ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
ctx.lineTo(x + width, y + height - radius);
ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
ctx.lineTo(x + radius, y + height);
ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
ctx.lineTo(x, y + radius);
ctx.quadraticCurveTo(x, y, x + radius, y);
ctx.closePath();
ctx.fill();
//render text
ctx.fillStyle = '#222222';
ctx.textAlign = 'center';
for (index = 0; index < arrayOfLabelLines.length; ++index) {
ctx.fillText(arrayOfLabelLines[index], x + (width / 2), y + 5 + (16 * index));
}
}
},
'contains': function (adj, pos) {
var from = adj.nodeFrom.pos.getc(true),
to = adj.nodeTo.pos.getc(true);
return this.edgeHelper.line.contains(from, to, pos, adj.Edge.epsilon);
}
}
}
var edgeSettingsEmbed = {
'customEdgeEmbed': {
'render': function (adj, canvas) {
//get nodes cartesian coordinates
var pos = adj.nodeFrom.pos.getc(true);
var posChild = adj.nodeTo.pos.getc(true);
var directionCat = adj.getData("category");
//label placement on edges
renderEdgeArrows(this.edgeHelper, adj);
//check for edge label in data
var desc = adj.getData("desc");
var showDesc = adj.getData("showDesc");
if (desc != "" && showDesc) {
// '&amp;' to '&'
desc = decodeEntities(desc);
//now adjust the label placement
var ctx = canvas.getCtx();
var radius = canvas.getSize();
var x = parseInt((pos.x + posChild.x - (desc.length * 5)) / 2);
var y = parseInt((pos.y + posChild.y) / 2);
ctx.font = 'bold 14px arial';
//render background
ctx.fillStyle = '#999';
var margin = 5;
var height = 14 + margin; //font size + margin
var CURVE = height / 2; //offset for curvy corners
var width = ctx.measureText(desc).width + 2 * margin - 2 * CURVE
var labelX = x - margin + CURVE;
var labelY = y - height + margin;
ctx.fillRect(labelX, labelY, width, height);
//curvy corners woo - circles in place of last CURVE pixels of rect
ctx.beginPath();
ctx.arc(labelX, labelY + CURVE, CURVE, 0, 2 * Math.PI, false);
ctx.arc(labelX + width, labelY + CURVE, CURVE, 0, 2 * Math.PI, false);
ctx.fill();
//render text
ctx.fillStyle = '#000';
ctx.fillText(desc, x, y);
}
},
'contains': function (adj, pos) {
var from = adj.nodeFrom.pos.getc(true),
to = adj.nodeTo.pos.getc(true);
return this.edgeHelper.line.contains(from, to, pos, adj.Edge.epsilon);
}
}
}
function drawSelectBox(eventInfo, e) {
Mconsole.plot();
var ctx = Mconsole.canvas.getCtx();
var startX = MetamapsModel.boxStartCoordinates.x,
startY = MetamapsModel.boxStartCoordinates.y,
currX = eventInfo.getPos().x,
currY = eventInfo.getPos().y;
Mconsole.plot();
ctx.beginPath();
ctx.moveTo(startX, startY);
ctx.lineTo(startX, currY);
ctx.lineTo(currX, currY);
ctx.lineTo(currX, startY);
ctx.lineTo(startX, startY);
ctx.strokeStyle = "black";
ctx.stroke();
}
function selectNodesWithBox() {
var sX = MetamapsModel.boxStartCoordinates.x,
sY = MetamapsModel.boxStartCoordinates.y,
eX = MetamapsModel.boxEndCoordinates.x,
eY = MetamapsModel.boxEndCoordinates.y;
Mconsole.graph.eachNode(function (n) {
var x = gType == "centered" ? n.pos.toComplex().x : n.pos.x,
y = gType == "centered" ? n.pos.toComplex().y : n.pos.y;
if ((sX < x && x < eX && sY < y && y < eY) || (sX > x && x > eX && sY > y && y > eY) || (sX > x && x > eX && sY < y && y < eY) || (sX < x && x < eX && sY > y && y > eY)) {
var nodeIsSelected = MetamapsModel.selectedNodes.indexOf(n);
if (nodeIsSelected == -1) selectNode(n); // the node is not selected, so select it
else if (nodeIsSelected != -1) deselectNode(n); // the node is selected, so deselect it
}
});
MetamapsModel.boxStartCoordinates = false;
MetamapsModel.boxEndCoordinates = false;
Mconsole.plot();
}
function onMouseMoveHandler(node, eventInfo, e) {
if (Mconsole.busy) return;
var node = eventInfo.getNode();
var edge = eventInfo.getEdge();
//if we're on top of a node object, act like there aren't edges under it
if (node != false) {
if (MetamapsModel.edgeHoveringOver) {
onMouseLeave(MetamapsModel.edgeHoveringOver);
}
$('canvas').css('cursor', 'pointer');
return;
}
if (edge == false && MetamapsModel.edgeHoveringOver != false) {
//mouse not on an edge, but we were on an edge previously
onMouseLeave(MetamapsModel.edgeHoveringOver);
} else if (edge != false && MetamapsModel.edgeHoveringOver == false) {
//mouse is on an edge, but there isn't a stored edge
onMouseEnter(edge);
} else if (edge != false && MetamapsModel.edgeHoveringOver != edge) {
//mouse is on an edge, but a different edge is stored
onMouseLeave(MetamapsModel.edgeHoveringOver)
onMouseEnter(edge);
}
//could be false
MetamapsModel.edgeHoveringOver = edge;
if (!node && !edge) {
$('canvas').css('cursor', 'default');
}
}
function onMouseEnter(edge) {
$('canvas').css('cursor', 'pointer');
var edgeIsSelected = MetamapsModel.selectedEdges.indexOf(edge);
//following if statement only executes if the edge being hovered over is not selected
if (edgeIsSelected == -1) {
edge.setData('showDesc', true, 'current');
edge.setDataset('end', {
lineWidth: 4,
alpha: 1
});
Mconsole.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
Mconsole.plot();
}
}
function onMouseLeave(edge) {
$('canvas').css('cursor', 'default');
var edgeIsSelected = MetamapsModel.selectedEdges.indexOf(edge);
//following if statement only executes if the edge being hovered over is not selected
if (edgeIsSelected == -1) {
edge.setData('showDesc', false, 'current');
edge.setDataset('end', {
lineWidth: 2,
alpha: 0.4
});
Mconsole.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
}
Mconsole.plot();
}
function onDragEndTopicHandler(node, eventInfo, e, allowRealtime) {
if (tempInit && tempNode2 == null) {
$('#topic_addSynapse').val("true");
$('#new_topic').fadeIn('fast');
$('#topic_name').focus();
} else if (tempInit && tempNode2 != null) {
$('#topic_addSynapse').val("false");
$('#synapse_topic1id').val(tempNode.id);
$('#synapse_topic2id').val(tempNode2.id);
$('#new_synapse').fadeIn('fast');
$('#synapse_desc').typeahead('setQuery', '').focus();
tempNode = null;
tempNode2 = null;
tempInit = false;
} else if (dragged && dragged != 0 && goRealtime) {
saveLayout(dragged);
for (var i = 0; i < MetamapsModel.selectedNodes.length; i++) {
saveLayout(MetamapsModel.selectedNodes[i].id);
}
}
} //onDragEndTopicHandler
function onDragCancelHandler(node, eventInfo, e, centred) {
tempNode = null;
tempNode2 = null;
tempInit = false;
//not sure why this doesn't happen for centred graphs
if (!centred) {
$('#topic_addSynapse').val("false");
$('#topic_topic1id').val(0);
$('#topic_topic2id').val(0);
}
Mconsole.plot();
}
// thanks to http://stackoverflow.com/questions/4338963/
// convert-html-character-entities-back-to-regular-text-using-javascript
function decodeEntities(desc) {
var str, temp = document.createElement('p');
temp.innerHTML = desc; //browser handles the entities
str = temp.textContent || temp.innerText;
temp = null; //delete the element;
return str;
} //decodeEntities

9761
app/assets/javascripts/Jit/jit2.0.0.js
View file

File diff suppressed because it is too large Load diff

143
app/assets/javascripts/Jit/loadgraphs.js
View file

@ -1,143 +0,0 @@
(function() {
var ua = navigator.userAgent,
iStuff = ua.match(/iPhone/i) || ua.match(/iPad/i),
typeOfCanvas = typeof HTMLCanvasElement,
nativeCanvasSupport = (typeOfCanvas == 'object' || typeOfCanvas == 'function'),
textSupport = nativeCanvasSupport
&& (typeof document.createElement('canvas').getContext('2d').fillText == 'function');
//I'm setting this based on the fact that ExCanvas provides text support for IE
//and that as of today iPhone/iPad current text support is lame
labelType = (!nativeCanvasSupport || (textSupport && !iStuff))? 'Native' : 'HTML';
nativeTextSupport = labelType == 'Native';
useGradients = nativeCanvasSupport;
animate = !(iStuff || !nativeCanvasSupport);
})();
// init custom node type
$jit.ForceDirected.Plot.NodeTypes.implement(nodeSettings);
//implement an edge type
$jit.ForceDirected.Plot.EdgeTypes.implement(edgeSettings);
$jit.ForceDirected.Plot.EdgeTypes.implement(edgeSettingsEmbed);
// end
// init custom node type
$jit.RGraph.Plot.NodeTypes.implement(nodeSettings);
//implement an edge type
$jit.RGraph.Plot.EdgeTypes.implement(edgeSettings);
// end
function initialize(type, loadLater, embed){
if (loadLater == null) {
loadlater = false;
}
if (embed == null) {
embed = false;
}
viewMode = "graph";
gType = type;
if ( type == "centered") {
// init Rgraph
Mconsole = new $jit.RGraph(graphSettings(type));
}
else if ( type == "arranged" || type == "chaotic" ) {
// init ForceDirected
Mconsole = new $jit.ForceDirected(graphSettings(type, embed));
}
else {
alert("You didn't specify a type!");
return false;
}
// load JSON data.
if (!loadLater) {
Mconsole.busy = true;
Mconsole.loadJSON(json);
// choose how to plot and animate the data onto the screen
var chooseAnimate;
if ( type == "centered") {
// compute positions incrementally and animate.
//trigger small animation
Mconsole.graph.eachNode(function(n) {
var pos = n.getPos();
pos.setc(-200, -200);
});
Mconsole.compute('end');
chooseAnimate = {
modes:['polar'],
duration: 2000,
onComplete: function() {
Mconsole.busy = false;
}
};
}
else if ( type == "arranged" ) {
// compute positions incrementally and animate.
Mconsole.graph.eachNode(function(n) {
var pos = n.getPos();
pos.setc(0, 0);
var newPos = new $jit.Complex();
newPos.x = n.data.$xloc;
newPos.y = n.data.$yloc;
n.setPos(newPos, 'end');
});
chooseAnimate = {
modes: ['linear'],
transition: $jit.Trans.Quad.easeInOut,
duration: 2500,
onComplete: function() {
Mconsole.busy = false;
}
};
}
else if ( type == "chaotic" ) {
// compute positions incrementally and animate.
Mconsole.compute();
chooseAnimate = {
modes: ['linear'],
transition: $jit.Trans.Elastic.easeOut,
duration: 2500,
onComplete: function() {
Mconsole.busy = false;
}
};
}
$(document).ready(function() {
if ( type == "centered") {
Mconsole.fx.animate(chooseAnimate);
}
else if ( type == "arranged" || type == "chaotic") {
Mconsole.animate(chooseAnimate);
}
// prevent touch events on the canvas from default behaviour
$("#infovis-canvas").bind('touchstart', function(event) {
event.preventDefault();
Mconsole.events.touched = true;
});
// prevent touch events on the canvas from default behaviour
$("#infovis-canvas").bind('touchmove', function(event) {
//touchPanZoomHandler(event);
});
// prevent touch events on the canvas from default behaviour
$("#infovis-canvas").bind('touchend touchcancel', function(event) {
lastDist = 0;
if (!Mconsole.events.touchMoved && !touchDragNode) hideCurrentCard();
Mconsole.events.touched = Mconsole.events.touchMoved = false;
touchDragNode = false;
});
});
// end
}// if not loadLater
}

11
app/assets/javascripts/Jit/permissions.js
View file

@ -1,11 +0,0 @@
function authorizeToEdit(obj) {
if (userid && (obj.data.$permission == "commons" || obj.data.$userid == userid)) return true;
else return false;
}
function mk_permission(obj) {
if (obj.getData("permission") == "commons") return "co";
else if (obj.getData("permission") == "public") return "pu";
else if (obj.getData("permission") == "private") return "pr";
}

439
app/assets/javascripts/Jit/select-edit-delete-nodes-and-edges.js
View file

@ -1,439 +0,0 @@
function centerOn(nodeid) {
if (!Mconsole.busy) {
var node = Mconsole.graph.getNode(nodeid);
$('div.index img').attr('src', imgArray[node.getData('metacode')].src);
$('div.index .mapName').html(node.name);
$(document).attr('title', node.name + ' | Metamaps');
window.history.pushState(node.name, "Metamaps", "/topics/" + node.id);
Mconsole.onClick(node.id, {
hideLabels: false,
duration: 1000,
onComplete: function () {
fetchRelatives(node);
}
});
}
}
function editEdge(edge, e) {
//reset so we don't interfere with other edges, but first, save its x and y
var myX = $('#edit_synapse').css('left');
var myY = $('#edit_synapse').css('top');
$('#edit_synapse').remove();
//so label is missing while editing
deselectEdge(edge);
//create the wrapper around the form elements, including permissions
//classes to make best_in_place happy
var edit_div = document.createElement('div');
edit_div.setAttribute('id', 'edit_synapse');
if (authorizeToEdit(edge)) {
edit_div.className = 'permission canEdit';
edit_div.className += edge.getData('userid') === userid ? ' yourEdge' : '';
} else {
edit_div.className = 'permission cannotEdit';
}
$('.main .wrapper').append(edit_div);
populateEditEdgeForm(edge);
//drop it in the right spot, activate it
$('#edit_synapse').css('position', 'absolute');
if (e) {
$('#edit_synapse').css('left', e.clientX);
$('#edit_synapse').css('top', e.clientY);
} else {
$('#edit_synapse').css('left', myX);
$('#edit_synapse').css('top', myY);
}
//$('#edit_synapse_name').click(); //required in case name is empty
//$('#edit_synapse_name input').focus();
$('#edit_synapse').show();
MetamapsModel.edgecardInUse = edge.data.$id;
}
function populateEditEdgeForm(edge) {
add_name_form(edge);
add_user_info(edge);
add_perms_form(edge);
if (authorizeToEdit(edge)) {
add_direction_form(edge);
}
}
function add_name_form(edge) {
var data_nil = '<span class="gray">Click to add description.</span>';
//name editing form
$('#edit_synapse').append('<div id="edit_synapse_name"></div>');
$('#edit_synapse_name').attr('class', 'best_in_place best_in_place_desc');
$('#edit_synapse_name').attr('data-object', 'synapse');
$('#edit_synapse_name').attr('data-attribute', 'desc');
$('#edit_synapse_name').attr('data-type', 'textarea');
$('#edit_synapse_name').attr('data-nil', data_nil);
$('#edit_synapse_name').attr('data-url', '/synapses/' + edge.getData("id"));
$('#edit_synapse_name').html(edge.getData("desc"));
//if edge data is blank or just whitespace, populate it with data_nil
if ($('#edit_synapse_name').html().trim() == '') {
$('#edit_synapse_name').html(data_nil);
}
$('#edit_synapse_name').bind("ajax:success", function () {
var desc = $(this).html();
if (desc == data_nil) {
edge.setData("desc", '');
} else {
edge.setData("desc", desc);
}
selectEdge(edge);
Mconsole.plot();
});
}
function add_user_info(edge) {
$('#edit_synapse').append('<div id="edgeUser" class="hoverForTip"><div class="tip">Created by ' + edge.getData("username") + '</div></div>');
}
function add_perms_form(edge) {
//permissions - if owner, also allow permission editing
$('#edit_synapse').append('<div class="mapPerm ' + mk_permission(edge) + '"></div>');
// ability to change permission
var selectingPermission = false;
if (userid == edge.getData('userid')) {
$('#edit_synapse.yourEdge .mapPerm').click(function () {
if (!selectingPermission) {
selectingPermission = true;
$(this).addClass('minimize'); // this line flips the drop down arrow to a pull up arrow
if ($(this).hasClass('co')) {
$(this).append('<ul class="permissionSelect"><li class="public"></li><li class="private"></li></ul>');
} else if ($(this).hasClass('pu')) {
$(this).append('<ul class="permissionSelect"><li class="commons"></li><li class="private"></li></ul>');
} else if ($(this).hasClass('pr')) {
$(this).append('<ul class="permissionSelect"><li class="commons"></li><li class="public"></li></ul>');
}
$('#edit_synapse .permissionSelect li').click(function (event) {
selectingPermission = false;
var permission = $(this).attr('class');
updateSynapsePermission(edge, permission);
event.stopPropagation();
});
} else {
selectingPermission = false;
$(this).removeClass('minimize'); // this line flips the pull up arrow to a drop down arrow
$('#edit_synapse .permissionSelect').remove();
}
});
}
} //add_perms_form
function add_direction_form(edge) {
//directionality checkboxes
$('#edit_synapse').append('<input type="checkbox" id="edit_synapse_left">');
$('#edit_synapse').append('<label class="left">&lt;</label>');
$('#edit_synapse').append('<input type="checkbox" id="edit_synapse_right">');
$('#edit_synapse').append('<label class="right">&gt;</label>');
//determine which node is to the left and the right
//if directly in a line, top is left
if (edge.nodeFrom.pos.x < edge.nodeTo.pos.x ||
edge.nodeFrom.pos.x == edge.nodeTo.pos.x &&
edge.nodeFrom.pos.y < edge.nodeTo.pos.y) {
var left = edge.nodeTo;
var right = edge.nodeFrom;
} else {
var left = edge.nodeFrom;
var right = edge.nodeTo;
}
/*
* One node is actually on the left onscreen. Call it left, & the other right.
* If category is from-to, and that node is first, check the 'right' checkbox.
* Else check the 'left' checkbox since the arrow is incoming.
*/
var directionCat = edge.getData('category'); //both, none, from-to
if (directionCat == 'from-to') {
var from_to = edge.getData('direction');
if (from_to[0] == left.id) {
//check left checkbox
$('#edit_synapse_left').prop('checked', true);
} else {
//check right checkbox
$('#edit_synapse_right').prop('checked', true);
}
} else if (directionCat == 'both') {
//check both checkboxes
$('#edit_synapse_left').prop('checked', true);
$('#edit_synapse_right').prop('checked', true);
}
$('#edit_synapse_left, #edit_synapse_right').click(function () {
var leftChecked = $('#edit_synapse_left').is(':checked');
var rightChecked = $('#edit_synapse_right').is(':checked');
var dir = edge.getData('direction');
var dirCat = 'none';
if (leftChecked && rightChecked) {
dirCat = 'both';
} else if (!leftChecked && rightChecked) {
dirCat = 'from-to';
dir = [right.id, left.id];
} else if (leftChecked && !rightChecked) {
dirCat = 'from-to';
dir = [left.id, right.id];
}
$.ajax({
'type': 'PUT',
'url': '/synapses/' + edge.getData('id'),
'data': {
synapse: {
category: dirCat
},
node1_id: {
node1: dir[0]
},
node2_id: {
node2: dir[1]
}
},
'success': function (data) {
updateEdgeDisplay(edge, dir, dirCat);
}
});
});
} //add_direction_form
function updateEdgeDisplay(edge, dir, dirCat) {
edge.setData('category', dirCat);
edge.setData('direction', dir);
//render mid arrow
//renderEdgeArrows(Mconsole.fx.edgeHelper, edge);
Mconsole.plot();
}
function deselectAllEdges() {
var l = MetamapsModel.selectedEdges.length;
for (var i = l - 1; i >= 0; i -= 1) {
var edge = MetamapsModel.selectedEdges[i];
deselectEdge(edge);
}
}
function deselectAllNodes() {
var l = MetamapsModel.selectedNodes.length;
for (var i = l - 1; i >= 0; i -= 1) {
var node = MetamapsModel.selectedNodes[i];
deselectNode(node);
}
}
// this is for hiding one topic from your canvas
function removeEdge(edge) {
var id = edge.getData("id");
$.ajax({
type: "DELETE",
url: "/synapses/" + id,
success: function () {
hideEdge(edge);
},
});
}
function hideEdge(edge) {
var from = edge.nodeFrom.id;
var to = edge.nodeTo.id;
edge.setData('alpha', 0, 'end');
Mconsole.fx.animate({
modes: ['edge-property:alpha'],
duration: 1000
});
Mconsole.graph.removeAdjacence(from, to);
Mconsole.plot();
}
function hideSelectedEdges() {
var l = MetamapsModel.selectedEdges.length;
for (var i = l - 1; i >= 0; i -= 1) {
var edge = MetamapsModel.selectedEdges[i];
hideEdge(edge);
}
MetamapsModel.selectedEdges = new Array();
}
function removeSelectedEdges() {
var l = MetamapsModel.selectedEdges.length;
for (var i = l - 1; i >= 0; i -= 1) {
if (mapid != null) {
var edge = MetamapsModel.selectedEdges[i];
var id = edge.getData("id");
//delete mapping of id mapid
$.ajax({
type: "POST",
url: "/synapses/" + mapid + "/" + id + "/removefrommap",
});
}
hideEdge(edge);
}
MetamapsModel.selectedEdges = new Array();
}
function deleteSelectedEdges() {
var l = MetamapsModel.selectedEdges.length;
for (var i = l - 1; i >= 0; i -= 1) {
var edge = MetamapsModel.selectedEdges[i];
var id = edge.getData("id");
$.ajax({
type: "DELETE",
url: "/synapses/" + id,
});
hideEdge(edge);
}
MetamapsModel.selectedEdges = new Array();
}
function selectNode(node) {
if (MetamapsModel.selectedNodes.indexOf(node) != -1) return;
node.selected = true;
node.setData('dim', 30, 'current');
node.setData('whiteCircle', true);
node.eachAdjacency(function (adj) {
selectEdge(adj);
});
MetamapsModel.selectedNodes.push(node);
}
function deselectNode(node) {
delete node.selected;
node.setData('whiteCircle', false);
node.eachAdjacency(function (adj) {
deselectEdge(adj);
});
node.setData('dim', 25, 'current');
//remove the node
MetamapsModel.selectedNodes.splice(
MetamapsModel.selectedNodes.indexOf(node), 1);
}
function selectEdge(edge) {
if (MetamapsModel.selectedEdges.indexOf(edge) != -1) return;
edge.setData('showDesc', true, 'current');
if (!MetamapsModel.embed) {
edge.setDataset('end', {
lineWidth: 4,
color: '#FFFFFF',
alpha: 1
});
} else if (MetamapsModel.embed) {
edge.setDataset('end', {
lineWidth: 4,
color: '#999',
alpha: 1
});
}
Mconsole.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
MetamapsModel.selectedEdges.push(edge);
}
function deselectEdge(edge) {
edge.setData('showDesc', false, 'current');
edge.setDataset('end', {
lineWidth: 2,
color: '#222222',
alpha: 0.4
});
if (MetamapsModel.edgeHoveringOver == edge) {
edge.setData('showDesc', true, 'current');
edge.setDataset('end', {
lineWidth: 4,
color: '#222222',
alpha: 1
});
}
Mconsole.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
//remove the edge
MetamapsModel.selectedEdges.splice(
MetamapsModel.selectedEdges.indexOf(edge), 1);
}
// this is for hiding one topic from your canvas
function hideNode(nodeid) {
var node = Mconsole.graph.getNode(nodeid);
if (nodeid == Mconsole.root && gType == "centered") {
alert("You can't hide this topic, it is the root of your graph.");
return;
}
deselectNode(node);
node.setData('alpha', 0, 'end');
node.eachAdjacency(function (adj) {
adj.setData('alpha', 0, 'end');
});
Mconsole.fx.animate({
modes: ['node-property:alpha',
'edge-property:alpha'],
duration: 1000
});
Mconsole.graph.removeNode(nodeid);
}
function hideSelectedNodes() {
var l = MetamapsModel.selectedNodes.length;
for (var i = l - 1; i >= 0; i -= 1) {
var node = MetamapsModel.selectedNodes[i];
hideNode(node.id);
}
}
function removeNode(nodeid) {
var node = Mconsole.graph.getNode(nodeid);
deselectNode(node);
if (mapperm) {
$.ajax({
type: "POST",
url: "/topics/" + mapid + "/" + nodeid + "/removefrommap",
});
}
}
function removeSelectedNodes() {
if (mapperm) {
var l = MetamapsModel.selectedNodes.length;
for (var i = l - 1; i >= 0; i -= 1) {
var node = MetamapsModel.selectedNodes[i];
removeNode(node.id);
}
}
}
function deleteNode(nodeid) {
if (nodeid == Mconsole.root && gType == "centered") {
alert("You can't delete this topic, it is the root of your graph.");
return;
}
$.ajax({
type: "DELETE",
url: "/topics/" + nodeid,
});
}
function deleteSelectedNodes() {
var l = MetamapsModel.selectedNodes.length;
for (var i = l - 1; i >= 0; i -= 1) {
var node = MetamapsModel.selectedNodes[i];
deleteNode(node.id);
}
}

213
app/assets/javascripts/Jit/topicCard.js
View file

@ -1,213 +0,0 @@
/*
* @file
* There is a lot of code that goes into creating the "label" of a node
* This includes editable cards with all node details, and some controls
* onCreateLabelHandler is the main function of this file, and the file
* also contains a bunch of helper functions
*
* html and littleHTML are potentially confusing variables
* html is the contents of the card shown when you click on a node's label.
* littleHTML creates little controls for removing/hiding nodes from the canvas
*
* This function features PHP-style variable substitution because the strings
* are so damn long. Values are identified by $_id_$, and then a regular
* expression is substituted in later (for html, in a separate function).
*/
function buildCardWithHogan(node) {
var nodeValues = {};
var authorized = authorizeToEdit(node);
//link is rendered differently if user is logged out or in
var go_link, a_tag, close_a_tag;
if (!authorized) {
go_link = '';
if (node.getData("link") != "") {
a_tag = '<a href="' + node.getData("link") + '" target="_blank">';
close_a_tag = '</a>';
} else {
a_tag = '';
close_a_tag = '';
}
} else {
go_link = '<a href="' + node.getData("link") + '" ' +
' class="go-link" target="_blank"></a>';
a_tag = '';
close_a_tag = '';
}
var desc_nil = "Click to add description...";
var link_nil = "Click to add link...";
nodeValues.permission = node.getData("permission");
nodeValues.mk_permission = mk_permission(node);
nodeValues.map_count = node.getData("inmaps").length;
nodeValues.synapse_count = node.getData("synapseCount");
nodeValues.id = node.id;
nodeValues.metacode = node.getData("metacode");
nodeValues.metacode_class = 'mbg' + node.getData("metacode").replace(/\s/g, '');
nodeValues.imgsrc = imgArray[node.getData("metacode")].src;
nodeValues.name = node.name;
nodeValues.userid = node.getData("userid");
nodeValues.username = node.getData("username");
nodeValues.date = node.getData("date");
// the code for this is stored in /views/main/_metacodeOptions.html.erb
nodeValues.metacode_select = $('#metacodeOptions').html();
nodeValues.go_link = go_link;
nodeValues.a_tag = a_tag;
nodeValues.close_a_tag = close_a_tag;
nodeValues.link_nil = link_nil;
nodeValues.link = (node.getData("link") == "" && authorized) ? link_nil : node.getData("link");
nodeValues.desc_nil = desc_nil;
nodeValues.desc = (node.getData("desc") == "" && authorized) ? desc_nil : node.getData("desc");
// the code for the template is stored in /views/layouts/_templates.html.erb
var hoganTemplate = Hogan.compile($('#topicCardTemplate').html());
return hoganTemplate.render(nodeValues);
}
function hideCurrentCard() {
if (MetamapsModel.showcardInUse) {
var node = Mconsole.graph.getNode(MetamapsModel.showcardInUse);
hideCard(node);
}
}
function hideCard(node) {
var card = '.showcard';
$(card).fadeOut('fast', function () {
//node.setData('dim', 25, 'current');
Mconsole.plot();
});
MetamapsModel.showcardInUse = null;
}
function populateShowCard(node) {
var showCard = document.getElementById('showcard');
$(showCard).find('.permission').remove();
var html = buildCardWithHogan(node);
if (authorizeToEdit(node)) {
var perm = document.createElement('div');
var string = 'permission canEdit';
if (userid == node.data.$userid) string += ' yourTopic';
perm.className = string;
perm.innerHTML = html;
showCard.appendChild(perm);
} else {
var perm = document.createElement('div');
perm.className = 'permission cannotEdit';
perm.innerHTML = html;
showCard.appendChild(perm);
}
var selectingMetacode = false;
// attach the listener that shows the metacode title when you hover over the image
$('.showcard .metacodeImage').mouseenter(function () {
$('.showcard .icon').css('z-index', '4');
$('.showcard .metacodeTitle').show();
});
$('.showcard .linkItem.icon').mouseleave(function () {
if (!selectingMetacode) {
$('.showcard .metacodeTitle').hide();
$('.showcard .icon').css('z-index', '1');
}
});
$('.showcard .metacodeTitle').click(function () {
if (!selectingMetacode) {
selectingMetacode = true;
$(this).addClass('minimize'); // this line flips the drop down arrow to a pull up arrow
$('.metacodeSelect').show();
// add the scroll bar to the list of metacode select options if it isn't already there
if (!$('.metacodeSelect ul').hasClass('mCustomScrollbar')) {
$('.metacodeSelect ul').mCustomScrollbar({
mouseWheelPixels: 200,
advanced: {
updateOnContentResize: true
}
});
$('.metacodeSelect li').click(function () {
selectingMetacode = false;
var metacodeName = $(this).find('.mSelectName').text();
updateMetacode(node, metacodeName);
});
}
} else {
selectingMetacode = false;
$(this).removeClass('minimize'); // this line flips the pull up arrow to a drop down arrow
$('.metacodeSelect').hide();
}
});
// ability to change permission
var selectingPermission = false;
if (userid == node.data.$userid) {
$('.showcard .yourTopic .mapPerm').click(function () {
if (!selectingPermission) {
selectingPermission = true;
$(this).addClass('minimize'); // this line flips the drop down arrow to a pull up arrow
if ($(this).hasClass('co')) {
$(this).append('<ul class="permissionSelect"><li class="public"></li><li class="private"></li></ul>');
} else if ($(this).hasClass('pu')) {
$(this).append('<ul class="permissionSelect"><li class="commons"></li><li class="private"></li></ul>');
} else if ($(this).hasClass('pr')) {
$(this).append('<ul class="permissionSelect"><li class="commons"></li><li class="public"></li></ul>');
}
$('.permissionSelect li').click(function (event) {
selectingPermission = false;
var permission = $(this).attr('class');
updateTopicPermission(node, permission);
event.stopPropagation();
});
} else {
selectingPermission = false;
$(this).removeClass('minimize'); // this line flips the pull up arrow to a drop down arrow
$('.permissionSelect').remove();
}
});
}
// when you're typing a description, resize the scroll box to have space
$('.best_in_place_desc textarea').bind('keyup', function () {
var s = $('.showcard').find('.scroll');
s.height(s.height()).mCustomScrollbar('update');
console.log('working');
});
//bind best_in_place ajax callbacks
$(showCard).find('.best_in_place_name').bind("ajax:success", function () {
var s = $('.showcard').find('.scroll');
s.height(s.height()).mCustomScrollbar('update');
var name = $(this).html();
node.name = decodeEntities(name);
Mconsole.plot();
});
$(showCard).find('.best_in_place_desc').bind("ajax:success", function () {
this.innerHTML = this.innerHTML.replace(/\r/g, '')
var s = $('.showcard').find('.scroll');
s.height(s.height()).mCustomScrollbar('update');
var desc = $(this).html();
node.setData("desc", desc);
});
$(showCard).find('.best_in_place_link').bind("ajax:success", function () {
var link = $(this).html();
$(showCard).find('.go-link').attr('href', link);
node.setData("link", link);
});
}

303
app/assets/javascripts/application.js
View file

@ -20,307 +20,8 @@
//= require jquery.roundabout.min
//= require bip
//= require jquery_ujs
//= require hogan-2.0.0
//= require socket.io
//= require typeahead
//= require underscore
//= require backbone
//= require_directory ./carousel
// require_directory ./Jit
//= require_directory ./jquery
//= require_directory ./realtime
//= require hogan-2.0.0
//= require_directory ./scroll
//= require_directory ./typing
// other options are 'graph'
var viewMode = "list";
var labelType, useGradients, nativeTextSupport, animate, json, Mconsole = null,
gType, tempNode = null,
tempInit = false,
tempNode2 = null,
metacodeIMGinit = false,
goRealtime = false,
mapid = null,
mapperm = false,
touchPos, touchDragNode, mouseIsDown = false;
// this is to save the layout of a map
function saveLayoutAll() {
$('.sidebarSave .tip').html('Saving...');
var coor = "";
if (gType == "arranged" || gType == "chaotic") {
Mconsole.graph.eachNode(function (n) {
coor = coor + n.getData("mappingid") + '/' + n.pos.x + '/' + n.pos.y + ',';
});
coor = coor.slice(0, -1);
$('#map_coordinates').val(coor);
$('#saveMapLayout').submit();
}
}
// this is to update the location coordinate of a single node on a map
function saveLayout(id) {
var n = Mconsole.graph.getNode(id);
$('#map_coordinates').val(n.getData("mappingid") + '/' + n.pos.x + '/' + n.pos.y);
$('#saveMapLayout').submit();
dragged = 0;
//$('.wandSaveLayout').html('Saved!');
//setTimeout(function(){$('.wandSaveLayout').html('Save Layout')},1500);
}
// this is to save your console to a map
function saveToMap() {
var nodes_data = "",
synapses_data = "";
var synapses_array = new Array();
Mconsole.graph.eachNode(function (n) {
//don't add to the map if it was filtered out
if (categoryVisible[n.getData('metacode')] == false) {
return;
}
var x, y;
if (n.pos.x && n.pos.y) {
x = n.pos.x;
y = n.pos.y;
} else {
var x = Math.cos(n.pos.theta) * n.pos.rho;
var y = Math.sin(n.pos.theta) * n.pos.rho;
}
nodes_data += n.id + '/' + x + '/' + y + ',';
n.eachAdjacency(function (adj) {
synapses_array.push(adj.getData("id"));
});
});
//get unique values only
synapses_array = $.grep(synapses_array, function (value, key) {
return $.inArray(value, synapses_array) === key;
});
synapses_data = synapses_array.join();
nodes_data = nodes_data.slice(0, -1);
$('#map_topicsToMap').val(nodes_data);
$('#map_synapsesToMap').val(synapses_data);
openLightbox('forkmap');
}
function fetchRelatives(node) {
var myA = $.ajax({
type: "Get",
url: "/topics/" + node.id + "?format=json",
success: function (data) {
if (gType == "centered") {
Mconsole.busy = true;
Mconsole.op.sum(data, {
type: 'fade',
duration: 500,
hideLabels: false
});
Mconsole.graph.eachNode(function (n) {
n.eachAdjacency(function (a) {
if (!a.getData('showDesc')) {
a.setData('alpha', 0.4, 'start');
a.setData('alpha', 0.4, 'current');
a.setData('alpha', 0.4, 'end');
}
});
});
Mconsole.busy = false;
} else {
Mconsole.op.sum(data, {
type: 'nothing',
});
Mconsole.plot();
}
},
error: function () {
alert('failure');
}
});
}
// @param node = JIT node object
// @param metacode = STRING like "Idea", "Action", etc.
function updateMetacode(node, metacode) {
var mdata = {
"topic": {
"metacode": metacode
}
};
$.ajax({
type: "PUT",
dataType: 'json',
url: "/topics/" + node.id,
data: mdata,
success: function (data) {
$('.CardOnGraph').find('.metacodeTitle').text(metacode)
.attr('class', 'metacodeTitle mbg' + metacode.replace(/\s/g, ''));
$('.CardOnGraph').find('.metacodeImage').css('background-image', 'url(' + imgArray[metacode].src + ')');
node.setData("metacode", metacode);
Mconsole.plot();
$('.metacodeTitle').removeClass('minimize'); // this line flips the pull up arrow to a drop down arrow
$('.metacodeSelect').hide();
setTimeout(function () {
$('.metacodeTitle').hide();
$('.showcard .icon').css('z-index', '1');
}, 500);
},
error: function () {
alert('failed to update metacode');
}
});
}
function updateMetacodeSet(set, index, custom) {
if (custom && MetamapsModel.newSelectedMetacodes.length == 0) {
alert('Please select at least one metacode to use!');
return false;
}
var codesToSwitchTo;
MetamapsModel.selectedMetacodeSetIndex = index;
MetamapsModel.selectedMetacodeSet = "metacodeset-" + set;
if (!custom) {
codesToSwitchTo = $('#metacodeSwitchTabs' + set).attr('data-metacodes').split(',');
$('.customMetacodeList li').addClass('toggledOff');
MetamapsModel.selectedMetacodes = [];
MetamapsModel.selectedMetacodeNames = [];
MetamapsModel.newSelectedMetacodes = [];
MetamapsModel.newSelectedMetacodeNames = [];
}
if (custom) {
// uses .slice to avoid setting the two arrays to the same actual array
MetamapsModel.selectedMetacodes = MetamapsModel.newSelectedMetacodes.slice(0);
MetamapsModel.selectedMetacodeNames = MetamapsModel.newSelectedMetacodeNames.slice(0);
codesToSwitchTo = MetamapsModel.selectedMetacodeNames.slice(0);
}
// sort by name
codesToSwitchTo.sort();
codesToSwitchTo.reverse();
$('#metacodeImg, #metacodeImgTitle').empty();
$('#metacodeImg').removeData('cloudcarousel');
var newMetacodes = "";
for (var i = 0; i < codesToSwitchTo.length; i++) {
newMetacodes += '<img class="cloudcarousel" width="40" height="40" src="' + imgArray[codesToSwitchTo[i]].src + '" title="' + codesToSwitchTo[i] + '" alt="' + codesToSwitchTo[i] + '"/>';
};
$('#metacodeImg').empty().append(newMetacodes).CloudCarousel({
titleBox: $('#metacodeImgTitle'),
yRadius: 40,
xPos: 150,
yPos: 40,
speed: 0.3,
mouseWheel: true,
bringToFront: true
});
$('#lightbox_overlay').hide();
$('#topic_name').focus();
var mdata = {
"metacodes": {
"value": custom ? MetamapsModel.selectedMetacodes.toString() : MetamapsModel.selectedMetacodeSet
}
};
$.ajax({
type: "POST",
dataType: 'json',
url: "/user/updatemetacodes",
data: mdata,
success: function (data) {
console.log('selected metacodes saved');
},
error: function () {
console.log('failed to save selected metacodes');
}
});
}
function cancelMetacodeSetSwitch() {
if (MetamapsModel.selectedMetacodeSet != "metacodeset-custom") {
$('.customMetacodeList li').addClass('toggledOff');
MetamapsModel.selectedMetacodes = [];
MetamapsModel.selectedMetacodeNames = [];
MetamapsModel.newSelectedMetacodes = [];
MetamapsModel.newSelectedMetacodeNames = [];
} else { // custom set is selected
// reset it to the current actual selection
$('.customMetacodeList li').addClass('toggledOff');
for (var i = 0; i < MetamapsModel.selectedMetacodes.length; i++) {
$('#' + MetamapsModel.selectedMetacodes[i]).removeClass('toggledOff');
};
// uses .slice to avoid setting the two arrays to the same actual array
MetamapsModel.newSelectedMetacodeNames = MetamapsModel.selectedMetacodeNames.slice(0);
MetamapsModel.newSelectedMetacodes = MetamapsModel.selectedMetacodes.slice(0);
}
$('#metacodeSwitchTabs').tabs("select", MetamapsModel.selectedMetacodeSetIndex);
$('#topic_name').focus();
}
function MconsoleReset() {
var tX = Mconsole.canvas.translateOffsetX;
var tY = Mconsole.canvas.translateOffsetY;
Mconsole.canvas.translate(-tX, -tY);
var mX = Mconsole.canvas.scaleOffsetX;
var mY = Mconsole.canvas.scaleOffsetY;
Mconsole.canvas.scale((1 / mX), (1 / mY));
}
function openLightbox(which) {
$('.lightboxContent').hide();
$('#' + which).show();
$('#lightbox_overlay').show();
$('#lightbox_main').css('margin-top', '-' + ($('#lightbox_main').height() / 2) + 'px');
if (!MetamapsModel.metacodeScrollerInit) {
$('.customMetacodeList, .metacodeSetList').mCustomScrollbar({
mouseWheelPixels: 200,
advanced: {
updateOnContentResize: true
}
});
MetamapsModel.metacodeScrollerInit = true;
}
if (which == "switchMetacodes") {
MetamapsModel.isSwitchingSet = true;
}
}
function closeLightbox() {
$('#lightbox_overlay').hide();
cancelMapCreate('fork_map');
cancelMapCreate('new_map');
if (MetamapsModel.isSwitchingSet) {
cancelMetacodeSetSwitch();
MetamapsModel.isSwitchingSet = false;
}
}
function cancelMapCreate(id) {
var form = $('#' + id);
form.find('#map_name').val('');
form.find('#map_desc').val('');
form.find('#map_permission').val('commons');
if (id == "fork_map") {
form.find('#map_topicsToMap').val('0');
form.find('#map_synapsesToMap').val('0');
}
form.find('.mapPermIcon').removeClass('selected');
form.find('.mapCommonsIcon').addClass('selected');
return false;
}
//= require ./metamaps/Metamaps.GlobalUI

9
app/assets/javascripts/map.js → app/assets/javascripts/compileMapPages.js
View file

@ -10,5 +10,10 @@
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require ./metamaps/metamapsJIT
//= require ./metamaps/metamaps
//= require socket.io
//= require underscore
//= require backbone
//= require_directory ./carousel
//= require ./metamaps/JIT
//= require ./metamaps/Metamaps
//= require ./metamaps/Metamaps.JIT

98
app/assets/javascripts/jquery/AllMappingPages.js vendored
View file

@ -1,98 +0,0 @@
/* AllMappingPages means:
1. being logged in or logged out and,
2. either
a. being on a Map page, or
b. being on a Topic page
*/
$(document).ready(function () {
// initialize topic card draggability and resizability
$('.showcard').draggable({
handle: ".metacodeImage"
});
$('#showcard').resizable({
maxHeight: 500,
maxWidth: 500,
minHeight: 320,
minWidth: 226,
resize: function (event, ui) {
var p = $('#showcard').find('.scroll');
p.height(p.height()).mCustomScrollbar('update');
}
}).css({
display: 'none',
top: '300px',
left: '100px'
});
function bindFilterHover() {
var filterIsOpen = false;
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeFilter = function () {
lT = setTimeout(function () {
if (!sliding1) {
sliding1 = true;
$('.sidebarFilterIcon').css('background-color', '#0F1519');
$('.sidebarFilterBox').fadeOut(200, function () {
sliding1 = false;
filterIsOpen = false;
});
}
}, 300);
}
var openFilter = function () {
clearTimeout(lT);
if (!sliding1) {
sliding1 = true;
// hide the other two
$('.sidebarAccountBox').hide();
$('.sidebarCollaborateBox').hide();
//$('.sidebarAccountIcon').css('background-color', '#0F1519');
$('.sidebarCollaborateIcon').css('background-color', '#0F1519');
$('.sidebarFilterIcon').css('background-color', '#000');
$('.sidebarFilterBox').fadeIn(200, function () {
sliding1 = false;
filterIsOpen = true;
});
}
}
// bind the hover events
$(".sidebarFilter").hover(openFilter, closeFilter);
} // end bindFilterHover
bindFilterHover();
// initialize scroll bar for filter by metacode, then hide it and position it correctly again
$("#filter_by_metacode").mCustomScrollbar({
mouseWheelPixels: 200,
advanced: {
updateOnContentResize: true
}
});
$('.sidebarFilterBox').hide().css({
position: 'absolute',
top: '35px',
right: '-36px'
});
// prevent right clicks on the main canvas, so as to not get in the way of our right clicks
$('#center-container').bind('contextmenu', function (e) {
return false;
});
// tab the cheatsheet
$('#cheatSheet').tabs().addClass("ui-tabs-vertical ui-helper-clearfix");
$("#cheatSheet .ui-tabs-nav li").removeClass("ui-corner-top").addClass("ui-corner-left");
}); // end document.ready

19
app/assets/javascripts/jquery/AuthAllMappingPages.js vendored
View file

@ -1,19 +0,0 @@
/* AuthAllMappingPages means:
1. being logged in and,
2. either
a. being on a Map page, or
b. being on a Topic page
*/
$(document).ready(function () {
$('.sidebarFork').click(function () {
saveToMap();
});
// initialize best_in_place editing
$('.authenticated div.permission.canEdit .best_in_place').best_in_place();
}); // end document.ready

97
app/assets/javascripts/jquery/AuthCanEditMapPage.js vendored
View file

@ -1,97 +0,0 @@
/* authCanEditMapPage means:
1. being logged in and,
2. being on a Map page and having edit permissions (your map, or commons map)
*/
$(document).ready(function () {
function bindRealtimeHover() {
var realtimeIsOpen = false
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeRealtime = function () {
lT = setTimeout(function () {
if (!sliding1) {
sliding1 = true;
$('.sidebarCollaborateIcon').css('background-color', '#0F1519');
$('.sidebarCollaborateBox').fadeOut(200, function () {
sliding1 = false;
realtimeIsOpen = false;
});
}
}, 300);
}
var openRealtime = function () {
clearTimeout(lT);
if (!sliding1) {
sliding1 = true;
// hide the other two
$('.sidebarFilterBox').hide();
$('.sidebarAccountBox').hide();
$('.sidebarFilterIcon').css('background-color', '#0F1519');
//$('.sidebarAccountIcon').css('background-color', '#0F1519');
$('.sidebarCollaborateIcon').css('background-color', '#000');
$('.sidebarCollaborateBox').fadeIn(200, function () {
sliding1 = false;
realtimeIsOpen = true;
});
}
}
// bind the hover events
$(".sidebarCollaborate").hover(openRealtime, closeRealtime);
} // end bindRealtimeHover
function bindSaveHover() {
var closeSave = function () {
}
var openSave = function () {
// hide the other three
$('.sidebarFilterBox, .sidebarAccountBox, .sidebarCollaborateBox').hide();
$('.sidebarFilterIcon, .sidebarCollaborateIcon').css('background-color', '#0F1519');
}
// bind the hover events
$(".sidebarSave").hover(openSave, closeSave);
} // end bindSaveHover
// bind hover events
bindRealtimeHover();
bindSaveHover();
// because anyone who can edit the map can collaborate on it in realtime
$(".realtimeOnOff").click(function (event) {
if (!goRealtime) {
window.realtime.sendRealtimeOn();
$(this).html('ON').removeClass('rtOff').addClass('rtOn');
$(".rtMapperSelf").removeClass('littleRtOff').addClass('littleRtOn');
} else {
window.realtime.sendRealtimeOff();
$(this).html('OFF').removeClass('rtOn').addClass('rtOff');
$(".rtMapperSelf").removeClass('littleRtOn').addClass('littleRtOff');
}
goRealtime = !goRealtime;
$(".sidebarCollaborateIcon").toggleClass("blue");
});
// because anyone who can edit the map can save a new map layout
$('.sidebarSave').click(function () {
saveLayoutAll();
});
// because anyone who can edit the map can change the map title
$('.mapInfoName .best_in_place_name').bind("ajax:success", function () {
var name = $(this).html();
$('.mapName').html(name);
});
}); // end document.ready

52
app/assets/javascripts/jquery/AuthCanEditMappingPages.js vendored
View file

@ -1,52 +0,0 @@
/* authCanEditMappingPages means:
1. being logged in and,
2. either
a. being on a Map page and having edit permissions (your map, or commons map) or,
b. being on a Topic page
this code adds required jQuery for creating, or pulling in, topics and synapses
*/
$(document).ready(function () {
function bindForkHover() {
var closeFork = function () {
}
var openFork = function () {
// hide the other three
$('.sidebarFilterBox, .sidebarAccountBox, .sidebarCollaborateBox').hide();
$('.sidebarFilterIcon, .sidebarCollaborateIcon').css('background-color', '#0F1519');
}
// bind the hover events
$(".sidebarFork").hover(openFork, closeFork);
} // end bindForkHover
// bind hover events
bindForkHover();
//////
//////
//// SWITCHING METACODE SETS
$('#metacodeSwitchTabs').tabs({
selected: Metamaps.Settings.selectedMetacodeSetIndex
}).addClass("ui-tabs-vertical ui-helper-clearfix");
$("#metacodeSwitchTabs .ui-tabs-nav li").removeClass("ui-corner-top").addClass("ui-corner-left");
$('.customMetacodeList li').click(function () {
if ($(this).attr('class') != 'toggledOff') {
$(this).addClass('toggledOff');
var value_to_remove = $(this).attr('id');
var name_to_remove = $(this).attr('data-name');
MetamapsModel.newSelectedMetacodes.splice(MetamapsModel.newSelectedMetacodes.indexOf(value_to_remove), 1);
MetamapsModel.newSelectedMetacodeNames.splice(MetamapsModel.newSelectedMetacodeNames.indexOf(name_to_remove), 1);
} else if ($(this).attr('class') == 'toggledOff') {
$(this).removeClass('toggledOff');
MetamapsModel.newSelectedMetacodes.push($(this).attr('id'));
MetamapsModel.newSelectedMetacodeNames.push($(this).attr('data-name'));
}
});
}); // end document.ready

16
app/assets/javascripts/jquery/AuthEveryPage.js vendored
View file

@ -1,16 +0,0 @@
/* authEveryPage means:
1. being logged in and on any page on metamaps
this code adds required jQuery for the create map lightBox that can be used from any page on metamaps
*/
$(document).ready(function () {
// bind permission changer events on the createMap form
$('.permIcon').click(function () {
$(this).siblings('#map_permission').val($(this).attr('data-permission'));
$(this).siblings('.permIcon').find('.mapPermIcon').removeClass('selected');
$(this).find('.mapPermIcon').addClass('selected');
});
}); // end document.ready

36
app/assets/javascripts/jquery/AuthMapCreatorMapPage.js vendored
View file

@ -1,36 +0,0 @@
/* AuthMapCreatorMapPage means:
1. being on a Map page
2. being the original creator of that map
*/
$(document).ready(function () {
// ability to change permission of the map
var selectingPermission = false;
$('.yourMap .mapPermission').click(function () {
if (!selectingPermission) {
selectingPermission = true;
$(this).addClass('minimize'); // this line flips the drop down arrow to a pull up arrow
if ($(this).hasClass('commons')) {
$(this).append('<ul class="permissionSelect"><li class="public"></li><li class="private"></li></ul>');
} else if ($(this).hasClass('public')) {
$(this).append('<ul class="permissionSelect"><li class="commons"></li><li class="private"></li></ul>');
} else if ($(this).hasClass('private')) {
$(this).append('<ul class="permissionSelect"><li class="commons"></li><li class="public"></li></ul>');
}
$('.mapPermission .permissionSelect li').click(function (event) {
selectingPermission = false;
var permission = $(this).attr('class');
updateMapPermission(mapid, permission);
event.stopPropagation();
});
} else {
selectingPermission = false;
$(this).removeClass('minimize'); // this line flips the pull up arrow to a drop down arrow
$('.mapPermission .permissionSelect').remove();
}
});
}); // end document.ready

412
app/assets/javascripts/jquery/EveryPage.js vendored
View file

@ -1,412 +0,0 @@
// everything in this document.ready function is here because it is needed on every single page on metamaps
$(document).ready(function () {
function bindMainMenuHover() {
var menuIsOpen = false
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeMenu = function () {
lT = setTimeout(function () {
if (!sliding1) {
sliding1 = true;
// $('.footer .menu').animate({
// height: '0px'
// }, 300, function() {
// sliding1 = false;
// menuIsOpen = false;
// });
$('.footer').css('border-top-right-radius', '5px');
$('.logo').animate({
'background-position-x': '-10px'
}, 200);
$('.footer .menu').fadeOut(200, function () {
sliding1 = false;
menuIsOpen = false;
});
}
}, 500);
}
var openMenu = function () {
clearTimeout(lT);
if (!sliding1) {
sliding1 = true;
// $('.footer .menu').animate({
// height: listLength + 'px'
// }, 300, function() {
// sliding1 = false;
// });
$('.footer').css('border-top-right-radius', '0');
$('.logo').animate({
'background-position-x': '-7px'
}, 200);
$('.footer .menu').fadeIn(200, function () {
sliding1 = false;
});
}
}
// bind the hover events
$(".logo").hover(openMenu, closeMenu);
// when on touch screen, make touching on the logo do what hovering does on desktop
$("#mainTitle a").bind('touchend', function (evt) {
if (!menuIsOpen) {
openMenu();
evt.preventDefault();
evt.stopPropagation();
}
});
}
function bindSearchHover() {
var searchIsOpen = false
// controls the sliding hover of the search
var sliding1 = false;
var lT;
var openSearch = function () {
clearTimeout(lT);
if (!sliding1 && !searchIsOpen) {
hideCards();
sliding1 = true;
$('.sidebarSearch .twitter-typeahead, .sidebarSearch .tt-hint, .sidebarSearchField').animate({
width: '200px'
}, 200, function () {
$('.sidebarSearchField, .sidebarSearch .tt-hint').css({
padding: '5px 10px',
width: '180px'
});
$('.sidebarSearchField').focus();
sliding1 = false
searchIsOpen = true;
});
}
}
var closeSearch = function (closeAfter, bypass) {
lT = setTimeout(function () {
if (!sliding1 && searchIsOpen && (bypass || $('.sidebarSearchField').val() == '')) {
sliding1 = true;
$('.sidebarSearchField, .sidebarSearch .tt-hint').css({
padding: '5px 0',
width: '200px'
});
$('.sidebarSearch .twitter-typeahead, .sidebarSearch .tt-hint, .sidebarSearchField').animate({
width: '0'
}, 200, function () {
$('.sidebarSearchField').typeahead('setQuery', '');
$('.sidebarSearchField').blur();
sliding1 = false;
searchIsOpen = false;
});
}
}, closeAfter);
}
// bind the hover events
$(".sidebarSearch").hover(function () {
openSearch()
}, function () {
closeSearch(800, false)
});
$('.sidebarSearchIcon').click(function (e) {
$('.sidebarSearchField').focus();
});
$('.sidebarSearch').click(function (e) {
e.stopPropagation();
});
$('body').click(function (e) {
closeSearch(0, false);
});
// if the search is closed and user hits ctrl+/
// close if they hit ESC
$('body').bind('keydown', function (e) {
switch (e.which) {
case 191:
if (e.ctrlKey && !searchIsOpen) {
openSearch();
}
break;
case 27:
if (searchIsOpen) {
closeSearch(0, true);
}
break;
default:
break; //console.log(e.which);
}
});
// initialize the search box autocomplete results
var mapheader = userid ? '<h3 class="search-header">Maps</h3><input type="checkbox" class="limitToMe" id="limitMapsToMe"></input><label for="limitMapsToMe" class="limitToMeLabel">added by me</label><div class="minimizeResults minimizeMapResults"></div><div class="clearfloat"></div>' : '<h3 class="search-header">Maps</h3><div class="minimizeResults minimizeMapResults"></div><div class="clearfloat"></div>';
var topicheader = userid ? '<h3 class="search-header">Topics</h3><input type="checkbox" class="limitToMe" id="limitTopicsToMe"></input><label for="limitTopicsToMe" class="limitToMeLabel">added by me</label><div class="minimizeResults minimizeTopicResults"></div><div class="clearfloat"></div>' : '<h3 class="search-header">Topics</h3><div class="minimizeResults minimizeTopicResults"></div><div class="clearfloat"></div>';
$('.sidebarSearchField').typeahead([
{
name: 'topics',
limit: 9999,
dupChecker: function (datum1, datum2) {
return false;
},
template: $('#topicSearchTemplate').html(),
remote: {
url: '/search/topics?term=%QUERY',
replace: function () {
var q = '/search/topics?term=' + $('.sidebarSearchField').val();
if ($("#limitTopicsToMe").is(':checked')) {
q += "&user=" + userid.toString();
}
return q;
},
filter: function (dataset) {
if (dataset.length == 0) {
dataset.push({
value: "No results",
label: "No results",
typeImageURL: "/assets/icons/wildcard.png",
rtype: "noresult"
});
}
return dataset;
}
},
engine: Hogan,
header: topicheader
},
{
name: 'maps',
limit: 9999,
dupChecker: function (datum1, datum2) {
return false;
},
template: $('#mapSearchTemplate').html(),
remote: {
url: '/search/maps?term=%QUERY',
replace: function () {
var q = '/search/maps?term=' + $('.sidebarSearchField').val();
if ($("#limitMapsToMe").is(':checked')) {
q += "&user=" + userid.toString();
}
return q;
},
filter: function (dataset) {
if (dataset.length == 0) {
dataset.push({
value: "No results",
label: "No results",
rtype: "noresult"
});
}
return dataset;
}
},
engine: Hogan,
header: mapheader
},
{
name: 'mappers',
limit: 9999,
dupChecker: function (datum1, datum2) {
return false;
},
template: $('#mapperSearchTemplate').html(),
remote: {
url: '/search/mappers?term=%QUERY',
filter: function (dataset) {
if (dataset.length == 0) {
dataset.push({
value: "No results",
label: "No results",
rtype: "noresult"
});
}
return dataset;
}
},
engine: Hogan,
header: '<h3 class="search-header">Mappers</h3><div class="minimizeResults minimizeMapperResults"></div><div class="clearfloat"></div>'
}
]);
//Set max height of the search results box to prevent it from covering bottom left footer
$('.sidebarSearchField').bind('typeahead:opened', function (event) {
var h = $(window).height();
$(".tt-dropdown-menu").css('max-height', h - 100);
});
$(window).resize(function () {
var h = $(window).height();
$(".tt-dropdown-menu").css('max-height', h - 100);
});
// tell the autocomplete to launch a new tab with the topic, map, or mapper you clicked on
$('.sidebarSearchField').bind('typeahead:selected', function (event, datum, dataset) {
console.log(event);
if (datum.rtype != "noresult") {
var win;
if (dataset == "topics") {
win = window.open('/topics/' + datum.id, '_blank');
} else if (dataset == "maps") {
win = window.open('/maps/' + datum.id, '_blank');
} else if (dataset == "mappers") {
win = window.open('/maps/mappers/' + datum.id, '_blank');
}
win.focus();
closeSearch(0);
}
});
var checkboxChangeInit = false,
minimizeInit = false;
$('.sidebarSearchField').bind('keyup', function () {
// when the user selects 'added by me' resend the query with their userid attached
if (!checkboxChangeInit) {
$('.limitToMe').bind("change", function (e) {
// set the value of the search equal to itself to retrigger the autocomplete event
searchIsOpen = false;
$('.sidebarSearchField').typeahead('setQuery', $('.sidebarSearchField').val());
setTimeout(function () {
searchIsOpen = true;
}, 2000);
});
checkboxChangeInit = true;
}
// when the user clicks minimize section, hide the results for that section
if (!minimizeInit) {
$('.minimizeMapperResults').click(function (e) {
var s = $('.tt-dataset-mappers .tt-suggestions');
console.log(s.css('height'));
if (s.css('height') == '0px') {
$('.tt-dataset-mappers .tt-suggestions').css({
'height': 'auto',
'overflow': 'visible'
});
$(this).removeClass('maximizeResults').addClass('minimizeResults');
} else {
$('.tt-dataset-mappers .tt-suggestions').css({
'height': '0',
'overflow': 'hidden'
});
$(this).removeClass('minimizeResults').addClass('maximizeResults');
}
});
$('.minimizeTopicResults').click(function (e) {
var s = $('.tt-dataset-topics .tt-suggestions');
console.log(s.css('height'));
if (s.css('height') == '0px') {
s.css({
'height': 'auto',
'border-top': 'none',
'overflow': 'visible'
});
$(this).removeClass('maximizeResults').addClass('minimizeResults');
} else {
s.css({
'height': '0',
'border-top': '1px solid rgb(56, 56, 56)',
'overflow': 'hidden'
});
$(this).removeClass('minimizeResults').addClass('maximizeResults');
}
});
$('.minimizeMapResults').click(function (e) {
var s = $('.tt-dataset-maps .tt-suggestions');
console.log(s.css('height'));
if (s.css('height') == '0px') {
s.css({
'height': 'auto',
'border-top': 'none',
'overflow': 'visible'
});
$(this).removeClass('maximizeResults').addClass('minimizeResults');
} else {
s.css({
'height': '0',
'border-top': '1px solid rgb(56, 56, 56)',
'overflow': 'hidden'
});
$(this).removeClass('minimizeResults').addClass('maximizeResults');
}
});
minimizeInit = true;
}
});
//
$('.sidebarSearch button.addToMap').click(function (event) {
event.stopPropagation();
});
} // end bindSearchHover
function bindAccountHover() {
var accountIsOpen = false
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeAccount = function () {
lT = setTimeout(function () {
if (!sliding1) {
sliding1 = true;
//$('.sidebarAccountIcon').css('background-color', '#0F1519');
$('.sidebarAccountBox').fadeOut(200, function () {
sliding1 = false;
accountIsOpen = false;
});
}
}, 300);
}
var openAccount = function () {
clearTimeout(lT);
if (!sliding1) {
sliding1 = true;
// hide the other two
$('.sidebarFilterBox').hide();
$('.sidebarCollaborateBox').hide();
$('.sidebarFilterIcon').css('background-color', '#0F1519');
$('.sidebarCollaborateIcon').css('background-color', '#0F1519');
//$('.sidebarAccountIcon').css('background-color', '#000');
$('.sidebarAccountBox').fadeIn(200, function () {
sliding1 = false;
accountIsOpen = true;
});
}
}
// bind the hover events
$(".sidebarAccount").hover(openAccount, closeAccount);
} // end bindAccountHover
// bind hover events
bindMainMenuHover();
bindSearchHover();
bindAccountHover();
// hide notices after 10 seconds
$('.notice.metamaps').delay(10000).fadeOut('fast');
$('.alert.metamaps').delay(10000).fadeOut('fast');
//bind lightbox clicks
$('.openLightbox').click(function (event) {
openLightbox($(this).attr('data-open'));
event.preventDefault();
return false;
});
}); // end document.ready

48
app/assets/javascripts/jquery/MapPage.js vendored
View file

@ -1,48 +0,0 @@
/* MapPage means:
1. being on a Map page
*/
$(document).ready(function () {
function bindInfoHover() {
var infoIsOpen = false;
// controls the sliding hover of the bottom left menu
var sliding1 = false;
var lT;
var closeInfo = function () {
lT = setTimeout(function () {
if (!sliding1) {
sliding1 = true;
$('.mapInfoBox').fadeOut(200, function () {
sliding1 = false;
infoIsOpen = false;
});
}
}, 300);
}
var openInfo = function (event) {
clearTimeout(lT);
if (!sliding1 && event.target.className != "openCheatsheet openLightbox") {
sliding1 = true;
$('.mapInfoBox').fadeIn(200, function () {
sliding1 = false;
infoIsOpen = true;
});
}
}
// bind the hover events
$("div.index").hover(openInfo, closeInfo);
} // end bindInfoHover
bindInfoHover();
}); // end document.ready

9
app/assets/javascripts/metamaps/metamapsJIT.js → app/assets/javascripts/metamaps/JIT.js
View file

@ -2475,7 +2475,9 @@ Extras.Classes.Navigation = new Class({
this.pressed = true;
//START METAMAPS CODE
if (!Metamaps.Mouse.boxStartCoordinates && e.shiftKey) {
var rightClick = e.button == 2 || (navigator.platform.indexOf("Mac") != -1 && e.ctrlKey);
// TODO make sure this works across browsers
if (!Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) {
Metamaps.Mouse.boxStartCoordinates = eventInfo.getPos();
}
Metamaps.Mouse.didPan = false;
@ -2499,12 +2501,13 @@ Extras.Classes.Navigation = new Class({
if(this.config.panning == 'avoid nodes' && (this.dom? this.isLabel(e, win) : eventInfo.getNode())) return;
// START METAMAPS CODE
if (!Metamaps.Mouse.boxStartCoordinates && e.shiftKey) {
var rightClick = e.button == 2 || (navigator.platform.indexOf("Mac") != -1 && e.ctrlKey);
if (!Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) {
Metamaps.Visualize.mGraph.busy = true;
Metamaps.boxStartCoordinates = eventInfo.getPos();
return;
}
if (Metamaps.Mouse.boxStartCoordinates && e.shiftKey) {
if (Metamaps.Mouse.boxStartCoordinates && (e.shiftKey || rightClick)) {
Metamaps.Visualize.mGraph.busy = true;
Metamaps.JIT.drawSelectBox(eventInfo,e);
return;

526
app/assets/javascripts/metamaps/Metamaps.GlobalUI.js Normal file
View file

@ -0,0 +1,526 @@
var Metamaps = {}; // this variable declaration defines a Javascript object that will contain all the variables and functions used by us, broken down into 'sub-modules' that look something like this
/*
* unless you are on a page with the Javascript InfoVis Toolkit (Topic or Map) the only section in the metamaps
* object will be this one
GlobalUI
* all these get added when you are on a page with the Javascript Infovis Toolkit
Settings
Touch
Mouse
Active
Selected
Maps
Mappers
Metacodes
Topics
Synapses
Mappings
Backbone
Create
TopicCard
SynapseCard
Visualize
Util
Realtime
Control
Filter
Listeners
Organize
Topic
Synapse
Map
Mapper
JIT
*/
$(document).ready(function () {
for (var prop in Metamaps) {
// this runs the init function within each sub-object on the Metamaps one
if (Metamaps.hasOwnProperty(prop) &&
Metamaps[prop].hasOwnProperty('init') &&
typeof (Metamaps[prop].init) == 'function'
) {
Metamaps[prop].init();
}
}
//Metamaps.Visualize.type = "ForceDirected3D";
// this line could maybe go at the end of the Metamaps.JIT init function
if (Metamaps.JIT) Metamaps.JIT.prepareVizData();
});
Metamaps.GlobalUI = {
notifyTimeout: null,
init: function () {
var self = Metamaps.GlobalUI;
self.Search.init();
self.MainMenu.init();
self.CreateMap.init();
self.Account.init();
//bind lightbox clicks
$('.openLightbox').click(function (event) {
self.openLightbox($(this).attr('data-open'));
event.preventDefault();
return false;
});
// hide notices after 10 seconds
$('.notice.metamaps').delay(10000).fadeOut('fast');
$('.alert.metamaps').delay(10000).fadeOut('fast');
},
openLightbox: function (which) {
$('.lightboxContent').hide();
$('#' + which).show();
$('#lightbox_overlay').show();
$('#lightbox_main').css('margin-top', '-' + ($('#lightbox_main').height() / 2) + 'px');
if (Metamaps.Create && !Metamaps.Create.metacodeScrollerInit) {
$('.customMetacodeList, .metacodeSetList').mCustomScrollbar({
mouseWheelPixels: 200,
advanced: {
updateOnContentResize: true
}
});
Metamaps.Create.metacodeScrollerInit = true;
}
if (which == "switchMetacodes") {
Metamaps.Create.isSwitchingSet = true;
}
},
closeLightbox: function () {
$('#lightbox_overlay').hide();
Metamaps.GlobalUI.CreateMap.reset('fork_map');
Metamaps.GlobalUI.CreateMap.reset('new_map');
if (Metamaps.Create && Metamaps.Create.isSwitchingSet) {
Metamaps.Create.cancelMetacodeSetSwitch();
}
},
notifyUser: function (message) {
var self = Metamaps.GlobalUI;
if ($('.notice.metamaps').length == 0) {
$('body').prepend('<div class="notice metamaps" />');
}
$('.notice.metamaps').hide().html(message).fadeIn('fast');
clearTimeout(self.notifyTimeOut);
self.notifyTimeOut = setTimeout(function () {
$('.notice.metamaps').fadeOut('fast');
}, 8000);
}
};
Metamaps.GlobalUI.MainMenu = {
isOpen: false,
timeOut: null,
changing: false,
init: function () {
var self = Metamaps.GlobalUI.MainMenu;
$(".logo").hover(self.open, self.close);
// when on touch screen, make touching on the logo do what hovering does on desktop
$("#mainTitle a").bind('touchend', function (evt) {
if (!self.isOpen) {
self.openMenu();
evt.preventDefault();
evt.stopPropagation();
}
});
},
open: function () {
var self = Metamaps.GlobalUI.MainMenu;
clearTimeout(self.timeOut);
if (!self.isOpen && !self.changing) {
self.changing = true;
// toggle the upper right rounded corner off
$('.footer').css('border-top-right-radius', '0');
// move the hamburger menu icon a little bit further out
$('.logo').animate({
'background-position-x': '-7px'
}, 200);
// fade the main part of the menu in
$('.footer .menu').fadeIn(200, function () {
self.changing = false;
self.isOpen = true;
});
}
},
close: function () {
var self = Metamaps.GlobalUI.MainMenu;
self.timeOut = setTimeout(function () {
if (!self.changing) {
self.changing = true;
// set back to having a rounder upper right corner
$('.footer').css('border-top-right-radius', '5px');
// move the hamburger menu icon further to the left, more hidden again
$('.logo').animate({
'background-position-x': '-10px'
}, 200);
// fade out the main menu
$('.footer .menu').fadeOut(200, function () {
self.changing = false;
self.isOpen = false;
});
}
}, 500);
}
};
Metamaps.GlobalUI.CreateMap = {
init: function () {
// bind permission changer events on the createMap form
$('.permIcon').click(function () {
$(this).siblings('#map_permission').val($(this).attr('data-permission'));
$(this).siblings('.permIcon').find('.mapPermIcon').removeClass('selected');
$(this).find('.mapPermIcon').addClass('selected');
});
},
reset: function (id) {
var form = $('#' + id);
form.find('#map_name').val('');
form.find('#map_desc').val('');
form.find('#map_permission').val('commons');
if (id == "fork_map") {
form.find('#map_topicsToMap').val('0');
form.find('#map_synapsesToMap').val('0');
}
// remove a selected state from all three of them
form.find('.mapPermIcon').removeClass('selected');
// add a selected state back to commons permission, the default
form.find('.mapCommonsIcon').addClass('selected');
return false;
},
};
Metamaps.GlobalUI.Account = {
isOpen: false,
timeOut: null,
changing: false,
init: function () {
var self = Metamaps.GlobalUI.Account;
$(".sidebarAccount").hover(self.open, self.close);
},
open: function () {
var self = Metamaps.GlobalUI.Account;
clearTimeout(self.timeOut);
if (!self.isOpen && !self.changing) {
self.changing = true;
$('.sidebarAccountBox').fadeIn(200, function () {
self.changing = false;
self.isOpen = true;
});
}
},
close: function () {
var self = Metamaps.GlobalUI.Account;
self.timeOut = setTimeout(function () {
if (!self.changing) {
self.changing = true;
$('.sidebarAccountBox').fadeOut(200, function () {
self.changing = false;
self.isOpen = false;
});
}
}, 500);
}
};
Metamaps.GlobalUI.Search = {
isOpen: false,
timeOut: null,
changing: false,
optionsInitialized: false,
init: function () {
var self = Metamaps.GlobalUI.Search;
// bind the hover events
$(".sidebarSearch").hover(function () {
self.open()
}, function () {
self.close(800, false)
});
$('.sidebarSearchIcon').click(function (e) {
$('.sidebarSearchField').focus();
});
$('.sidebarSearch').click(function (e) {
e.stopPropagation();
});
$('body').click(function (e) {
self.close(0, false);
});
// open if the search is closed and user hits ctrl+/
// close if they hit ESC
$('body').bind('keydown', function (e) {
switch (e.which) {
case 191:
if (e.ctrlKey && !self.isOpen) {
self.open();
}
break;
case 27:
if (self.isOpen) {
self.close(0, true);
}
break;
default:
break; //console.log(e.which);
}
});
self.startTypeahead();
},
open: function () {
var self = Metamaps.GlobalUI.Search;
clearTimeout(self.timeOut);
if (!self.isOpen && !self.changing) {
self.changing = true;
$('.sidebarSearch .twitter-typeahead, .sidebarSearch .tt-hint, .sidebarSearchField').animate({
width: '200px'
}, 200, function () {
$('.sidebarSearchField, .sidebarSearch .tt-hint').css({
padding: '5px 10px',
width: '180px'
});
$('.sidebarSearchField').focus();
self.changing = false;
self.isOpen = true;
});
}
},
close: function (closeAfter, bypass) {
var self = Metamaps.GlobalUI.Search;
self.timeOut = setTimeout(function () {
if (!self.changing && self.isOpen && (bypass || $('.sidebarSearchField').val() == '')) {
self.changing = true;
$('.sidebarSearchField, .sidebarSearch .tt-hint').css({
padding: '5px 0',
width: '200px'
});
$('.sidebarSearch .twitter-typeahead, .sidebarSearch .tt-hint, .sidebarSearchField').animate({
width: '0'
}, 200, function () {
$('.sidebarSearchField').typeahead('setQuery', '');
$('.sidebarSearchField').blur();
self.changing = false;
self.isOpen = false;
});
}
}, closeAfter);
},
startTypeahead: function () {
var self = Metamaps.GlobalUI.Search;
// TODO stop using userid
var mapheader = userid ? '<h3 class="search-header">Maps</h3><input type="checkbox" class="limitToMe" id="limitMapsToMe"></input><label for="limitMapsToMe" class="limitToMeLabel">added by me</label><div class="minimizeResults minimizeMapResults"></div><div class="clearfloat"></div>' : '<h3 class="search-header">Maps</h3><div class="minimizeResults minimizeMapResults"></div><div class="clearfloat"></div>';
var topicheader = userid ? '<h3 class="search-header">Topics</h3><input type="checkbox" class="limitToMe" id="limitTopicsToMe"></input><label for="limitTopicsToMe" class="limitToMeLabel">added by me</label><div class="minimizeResults minimizeTopicResults"></div><div class="clearfloat"></div>' : '<h3 class="search-header">Topics</h3><div class="minimizeResults minimizeTopicResults"></div><div class="clearfloat"></div>';
var mapperheader = '<h3 class="search-header">Mappers</h3><div class="minimizeResults minimizeMapperResults"></div><div class="clearfloat"></div>';
var topics = {
name: 'topics',
limit: 9999,
dupChecker: function (datum1, datum2) {
return false;
},
template: $('#topicSearchTemplate').html(),
remote: {
url: '/search/topics?term=%QUERY',
replace: function () {
var q = '/search/topics?term=' + $('.sidebarSearchField').val();
if ($("#limitTopicsToMe").is(':checked')) {
q += "&user=" + userid.toString();
}
return q;
},
filter: function (dataset) {
if (dataset.length == 0) {
dataset.push({
value: "No results",
label: "No results",
typeImageURL: "/assets/icons/wildcard.png",
rtype: "noresult"
});
}
return dataset;
}
},
engine: Hogan,
header: topicheader
};
var maps = {
name: 'maps',
limit: 9999,
dupChecker: function (datum1, datum2) {
return false;
},
template: $('#mapSearchTemplate').html(),
remote: {
url: '/search/maps?term=%QUERY',
replace: function () {
var q = '/search/maps?term=' + $('.sidebarSearchField').val();
if ($("#limitMapsToMe").is(':checked')) {
q += "&user=" + userid.toString();
}
return q;
},
filter: function (dataset) {
if (dataset.length == 0) {
dataset.push({
value: "No results",
label: "No results",
rtype: "noresult"
});
}
return dataset;
}
},
engine: Hogan,
header: mapheader
};
var mappers = {
name: 'mappers',
limit: 9999,
dupChecker: function (datum1, datum2) {
return false;
},
template: $('#mapperSearchTemplate').html(),
remote: {
url: '/search/mappers?term=%QUERY',
filter: function (dataset) {
if (dataset.length == 0) {
dataset.push({
value: "No results",
label: "No results",
rtype: "noresult"
});
}
return dataset;
}
},
engine: Hogan,
header: mapperheader
};
$('.sidebarSearchField').typeahead([topics, maps, mappers]);
//Set max height of the search results box to prevent it from covering bottom left footer
$('.sidebarSearchField').bind('typeahead:opened', function (event) {
var h = $(window).height();
$(".tt-dropdown-menu").css('max-height', h - 100);
});
$(window).resize(function () {
var h = $(window).height();
$(".tt-dropdown-menu").css('max-height', h - 100);
});
// tell the autocomplete to launch a new tab with the topic, map, or mapper you clicked on
$('.sidebarSearchField').bind('typeahead:selected', self.handleResultClick);
// don't do it, if they clicked on a 'addToMap' button
$('.sidebarSearch button.addToMap').click(function (event) {
event.stopPropagation();
});
// make sure that when you click on 'limit to me' or 'toggle section' it works
$('.sidebarSearchField').bind('keyup', self.initSearchOptions);
},
handleResultClick: function (event, datum, dataset) {
var self = Metamaps.GlobalUI.Search;
if (datum.rtype != "noresult") {
self.close(0, true);
var win;
if (dataset == "topics") {
win = window.open('/topics/' + datum.id, '_blank');
} else if (dataset == "maps") {
win = window.open('/maps/' + datum.id, '_blank');
} else if (dataset == "mappers") {
win = window.open('/maps/mappers/' + datum.id, '_blank');
}
win.focus();
}
},
initSearchOptions: function () {
var self = Metamaps.GlobalUI.Search;
function toggleResultSet(set) {
var s = $('.tt-dataset-' + set + ' .tt-suggestions');
if (s.css('height') == '0px') {
s.css({
'height': 'auto',
'border-top': 'none',
'overflow': 'visible'
});
$(this).removeClass('maximizeResults').addClass('minimizeResults');
} else {
s.css({
'height': '0',
'border-top': '1px solid rgb(56, 56, 56)',
'overflow': 'hidden'
});
$(this).removeClass('minimizeResults').addClass('maximizeResults');
}
}
if (!self.optionsInitialized) {
$('.limitToMe').bind("change", function (e) {
// set the value of the search equal to itself to retrigger the autocomplete event
self.isOpen = false;
$('.sidebarSearchField').typeahead('setQuery', $('.sidebarSearchField').val());
setTimeout(function () {
self.isOpen = true;
}, 2000);
});
// when the user clicks minimize section, hide the results for that section
$('.minimizeMapperResults').click(function (e) {
toggleResultSet.call(this, 'mappers');
});
$('.minimizeTopicResults').click(function (e) {
toggleResultSet.call(this, 'topics');
});
$('.minimizeMapResults').click(function (e) {
toggleResultSet.call(this, 'maps');
});
self.optionsInitialized = true;
}
}
};

1533
app/assets/javascripts/metamaps/Metamaps.JIT.js Normal file
View file

File diff suppressed because it is too large Load diff

128
app/assets/javascripts/Jit/filter.js → app/assets/javascripts/metamaps/codeleft.js
View file

@ -1,3 +1,69 @@
function fetchRelatives(node) {
var myA = $.ajax({
type: "Get",
url: "/topics/" + node.id + "?format=json",
success: function (data) {
if (gType == "centered") {
Mconsole.busy = true;
Mconsole.op.sum(data, {
type: 'fade',
duration: 500,
hideLabels: false
});
Mconsole.graph.eachNode(function (n) {
n.eachAdjacency(function (a) {
if (!a.getData('showDesc')) {
a.setData('alpha', 0.4, 'start');
a.setData('alpha', 0.4, 'current');
a.setData('alpha', 0.4, 'end');
}
});
});
Mconsole.busy = false;
} else {
Mconsole.op.sum(data, {
type: 'nothing',
});
Mconsole.plot();
}
},
error: function () {
alert('failure');
}
});
}
function centerOn(nodeid) {
if (!Mconsole.busy) {
var node = Mconsole.graph.getNode(nodeid);
$('div.index img').attr('src', imgArray[node.getData('metacode')].src);
$('div.index .mapName').html(node.name);
$(document).attr('title', node.name + ' | Metamaps');
window.history.pushState(node.name, "Metamaps", "/topics/" + node.id);
Mconsole.onClick(node.id, {
hideLabels: false,
duration: 1000,
onComplete: function () {
fetchRelatives(node);
}
});
}
}
function MconsoleReset() {
var tX = Mconsole.canvas.translateOffsetX;
var tY = Mconsole.canvas.translateOffsetY;
Mconsole.canvas.translate(-tX, -tY);
var mX = Mconsole.canvas.scaleOffsetX;
var mY = Mconsole.canvas.scaleOffsetY;
Mconsole.canvas.scale((1 / mX), (1 / mY));
}
// create filters for maps
function switchVisible(category, duration) {
@ -120,64 +186,4 @@ function filterTopicsByName(searchQuery) {
duration: 500
});
});
} // filterTopicsByName
function clearCanvas() {
Mconsole.graph.eachNode(function(n) {
Mconsole.graph.removeNode(n.id);
});
Mconsole.plot();
}
function clearCanvasExceptRoot() {
var ids = new Array();
Mconsole.graph.eachNode(function(n) {
ids.push(n.id);
});
var root = Mconsole.graph.nodes[Mconsole.root];
ids.forEach(function(id, index) {
if (id != root.id) {
Mconsole.graph.removeNode(id);
}
});
fetchRelatives(root); //also runs Mconsole.plot()
}
/**
* Define all the dynamic interactions for the Filter By Metacode using Jquery
*/
$(document).ready(function() {
$('.sidebarFilterBox .showAll').click(function(e) {
showAll();
$('#filter_by_metacode ul li').removeClass('toggledOff');
for (var catVis in categoryVisible) {
categoryVisible[catVis] = true;
}
});
$('.sidebarFilterBox .hideAll').click(function(e) {
hideAll();
$('#filter_by_metacode ul li').addClass('toggledOff');
for (var catVis in categoryVisible) {
categoryVisible[catVis] = false;
}
});
// toggle visibility of topics with metacodes based on status in the filters list
$('#filter_by_metacode ul li').click(function(event) {
var category = $(this).children('img').attr('alt');
switchVisible(category);
// toggle the image and the boolean array value
if (categoryVisible[category] == true) {
$(this).addClass('toggledOff');
categoryVisible[category] = false;
}
else if (categoryVisible[category] == false) {
$(this).removeClass('toggledOff');
categoryVisible[category] = true;
}
});
});
} // filterTopicsByName

4711
app/assets/javascripts/metamaps/metamaps.js
View file

File diff suppressed because it is too large Load diff

235
app/assets/javascripts/realtime/realtime.js
View file

@ -1,235 +0,0 @@
window.realtime = {};
window.realtime.notifyTimeOut = null;
window.realtime.notifyUser = function (message) {
if ($('.notice.metamaps').length == 0) {
$('body').prepend('<div class="notice metamaps" />');
}
$('.notice.metamaps').hide().html(message).fadeIn('fast');
clearTimeout(window.realtime.notifyTimeOut);
window.realtime.notifyTimeOut = setTimeout(function () {
$('.notice.metamaps').fadeOut('fast');
}, 8000);
};
window.realtime.setupSocket = function () {
var socket = window.realtime.socket;
socket.emit('newMapperNotify', {
userid: userid,
username: username,
mapid: mapid
});
// if you're the 'new guy' update your list with who's already online
socket.on(userid + '-' + mapid + '-UpdateMapperList', function (data) {
// data.userid
// data.username
// data.userrealtime
MetamapsModel.mappersOnMap[data.userid] = {
name: data.username,
realtime: data.userrealtime
};
var onOff = data.userrealtime ? "On" : "Off";
var mapperListItem = '<li id="mapper' + data.userid + '" class="rtMapper littleRt' + onOff + '">' + data.username + '</li>';
$('#mapper' + data.userid).remove();
$('.realtimeMapperList ul').append(mapperListItem);
});
// receive word that there's a new mapper on the map
socket.on('maps-' + mapid + '-newmapper', function (data) {
// data.userid
// data.username
MetamapsModel.mappersOnMap[data.userid] = {
name: data.username,
realtime: false
};
var mapperListItem = '<li id="mapper' + data.userid + '" class="rtMapper littleRtOff">' + data.username + '</li>';
$('#mapper' + data.userid).remove();
$('.realtimeMapperList ul').append(mapperListItem);
window.realtime.notifyUser(data.username + ' just joined the map');
// send this new mapper back your details, and the awareness that you've loaded the map
var update = {
userToNotify: data.userid,
username: username,
userid: userid,
userrealtime: goRealtime,
mapid: mapid
};
socket.emit('updateNewMapperList', update);
});
// receive word that a mapper left the map
socket.on('maps-' + mapid + '-lostmapper', function (data) {
// data.userid
// data.username
delete MetamapsModel.mappersOnMap[data.userid];
$('#mapper' + data.userid).remove();
window.realtime.notifyUser(data.username + ' just left the map');
});
// receive word that there's a mapper turned on realtime
socket.on('maps-' + mapid + '-newrealtime', function (data) {
// data.userid
// data.username
MetamapsModel.mappersOnMap[data.userid].realtime = true;
$('#mapper' + data.userid).removeClass('littleRtOff').addClass('littleRtOn');
window.realtime.notifyUser(data.username + ' just turned on realtime');
});
// receive word that there's a mapper turned on realtime
socket.on('maps-' + mapid + '-lostrealtime', function (data) {
// data.userid
// data.username
MetamapsModel.mappersOnMap[data.userid].realtime = false;
$('#mapper' + data.userid).removeClass('littleRtOn').addClass('littleRtOff');
window.realtime.notifyUser(data.username + ' just turned off realtime');
});
socket.on('maps-' + mapid, function (data) {
//as long as you weren't the origin of the changes, update your map
if (data.origin != userid && goRealtime) {
if (data.resource == 'Topic') {
topic = $.parseJSON(data.obj);
if (data.action == 'create') {
window.realtime.addTopicToMap(topic);
} else if (data.action == 'update' && Mconsole.graph.getNode(topic.id) != 'undefined') {
window.realtime.updateTopicOnMap(topic);
} else if (data.action == 'destroy' && Mconsole.graph.getNode(topic.id) != 'undefined') {
hideNode(topic.id)
}
return;
} else if (data.resource == 'Synapse') {
synapse = $.parseJSON(data.obj);
if (data.action == 'create') {
window.realtime.addSynapseToMap(synapse);
} else if (data.action == 'update' &&
Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']) != 'undefined') {
window.realtime.updateSynapseOnMap(synapse);
} else if (data.action == 'destroy' &&
Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']) != 'undefined') {
var edge = Mconsole.graph.getAdjacence(synapse.data.$direction['0'], synapse.data.$direction['1']);
hideEdge(edge);
}
return;
}
}
});
};
window.realtime.sendRealtimeOn = function () {
// send this new mapper back your details, and the awareness that you're online
var update = {
username: username,
userid: userid,
mapid: mapid
};
window.realtime.socket.emit('notifyStartRealtime', update);
}
window.realtime.sendRealtimeOff = function () {
// send this new mapper back your details, and the awareness that you're online
var update = {
username: username,
userid: userid,
mapid: mapid
};
window.realtime.socket.emit('notifyStopRealtime', update);
}
window.realtime.addTopicToMap = function (topic) {
var newPos, tempForT;
Mconsole.graph.addNode(topic);
tempForT = Mconsole.graph.getNode(topic.id);
tempForT.setData('dim', 1, 'start');
tempForT.setData('dim', 25, 'end');
newPos = new $jit.Complex();
newPos.x = tempForT.data.$xloc;
newPos.y = tempForT.data.$yloc;
tempForT.setPos(newPos, 'start');
tempForT.setPos(newPos, 'current');
tempForT.setPos(newPos, 'end');
Mconsole.fx.plotNode(tempForT, Mconsole.canvas);
return Mconsole.labels.plotLabel(Mconsole.canvas, tempForT, Mconsole.config);
};
window.realtime.updateTopicOnMap = function (topic) {
var newPos, tempForT;
tempForT = Mconsole.graph.getNode(topic.id);
tempForT.data = topic.data;
tempForT.name = topic.name;
if (MetamapsModel.showcardInUse === topic.id) {
populateShowCard(tempForT);
}
newPos = new $jit.Complex();
newPos.x = tempForT.data.$xloc;
newPos.y = tempForT.data.$yloc;
tempForT.setPos(newPos, 'start');
tempForT.setPos(newPos, 'current');
tempForT.setPos(newPos, 'end');
return Mconsole.fx.animate({
modes: ['linear', 'node-property:dim', 'edge-property:lineWidth'],
transition: $jit.Trans.Quad.easeInOut,
duration: 500
});
};
window.realtime.addSynapseToMap = function (synapse) {
var Node1, Node2, tempForS;
Node1 = Mconsole.graph.getNode(synapse.data.$direction[0]);
Node2 = Mconsole.graph.getNode(synapse.data.$direction[1]);
Mconsole.graph.addAdjacence(Node1, Node2, {});
tempForS = Mconsole.graph.getAdjacence(Node1.id, Node2.id);
tempForS.setDataset('start', {
lineWidth: 0.4
});
tempForS.setDataset('end', {
lineWidth: 2
});
tempForS.data = synapse.data;
Mconsole.fx.plotLine(tempForS, Mconsole.canvas);
return Mconsole.fx.animate({
modes: ['linear', 'node-property:dim', 'edge-property:lineWidth'],
transition: $jit.Trans.Quad.easeInOut,
duration: 500
});
};
window.realtime.updateSynapseOnMap = function (synapse) {
var k, tempForS, v, wasShowDesc, _ref;
tempForS = Mconsole.graph.getAdjacence(synapse.data.$direction[0], synapse.data.$direction[1]);
wasShowDesc = tempForS.data.$showDesc;
_ref = synapse.data;
for (k in _ref) {
v = _ref[k];
tempForS.data[k] = v;
}
tempForS.data.$showDesc = wasShowDesc;
if (MetamapsModel.edgecardInUse === synapse.data.$id) {
editEdge(tempForS, false);
}
return Mconsole.plot();
};

21
app/assets/stylesheets/application.css
View file

@ -514,7 +514,7 @@ label[for="user_remember_me"] {
position: absolute;
top: 0;
left: -41px;
background: #0F1519 url('MMCCicon_help.png') no-repeat center center;
background: url('MMCCicon_help.png') no-repeat center center;
background-size: 27px 27px;
border-radius: 5px;
height: 36px;
@ -692,18 +692,17 @@ li.accountInvite span {
z-index: 200;
width: 35px;
height: 35px;
border-right: 1px solid black;
}
.sidebarForkIcon {
position: absolute;
width: 35px;
height: 35px;
background: #0F1519 url('MMCCicon_save_new_map.png') no-repeat center center;
background: url('MMCCicon_save_new_map.png') no-repeat center center;
background-size: 28px 28px;
cursor: pointer;
}
.sidebarForkIcon:hover {
background-color: black;
}
.sidebarForkBox {
position: absolute;
@ -746,18 +745,17 @@ li.accountInvite span {
z-index: 200;
width: 35px;
height: 35px;
border-right: 1px solid black;
}
.sidebarSaveIcon {
position: absolute;
width: 35px;
height: 35px;
background: #0F1519 url('MMCCicon_save_layout.png') no-repeat center center;
background: url('MMCCicon_save_layout.png') no-repeat center center;
background-size: 22px 22px;
cursor: pointer;
}
.sidebarSaveIcon:hover {
background-color: black;
}
.sidebarSaveBox {
position: absolute;
@ -798,7 +796,6 @@ li.accountInvite span {
z-index: 200;
width: 35px;
height: 35px;
border-right: 1px solid black;
}
.sidebarFilter.loggedout {
right: 35px;
@ -807,12 +804,12 @@ li.accountInvite span {
position: absolute;
width: 35px;
height: 35px;
background: #0F1519 url('MMCCicon_filter2.png') no-repeat center center;
background: url('MMCCicon_filter2.png') no-repeat center center;
background-size: 28px 28px;
cursor: pointer;
}
.sidebarFilterIcon:hover {
background-color: black;
}
/* we set a few of these params off screen to begin with, so that when we initialize the scroll bar it works, but then
we hide the element and position it correctly */
@ -889,7 +886,6 @@ h3.filterByMetacode {
z-index: 200;
width: 35px;
height: 35px;
border-right: 1px solid black;
}
.sidebarCollaborateIcon {
position: absolute;
@ -899,7 +895,6 @@ h3.filterByMetacode {
background-size: 36px 36px;
background-position: center center;
background-repeat: no-repeat;
background-color: #0F1519;
cursor: pointer;
}
.sidebarCollaborateIcon.blue {
@ -2269,7 +2264,7 @@ div.mapInfoStat {
top: 0px;
width: 44px;
height: 35px;
background: #0F1519 url('MMCCicon_add_map.png') no-repeat 3px -4px;
background: url('MMCCicon_add_map.png') no-repeat 3px -4px;
background-size: 40px 40px;
border-radius: 5px;
cursor: pointer;

92
app/controllers/maps_controller.rb
View file

@ -1,6 +1,6 @@
class MapsController < ApplicationController
before_filter :require_user, only: [:new, :create, :edit, :update, :savelayout, :destroy]
before_filter :require_user, only: [:create, :update, :destroy]
respond_to :html, :js, :json
@ -52,14 +52,6 @@ class MapsController < ApplicationController
respond_with(@maps, @request, @user)
end
# GET maps/new
def new
@map = Map.new
@user = current_user
respond_with(@map)
end
# GET maps/:id
def show
@ -69,8 +61,6 @@ class MapsController < ApplicationController
if not @map
redirect_to root_url and return
end
@mapjson = @map.self_as_json(@current).html_safe
@alltopics = @map.topics # should limit to topics visible to user
@allsynapses = @map.synapses # should also be limited
@ -78,43 +68,29 @@ class MapsController < ApplicationController
@allmetacodes = Metacode.all
respond_to do |format|
format.html { respond_with(@allmetacodes, @allmappings, @allsynapses, @alltopics, @map, @user) }
#format.json { respond_with(@mapjson) }
format.json { render json: @topics }
end
format.html { respond_with(@allmetacodes, @allmappings, @allsynapses, @alltopics, @map, @user) }
format.json { render json: @map }
end
end
# GET maps/:id/embed
def embed
@current = current_user
@current = current_user
@map = Map.find(params[:id]).authorize_to_show(@current)
if not @map
redirect_to root_url and return
end
@mapjson = @map.self_as_json(@current).html_safe
@alltopics = @map.topics # should limit to topics visible to user
@allsynapses = @map.synapses # should also be limited
@allmappings = @map.mappings
@allmetacodes = Metacode.all
respond_to do |format|
format.html { respond_with(@map, @user) }
format.json { respond_with(@mapjson) }
end
end
# GET maps/:id/json
def json
@current = current_user
@map = Map.find(params[:id]).authorize_to_show(@current)
if not @map
redirect_to root_url and return
end
respond_to do |format|
format.json { render :json => @map.self_as_json(@current) }
end
format.html { respond_with(@allmetacodes, @allmappings, @allsynapses, @alltopics, @map, @user) }
format.json { render json: @map }
end
end
# POST maps
@ -171,20 +147,6 @@ class MapsController < ApplicationController
end
end
# GET maps/:id/edit
def edit
@current = current_user
@map = Map.find(params[:id]).authorize_to_edit(@current)
if not @map
redirect_to root_url and return
end
@outtopics = @map.topics.order("name ASC").delete_if{|topic| not topic.authorize_to_view(@current)}
respond_with(@user, @map, @outtopics)
end
# PUT maps/:id
def update
@current = current_user
@ -202,32 +164,6 @@ class MapsController < ApplicationController
respond_with @map
end
# PUT maps/:id/savelayout
def savelayout
@user = current_user
@map = Map.find(params[:id])
if params[:map][:coordinates]
@all = params[:map][:coordinates]
@all = @all.split(',')
@all.each do |topic|
topic = topic.split('/')
@mapping = Mapping.find(topic[0])
if @mapping
@mapping.xloc = topic[1]
@mapping.yloc = topic[2]
@mapping.save
#push realtime update for location on map
@mapping.message 'update',@user.id
end
end
@map.arranged = true
@map.touch(:updated_at)
@map.save
end
end
# DELETE maps/:id
def destroy
@current = current_user

25
app/controllers/synapses_controller.rb
View file

@ -3,20 +3,19 @@ class SynapsesController < ApplicationController
before_filter :require_user, only: [:create, :update, :destroy]
respond_to :js, :json
respond_to :json
# GET synapses/:id/json
def json
@current = current_user
@synapse = Synapse.find(params[:id]).authorize_to_show(@current)
# GET /synapses/1.json
def show
@synapse = Synapse.find(params[:id])
#.authorize_to_show(@current)
if not @synapse
redirect_to root_url and return
end
respond_to do |format|
format.json { render :json => @synapse.selfplusnodes_as_json }
end
#if not @synapse
# redirect_to root_url and return
#end
render json: @synapse
end
# POST /synapses
@ -65,7 +64,7 @@ class SynapsesController < ApplicationController
@synapse.delete if @synapse
respond_to do |format|
format.js { render :json => "success" }
format.json { render :json => "success" }
end
end
end

15
app/controllers/topics_controller.rb
View file

@ -38,21 +38,6 @@ class TopicsController < ApplicationController
format.json { render :json => @topic }
end
end
# GET topics/:id/json
def json
@current = current_user
@topic = Topic.find(params[:id]).authorize_to_show(@current)
if not @topic
redirect_to root_url and return
end
respond_to do |format|
#format.json { render :json => @topic.self_as_json }
format.json { render :json => @topic.to_json }
end
end
# POST /topics
# POST /topics.json

71
app/models/map.rb
View file

@ -33,67 +33,6 @@ end
return contributors
end
###### JSON ######
#build a json object of a map
def self_as_json(current)
Jbuilder.encode do |json|
@topics = self.topics.dup
@synapses = self.synapses.dup
json.array!(@topics.delete_if{|topic| not topic.authorize_to_view(current)}) do |topic|
#json.adjacencies topic.synapses2.delete_if{|synapse| (not @topics.include?(synapse.topic1)) || (not @synapses.include?(synapse)) || (not synapse.authorize_to_view(current)) || (not synapse.topic1.authorize_to_view(current)) } do |json, synapse|
json.adjacencies topic.synapses1.delete_if{|synapse| (not @synapses.include?(synapse)) || (not @topics.include?(synapse.topic2)) || (not synapse.authorize_to_view(current)) || (not synapse.topic2.authorize_to_view(current)) } do |json, synapse|
json.nodeTo synapse.node2_id
json.nodeFrom synapse.node1_id
@synapsedata = Hash.new
@synapsedata['$desc'] = synapse.desc
@synapsedata['$showDesc'] = false
@synapsedata['$category'] = synapse.category
@synapsedata['$id'] = synapse.id
@synapsedata['$userid'] = synapse.user.id
@synapsedata['$username'] = synapse.user.name
@synapsedata['$direction'] = [synapse.node1_id.to_s(), synapse.node2_id.to_s()]
@synapsedata['$permission'] = synapse.permission
@mapping = Mapping.find_by_synapse_id_and_map_id(synapse.id,self.id)
@synapsedata['$mappingid'] = @mapping.id
json.data @synapsedata
end
@inmaps = Array.new
@mapsString = ""
topic.maps.each_with_index do |map, index|
@inmaps.push(map.id)
@mapsString += map.name
@mapsString += (index+1) == topic.maps.count ? "" : ", "
end
@topicdata = Hash.new
@topicdata['$desc'] = topic.desc
@topicdata['$link'] = topic.link
@topicdata['$metacode'] = topic.metacode.name
@topicdata['$inmaps'] = @inmaps
@topicdata['$inmapsString'] = @mapsString
@topicdata['$synapseCount'] = topic.synapses.count
@topicdata['$userid'] = topic.user.id
@topicdata['$username'] = topic.user.name
@mapping = Mapping.find_by_topic_id_and_map_id(topic.id,self.id)
@topicdata['$xloc'] = @mapping.xloc
@topicdata['$yloc'] = @mapping.yloc
@topicdata['$mappingid'] = @mapping.id
@topicdata['$permission'] = topic.permission
@topicdata['$date'] = topic.created_at.strftime("%m/%d/%Y")
@topicdata['$id'] = topic.id
json.data @topicdata
json.id @mapping.id
json.name topic.name
end
end
end
##### PERMISSIONS ######
scope :visibleToUser, lambda { |current, user|
@ -135,15 +74,5 @@ end
end
return true
end
# returns Boolean based on whether user has permissions to edit or not
def authorize_linkto_edit(user)
if (self.user == user)
return true
elsif (self.permission == "commons")
return true
end
return false
end
end

6
app/views/layouts/_lightboxes.html.erb
View file

@ -6,7 +6,7 @@
<div id="lightbox_overlay">
<div id="lightbox_main">
<a id="lightbox_close" onclick="closeLightbox(); return false;" href="#"></a>
<a id="lightbox_close" onclick="Metamaps.GlobalUI.closeLightbox(); return false;" href="#"></a>
<div id="lightbox_content">
<div class="lightboxContent" id="about">
@ -42,7 +42,7 @@
<div class="lightboxContent" id="invite">
<h3>Send Invites</h3>
<p>You can invite others to the Metamaps platform. Send them this link</p>
<p class="green">http://metamaps.cc/users/sign_up</p>
<p class="green">http://metamaps.cc/join</p>
<p>and give them the access code shown below.</p>
<% mapper = current_user %>
<p class="green"><%= mapper.code %></p>
@ -67,6 +67,6 @@
</div>
</div>
<div id="lightbox_screen" onclick="closeLightbox();return false;" style="height: 100%;"></div>
<div id="lightbox_screen" onclick="Metamaps.GlobalUI.closeLightbox();return false;" style="height: 100%;"></div>
</div>

12
app/views/layouts/_switchmetacodes.html.erb
View file

@ -36,7 +36,9 @@
</ul>
<div class="clearfloat"></div>
</div>
<button class="button" onclick="updateMetacodeSet(<%= m.id %>, <%= localindex %>, false);">Switch to Set</button>
<button class="button" onclick="Metamaps.Create.updateMetacodeSet(<%= m.id %>, <%= localindex %>, false);">
Switch to Set
</button>
</div>
<% end %>
<div id="metacodeSwitchTabsCustom">
@ -57,13 +59,15 @@
</ul>
<div class="clearfloat"></div>
</div>
<button class="button" onclick="updateMetacodeSet('custom', <%= allMetacodeSets.length %>, true);">Switch to Custom Set</button>
<button class="button" onclick="Metamaps.Create.updateMetacodeSet('custom', <%= allMetacodeSets.length %>, true);">
Switch to Custom Set
</button>
</div>
</div>
<div class="clearfloat"></div>
<script>
Metamaps.Settings.selectedMetacodeSet = "metacodeset-<%= selectedSet %>";
Metamaps.Settings.selectedMetacodeSetIndex = <%= index %>;
Metamaps.Create.selectedMetacodeSet = "metacodeset-<%= selectedSet %>";
Metamaps.Create.selectedMetacodeSetIndex = <%= index %>;
</script>

4
app/views/layouts/application.html.erb
View file

@ -29,8 +29,8 @@
</script>
<%= stylesheet_link_tag "application", :media => "all" %>
<%= javascript_include_tag "application" %>
<% if controller_name == "maps" && action_name == "show" %>
<%= javascript_include_tag "map" %>
<% if (controller_name == "maps" || controller_name == "topics") && action_name == "show" %>
<%= javascript_include_tag "compileMapPages" %>
<% end %>
<script type="text/javascript" src="//use.typekit.net/tki2nyo.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>

2
app/views/maps/_fork.html.erb
View file

@ -58,7 +58,7 @@
<p class="permText">*new topics and synapses take on the same permission as the map they are created on</p>
<div class="buttonWrapper">
<button class="button" onclick="closeLightbox(); return false;">Cancel</button>
<button class="button" onclick="Metamaps.GlobalUI.closeLightbox(); return false;">Cancel</button>
<%= form.submit "Create!", class: "add" %>
</div>

2
app/views/maps/_new.html.erb
View file

@ -53,7 +53,7 @@
<p class="permText">*new topics and synapses take on the same permission as the map they are created on</p>
<div class="buttonWrapper">
<button class="button" onclick="closeLightbox(); return false;">Cancel</button>
<button class="button" onclick="Metamaps.GlobalUI.closeLightbox(); return false;">Cancel</button>
<%= form.submit "Create!", class: "add" %>
</div>

6
app/views/maps/_newsynapse.html.erb
View file

@ -6,11 +6,5 @@
<div class="anypage">
<%= form_for Synapse.new, url: synapses_url, remote: true do |form| %>
<%= form.text_field :desc, :placeholder => "describe the connection..." %>
<%= form.hidden_field :topic1id, :value => 0 %>
<%= form.hidden_field :topic2id, :value => 0 %>
<%= form.hidden_field :grabSynapse, :value => "null" %>
<% if (@map.permission == "commons" && authenticated?) || @map.user == user %>
<%= form.hidden_field :map, :value => @map.id %>
<% end %>
<% end %>
</div>

16
app/views/maps/_newtopic.html.erb
View file

@ -22,23 +22,15 @@
<% end %>
</div>
<%= form.text_field :name, :maxlength => 140, :placeholder => "title..." %>
<%= form.hidden_field :metacode, :value => "Action" %>
<%= form.hidden_field :x, :value => 0 %>
<%= form.hidden_field :y, :value => 0 %>
<% if (@map.permission == "commons" && authenticated?) || @map.user == user %>
<%= form.hidden_field :map, :value => @map.id %>
<% end %>
<%= form.hidden_field :grabTopic, :value => "null" %>
<%= form.hidden_field :addSynapse, :value => false %>
<div id="metacodeImgTitle"></div>
<div class="clearfloat"></div>
<script>
<% @metacodes.each do |metacode| %>
<% if !set %>
MetamapsModel.selectedMetacodes.push("<%= metacode.id %>");
MetamapsModel.newSelectedMetacodes.push("<%= metacode.id %>");
MetamapsModel.selectedMetacodeNames.push("<%= metacode.name %>");
MetamapsModel.newSelectedMetacodeNames.push("<%= metacode.name %>");
Metamaps.Create.selectedMetacodes.push("<%= metacode.id %>");
Metamaps.Create.newSelectedMetacodes.push("<%= metacode.id %>");
Metamaps.Create.selectedMetacodeNames.push("<%= metacode.name %>");
Metamaps.Create.newSelectedMetacodeNames.push("<%= metacode.name %>");
<% end %>
<% end %>
</script>

23
app/views/maps/show.html.erb
View file

@ -12,14 +12,6 @@
<% if authenticated? %>
<% if @map.permission == "commons" || @map.user == user %>
<div class="sidebarSave">
<div class="sidebarSaveIcon hoverForTip">
<div class="tip">Save Layout</div>
</div>
<div class="sidebarSaveBox"></div>
</div>
<% end %>
<div class="sidebarFork">
<div class="sidebarForkIcon hoverForTip">
<div class="tip">Save To New Map</div>
@ -28,14 +20,14 @@
</div>
<% if @map.permission == "commons" || @map.user == user %>
<div class="sidebarCollaborate">
<div class="sidebarCollaborateIcon"></div>
<div class="sidebarCollaborateIcon blue"></div>
<div class="sidebarCollaborateBox">
<h3 class="realtimeBoxTitle">Realtime: </h3>
<span class="realtimeOnOff rtOff">OFF</span>
<span class="realtimeOnOff rtOn">ON</span>
<div class="clearfloat"></div>
<div class="realtimeMapperList">
<ul>
<li class="rtMapper littleRtOff rtMapperSelf">
<li class="rtMapper littleRtOn rtMapperSelf">
<%= user.name %> (me)
</li>
</ul>
@ -73,17 +65,10 @@
<% if authenticated? %>
<% # add these if you have edit permissions on the map %>
<% if @map.permission == "commons" || @map.user == user %>
<% if @map.permission == "commons" || @map.user == user %>
<% # for creating and pulling in topics and synapses %>
<%= render :partial => 'newtopic' %>
<%= render :partial => 'newsynapse' %>
<% # for saving the layout of the map %>
<%= form_for @map, :url => savelayout_path(@map), :html => { :class => "saveMapLayout", :id => "saveMapLayout"}, remote: true do |form| %>
<%= form.hidden_field "coordinates", :value => "" %>
<% end %>
<% end %>
<% # for populating the change metacode list on the topic card %>

2
config/environments/production.rb
View file

@ -70,7 +70,7 @@ ISSAD::Application.configure do
# config.action_controller.asset_host = "http://assets.example.com"
# Precompile additional assets (application.js, application.css, and all non-JS/CSS are already added)
config.assets.precompile += %w( metamaps.js )
config.assets.precompile += %w( compileMapPages.js )
# Disable delivery errors, bad email addresses will be ignored
# config.action_mailer.raise_delivery_errors = false

11
config/routes.rb
View file

@ -12,20 +12,14 @@ ISSAD::Application.routes.draw do
match '/search/mappers', to: 'main#searchmappers', via: :get, as: :searchmappers
match '/search/synapses', to: 'main#searchsynapses', via: :get, as: :searchsynapses
match 'maps/:id/savelayout', to: 'maps#savelayout', via: :put, as: :savelayout
match 'topics/:map_id/:topic_id/removefrommap', to: 'topics#removefrommap', via: :post, as: :removefrommap
match 'synapses/:map_id/:synapse_id/removefrommap', to: 'synapses#removefrommap', via: :post, as: :removefrommap
resources :in_metacode_sets
resources :metacode_sets, :except => [:show]
resources :metacodes, :except => [:show, :destroy]
resources :topics, except: [:index, :new, :edit] do
get :autocomplete_topic, :on => :collection
end
match 'topics/:id/:format', to: 'topics#json', via: :get, as: :json
resources :synapses, except: [:index, :new, :edit, :show]
match 'synapses/:id/:format', to: 'synapses#json', via: :get, as: :json
resources :synapses, except: [:index, :new, :edit]
match 'maps/active', to: 'maps#index', via: :get, as: :activemaps
match 'maps/featured', to: 'maps#index', via: :get, as: :featuredmaps
@ -36,7 +30,6 @@ ISSAD::Application.routes.draw do
resources :maps, except: [:new, :edit]
match 'maps/:id/embed', to: 'maps#embed', via: :get, as: :embed
match 'maps/:id/:format', to: 'maps#json', via: :get, as: :json
devise_for :users, :controllers => { :registrations => "registrations" }, :path_names => { :sign_in => 'login', :sign_out => 'logout' }
devise_scope :user do
@ -46,6 +39,6 @@ ISSAD::Application.routes.draw do
resources :users, except: [:index]
resources :mappings
resources :mappings, except: [:index, :new, :edit]
end