fixed selecting things on the radial view, and the weird synapse autocomplete bug

This commit is contained in:
Connor Turland 2013-11-14 12:28:31 -05:00
parent 6e433683c7
commit adcdea5d5e
23 changed files with 169 additions and 108 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 3 KiB

View file

@ -109,7 +109,6 @@ function selectNodeOnClickHandler(node, e) {
return; return;
} }
if (gType != "centered") {
//set final styles //set final styles
if (!e.shiftKey) { if (!e.shiftKey) {
Mconsole.graph.eachNode(function (n) { Mconsole.graph.eachNode(function (n) {
@ -129,7 +128,6 @@ function selectNodeOnClickHandler(node, e) {
duration: 500 duration: 500
}); });
Mconsole.plot(); Mconsole.plot();
}
}//selectNodeOnClickHandler }//selectNodeOnClickHandler
function canvasDoubleClickHandler(canvasLoc,e) { function canvasDoubleClickHandler(canvasLoc,e) {
@ -191,19 +189,17 @@ function onDragMoveTopicHandler(node, eventInfo, e) {
if ( e.touches || (e.button == 0 && !e.altKey && (e.buttons == 0 || e.buttons == 1 || e.buttons == undefined))) { 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 //if the node dragged isn't already selected, select it
var whatToDo = handleSelectionBeforeDragging(node, e); var whatToDo = handleSelectionBeforeDragging(node, e);
if (node.pos.rho || node.pos.rho === 0) { if (whatToDo == 'only-drag-this-one' || whatToDo == 'deselect') {
if (gType == "centered") {
var rho = Math.sqrt(pos.x * pos.x + pos.y * pos.y); var rho = Math.sqrt(pos.x * pos.x + pos.y * pos.y);
var theta = Math.atan2(pos.y, pos.x); var theta = Math.atan2(pos.y, pos.x);
node.pos.setp(theta, rho); node.pos.setp(theta, rho);
} else if (whatToDo == 'only-drag-this-one') { }
newPos = new $jit.Complex() else {
newPos.x = pos.x node.pos.setc(pos.x,pos.y);
newPos.y = pos.y node.setData('xloc', pos.x);
node.setPos(newPos, 'start') node.setData('yloc', pos.y);
node.setPos(newPos, 'current') }
node.setPos(newPos, 'end')
node.setData('xloc', pos.x);
node.setData('yloc', pos.y);
} else { } else {
var len = MetamapsModel.selectedNodes.length; var len = MetamapsModel.selectedNodes.length;
@ -212,20 +208,32 @@ function onDragMoveTopicHandler(node, eventInfo, e) {
var yOffset = new Array(); var yOffset = new Array();
for (var i = 0; i < len; i += 1) { for (var i = 0; i < len; i += 1) {
var n = MetamapsModel.selectedNodes[i]; var n = MetamapsModel.selectedNodes[i];
xOffset[i] = n.pos.x - node.pos.x; if (gType == "centered") {
yOffset[i] = n.pos.y - node.pos.y; 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
for (var i = 0; i < len; i += 1) { for (var i = 0; i < len; i += 1) {
var n = MetamapsModel.selectedNodes[i]; var n = MetamapsModel.selectedNodes[i];
var x = pos.x + xOffset[i]; if (gType == "centered") {
var y = pos.y + yOffset[i]; var x = pos.x + xOffset[i];
newPos = new $jit.Complex() var y = pos.y + yOffset[i];
newPos.x = x var rho = Math.sqrt(x * x + y * y);
newPos.y = y var theta = Math.atan2(y, x);
n.setPos(newPos, 'start') n.pos.setp(theta, rho);
n.setPos(newPos, 'current') }
n.setPos(newPos, 'end') else {
var x = pos.x + xOffset[i];
var y = pos.y + yOffset[i];
n.pos.setc(x,y);
n.setData('xloc', pos.x);
n.setData('yloc', pos.y);
}
n.setData('xloc', x); n.setData('xloc', x);
n.setData('yloc', y); n.setData('yloc', y);
}//for }//for

View file

@ -132,7 +132,7 @@ function graphSettings(type, embed) {
// Add text to the labels. This method is only triggered // Add text to the labels. This method is only triggered
// on label creation and only for DOM labels (not native canvas ones). // on label creation and only for DOM labels (not native canvas ones).
onCreateLabel: function (domElement, node) { onCreateLabel: function (domElement, node) {
onCreateLabelHandler(domElement, node); onCreateLabelHandler(type, domElement, node);
}, },
// Change node styles when DOM labels are placed or moved. // Change node styles when DOM labels are placed or moved.
onPlaceLabel: function (domElement, node) { onPlaceLabel: function (domElement, node) {
@ -161,7 +161,7 @@ function graphSettings(type, embed) {
//different because we're centred //different because we're centred
onDragCancelHandler(node, eventInfo, e, true); onDragCancelHandler(node, eventInfo, e, true);
}; };
t.Events.onClick = function(node, eventInfo, e) { /*t.Events.onClick = function(node, eventInfo, e) {
//this is handled mostly differently than in arranged/chaotic //this is handled mostly differently than in arranged/chaotic
if (e.target.id != "infovis-canvas") return false; if (e.target.id != "infovis-canvas") return false;
@ -173,21 +173,12 @@ function graphSettings(type, embed) {
selectEdgeOnClickHandler(node, e); selectEdgeOnClickHandler(node, e);
} else if (node && !node.nodeFrom) { } else if (node && !node.nodeFrom) {
//node is actually a node :) //node is actually a node :)
if (!Mconsole.busy) { selectNodeOnClickHandler(node, e);
$('h1.index').html('Viewing Topic: ' + node.name);
window.history.pushState(node.name, "Metamaps", "/topics/" + node.id);
Mconsole.onClick(node.id, {
hideLabels: false,
duration: 1000,
onComplete: function() {
fetchRelatives(node);
}
});
}
} else { } else {
canvasDoubleClickHandler(eventInfo.getPos(), e); canvasDoubleClickHandler(eventInfo.getPos(), e);
} }
}; };*/
}//if }//if
return t; return t;
@ -464,7 +455,8 @@ function selectNodesWithBox() {
Mconsole.graph.eachNode(function (n) { Mconsole.graph.eachNode(function (n) {
var x = n.pos.x, y = n.pos.y; 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)) { 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); var nodeIsSelected = MetamapsModel.selectedNodes.indexOf(n);

View file

@ -14,14 +14,20 @@
* expression is substituted in later (for html, in a separate function). * expression is substituted in later (for html, in a separate function).
*/ */
function onCreateLabelHandler(domElement, node) { function onCreateLabelHandler(type, domElement, node) {
// Create a 'name' button and add it to the main node label // Create a 'name' button and add it to the main node label
var nameContainer = document.createElement('span'), var nameContainer = document.createElement('span'),
style = nameContainer.style; style = nameContainer.style;
nameContainer.className = 'name topic_' + node.id; nameContainer.className = 'name topic_' + node.id;
nameContainer.id = 'topic_' + node.id + '_label'; nameContainer.id = 'topic_' + node.id + '_label';
nameContainer.innerHTML = generateLittleHTML (node); if (type == "centered") {
nameContainer.innerHTML = generateCenteredLittleHTML (node);
}
else {
nameContainer.innerHTML = generateLittleHTML (node);
}
domElement.appendChild(nameContainer); domElement.appendChild(nameContainer);
style.fontSize = "0.9em"; style.fontSize = "0.9em";
style.color = "#222222"; style.color = "#222222";
@ -29,6 +35,7 @@ function onCreateLabelHandler(domElement, node) {
bindNameContainerCallbacks(nameContainer, node); bindNameContainerCallbacks(nameContainer, node);
} }
function generateShowcardHTML() { function generateShowcardHTML() {
return ' \ return ' \
<div class="CardOnGraph" \ <div class="CardOnGraph" \
@ -242,6 +249,23 @@ function generateLittleHTML(node) {
return littleHTML; return littleHTML;
} }
function generateCenteredLittleHTML(node) {
var littleHTML = ' \
<div class="label">$_name_$</div> \
<div class="nodeOptions">';
littleHTML += ' \
<span class="centerOn" \
onclick="centerOn($_id_$)" \
title="Move this topic to center"> \
</span>';
littleHTML += '</div>';
littleHTML = littleHTML.replace(/\$_id_\$/g, node.id);
littleHTML = littleHTML.replace(/\$_name_\$/g, node.name);
return littleHTML;
}
function hideCurrentCard() { function hideCurrentCard() {
if (MetamapsModel.showcardInUse) { if (MetamapsModel.showcardInUse) {
var node = Mconsole.graph.getNode(MetamapsModel.showcardInUse); var node = Mconsole.graph.getNode(MetamapsModel.showcardInUse);

View file

@ -1,3 +1,18 @@
function centerOn(nodeid) {
if (!Mconsole.busy) {
var node = Mconsole.graph.getNode(nodeid);
$('h1.index').html('Viewing Topic: ' + node.name);
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) { function editEdge(edge, e) {
if (authorizeToEdit(edge)) { if (authorizeToEdit(edge)) {
//reset so we don't interfere with other edges, but first, save its x and y //reset so we don't interfere with other edges, but first, save its x and y

View file

@ -31,6 +31,14 @@
background: url('removeFromMap.png') no-repeat 2px 0; background: url('removeFromMap.png') no-repeat 2px 0;
} }
.centerOn {
display: block;
width: 17px;
height: 23px;
background: url("centerOn.png") no-repeat 2px 3px;
margin-top: 4px;
}
.deleteTopic { .deleteTopic {
display: block; display: block;
width: 17px; width: 17px;

View file

@ -15,7 +15,12 @@ before_create :generate_code
validates_uniqueness_of :name # done by devise validates_uniqueness_of :name # done by devise
validates_uniqueness_of :email # done by devise validates_uniqueness_of :email # done by devise
validates :joinedwithcode, :presence => true, :inclusion => { :in => User.all.map(&:code), :message => "%{value} is not a valid code" }, :on => :create if Object.const_defined?('User')
codes = User.all.map(&:code)
else
codes = []
end
validates :joinedwithcode, :presence => true, :inclusion => { :in => codes, :message => "%{value} is not a valid code" }, :on => :create
def generate_code def generate_code
#generate a random 8 letter/digit code that they can use to invite people #generate a random 8 letter/digit code that they can use to invite people

View file

@ -122,5 +122,3 @@
</script> </script>
<%= render :partial => 'main/find' %> <%= render :partial => 'main/find' %>
<%= render :partial => 'main/analyze' %>
<%= render :partial => 'main/organize' %>

View file

@ -4,6 +4,7 @@
*/ */
$('#new_synapse').fadeOut('fast'); $('#new_synapse').fadeOut('fast');
$('#synapse_desc').attr('value',''); $('#synapse_desc').attr('value','');
$('.ui-autocomplete.ui-widget').fadeOut('fast');
$('#synapse_desc').autocomplete('disable'); $('#synapse_desc').autocomplete('disable');
$('#synapse_topic1id').attr('value','0'); $('#synapse_topic1id').attr('value','0');
$('#synapse_topic2id').attr('value','0'); $('#synapse_topic2id').attr('value','0');

View file

@ -34,6 +34,7 @@ if (!$.isEmptyObject(Mconsole.graph.nodes)) {
temp.setPos(tempPos, 'current'); temp.setPos(tempPos, 'current');
temp.setPos(tempPos, 'start'); temp.setPos(tempPos, 'start');
temp.setPos(tempPos, 'end'); temp.setPos(tempPos, 'end');
temp._depth = tempNode._depth + 1;
} }
else if (gType == "arranged" || gType == "chaotic") { else if (gType == "arranged" || gType == "chaotic") {
temp.setData('xloc',0); temp.setData('xloc',0);
@ -52,6 +53,7 @@ if (!$.isEmptyObject(Mconsole.graph.nodes)) {
$('#synapse_topic1id').val(tempNode.id); $('#synapse_topic1id').val(tempNode.id);
$('#synapse_topic2id').val(temp.id); $('#synapse_topic2id').val(temp.id);
$('#synapse_desc').autocomplete('enable'); $('#synapse_desc').autocomplete('enable');
$('#synapse_desc').val("");
$('#new_synapse').fadeIn('fast'); $('#new_synapse').fadeIn('fast');
$('#synapse_desc').focus(); $('#synapse_desc').focus();
Mconsole.fx.animate({ Mconsole.fx.animate({

View file

@ -19,11 +19,9 @@
<div class="headertop"> <div class="headertop">
<div class="tab"></div> <div class="tab"></div>
<button class="hidelabels" onclick="hideLabels();">Hide Labels</button> <button class="hidelabels" onclick="hideLabels();">Hide Labels</button>
<button onclick="enterKeyPressed();">Keep Selected</button>
<% if authenticated? %> <% if authenticated? %>
<button onclick="saveToMap();">Save to Map</button> <button onclick="saveToMap();">Save to Map</button>
<% end %> <% end %>
<button onclick='clearCanvasExceptRoot();'>Clear Canvas</button>
</div> </div>
<div class="clearfloat"></div> <div class="clearfloat"></div>
@ -47,10 +45,6 @@
}); });
</script> </script>
<!-- <%= render :partial => 'main/find' %> -->
<%= render :partial => 'main/analyze' %>
<%= render :partial => 'main/organize' %>
<% if authenticated? %> <% if authenticated? %>
<%= render :partial => 'topics/new' %> <%= render :partial => 'topics/new' %>
<%= render :partial => 'synapses/new' %> <%= render :partial => 'synapses/new' %>

View file

@ -13,38 +13,6 @@
ActiveRecord::Schema.define(:version => 20130709212556) do ActiveRecord::Schema.define(:version => 20130709212556) do
create_table "entities", :force => true do |t|
t.datetime "created_at", :null => false
t.datetime "updated_at", :null => false
end
create_table "fields", :force => true do |t|
t.integer "entity_id"
t.integer "field_id"
t.integer "mkey_id"
t.binary "binary_val"
t.boolean "boolean_val"
t.date "date_val"
t.datetime "datetime_val"
t.decimal "decimal_val"
t.float "float_val"
t.integer "integer_val"
t.string "string_val"
t.text "text_val"
t.time "time_val"
t.integer "references_val_id"
t.datetime "datetimeedit"
t.integer "user_id"
t.integer "useredit_id"
end
add_index "fields", ["entity_id"], :name => "index_fields_on_entity_id"
add_index "fields", ["field_id"], :name => "index_fields_on_field_id"
add_index "fields", ["mkey_id"], :name => "index_fields_on_mkey_id"
add_index "fields", ["references_val_id"], :name => "index_fields_on_references_val_id"
add_index "fields", ["user_id"], :name => "index_fields_on_user_id"
add_index "fields", ["useredit_id"], :name => "index_fields_on_useredit_id"
create_table "mappings", :force => true do |t| create_table "mappings", :force => true do |t|
t.text "category" t.text "category"
t.integer "xloc" t.integer "xloc"

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

File diff suppressed because one or more lines are too long

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 3 KiB

BIN
public/assets/centerOn.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3 KiB

View file

@ -19,6 +19,8 @@ black_bg.png: black_bg-a84a34cb111aa74875c1074cd333adab.png
black_bg/index.png: black_bg-a84a34cb111aa74875c1074cd333adab.png black_bg/index.png: black_bg-a84a34cb111aa74875c1074cd333adab.png
catalyst.png: catalyst-1594e823fd9c8472821f92bf396d6923.png catalyst.png: catalyst-1594e823fd9c8472821f92bf396d6923.png
catalyst/index.png: catalyst-1594e823fd9c8472821f92bf396d6923.png catalyst/index.png: catalyst-1594e823fd9c8472821f92bf396d6923.png
centerOn.png: centerOn-8e34d2284da3af348a871042dc124b06.png
centerOn/index.png: centerOn-8e34d2284da3af348a871042dc124b06.png
closed.png: closed-15267ab51fc3279b336662252acca9bf.png closed.png: closed-15267ab51fc3279b336662252acca9bf.png
closed/index.png: closed-15267ab51fc3279b336662252acca9bf.png closed/index.png: closed-15267ab51fc3279b336662252acca9bf.png
con_icon.png: con_icon-7ee91f8671fb3fa1fc5881baaea21f15.png con_icon.png: con_icon-7ee91f8671fb3fa1fc5881baaea21f15.png
@ -155,8 +157,8 @@ WebSocketMain.swf: WebSocketMain-0de980edb45e36785bf9d862baa032bb.swf
WebSocketMain/index.swf: WebSocketMain-0de980edb45e36785bf9d862baa032bb.swf WebSocketMain/index.swf: WebSocketMain-0de980edb45e36785bf9d862baa032bb.swf
WebSocketMainInsecure.swf: WebSocketMainInsecure-c4377647e57e58cacc692c8a51afc9f8.swf WebSocketMainInsecure.swf: WebSocketMainInsecure-c4377647e57e58cacc692c8a51afc9f8.swf
WebSocketMainInsecure/index.swf: WebSocketMainInsecure-c4377647e57e58cacc692c8a51afc9f8.swf WebSocketMainInsecure/index.swf: WebSocketMainInsecure-c4377647e57e58cacc692c8a51afc9f8.swf
application.js: application-ccd5b4903a6d3d29a6cf4d65d54e5d66.js application.js: application-64a634aaea8b14786c16e2405d002136.js
application/index.js: application-ccd5b4903a6d3d29a6cf4d65d54e5d66.js application/index.js: application-64a634aaea8b14786c16e2405d002136.js
scroll/mCSB_buttons.png: scroll/mCSB_buttons-0642ce29bb568932e832d150141614e6.png scroll/mCSB_buttons.png: scroll/mCSB_buttons-0642ce29bb568932e832d150141614e6.png
scroll/mCSB_buttons/index.png: scroll/mCSB_buttons-0642ce29bb568932e832d150141614e6.png scroll/mCSB_buttons/index.png: scroll/mCSB_buttons-0642ce29bb568932e832d150141614e6.png
Fonts/Lato-Lig-webfont.eot: Fonts/Lato-Lig-webfont-1435188a694a7d5e29cf4a3288ff3e36.eot Fonts/Lato-Lig-webfont.eot: Fonts/Lato-Lig-webfont-1435188a694a7d5e29cf4a3288ff3e36.eot
@ -167,5 +169,5 @@ Fonts/Lato-Lig-webfont.ttf: Fonts/Lato-Lig-webfont-4b8f0d5ac83e783eb84848ff32546
Fonts/Lato-Lig-webfont/index.ttf: Fonts/Lato-Lig-webfont-4b8f0d5ac83e783eb84848ff3254685c.ttf Fonts/Lato-Lig-webfont/index.ttf: Fonts/Lato-Lig-webfont-4b8f0d5ac83e783eb84848ff3254685c.ttf
Fonts/Lato-Lig-webfont.woff: Fonts/Lato-Lig-webfont-47c2912f319ae759c3b1cd558b080c33.woff Fonts/Lato-Lig-webfont.woff: Fonts/Lato-Lig-webfont-47c2912f319ae759c3b1cd558b080c33.woff
Fonts/Lato-Lig-webfont/index.woff: Fonts/Lato-Lig-webfont-47c2912f319ae759c3b1cd558b080c33.woff Fonts/Lato-Lig-webfont/index.woff: Fonts/Lato-Lig-webfont-47c2912f319ae759c3b1cd558b080c33.woff
application.css: application-35fd75c72fc58c75cc102042a2e708c9.css application.css: application-4aed0b9d5fe2ebc5e4f255906f9ad457.css
application/index.css: application-35fd75c72fc58c75cc102042a2e708c9.css application/index.css: application-4aed0b9d5fe2ebc5e4f255906f9ad457.css