diff --git a/app/assets/images/pincarousel_sprite.png b/app/assets/images/pincarousel_sprite.png new file mode 100644 index 00000000..e12956ab Binary files /dev/null and b/app/assets/images/pincarousel_sprite.png differ diff --git a/app/assets/javascripts/lib/cloudcarousel.js b/app/assets/javascripts/lib/cloudcarousel.js index 69283044..5e3ef9fa 100644 --- a/app/assets/javascripts/lib/cloudcarousel.js +++ b/app/assets/javascripts/lib/cloudcarousel.js @@ -180,8 +180,10 @@ jQuery.browser = browser; if (options.mouseWheel) { // START METAMAPS CODE - /*$('body').bind('mousewheel',this,function(event, delta) { - if (Metamaps.Create.newTopic.beingCreated && !Metamaps.Create.isSwitchingSet) { + $('body').bind('mousewheel',this,function(event, delta) { + if (Metamaps.Create.newTopic.beingCreated && + !Metamaps.Create.isSwitchingSet && + !Metamaps.Create.newTopic.pinned) { event.data.rotate(delta); return false; } @@ -426,4 +428,4 @@ jQuery.browser = browser; return this; }; -})(jQuery); \ No newline at end of file +})(jQuery); diff --git a/app/assets/javascripts/src/JIT.js.erb b/app/assets/javascripts/src/JIT.js.erb index d31d850c..2cb202dc 100644 --- a/app/assets/javascripts/src/JIT.js.erb +++ b/app/assets/javascripts/src/JIT.js.erb @@ -2454,7 +2454,7 @@ Extras.Classes.Navigation = new Class({ // START METAMAPS CODE e.preventDefault(); if (e.target.id != 'infovis-canvas') return; - if (Metamaps.Create.newTopic.beingCreated) return; + if (Metamaps.Create.newTopic.beingCreated && !Metamaps.Create.newTopic.pinned) return; // END METAMAPS CODE //$.event.stop($.event.get(e, win)); diff --git a/app/assets/javascripts/src/Metamaps.Create.js b/app/assets/javascripts/src/Metamaps.Create.js index de8e96f4..29dccb09 100644 --- a/app/assets/javascripts/src/Metamaps.Create.js +++ b/app/assets/javascripts/src/Metamaps.Create.js @@ -163,6 +163,16 @@ Metamaps.Create = { }) Metamaps.Create.newTopic.initSelector() + $('.pinCarousel').click(function() { + if (Metamaps.Create.newTopic.pinned) { + $('.pinCarousel').removeClass('isPinned') + Metamaps.Create.newTopic.pinned = false + } + else { + $('.pinCarousel').addClass('isPinned') + Metamaps.Create.newTopic.pinned = true + } + }) var topicBloodhound = new Bloodhound({ datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), @@ -217,6 +227,7 @@ Metamaps.Create = { x: null, y: null, addSynapse: false, + pinned: false, initSelector: function () { ReactDOM.render( React.createElement(Metamaps.ReactComponents.MetacodeSelect, { @@ -272,8 +283,15 @@ Metamaps.Create = { Metamaps.Create.newTopic.beingCreated = true Metamaps.Create.newTopic.name = '' }, - hide: function () { - $('#new_topic').fadeOut('fast') + hide: function (force) { + if (force || !Metamaps.Create.newTopic.pinned) { + $('#new_topic').fadeOut('fast') + Metamaps.Create.newTopic.beingCreated = false + } + if (force) { + $('.pinCarousel').removeClass('isPinned') + Metamaps.Create.newTopic.pinned = false + } $('#topic_name').typeahead('val', '') Metamaps.Create.newTopic.beingCreated = false Metamaps.Create.newTopic.hideSelector() diff --git a/app/assets/javascripts/src/Metamaps.Map.js b/app/assets/javascripts/src/Metamaps.Map.js index 0964ef51..1c3c638d 100644 --- a/app/assets/javascripts/src/Metamaps.Map.js +++ b/app/assets/javascripts/src/Metamaps.Map.js @@ -136,7 +136,7 @@ Metamaps.Map = { $('.rightclickmenu').remove() Metamaps.TopicCard.hideCard() Metamaps.SynapseCard.hideCard() - Metamaps.Create.newTopic.hide() + Metamaps.Create.newTopic.hide(true) // true means force (and override pinned) Metamaps.Create.newSynapse.hide() Metamaps.Filter.close() Metamaps.Map.InfoBox.close() @@ -284,7 +284,13 @@ Metamaps.Map = { } } - return { + // this is so that if someone has relied on the auto-placement feature on this map, + // it will at least start placing nodes at the first empty spot + // this will only work up to the point in the spiral at which someone manually moved a node + if (Metamaps.Mappings.findWhere({ xloc: nextX, yloc: nextY })) { + return self.getNextCoord() + } + else return { x: nextX, y: nextY } diff --git a/app/assets/javascripts/src/Metamaps.Topic.js b/app/assets/javascripts/src/Metamaps.Topic.js index da2e6be3..40a4cd42 100644 --- a/app/assets/javascripts/src/Metamaps.Topic.js +++ b/app/assets/javascripts/src/Metamaps.Topic.js @@ -325,9 +325,12 @@ Metamaps.Topic = { }) Metamaps.Topics.add(topic) + if (Metamaps.Create.newTopic.pinned) { + var nextCoords = Metamaps.Map.getNextCoord() + } var mapping = new Metamaps.Backbone.Mapping({ - xloc: Metamaps.Create.newTopic.x, - yloc: Metamaps.Create.newTopic.y, + xloc: nextCoords ? nextCoords.x : Metamaps.Create.newTopic.x, + yloc: nextCoords ? nextCoords.y : Metamaps.Create.newTopic.y, mappable_id: topic.cid, mappable_type: 'Topic', }) @@ -347,9 +350,12 @@ Metamaps.Topic = { var topic = self.get(id) + if (Metamaps.Create.newTopic.pinned) { + var nextCoords = Metamaps.Map.getNextCoord() + } var mapping = new Metamaps.Backbone.Mapping({ - xloc: Metamaps.Create.newTopic.x, - yloc: Metamaps.Create.newTopic.y, + xloc: nextCoords ? nextCoords.x : Metamaps.Create.newTopic.x, + yloc: nextCoords ? nextCoords.y : Metamaps.Create.newTopic.y, mappable_type: 'Topic', mappable_id: topic.id, }) diff --git a/app/assets/stylesheets/application.css.erb b/app/assets/stylesheets/application.css.erb index da964984..0b21f5a7 100644 --- a/app/assets/stylesheets/application.css.erb +++ b/app/assets/stylesheets/application.css.erb @@ -598,6 +598,26 @@ button.button.btn-no:hover { .openMetacodeSwitcher:hover { background-position: -16px 0; } +.pinCarousel { + cursor: pointer; + display: block; + height: 16px; + width: 16px; + background-image: url(<%= asset_data_uri('pincarousel_sprite.png') %>); + position: absolute; + z-index: 2; + top: 20px; + right: 16px; +} +.pinCarousel:hover { + background-position: 0 -16px; +} +.pinCarousel.isPinned { + background-position: -16px 0; +} +.pinCarousel.isPinned:hover { + background-position: -16px -16px; +} #metacodeImg { height: 120px; width: 380px; diff --git a/app/assets/stylesheets/clean.css.erb b/app/assets/stylesheets/clean.css.erb index 71985408..b41f14ca 100644 --- a/app/assets/stylesheets/clean.css.erb +++ b/app/assets/stylesheets/clean.css.erb @@ -458,7 +458,7 @@ } .zoomExtents:hover .tooltips, .zoomIn:hover .tooltips, .zoomOut:hover .tooltips, .takeScreenshot:hover .tooltips, .sidebarFilterIcon:hover .tooltipsUnder, .sidebarForkIcon:hover .tooltipsUnder, .addMap:hover .tooltipsUnder, .authenticated .sidebarAccountIcon:hover .tooltipsUnder, - .mapInfoIcon:hover .tooltipsAbove, .openCheatsheet:hover .tooltipsAbove, .chat-button:hover .tooltips, .starMap:hover .tooltipsAbove { + .mapInfoIcon:hover .tooltipsAbove, .openCheatsheet:hover .tooltipsAbove, .chat-button:hover .tooltips, .starMap:hover .tooltipsAbove, .openMetacodeSwitcher:hover .tooltipsAbove, .pinCarousel:not(.isPinned):hover .tooltipsAbove.helpPin, .pinCarousel.isPinned:hover .tooltipsAbove.helpUnpin { display: block; } @@ -522,6 +522,29 @@ margin-left: -34px; } +.openMetacodeSwitcher .tooltipsAbove { + left: -50px; + top: -5px; +} +.pinCarousel .tooltipsAbove { + top: -5px; +} +.pinCarousel .tooltipsAbove.helpPin { + left: -24px; +} +.pinCarousel .tooltipsAbove.helpUnpin { + left: -14px; +} +.openMetacodeSwitcher .tooltipsAbove:after { + left: 50%; +} +.pinCarousel .tooltipsAbove.helpPin:after { + left: 46%; +} +.pinCarousel .tooltipsAbove.helpUnpin:after { + left: 42%; +} + .sidebarForkIcon div:after{ left: 45%; } @@ -586,7 +609,7 @@ right: 37% !important; } -.mapInfoIcon div:after, .openCheatsheet div:after, .starMap div:after { +.mapInfoIcon div:after, .openCheatsheet div:after, .starMap div:after, .openMetacodeSwitcher div:after, .pinCarousel div:after { content: ''; position: absolute; top: 76%; diff --git a/app/views/maps/_newtopic.html.erb b/app/views/maps/_newtopic.html.erb index 2c50686a..4e3644ab 100644 --- a/app/views/maps/_newtopic.html.erb +++ b/app/views/maps/_newtopic.html.erb @@ -1,5 +1,11 @@ <%= form_for Topic.new, url: topics_url, remote: true do |form| %> -
+