X-Git-Url: https://jasonwoof.com/gitweb/?a=blobdiff_plain;ds=sidebyside;f=auto.coffee;h=c415d0b69fbf3d91849fb01385d5505aa5d63852;hb=0334684c7b92ea68acf4bd53b2e5d7378d3f3862;hp=7a55b2acd8975fb03fdd541bf869eaaeced48842;hpb=c8077c7a5c9ce3610d8f926b7fdf8969974728c8;p=crayon_mockup.git diff --git a/auto.coffee b/auto.coffee index 7a55b2a..c415d0b 100644 --- a/auto.coffee +++ b/auto.coffee @@ -1,36 +1,221 @@ -# globals -$svg = null #jquery object for svg element -selected = null - -stop_drawing = -> - selected = null -click = (x, y) -> - unless selected? - selected = [] - if selected.length > 0 - last = selected[selected.length - 1] - obj = document.createElementNS("http://www.w3.org/2000/svg", "path") - obj.setAttributeNS(null, "d", "M #{last[0]} #{last[1]} L #{x} #{y}") - $svg[0].appendChild(obj) - selected.push [x, y] - console.log selected +# settings +width = 800 +height = 600 +supply_height = 96 +CLICK_FUZ = 10 # this far away from things is close enough to be "clicked on" +PROX_MAX = CLICK_FUZ * CLICK_FUZ + +# constants +STYLE_NORMAL = 0 +STYLE_SELECTED = 1 +STYLE_HOVER = 2 +STYLE_EDITING = 3 +STYLE_DRAGGING = 4 + +# json (compiled to javascript and minified) is ~8% smaller than the resulting xml +json_to_svg = (json) -> + for tag, attrs of json + el = document.createElementNS 'http://www.w3.org/2000/svg', tag + for k, v of attrs + if k is 'children' + for child in v + el.appendChild json_to_svg child + else + el.setAttribute k, v + return el + +# public vars: x, y, width, height, el +class Widget + constructor: (args) -> + @style = STYLE_NORMAL + @x = args?.x ? 1 + @y = args?.y ? 1 + @width = args?.width ? 50 + @height = args?.height ? 34 + clone: -> + return new Widget @ + move: (args) -> + @x = args.x + @y = args.y + proximity: (xy) -> # return the square of the distance to your visible bits + return PROX_MAX + 1 + set_style: (style) -> + return if @style is style + if style is STYLE_NORMAL + @el.setAttribute 'style', 'filter: url(#crayon)' + else + if @style is STYLE_NORMAL + @el.setAttribute 'style', '' + switch style + when STYLE_NORMAL + @el.setAttribute 'class', "#{@css_class}" + when STYLE_SELECTED + @el.setAttribute 'class', "#{@css_class} selected" + when STYLE_HOVER + @el.setAttribute 'class', "#{@css_class} hover" + when STYLE_DRAGGING + @el.setAttribute 'class', "#{@css_class} dragging" + # FIXME when STYLE_EDITING + @style = style + controls: -> # create controls, return them + return [] + hide_controls: -> + +class RectWidget extends Widget + constructor: (args) -> + super args + @css_class = 'box' + @el = json_to_svg rect: + x: @x + 1 + y: @x + 1 + width: @width - 2 + height: @height - 2 + class: 'box' + style: 'filter: url(#crayon)' + clone: -> + return new RectWidget @ + move: (args) -> + super args + @el.setAttribute 'x', @x + 1 + @el.setAttribute 'y', @y + 1 + proximity: (xy) -> # return the square of the distance to your visible bits + x = xy.x + y = xy.y + prox = PROX_MAX + 1 + in_x = false + in_y = false + if x > @x - CLICK_FUZ and x < @x + @width + CLICK_FUZ + in_x = true + if y < @y + @height / 2 + new_prox = @y - y + else + new_prox = @y + @height - y + new_prox *= new_prox + if new_prox < prox + prox = new_prox + if y > @y - CLICK_FUZ and y < @y + @height + CLICK_FUZ + in_y = true + if x < @x + @width / 2 + new_prox = @x - x + else + new_prox = @x + @width - x + new_prox *= new_prox + if new_prox < prox + prox = new_prox + if in_x and in_y and prox > PROX_MAX + prox = PROX_MAX - 1 + return prox + controls: -> # create controls, return them + return [] + hide_controls: -> # called automatically on domcontentloaded init = -> + svg_offset = null $container = $ '.crayon_mockup' - $stop_button = $ '
' - $tools = $ '' - $tools.append $stop_button - $stop_button.click stop_drawing - $container.append $tools - $svg = $ '' - #$test_path = $ '