summaryrefslogtreecommitdiff
path: root/public/assets/javascripts/ui/editor/HelpCursor.js
blob: 8bfaef83bc43738914de9bb074a084dd6c9c8424 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
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.",
	  presets: "These presets will affect on all the walls.  Click some of them to see the walls change.",
	  wallpaper: "Drag the wallpaper onto the walls, floor, and ceiling.",
	  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.",
	},

  initialize: function(){
		$('#help-button').click(this.toggle.bind(this));
  },
  
  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)
  },
  
  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)
  },

  message: function(name){
    if (! this.active) return
    this.$el.html(this.messages[name])
  },

})