fix the carousel

app/assets/stylesheets/application.scss.erb

@@ -526,8 +526,8 @@ button.button.btn-no:hover {
 }
 
 .new_topic {
-    top: 50%;
-    left: 50%;
+    top: -10000px;
+    left: -10000px;
     margin-top: -17px;
     display: block;
     position: absolute;

frontend/src/Metamaps/Create.js

@@ -23,9 +23,9 @@ const Create = {
   newSelectedMetacodes: [],
   recentMetacodes: [],
   mostUsedMetacodes: [],
-  init: function () {
+  init: function (serverData) {
     var self = Create
-    self.newTopic.init()
+    self.newTopic.init(serverData)
     self.newSynapse.init()
 
     // // SWITCHING METACODE SETS
@@ -142,10 +142,12 @@ console.log(codesToSwitchToIds)
     $('#topic_name').focus()
   },
   newTopic: {
-    init: function () {
+    init: function (serverData) {
       const DOWN_ARROW = 40
       const ESC = 27
 
+      if (!serverData.ActiveMapper) return
+
       $('#topic_name').keyup(function (e) {
 
         Create.newTopic.name = $(this).val()
@@ -218,7 +220,9 @@ console.log(codesToSwitchToIds)
         speed: 0.3,
         bringToFront: true
       })
-      $('#new_topic').attr('oncontextmenu', 'return false') // prevents the mouse up event from opening the default context menu on this element
+      $('#new_topic').hide()
+        .css({ left: '50%', top: '50%' })
+        .attr('oncontextmenu', 'return false') // prevents the mouse up event from opening the default context menu on this element
     },
     name: null,
     newId: 1,