help messages on button, starting drag stuff

1 files changed, 35 insertions, 19 deletions

diff --git a/public/assets/javascripts/ui/editor/HelpCursor.js b/public/assets/javascripts/ui/editor/HelpCursor.js
index 4a6e616..8bfaef8 100644
--- a/public/assets/javascripts/ui/editor/HelpCursor.js
+++ b/public/assets/javascripts/ui/editor/HelpCursor.js
@@ -2,6 +2,8 @@
 var HelpCursor = View.extend({
 	el: "#helpCursor",
 	
+	active: false,
+	
 	messages: {
 	  start: "Welcome to Vvalls!  Click one of the tools at right to learn how it works.",
 	  media: "This is where you pick media to go on the walls.  You can upload media, paste links, or use some of the found media.",
@@ -10,33 +12,47 @@ var HelpCursor = View.extend({
 	  colors: "Use these colors to change the color of the walls, floor, and ceiling.",
 	  settings: "This is where you publish your project. Give it a name, hit save, and you'll have a URL you can share with your friends.",
 	},
-	shown: {},
 
   initialize: function(){
-    $(window).mousemove(function(e){
-      this.el.style.left = e.pageX + "px"
-      this.el.style.top = e.pageY + "px"
-    }.bind(this))
-    this.show("start")
+		$('#help-button').click(this.toggle.bind(this));
   },
-
-  show: function(name){
-    this.showMessage(name)
+  
+  toggle: function(){
+    this.active ? this.stop() : this.start()
+  },
+  
+  start: function(){
+    if (this.active) return
+    this.active = true
+    this.message('start')
     this.$el.show()
+//     $('body').chardinJs('start')
+//     $(window).one("click", function(){
+//       $('body').chardinJs('stop')
+//     })
+    this.move({ pageX: -1000, pageY: -10000 })
+    this.moveFn = this.move.bind(this)
+    document.addEventListener("mousemove", this.moveFn)
   },
-
-  hide: function(){
+  
+  stop: function(){
+    this.active = false
     this.$el.hide()
+    document.removeEventListener("mousemove", this.moveFn)
+  },
+  
+  move: function(e){
+    this.el.style.left = e.pageX + "px"
+    this.el.style.top = e.pageY + "px"
+  },
+
+  show: function(name){
+    this.showMessage(name)
   },
 
-  showMessage: function(name){
-    if (+(this.shown[name] || 0) < 2) {
-      this.$el.html(this.messages[name])
-      this.shown[name] = (+this.shown[name] || 0) + 1
-    }
-    else {
-      this.$el.html("")
-    }
+  message: function(name){
+    if (! this.active) return
+    this.$el.html(this.messages[name])
   },
 
 })