styled autocompletes and tooltips
This commit is contained in:
parent
8c1c4e3202
commit
8c985add2c
10 changed files with 77 additions and 109 deletions
4
Gemfile
4
Gemfile
|
@ -14,8 +14,8 @@ gem 'formtastic'
|
|||
gem 'json'
|
||||
gem 'rails3-jquery-autocomplete'
|
||||
gem 'best_in_place'
|
||||
#gem 'therubyracer' #optional
|
||||
#gem 'rb-readline'
|
||||
gem 'therubyracer' #optional
|
||||
gem 'rb-readline'
|
||||
|
||||
# Gems used only for assets and not required
|
||||
# in production environments by default.
|
||||
|
|
4
Gemfile~
4
Gemfile~
|
@ -14,8 +14,8 @@ gem 'formtastic'
|
|||
gem 'json'
|
||||
gem 'rails3-jquery-autocomplete'
|
||||
gem 'best_in_place'
|
||||
gem 'therubyracer' #optional
|
||||
gem 'rb-readline'
|
||||
#gem 'therubyracer' #optional
|
||||
#gem 'rb-readline'
|
||||
|
||||
# Gems used only for assets and not required
|
||||
# in production environments by default.
|
||||
|
|
|
@ -360,19 +360,19 @@ function canvasDoubleClickHandler(canvasLoc,e) {
|
|||
}
|
||||
}
|
||||
|
||||
$('#new_topic').fadeOut('fast');
|
||||
$('#new_synapse').fadeOut('fast');
|
||||
// reset the draw synapse positions to false
|
||||
MetamapsModel.synapseStartCoord = false;
|
||||
MetamapsModel.synapseEndCoord = false;
|
||||
// set all node dimensions back to normal
|
||||
Mconsole.graph.eachNode(function (n) {
|
||||
n.setData('dim', 25, 'current');
|
||||
});
|
||||
tempInit = false;
|
||||
tempNode = null;
|
||||
tempNode2 = null;
|
||||
Mconsole.plot();
|
||||
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) {
|
||||
|
|
|
@ -334,8 +334,8 @@ var nodeSettings = {
|
|||
|
||||
//now adjust the label placement
|
||||
var ctx = canvas.getCtx();
|
||||
ctx.font = '14px arial';
|
||||
ctx.fillStyle = '#222222';
|
||||
ctx.font = 'bold 14px arial';
|
||||
ctx.fillStyle = '#FFF';
|
||||
ctx.textBaseline = 'hanging';
|
||||
|
||||
// helper function to determine how many lines are needed
|
||||
|
@ -370,7 +370,7 @@ var nodeSettings = {
|
|||
ctx.fill();
|
||||
|
||||
//render text
|
||||
ctx.fillStyle = '#FFF';
|
||||
ctx.fillStyle = '#222222';
|
||||
ctx.textAlign = 'center';
|
||||
for (index = 0; index < arrayOfLabelLines.length; ++index) {
|
||||
ctx.fillText(arrayOfLabelLines[index], x + (width/2), y + 5 + (16*index));
|
||||
|
@ -565,7 +565,7 @@ function onDragEndTopicHandler(node, eventInfo, e, allowRealtime) {
|
|||
$('#synapse_topic1id').val(tempNode.id);
|
||||
$('#synapse_topic2id').val(tempNode2.id);
|
||||
$('#new_synapse').fadeIn('fast');
|
||||
$('#synapse_desc').focus();
|
||||
$('#synapse_desc').typeahead('setQuery','').focus();
|
||||
tempNode = null;
|
||||
tempNode2 = null;
|
||||
tempInit = false;
|
||||
|
|
|
@ -7264,7 +7264,7 @@ Graph.Label.Native = new Class({
|
|||
ctx.quadraticCurveTo(x, y, x + radius, y);
|
||||
ctx.closePath();
|
||||
ctx.fill();
|
||||
ctx.stroke();
|
||||
//ctx.stroke();
|
||||
|
||||
ctx.fillStyle = ctx.strokeStyle = node.getLabelData('color');
|
||||
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
// other options are 'graph'
|
||||
var viewMode = "list";
|
||||
|
||||
var labelType, useGradients, nativeTextSupport, animate, json, Mconsole = null, gType, tempNode = null, tempInit = false, tempNode2 = null, metacodeIMGinit = false, findOpen = false, analyzeOpen = false, organizeOpen = false, goRealtime = false, mapid = null, mapperm = false, touchPos, touchDragNode, mouseIsDown = false;
|
||||
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;
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
|
@ -296,7 +296,7 @@ var labelType, useGradients, nativeTextSupport, animate, json, Mconsole = null,
|
|||
s.css({'height':'auto','border-top':'none','overflow':'visible'});
|
||||
$(this).removeClass('maximizeResults').addClass('minimizeResults');
|
||||
} else {
|
||||
s.css({'height':'0','border-top':'1px solid #222','overflow':'hidden'});
|
||||
s.css({'height':'0','border-top':'1px solid rgb(56, 56, 56)','overflow':'hidden'});
|
||||
$(this).removeClass('minimizeResults').addClass('maximizeResults');
|
||||
}
|
||||
});
|
||||
|
@ -307,7 +307,7 @@ var labelType, useGradients, nativeTextSupport, animate, json, Mconsole = null,
|
|||
s.css({'height':'auto','border-top':'none','overflow':'visible'});
|
||||
$(this).removeClass('maximizeResults').addClass('minimizeResults');
|
||||
} else {
|
||||
s.css({'height':'0','border-top':'1px solid #222','overflow':'hidden'});
|
||||
s.css({'height':'0','border-top':'1px solid rgb(56, 56, 56)','overflow':'hidden'});
|
||||
$(this).removeClass('minimizeResults').addClass('maximizeResults');
|
||||
}
|
||||
});
|
||||
|
|
|
@ -240,8 +240,8 @@ jQuery.browser = browser;
|
|||
if ( items[this.frontIndex] === undefined ) { return; } // Images might not have loaded yet.
|
||||
// METAMAPS CODE
|
||||
$('#topic_metacode').val($(items[this.frontIndex].image).attr('title'));
|
||||
$('img.cloudcarousel').css({"background":"none", "width":"","height":""});
|
||||
$(items[this.frontIndex].image).css({"width":"45px","height":"45px"});
|
||||
//$('img.cloudcarousel').css({"background":"none", "width":"","height":""});
|
||||
//$(items[this.frontIndex].image).css({"width":"45px","height":"45px"});
|
||||
// NOT METAMAPS CODE
|
||||
$(options.titleBox).html( $(items[this.frontIndex].image).attr('title'));
|
||||
$(options.altBox).html( $(items[this.frontIndex].image).attr('alt'));
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -315,11 +315,12 @@ font-family: 'LatoLight';
|
|||
}
|
||||
|
||||
#metacodeImgTitle {
|
||||
color:#000;
|
||||
color:#FFF;
|
||||
float:left;
|
||||
width:120px;
|
||||
text-align:center;
|
||||
margin-left:90px;
|
||||
font-family: 'LatoRegular';
|
||||
}
|
||||
|
||||
/* synapse autocomplete */
|
||||
|
@ -332,10 +333,10 @@ margin: 0;
|
|||
padding: 5px 5px;
|
||||
border: 1px solid black;
|
||||
outline: none;
|
||||
font-size: 25px;
|
||||
font-size: 18px;
|
||||
line-height: 35px;
|
||||
color: rgba(255,255,255,0.7);
|
||||
font-family: 'LatoLight';
|
||||
color: white;
|
||||
font-family: 'LatoRegular';
|
||||
}
|
||||
|
||||
.new_synapse #synapse_desc, .new_synapse .tt-hint {
|
||||
|
@ -346,10 +347,10 @@ margin: 0;
|
|||
padding: 5px 5px;
|
||||
border: 1px solid black;
|
||||
outline: none;
|
||||
font-size: 18px;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
color: rgba(255,255,255,0.7);
|
||||
font-family: 'LatoLight';
|
||||
font-family: 'LatoRegular';
|
||||
}
|
||||
|
||||
label, select, input, textarea {
|
||||
|
@ -968,18 +969,17 @@ cursor:pointer;
|
|||
margin: 0;
|
||||
border: 0;
|
||||
outline: none;
|
||||
font-size: 25px;
|
||||
font-size: 18px;
|
||||
line-height:35px;
|
||||
background:#0F1519;
|
||||
color: rgba(255,255,255,0.6);
|
||||
font-family: 'LatoLight';
|
||||
font-family: 'LatoRegular';
|
||||
}
|
||||
|
||||
.sidebarSearch .tt-dropdown-menu {
|
||||
left:-35px !important;
|
||||
background: #0F1519;
|
||||
min-width: 440px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
|
||||
.sidebarSearch .tt-dropdown-menu h3 {
|
||||
|
@ -1027,12 +1027,11 @@ border: 1px solid black;
|
|||
|
||||
|
||||
.sidebarSearch .tt-suggestion {
|
||||
background: rgba(0,0,0,0.5);
|
||||
border: 1px solid black;
|
||||
background: #2A343C;
|
||||
}
|
||||
|
||||
.sidebarSearch .tt-is-under-cursor {
|
||||
background:black;
|
||||
background:#0E161D;
|
||||
}
|
||||
|
||||
.sidebarSearch .tt-dataset-maps .tt-is-under-cursor .resultmap, .sidebarSearch .tt-dataset-topics .tt-is-under-cursor .resulttopic {
|
||||
|
@ -1079,24 +1078,25 @@ border: 1px solid black;
|
|||
}
|
||||
|
||||
.sidebarSearch .resultText {
|
||||
width: 240px;
|
||||
width: 250px;
|
||||
display: block;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.sidebarSearch .resultTitle {
|
||||
font-weight:bold;
|
||||
font-size:20px;
|
||||
font-weight:normal;
|
||||
font-family: 'LatoRegular';
|
||||
font-size:18px;
|
||||
line-height:22px;
|
||||
width:100%;
|
||||
padding-top:8px;
|
||||
}
|
||||
.sidebarSearch .resultDesc {
|
||||
font-style:italic;
|
||||
font-size:16px;
|
||||
font-family: 'LatoItalic';
|
||||
font-size:14px;
|
||||
line-height:16px;
|
||||
width:100%;
|
||||
padding: 6px 0;
|
||||
padding: 3px 0 6px 0;
|
||||
}
|
||||
|
||||
.sidebarSearch .tip {
|
||||
|
@ -1197,10 +1197,9 @@ line-height: 20px;
|
|||
white-space: nowrap;
|
||||
border-radius: 4px;
|
||||
font-size:15px !important;
|
||||
font-family:'LatoLight';
|
||||
font-family:'LatoRegular';
|
||||
line-height:17px;
|
||||
padding: 3px 5px 2px;
|
||||
border: 1px solid black;
|
||||
z-index:100;
|
||||
}
|
||||
.sidebarSearch .mapCount .tip,.sidebarSearch .synapseCount .tip, .sidebarSearch .topicCount .tip {
|
||||
|
@ -1369,13 +1368,13 @@ background-position: 5px 2px;
|
|||
/* topic autocomplete */
|
||||
|
||||
#new_topic .tt-suggestion.tt-is-under-cursor {
|
||||
background: black;
|
||||
background: #0E161D;
|
||||
}
|
||||
|
||||
#new_topic .tt-suggestion {
|
||||
padding: 5px;
|
||||
font-family: 'LatoLight';
|
||||
background:#0F1519;
|
||||
background: #2A343C;
|
||||
}
|
||||
|
||||
#new_topic .autocompleteSection {
|
||||
|
@ -1425,11 +1424,10 @@ background:#0F1519;
|
|||
color: black;
|
||||
white-space: nowrap;
|
||||
border-radius: 4px;
|
||||
font-size:13px !important;
|
||||
font-family:'LatoLight';
|
||||
line-height:14px;
|
||||
font-size:15px !important;
|
||||
font-family:'LatoRegular';
|
||||
line-height:15px;
|
||||
padding: 2px 5px 2px;
|
||||
border: 1px solid black;
|
||||
z-index:100;
|
||||
}
|
||||
|
||||
|
@ -1437,7 +1435,7 @@ background:#0F1519;
|
|||
|
||||
#new_synapse .tt-dropdown-menu {
|
||||
width: 212px;
|
||||
background:#0F1519;
|
||||
background:#2A343C;
|
||||
}
|
||||
|
||||
#new_synapse .tt-dropdown-menu h3 {
|
||||
|
@ -1450,7 +1448,7 @@ margin: 3px;
|
|||
}
|
||||
|
||||
#new_synapse .tt-suggestion.tt-is-under-cursor {
|
||||
background: black;
|
||||
background: #0E161D;
|
||||
}
|
||||
|
||||
#new_synapse .tt-suggestion {
|
||||
|
@ -1504,11 +1502,10 @@ margin: 3px;
|
|||
color: black;
|
||||
white-space: nowrap;
|
||||
border-radius: 4px;
|
||||
font-size:13px !important;
|
||||
font-family:'LatoLight';
|
||||
line-height:14px;
|
||||
font-size:15px !important;
|
||||
font-family:'LatoRegular';
|
||||
line-height:15px;
|
||||
padding: 2px 5px 2px;
|
||||
border: 1px solid black;
|
||||
z-index:100;
|
||||
}
|
||||
|
||||
|
@ -1588,7 +1585,7 @@ z-index: 100;
|
|||
top: 38px;
|
||||
left: 6px;
|
||||
}
|
||||
.mapPermission .tip {
|
||||
.mapInfoBox .mapPermission .tip {
|
||||
top: 0;
|
||||
right: 32px;
|
||||
}
|
||||
|
@ -1606,7 +1603,7 @@ background-image: url(MMCCicon_synapse.png);
|
|||
background-position: 18px 6px;
|
||||
background-size: 27px 27px;
|
||||
}
|
||||
.mapPermission {
|
||||
.mapInfoBox .mapPermission {
|
||||
background-position: 0 center;
|
||||
background-size: 30px 30px;
|
||||
width: 30px;
|
||||
|
@ -1615,13 +1612,13 @@ padding: 0;
|
|||
margin: 5px 30px 5px 10px;
|
||||
position: relative;
|
||||
}
|
||||
.mapPermission.commons {
|
||||
.mapInfoBox .mapPermission.commons {
|
||||
background-image:url(MMCCicon_commons.png);
|
||||
}
|
||||
.mapPermission.public {
|
||||
.mapInfoBox .mapPermission.public {
|
||||
background-image:url(MMCCicon_public.png);
|
||||
}
|
||||
.mapPermission.private {
|
||||
.mapInfoBox .mapPermission.private {
|
||||
background-image:url(MMCCicon_private.png);
|
||||
}
|
||||
|
||||
|
@ -1633,36 +1630,36 @@ position: relative;
|
|||
background-image: url(MMCCicon_minimize_arrow.png) !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
.mapPermission .permissionSelect {
|
||||
.mapInfoBox .mapPermission .permissionSelect {
|
||||
list-style: none;
|
||||
width: 30px;
|
||||
height: 60px;
|
||||
position: relative;
|
||||
top: 30px;
|
||||
}
|
||||
.mapPermission .permissionSelect li {
|
||||
.mapInfoBox .mapPermission .permissionSelect li {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: 30px 30px;
|
||||
}
|
||||
.mapPermission .permissionSelect .commons {
|
||||
.mapInfoBox .mapPermission .permissionSelect .commons {
|
||||
background-image: url(MMCCicon_commons.png);
|
||||
}
|
||||
.mapPermission .permissionSelect .public {
|
||||
.mapInfoBox .mapPermission .permissionSelect .public {
|
||||
background-image: url(MMCCicon_public.png);
|
||||
}
|
||||
.mapPermission .permissionSelect .private {
|
||||
.mapInfoBox .mapPermission .permissionSelect .private {
|
||||
background-image: url(MMCCicon_private.png);
|
||||
}
|
||||
.mapPermission .permissionSelect .commons:hover {
|
||||
.mapInfoBox .mapPermission .permissionSelect .commons:hover {
|
||||
background-image: url(MMCCicon_commons_black.png);
|
||||
}
|
||||
.mapPermission .permissionSelect .public:hover {
|
||||
.mapInfoBox .mapPermission .permissionSelect .public:hover {
|
||||
background-image: url(MMCCicon_public_black.png);
|
||||
}
|
||||
.mapPermission .permissionSelect .private:hover {
|
||||
.mapInfoBox .mapPermission .permissionSelect .private:hover {
|
||||
background-image: url(MMCCicon_private_black.png);
|
||||
}
|
||||
|
||||
|
@ -1923,18 +1920,18 @@ font-family:arial;
|
|||
.new_map .tip {
|
||||
display:none;
|
||||
position: absolute;
|
||||
background: white;
|
||||
background: black;
|
||||
width: 150px;
|
||||
top: 85px;
|
||||
left: -32px;
|
||||
color: black;
|
||||
left: -29px;
|
||||
color: white;
|
||||
border-radius: 4px;
|
||||
font-size:15px !important;
|
||||
font-family:'LatoLight';
|
||||
font-family:'LatoRegular';
|
||||
line-height:17px;
|
||||
padding: 3px 5px 2px;
|
||||
border: 1px solid black;
|
||||
z-index:100;
|
||||
text-align:center;
|
||||
}
|
||||
.new_map .hoverForTip:hover .tip {
|
||||
display:block;
|
||||
|
|
|
@ -348,17 +348,15 @@ float:left;
|
|||
.CardOnGraph .tip, .mapCard .tip {
|
||||
display:none;
|
||||
position: absolute;
|
||||
background: white;
|
||||
width: 155px;
|
||||
background: black;
|
||||
top: 35px;
|
||||
left: 0;
|
||||
color: black;
|
||||
color: white;
|
||||
border-radius: 4px;
|
||||
font-size:15px !important;
|
||||
font-family:'LatoLight';
|
||||
font-family:'LatoRegular';
|
||||
line-height:17px;
|
||||
padding: 3px 5px 2px;
|
||||
border: 1px solid black;
|
||||
z-index:100;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue