This commit is contained in:
Bashar Jabbour 2014-10-01 20:43:23 -04:00
commit 179cee8456
9 changed files with 118 additions and 126 deletions

View file

@ -621,30 +621,25 @@ Metamaps.GlobalUI.Search = {
} }
} }
if (!self.optionsInitialized) { $('.limitToMe').unbind().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);
});
$('.limitToMe').bind("change", function (e) { // when the user clicks minimize section, hide the results for that section
// set the value of the search equal to itself to retrigger the autocomplete event $('.minimizeMapperResults').unbind().click(function (e) {
self.isOpen = false; toggleResultSet.call(this, 'mappers');
$('.sidebarSearchField').typeahead('setQuery', $('.sidebarSearchField').val()); });
setTimeout(function () { $('.minimizeTopicResults').unbind().click(function (e) {
self.isOpen = true; toggleResultSet.call(this, 'topics');
}, 2000); });
}); $('.minimizeMapResults').unbind().click(function (e) {
toggleResultSet.call(this, 'maps');
// 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;
}
}, },
hideLoader: function () { hideLoader: function () {
$('#searchLoading').hide(); $('#searchLoading').hide();

View file

@ -265,7 +265,7 @@ Metamaps.JIT = {
color: Metamaps.Settings.colors.synapses.normal, color: Metamaps.Settings.colors.synapses.normal,
type: 'customEdge', type: 'customEdge',
lineWidth: 2, lineWidth: 2,
alpha: 0.4 alpha: 1
}, },
//Native canvas text styling //Native canvas text styling
Label: { Label: {
@ -574,16 +574,16 @@ Metamaps.JIT = {
//following if statement only executes if the edge being hovered over is not selected //following if statement only executes if the edge being hovered over is not selected
if (edgeIsSelected == -1) { if (edgeIsSelected == -1) {
edge.setData('showDesc', true, 'current'); edge.setData('showDesc', true, 'current');
edge.setDataset('end', {
lineWidth: 4,
alpha: 1
});
Metamaps.Visualize.mGraph.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
Metamaps.Visualize.mGraph.plot();
} }
edge.setDataset('end', {
lineWidth: 4
});
Metamaps.Visualize.mGraph.fx.animate({
modes: ['edge-property:lineWidth'],
duration: 100
});
Metamaps.Visualize.mGraph.plot();
}, // onMouseEnter }, // onMouseEnter
onMouseLeave: function (edge) { onMouseLeave: function (edge) {
if (edge.getData('alpha') === 0) return; // don't do anything if the edge is filtered if (edge.getData('alpha') === 0) return; // don't do anything if the edge is filtered
@ -592,15 +592,15 @@ Metamaps.JIT = {
//following if statement only executes if the edge being hovered over is not selected //following if statement only executes if the edge being hovered over is not selected
if (edgeIsSelected == -1) { if (edgeIsSelected == -1) {
edge.setData('showDesc', false, 'current'); edge.setData('showDesc', false, 'current');
edge.setDataset('end', {
lineWidth: 2,
alpha: 0.4
});
Metamaps.Visualize.mGraph.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
} }
edge.setDataset('end', {
lineWidth: 2
});
Metamaps.Visualize.mGraph.fx.animate({
modes: ['edge-property:lineWidth'],
duration: 100
});
Metamaps.Visualize.mGraph.plot(); Metamaps.Visualize.mGraph.plot();
}, // onMouseLeave }, // onMouseLeave
onMouseMoveHandler: function (node, eventInfo, e) { onMouseMoveHandler: function (node, eventInfo, e) {

View file

@ -26,7 +26,7 @@ Metamaps.Settings = {
colors: { colors: {
background: '#344A58', background: '#344A58',
synapses: { synapses: {
normal: '#222222', normal: '#888888',
hover: '#222222', hover: '#222222',
selected: '#FFFFFF' selected: '#FFFFFF'
}, },
@ -683,8 +683,8 @@ Metamaps.TopicCard = {
link: null link: null
}); });
$('.embeds').empty(); $('.embeds').empty();
$('#addLinkInput input').val("");
$('.attachments').removeClass('hidden'); $('.attachments').removeClass('hidden');
$('.addAttachment').show();
$('.CardOnGraph').removeClass('hasAttachment'); $('.CardOnGraph').removeClass('hasAttachment');
}, },
bindShowCardListeners: function (topic) { bindShowCardListeners: function (topic) {
@ -700,21 +700,9 @@ Metamaps.TopicCard = {
Metamaps.Mapper.get(topic.get('user_id'), setMapperImage) Metamaps.Mapper.get(topic.get('user_id'), setMapperImage)
// starting embed.ly // starting embed.ly
var addLinkFunc = function () {
var addLinkDiv ='';
var addLinkDesc ='Enter or paste a link';
addLinkDiv+='<div class="addLink"><div id="addLinkIcon"></div>';
addLinkDiv+='<div id="addLinkInput"><input placeholder="' + addLinkDesc + '"></input>';
addLinkDiv+='<div id="addLinkReset"></div></div></div>';
$('.addAttachment').hide();
$('.attachments').append(addLinkDiv);
$('.showcard #addLinkReset').click(resetFunc);
$('.showcard #addLinkInput input').bind("paste keyup",inputEmbedFunc);
$('#addLinkInput input').focus();
};
var resetFunc = function () { var resetFunc = function () {
$('.addLink').remove(); $('#addLinkInput input').val("");
$('.addAttachment').show(); $('#addLinkInput input').focus();
}; };
var inputEmbedFunc = function (event) { var inputEmbedFunc = function (event) {
@ -734,7 +722,6 @@ Metamaps.TopicCard = {
'data-card-description': '0', 'data-card-description': '0',
href: text href: text
}).html(text); }).html(text);
$('.addLink').remove();
$('.attachments').addClass('hidden'); $('.attachments').addClass('hidden');
$('.embeds').append(embedlyEl); $('.embeds').append(embedlyEl);
$('.embeds').append('<div id="embedlyLinkLoader"></div>'); $('.embeds').append('<div id="embedlyLinkLoader"></div>');
@ -749,6 +736,8 @@ Metamaps.TopicCard = {
} }
}, 100); }, 100);
}; };
$('#addLinkReset').click(resetFunc);
$('#addLinkInput input').bind("paste keyup",inputEmbedFunc);
// initialize the link card, if there is a link // initialize the link card, if there is a link
if (topic.get('link') && topic.get('link') !== '') { if (topic.get('link') && topic.get('link') !== '') {
@ -760,7 +749,6 @@ Metamaps.TopicCard = {
loader.show(); // Hidden by default loader.show(); // Hidden by default
embedly('card', document.getElementById('embedlyLink')); embedly('card', document.getElementById('embedlyLink'));
} }
$('.showcard #addlink').click(addLinkFunc);
var selectingMetacode = false; var selectingMetacode = false;
@ -940,9 +928,9 @@ Metamaps.TopicCard = {
} }
if (authorized) { if (authorized) {
nodeValues.attachments = '<div class="addAttachment">'; nodeValues.attachments = '<div class="addLink"><div id="addLinkIcon"></div>';
nodeValues.attachments += '<div id="addlink"><div id="linkIcon" class="attachmentIcon"></div>Attach a link</div>'; nodeValues.attachments += '<div id="addLinkInput"><input placeholder="Enter or paste a link"></input>';
nodeValues.attachments += '<div id="addupload"><div id="uploadIcon" class="attachmentIcon"></div>Upload a file</div></div>'; nodeValues.attachments += '<div id="addLinkReset"></div></div></div>';
} else { } else {
nodeValues.attachmentsHidden = 'hidden'; nodeValues.attachmentsHidden = 'hidden';
nodeValues.attachments = ''; nodeValues.attachments = '';
@ -2117,17 +2105,11 @@ Metamaps.Control = {
}, },
selectNode: function (node,e) { selectNode: function (node,e) {
if (Metamaps.Selected.Nodes.indexOf(node) != -1) return; var filtered = node.getData('alpha') === 0;
if (filtered || Metamaps.Selected.Nodes.indexOf(node) != -1) return;
node.selected = true; node.selected = true;
node.setData('dim', 30, 'current'); node.setData('dim', 30, 'current');
/*
if(!(e.ctrlKey) && !(e.altKey)){
node.eachAdjacency(function (adj) {
Metamaps.Control.selectEdge(adj);
});
}
*/
Metamaps.Selected.Nodes.push(node); Metamaps.Selected.Nodes.push(node);
}, },
deselectAllNodes: function () { deselectAllNodes: function () {
@ -2140,11 +2122,6 @@ Metamaps.Control = {
}, },
deselectNode: function (node) { deselectNode: function (node) {
delete node.selected; delete node.selected;
/*
node.eachAdjacency(function (adj) {
Metamaps.Control.deselectEdge(adj);
});
*/
node.setData('dim', 25, 'current'); node.setData('dim', 25, 'current');
//remove the node //remove the node
@ -2223,26 +2200,18 @@ Metamaps.Control = {
Metamaps.Filter.checkMappers(); Metamaps.Filter.checkMappers();
}, },
selectEdge: function (edge) { selectEdge: function (edge) {
if (edge.getData('alpha') === 0) return; // don't do anything if the edge is filtered var filtered = edge.getData('alpha') === 0; // don't select if the edge is filtered
if (Metamaps.Selected.Edges.indexOf(edge) != -1) return;
edge.setData('showDesc', true, 'current'); if (filtered || Metamaps.Selected.Edges.indexOf(edge) != -1) return;
if (!Metamaps.Settings.embed) {
edge.setDataset('end', { var width = Metamaps.Mouse.edgeHoveringOver === edge ? 4 : 2;
lineWidth: 4, edge.setDataset('current', {
color: Metamaps.Settings.colors.synapses.selected, showDesc: true,
alpha: 1 lineWidth: width,
}); color: Metamaps.Settings.colors.synapses.selected
} else if (Metamaps.Settings.embed) {
edge.setDataset('end', {
lineWidth: 4,
color: Metamaps.Settings.colors.synapses.selected,
alpha: 1
});
}
Metamaps.Visualize.mGraph.fx.animate({
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
}); });
Metamaps.Visualize.mGraph.plot();
Metamaps.Selected.Edges.push(edge); Metamaps.Selected.Edges.push(edge);
}, },
deselectAllEdges: function () { deselectAllEdges: function () {
@ -2253,28 +2222,23 @@ Metamaps.Control = {
} }
Metamaps.Visualize.mGraph.plot(); Metamaps.Visualize.mGraph.plot();
}, },
deselectEdge: function (edge) { deselectEdge: function (edge, quick) {
if (edge.getData('alpha') === 0) return; // don't do anything if the edge is filtered
edge.setData('showDesc', false, 'current'); edge.setData('showDesc', false, 'current');
edge.setDataset('end', {
edge.setDataset('current', {
lineWidth: 2, lineWidth: 2,
color: Metamaps.Settings.colors.synapses.normal, color: Metamaps.Settings.colors.synapses.normal
alpha: 0.4
}); });
if (Metamaps.Mouse.edgeHoveringOver == edge) { if (Metamaps.Mouse.edgeHoveringOver == edge) {
edge.setData('showDesc', true, 'current'); edge.setDataset('current', {
edge.setDataset('end', { showDesc: true,
lineWidth: 4, lineWidth: 4,
color: Metamaps.Settings.colors.synapses.hover, color: Metamaps.Settings.colors.synapses.hover
alpha: 1
}); });
} }
Metamaps.Visualize.mGraph.fx.animate({ Metamaps.Visualize.mGraph.plot();
modes: ['edge-property:lineWidth:color:alpha'],
duration: 100
});
//remove the edge //remove the edge
Metamaps.Selected.Edges.splice( Metamaps.Selected.Edges.splice(
@ -2704,8 +2668,11 @@ Metamaps.Filter = {
} }
else { else {
if (n) { if (n) {
// TODO quick deselect node Metamaps.Control.deselectNode(n, true);
n.setData('alpha', 0, 'end'); n.setData('alpha', 0, 'end');
n.eachAdjacency(function(e){
Metamaps.Control.deselectEdge(e, true);
});
} }
else console.log(topic); else console.log(topic);
} }
@ -2724,15 +2691,17 @@ Metamaps.Filter = {
else passesMapper = true; else passesMapper = true;
} }
var color = Metamaps.Settings.colors.synapses.normal;
if (passesSynapse && passesMapper) { if (passesSynapse && passesMapper) {
if (e) { if (e) {
e.setData('alpha', 0.4, 'end'); e.setData('alpha', 1, 'end');
e.setData('color', color, 'end');
} }
else console.log(synapse); else console.log(synapse);
} }
else { else {
if (e) { if (e) {
// TODO quick deselect edge Metamaps.Control.deselectEdge(e, true);
e.setData('alpha', 0, 'end'); e.setData('alpha', 0, 'end');
} }
else console.log(synapse); else console.log(synapse);

View file

@ -1706,11 +1706,11 @@ float: left;
} }
.ui-tabs-vertical .ui-tabs-nav li a { .ui-tabs-vertical .ui-tabs-nav li a {
display: block; display: block;
width: 92%; width: 100%;
padding: 4% !important; padding: 4px 0 !important;
} }
.ui-tabs-vertical .ui-tabs-panel { .ui-tabs-vertical .ui-tabs-panel {
padding: 5px !important; padding: 0 !important;
float: right; float: right;
width: 388px; width: 388px;
} }
@ -1722,12 +1722,13 @@ float: left;
line-height: 21px; line-height: 21px;
border: none; border: none;
background: none; background: none;
} padding: 0;
#metacodeSwitchTabs .setTitle {
} }
#metacodeSwitchTabs .setDesc { #metacodeSwitchTabs .setDesc {
margin-bottom: 5px; margin-bottom: 5px;
font-family: 'din-medium', helvetica, sans-serif;
color: #424242;
font-size: 14px;
} }
#switchMetacodes > p { #switchMetacodes > p {
margin: 16px 0 16px 0; margin: 16px 0 16px 0;
@ -1777,6 +1778,8 @@ float: left;
background: none; background: none;
font-size: 14px; font-size: 14px;
line-height: 14px; line-height: 14px;
font-family: 'din-regular', helvetica, sans-serif;
color: #424242;
} }
#metacodeSwitchTabs button.button { #metacodeSwitchTabs button.button {
width: auto !important; width: auto !important;
@ -2312,7 +2315,7 @@ float: left;
position:fixed; position:fixed;
top:50%; top:50%;
left:50%; left:50%;
z-index: 4; z-index: 1;
} }
.collabCompass:hover p { .collabCompass:hover p {

View file

@ -15,7 +15,7 @@
background-color:#F5F5F5; background-color:#F5F5F5;
text-align: left; text-align: left;
overflow: visible; overflow: visible;
z-index:14000; z-index:2;
color: #424242; color: #424242;
border-radius:2px; border-radius:2px;
box-shadow: 0px 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16); box-shadow: 0px 3px 3px rgba(0,0,0,0.23), 0 3px 3px rgba(0,0,0,0.16);

View file

@ -267,14 +267,14 @@
left: 156px; left: 156px;
} }
.sidebarSearch .tt-dropdown-menu .minimizeResults, .sidebarSearch .tt-dropdown-menu .maximizeResults { .sidebarSearch .tt-dropdown-menu .minimizeResults, .sidebarSearch .tt-dropdown-menu .maximizeResults {
float: right;
width: 32px; width: 32px;
height: 32px; height: 32px;
background-image: url(arrowpermswhite_sprite.png); background-image: url(arrowpermswhite_sprite.png);
background-repeat: no-repeat; background-repeat: no-repeat;
cursor: pointer; cursor: pointer;
margin-top: 5px; position: absolute;
margin-right: 20px; top: 5px;
left: 410px;
} }
.sidebarSearch .tt-dropdown-menu .minimizeResults { .sidebarSearch .tt-dropdown-menu .minimizeResults {
background-position-x: 0; background-position-x: 0;
@ -346,6 +346,10 @@
.sidebarSearch .tt-dataset-mappers .tt-suggestion .icon { .sidebarSearch .tt-dataset-mappers .tt-suggestion .icon {
margin: 4px 9px 4px 4px; margin: 4px 9px 4px 4px;
} }
.sidebarSearch .tt-dataset-mappers .resultText {
width: 150px;
}
.sidebarSearch .resultText { .sidebarSearch .resultText {
width: 260px; width: 260px;
display: table-cell; display: table-cell;
@ -381,6 +385,9 @@
.tt-dataset-maps div.autoOptions { .tt-dataset-maps div.autoOptions {
width: 84px; width: 84px;
} }
.sidebarSearch .tt-dataset-mappers .autoOptions {
width: 235px;
}
.sidebarSearch .tt-is-under-cursor .autoOptions, .sidebarSearch .tt-is-under-cursor .autoOptions,
.sidebarSearch .tt-is-under-mouse-cursor .autoOptions { .sidebarSearch .tt-is-under-mouse-cursor .autoOptions {
display: block; display: block;
@ -514,7 +521,24 @@
.sidebarSearch .tt-dataset-mappers div.mapCount { .sidebarSearch .tt-dataset-mappers div.mapCount {
top: 8px; top: 8px;
left: 170px;
} }
.sidebarSearch .tt-dataset-mappers div.mapperCreated {
left: 0px;
padding-left: 0px;
font-size: 12px;
font-family: 'din-medium', helvetica, sans-serif;
line-height: 24px;
}
.sidebarSearch .tt-dataset-mappers div.mapperGeneration {
top: 20px;
left: 0px;
padding-left: 0px;
font-size: 12px;
font-family: 'din-medium', helvetica, sans-serif;
line-height: 24px;
}
/* end search */ /* end search */
/* end upperLeftUI */ /* end upperLeftUI */

View file

@ -10,6 +10,7 @@ module UsersHelper
user['value'] = u.name user['value'] = u.name
user['profile'] = u.image.url(:thumb) user['profile'] = u.image.url(:thumb)
user['mapCount'] = u.maps.count user['mapCount'] = u.maps.count
user['created_at'] = u.created_at.strftime("%m/%d/%Y")
user['rtype'] = "mapper" user['rtype'] = "mapper"
temp.push user temp.push user

View file

@ -137,10 +137,10 @@
</div> </div>
<div class="autoOptions"> <div class="autoOptions">
<div class="mapperCreated"> <div class="mapperCreated">
<span>Mapping since: {{created_at}}</span> <p>Mapping since: {{created_at}}</p>
</div> </div>
<div class="mapperGeneration"> <div class="mapperGeneration">
<span>Generation {{generation}}</span> <p>Generation: 1</p>
</div> </div>
<div class="mapCount"> <div class="mapCount">
{{mapCount}} {{mapCount}}

View file

@ -30,8 +30,8 @@
<% m.metacodes.sort{|x,y| x.name <=> y.name }.each_with_index do |m, index| %> <% m.metacodes.sort{|x,y| x.name <=> y.name }.each_with_index do |m, index| %>
<% @list += '<li><img src="' + m.icon + '" alt="' + m.name + '" /><p>' + m.name.downcase + '</p><div class="clearfloat"></div></li>' %> <% @list += '<li><img src="' + m.icon + '" alt="' + m.name + '" /><p>' + m.name.downcase + '</p><div class="clearfloat"></div></li>' %>
<% end %> <% end %>
<p class="setDesc"><%= m.desc %></p>
<div class="metacodeSetList"> <div class="metacodeSetList">
<p class="setDesc"><%= m.desc %></p>
<ul> <ul>
<%= @list.html_safe %> <%= @list.html_safe %>
</ul> </ul>
@ -43,7 +43,7 @@
</div> </div>
<% end %> <% end %>
<div id="metacodeSwitchTabsCustom"> <div id="metacodeSwitchTabsCustom">
<p class="setTitle">Pick Your Own Metacodes</p> <p class="setDesc">Choose Your Metacodes</p>
<% @list = '' %> <% @list = '' %>
<% Metacode.order("name").all.each_with_index do |m, index| %> <% Metacode.order("name").all.each_with_index do |m, index| %>
<% if selectedSet == "custom" %> <% if selectedSet == "custom" %>