From: Jason Woofenden <jason@jasonwoof.com>
Date: Sun, 24 May 2015 22:21:27 +0000 (-0400)
Subject: add tutorial tool, stub edit/delete
X-Git-Url: https://jasonwoof.com/gitweb/?p=crayon_mockup.git;a=commitdiff_plain;h=2577f78f9029a76598c9de1714cec4c8e79af2ca;hp=6f50cb6a6672de9240ec432fe0d27dfd0bd18b80

add tutorial tool, stub edit/delete
---

diff --git a/auto.coffee b/auto.coffee
index b4b8d98..a929f5e 100644
--- a/auto.coffee
+++ b/auto.coffee
@@ -19,6 +19,37 @@ class Tool
 	keydown: (keycode) ->
 	disable: ->
 
+class TutorialTool extends Tool
+	constructor: (toolbar) ->
+		super 'tutorial'
+		@paths = []
+		choose = [
+			[[219,34],[53,141],[96,143],[92,255],[365,257],[362,145],[407,144,'z']],
+			[[161,118],[144,106],[130,115],[128,152],[140,160],[156,150]],
+			[[173,107],[169,159],[180,137],[189,133],[193,160]],
+			[[218,135],[205,144],[205,158],[215,164],[225,156],[225,144,'z']],
+			[[242,135],[233,145],[233,157],[244,168],[256,158],[254,144,'z']],
+			[[278,141],[269,135],[261,142],[264,151],[278,153],[281,162],[271,170],[264,163]],
+			[[291,151],[305,151],[312,143],[299,135],[288,140],[293,160],[302,167],[313,158]],
+			[[136,208],[121,206],[116,226],[128,233],[136,229],[137,209],[140,233]],
+			[[160,207],[191,205]],
+			[[176,184],[174,228],[180,238]],
+			[[198,216],[187,223],[189,236],[200,242],[210,235],[209,224,'z']],
+			[[227,216],[216,222],[216,236],[224,244],[237,240],[237,226,'z']],
+			[[247,187],[249,241],[254,243]]
+		]
+		for c in choose
+			path = data: c, element: document.createElementNS svg_ns, "path"
+			update_path path, close: c[c.length - 1][2] is 'z'
+			svg.appendChild path.element
+			@paths.push path
+		@tip = $ "<span>&nbsp;</span>"
+		toolbar.append @tip
+	disable: ->
+		@tip.remove()
+		for p in @paths
+			svg.removeChild p.element
+
 class DrawTool extends Tool
 	constructor: (toolbar) ->
 		super 'draw'
@@ -75,6 +106,25 @@ class DrawTool extends Tool
 	disable: ->
 		if selection?.drawing?
 			delete selection.drawing
+		@stop_button.remove()
+		@stop_close_button.remove()
+		@cancel_button.remove()
+
+class EditTool extends Tool
+	constructor: (toolbar) ->
+		super 'draw'
+		@oops = $ "<span>Oops, this tool isn't implemented yet</span>"
+		toolbar.append @oops
+	disable: ->
+		@oops.remove()
+
+class DeleteTool extends Tool
+	constructor: (toolbar) ->
+		super 'draw'
+		@oops = $ "<span>Oops, this tool isn't implemented yet</span>"
+		toolbar.append @oops
+	disable: ->
+		@oops.remove()
 
 update_path = (path, flags) ->
 	d = ''
@@ -84,22 +134,42 @@ update_path = (path, flags) ->
 		sep = ' L'
 	if flags?.to_mouse?
 		d += "#{sep} #{mouse.x} #{mouse.y}"
-	if flags?.close?
+	if flags?.close
 		d += " z"
 	path.element.setAttribute "d", d
 
 # called automatically on domcontentloaded
 init = ->
 	$container = $ '.crayon_mockup'
-	$tools = $ '<div class="toolbar"></div>'
-	$container.append $tools
+	$toolbar = $ '<div class="toolbar">Tools: </div>'
+	$draw_tool_button = $ '<span class="button">draw</span>'
+	$edit_tool_button = $ '<span class="button">edit (coming soon)</span>'
+	$delete_tool_button = $ '<span class="button">delete (coming soon)</span>'
+	$toolbar.append $draw_tool_button
+	$toolbar.append $edit_tool_button
+	$toolbar.append $delete_tool_button
+	$draw_tool_button.click ->
+		if cur_tool?
+			cur_tool.disable()
+		cur_tool = new DrawTool $tool_extra
+	$edit_tool_button.click ->
+		if cur_tool?
+			cur_tool.disable()
+		cur_tool = new EditTool $tool_extra
+	$delete_tool_button.click ->
+		if cur_tool?
+			cur_tool.disable()
+		cur_tool = new DeleteTool $tool_extra
+	$tool_extra = $ '<div class="tool_extra"></div>'
+	$container.append $toolbar
+	$container.append $tool_extra
 	svg = document.createElementNS svg_ns, 'svg'
 	svg.setAttribute 'width', width
 	svg.setAttribute 'height', height
 	svg.setAttribute 'viewBox', "0 0 #{width} #{height}"
 	$svg = $ svg
 	$container.append $svg
-	cur_tool = new DrawTool $tools
+	cur_tool = new TutorialTool $tool_extra
 	$svg.mousedown (e) ->
 		offset = $svg.offset()
 		if cur_tool?
diff --git a/index.html b/index.html
index 4cce9fe..bc46e2a 100644
--- a/index.html
+++ b/index.html
@@ -27,7 +27,7 @@
 		.crayon_mockup .button + .button {
 			margin-left: 14px;
 		}
-		.crayon_mockup .toolbar {
+		.crayon_mockup .toolbar, .crayon_mockup .tool_extra {
 			padding-bottom: 5px;
 		}
 	</style>