2 confirm_confirm_confirm = () ->
\r
5 set_tree_value = (keys, last_attr, value) ->
\r
8 last_attr[key] = value
\r
10 last_attr[key] = last_attr[key] || {}
\r
11 set_tree_value(keys, last_attr[key], value)
\r
13 repeat_texts = ['repeat', 'repeat-x', 'repeat-y', 'no-repeat']
\r
15 is_editable = (p) ->
\r
16 if p.parent().attr('editable')
\r
22 if o.attr('column') == '_destroy' and o.val().length < 1
\r
30 panel_tag_id = (element) ->
\r
31 '#panel' + element.attr('panel_id')
\r
33 element_tag_id = (element) ->
\r
34 '#panel' + element.attr('panel_id') + element.attr('element_type') + element.attr('element_id')
\r
36 refresh_attribute = () ->
\r
40 keys = $(@).attr('tree').split('-')
\r
41 set_tree_value(keys, attr, $(this).val())
\r
42 $('textarea').map ->
\r
44 keys = $(@).attr('tree').split('-')
\r
45 set_tree_value(keys, attr, $(this).val())
\r
48 keys = $(@).attr('tree').split('-')
\r
49 set_tree_value(keys, attr, $(this).val())
\r
50 $('#pettanr-panel-json').val(JSON.stringify(attr['panels'][pettanr_current_panel_id.toString() ]))
\r
53 $('#elements-tabs').tabs()
\r
54 $('#elements-tabs').addClass( "ui-tabs-vertical ui-helper-clearfix" )
\r
55 $("#elements-tabs li").removeClass("ui-corner-top")
\r
56 $("#elements-tabs li").addClass("ui-corner-left")
\r
57 $("#elements-tabs li").map ->
\r
59 switch $(@).attr('element_type')
\r
60 when 'speech_balloon'
\r
61 trace = element_tag_id($(@))
\r
62 t = $('img', $(trace))
\r
63 when 'panel_picture'
\r
64 trace = element_tag_id($(@)) + 'img'
\r
69 $('.ui-resizable-handle', t.parent()).map ->
\r
70 $(@).css('display', 'block')
\r
72 switch $(@).attr('element_type')
\r
73 when 'speech_balloon'
\r
74 trace = element_tag_id($(@))
\r
75 t = $('img', $(trace))
\r
76 when 'panel_picture'
\r
77 trace = element_tag_id($(@)) + 'img'
\r
82 $('.ui-resizable-handle', t.parent()).map ->
\r
83 $(@).css('display', 'none')
\r
86 $('.ui-icon-destroy').map ->
\r
89 primary: 'ui-icon-close',
\r
95 if confirm('destroy ?')
\r
96 trace = element_tag_id($(@))
\r
97 $(trace + '_destroy').val('true')
\r
98 panel_trace = panel_tag_id($(@))
\r
99 update_t(panel_trace + 'tsort')
\r
100 update_z(panel_trace + 'zsort')
\r
102 $(trace + 'element_tab').css('display', 'none')
\r
103 $(trace + 'tab_panel').css('display', 'none')
\r
104 $(trace + 'zsort').css('display', 'none')
\r
105 $(trace + 'tsort').css('display', 'none')
\r
106 switch $(@).attr('element_type')
\r
107 when 'panel_picture'
\r
108 trace = trace + 'div'
\r
109 $(trace).css('display', 'none')
\r
112 $('#pettanr-panel-submit').focusin ->
\r
113 refresh_attribute()
\r
116 $('.pettanr-comic-panel').map ->
\r
117 if is_editable($(@))
\r
119 stop: ( event, ui ) ->
\r
120 trace = panel_tag_id($(@))
\r
121 w = parseInt($(@).width())
\r
122 h = parseInt($(@).height())
\r
123 $(trace + 'width').val(w)
\r
124 $(trace + 'height').val(h)
\r
125 $('.pettanr-comic-ground-picture').map ->
\r
128 $('.pettanr-comic-ground-color').map ->
\r
134 $('#panel' + pettanr_current_panel_id.toString() + 'width').focusout ->
\r
135 trace = '#panel' + $(@).attr('panel_id')
\r
136 $(trace).width(parseInt( $(@).val()))
\r
138 $('#panel' + pettanr_current_panel_id.toString() + 'height').focusout ->
\r
139 trace = '#panel' + $(@).attr('panel_id')
\r
140 $(trace).height(parseInt( $(@).val()))
\r
142 $('#panel' + pettanr_current_panel_id.toString() + 'border').focusout ->
\r
143 trace = '#panel' + $(@).attr('panel_id')
\r
144 $(trace).css('border-width', parseInt($(@).val()).toString() + 'px')
\r
148 $('.pettanr-panel-picture-wrapper').map ->
\r
150 stop: ( event, ui ) ->
\r
151 trace = '#panel' + $(@).attr('panel_id') + 'panel_picture' + $(@).attr('element_id')
\r
152 img = '#panel' + $(@).attr('panel_id') + 'panel_picture' + $(@).attr('element_id') + 'img'
\r
153 left = $(img).parent().position().left + $(@).position().left
\r
154 top = $(img ).parent().position().top + $(@).position().top
\r
155 $(trace + 'x').val(parseInt(left))
\r
156 $(trace + 'y').val(parseInt(top))
\r
159 $('.panel-picture').map ->
\r
161 stop: ( event, ui ) ->
\r
162 trace = '#panel' + $(@).parent().attr('panel_id') + 'panel_picture' + $(@).parent().attr('element_id')
\r
163 $(trace + 'width').val($(@).width())
\r
164 $(trace + 'height').val($(@).height())
\r
169 refresh_picture = (e, w, h) ->
\r
178 pid = parseInt(e.attr('picture_id')).toString()
\r
179 ext = e.attr('ext')
\r
180 src = '/pictures/' + sd + pid + '.' + ext
\r
185 if $(@).attr('element_type') and $(@).attr('element_type') == 'panel_picture'
\r
187 switch $(@).attr('column')
\r
189 trace = element_tag_id($(@)) + 'div'
\r
190 v = parseInt($(@).val()).toString() + 'px'
\r
191 $(trace).css('left', v)
\r
193 trace = element_tag_id($(@)) + 'div'
\r
194 v = parseInt($(@).val()).toString() + 'px'
\r
195 $(trace).css('top', v)
\r
197 trace = element_tag_id($(@)) + 'img'
\r
198 w = parseInt($(@).val())
\r
199 $(trace).width(Math.abs(w))
\r
200 $(trace).parent().width(Math.abs(w))
\r
201 h = parseInt($(element_tag_id($(@)) + 'height').val())
\r
203 trace = element_tag_id($(@)) + 'img'
\r
204 h = parseInt($(@).val())
\r
205 $(trace).height(Math.abs(h))
\r
206 $(trace).parent().height(Math.abs(h))
\r
207 w = parseInt($(element_tag_id($(@)) + 'width').val())
\r
209 refresh_picture($(trace), w, h)
\r
213 $('.pettanr-comic-balloon' ).map ->
\r
215 stop: ( event, ui ) ->
\r
216 trace = '#panel' + $(@).attr('panel_id') + 'speech_balloon' + $(@).attr('element_id') + 'balloon' + $(@).attr('balloon_id')
\r
217 left = $(@).position().left
\r
218 top = $(@).position().top
\r
219 $(trace + 'x').val(parseInt(left))
\r
220 $(trace + 'y').val(parseInt(top))
\r
224 $('.pettanr-balloon' ).map ->
\r
226 stop: ( event, ui ) ->
\r
227 trace = '#panel' + $(@).parent().attr('panel_id') + 'speech_balloon' + $(@).parent().attr('element_id') + 'balloon' + $(@).parent().attr('balloon_id')
\r
228 $(trace + 'width').val($(@).width())
\r
229 $(trace + 'height').val($(@).height())
\r
230 resize: ( event, ui ) ->
\r
231 trace = '#panel' + $(@).parent().attr('panel_id') + 'speech_balloon' + $(@).parent().attr('element_id')
\r
232 $(trace).width($(@).width())
\r
233 $(trace).height($(@).height())
\r
237 $('.pettanr-comic-balloon span' ).map ->
\r
241 trace = '#panel' + $(@).attr('panel_id') + 'speech_balloon' + $(@).attr('element_id') + 'balloon' + $(@).attr('balloon_id')
\r
243 $('.ui-resizable-handle', img.parent()).map ->
\r
244 $(@).css('display', 'block')
\r
246 trace = '#panel' + $(@).attr('panel_id') + 'speech_balloon' + $(@).attr('element_id') + 'balloon' + $(@).attr('balloon_id')
\r
248 $('.ui-resizable-handle', img.parent()).map ->
\r
249 $(@).css('display', 'none')
\r
254 if $(@).attr('element_type') and $(@).attr('element_type') == 'speech_balloon'
\r
256 switch $(@).attr('column')
\r
258 trace = element_tag_id($(@))
\r
259 v = parseInt($(@).val()).toString() + 'px'
\r
260 $(trace).css('left', v)
\r
262 trace = element_tag_id($(@))
\r
263 v = parseInt($(@).val()).toString() + 'px'
\r
264 $(trace).css('top', v)
\r
266 trace = element_tag_id($(@))
\r
267 v = parseInt($(@).val())
\r
268 $(trace).width(Math.abs(v))
\r
269 trace = '#panel' + $(trace).attr('panel_id') + 'speech_balloon' + $(trace).attr('element_id') + 'balloon' + $(trace).attr('balloon_id')
\r
270 $(trace).parent().width(v)
\r
273 trace = element_tag_id($(@))
\r
274 v = parseInt($(@).val())
\r
275 $(trace).height(Math.abs(v))
\r
276 trace = '#panel' + $(trace).attr('panel_id') + 'speech_balloon' + $(trace).attr('element_id') + 'balloon' + $(trace).attr('balloon_id')
\r
277 $(trace).parent().height(v)
\r
281 $('textarea').map ->
\r
282 if $(@).attr('element_type') and $(@).attr('element_type') == 'speech_balloon'
\r
284 switch $(@).attr('column')
\r
286 trace = element_tag_id($(@))
\r
287 speech_trace = '#panel' + $(@).attr('panel_id') + 'speech_balloon' + $(@).attr('element_id') + 'speech' + $(@).attr('element_part_id')
\r
289 $(speech_trace).html(v)
\r
294 if $(@).attr('element_type') and $(@).attr('element_type') == 'ground_picture'
\r
296 switch $(@).attr('column')
\r
298 trace = element_tag_id($(@))
\r
299 x = parseInt($(@).val()).toString() + 'px'
\r
300 ytrace = '#panel' + $(@).attr('panel_id') + 'ground_picture' + $(@).attr('element_id') + 'y'
\r
301 y = parseInt($(ytrace).val()).toString() + 'px'
\r
302 $(trace).css('background-position', y + ' ' + x)
\r
304 if $(@).attr('element_type') and $(@).attr('element_type') == 'ground_picture'
\r
306 switch $(@).attr('column')
\r
308 trace = element_tag_id($(@))
\r
309 v = parseInt($(@).val())
\r
310 $(trace).css('background-repeat', repeat_texts[v])
\r
317 if $(@).attr('element_type') and $(@).attr('element_type') == 'ground_color' and $(@).attr('column') == 'code'
\r
320 color_slider_change = (trace) ->
\r
321 red = $(trace + 'code_red').slider('value')
\r
322 green = $(trace + 'code_green').slider('value')
\r
323 blue = $(trace + 'code_blue').slider('value')
\r
324 code = (red << 16) + (green << 8) + (blue)
\r
325 phex = "000000" + code.toString(16)
\r
326 hex = code.toString(16)
\r
327 h = phex.substring(phex.length - 6)
\r
328 $(trace + 'code_swatch').css('background-color', '#' + h)
\r
329 $(trace + 'code_hex').html('HEX: #' + h)
\r
330 $(trace + 'code_rgb').html('RGB: (' + red + ',' + green + ',' +blue + ')')
\r
331 $(trace + 'code').val(code)
\r
333 $(trace).css('background-color', v)
\r
335 $('.colorpicker').map ->
\r
336 code_picker_trace = element_tag_id($(@))
\r
337 code = parseInt($(code_picker_trace + 'code').val())
\r
338 red = (code >> 16) & 0xFF
\r
339 green = (code >> 8) & 0xFF
\r
341 $(code_picker_trace + 'code_red').slider {
\r
342 orientation: 'horizontal',
\r
346 change: ( event, ui ) ->
\r
347 trace = element_tag_id($(@).parent())
\r
348 color_slider_change(trace)
\r
350 $(code_picker_trace + 'code_green').slider {
\r
351 orientation: 'horizontal',
\r
355 change: ( event, ui ) ->
\r
356 trace = element_tag_id($(@).parent())
\r
357 color_slider_change(trace)
\r
359 $(code_picker_trace + 'code_blue').slider {
\r
360 orientation: 'horizontal',
\r
364 change: ( event, ui ) ->
\r
365 trace = element_tag_id($(@).parent())
\r
366 color_slider_change(trace)
\r
368 color_slider_change(code_picker_trace)
\r
369 $('.colorpicker-wrap').map ->
\r
370 $(@).css('display', 'block')
\r
372 update_t = (ultrace) ->
\r
374 $(ultrace + ' li').map ->
\r
375 trace = element_tag_id($(@))
\r
376 if $(trace + '_destroy').val().length < 1
\r
377 $(trace + 't').val(t)
\r
381 $('.tsort').map ->
\r
383 update: ( event, ui ) ->
\r
384 trace = panel_tag_id($(@))
\r
385 update_t(trace + 'tsort')
\r
387 $('.t-sort li').map ->
\r
388 $(@).disableSelection()
\r
390 update_z = (ultrace) ->
\r
392 $(ultrace + ' li').map ->
\r
393 trace = element_tag_id($(@))
\r
395 if $(trace + '_destroy').val().length < 1
\r
396 $(trace + 'z').val(z)
\r
397 switch $(@).attr('element_type')
\r
398 when 'panel_picture'
\r
399 trace = trace + 'div'
\r
400 $(trace).css('zIndex', z)
\r
404 $('.zsort').map ->
\r
406 update: ( event, ui ) ->
\r
407 trace = panel_tag_id($(@))
\r
408 update_z(trace + 'zsort')
\r
410 $('.z-sort li').map ->
\r
411 $(@).disableSelection()
\r
413 $('.panel_picture_width_tool').map ->
\r
414 $(@).html('<button class="wreverse">Rev</button><button class="wdouble">x2</button><button class="whalf">/2</button>')
\r
416 $('.wreverse').click ->
\r
418 trace = element_tag_id(d)
\r
419 f = $(trace + 'width')
\r
422 f = $(trace + 'height')
\r
424 refresh_picture($(trace + 'img'), w, h)
\r
426 $('.wdouble').click ->
\r
428 trace = element_tag_id(d)
\r
429 f = $(trace + 'width')
\r
432 $(trace + 'img').width(Math.abs(w))
\r
433 $(trace + 'img').parent().width(Math.abs(w))
\r
435 $('.whalf').click ->
\r
437 trace = element_tag_id(d)
\r
438 f = $(trace + 'width')
\r
439 w = Math.floor(f.val() / 2)
\r
441 $(trace + 'img').width(Math.abs(w))
\r
442 $(trace + 'img').parent().width(Math.abs(w))
\r
444 $('.panel_picture_height_tool').map ->
\r
445 $(@).html('<button class="hreverse">Rev</button><button class="hdouble">x2</button><button class="hhalf">/2</button>')
\r
447 $('.hreverse').click ->
\r
449 trace = element_tag_id(d)
\r
450 f = $(trace + 'height')
\r
453 f = $(trace + 'width')
\r
455 refresh_picture($(trace + 'img'), w, h)
\r
457 $('.hdouble').click ->
\r
459 trace = element_tag_id(d)
\r
460 f = $(trace + 'height')
\r
463 $(trace + 'img').height(Math.abs(h))
\r
464 $(trace + 'img').parent().height(Math.abs(h))
\r
466 $('.hhalf').click ->
\r
468 trace = element_tag_id(d)
\r
469 f = $(trace + 'height')
\r
470 h = Math.floor(f.val() / 2)
\r
472 $(trace + 'img').height(Math.abs(h))
\r
473 $(trace + 'img').parent().height(Math.abs(h))
\r
476 # disable form actions
\r
477 # hide submit buttons
\r
478 $('.edit_panel_picture' ).map ->
\r
481 $('.edit_speech_balloon' ).map ->
\r
484 $('.edit_ground_picture' ).map ->
\r
487 $('.edit_ground_color' ).map ->
\r
491 $('.edit_panel' ).map ->
\r
492 if $(@).attr('jqform')
\r
497 $('.submit' ).map ->
\r
502 if $(@).attr('element_type') and $(@).attr('column')
\r
503 switch $(@).attr('column')
\r
506 $(@).parent().hide() #label
\r