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
59
60
|
var HelpCursor = View.extend({
el: "#helpCursor",
active: false,
messages: {
start: "Welcome to Vvalls! Click one of the tools at right to learn about it.",
media: "This is where you pick media to go on the walls. You can upload media and paste links.",
addmedia: "Great, now click a wall to place this image.",
resize: "Drag the image to position it, or use the dots to resize.",
presets: "These are some basic presets to get you started. Click em! :-)",
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])
},
})
|
