summaryrefslogtreecommitdiff
path: root/public/assets/javascripts/ui/editor/HelpCursor.js
diff options
context:
space:
mode:
Diffstat (limited to 'public/assets/javascripts/ui/editor/HelpCursor.js')
-rw-r--r--public/assets/javascripts/ui/editor/HelpCursor.js54
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])
},
})