terom@24: /*
terom@24:  * dir-list manipulation
terom@24:  */
terom@23: function toggle_dir (header_a_tag) {
terom@23:     var div = Element.next(header_a_tag);
terom@23:     
terom@23:     if (div._have_contents) {
terom@24:         if (div.visible()) {
terom@23:             Effect.BlindUp(div, {duration: 0.5});
terom@24:             func = hide_tag_image;
terom@24:         } else {
terom@23:             Effect.BlindDown(div, {duration: 0.5});
terom@24:             func = show_tag_image;
terom@24:         }
terom@24:         
terom@24:         Element.up(header_a_tag)._images.each(function(key){
terom@24:             $("img_" + key)._tags.each(function(tag){
terom@24:                 func(tag, key);
terom@24:             });
terom@24:         });
terom@24: 
terom@23:     } else {
terom@23: 
terom@23:         new Ajax.Updater(div, "taggr2.py", {
terom@23:             parameters: {
terom@23:                 act: "dirlist",
terom@23:                 path: div.id,
terom@23:             },
terom@23:             method: 'get',
terom@23:             onSuccess: function () {
terom@23:                 Effect.BlindDown(div, {duration: 0.5});
terom@23:                 div._have_contents = true;
terom@23:             }
terom@23:         });
terom@23:     }
terom@23: }
terom@23: 
terom@24: var g_last_select;
terom@24: function image_click (img, ev) {
terom@24:     var updiv = img.up(2);
terom@23: 
terom@24:     if (img.hasClassName("selection")) {
terom@24:         img.removeClassName("selection");
terom@24: 
terom@24:     } else if (ev.shiftKey && g_last_select && g_last_select.up(2) == updiv) {
terom@24:         var from = Math.min(img._offset, g_last_select._offset);
terom@24:         var to = Math.max(img._offset, g_last_select._offset);
terom@24: 
terom@24:         for (var i = from; i <= to; i++) {
terom@24:             $("img_" + updiv._images[i]).addClassName("selection");
terom@24:         }
terom@24: 
terom@24:         g_last_select = img;
terom@24:     } else {
terom@24:         
terom@24:         g_last_select = img;
terom@24:         img.addClassName("selection");
terom@24:     }
terom@23: }
terom@23: 
terom@24: function selection_clear () {
terom@24:     $$(".selection").each(function(e){
terom@24:         e.removeClassName("selection");
terom@24:     });
terom@23: }
terom@23: 
terom@24: /*
terom@24:  * image-loading callback
terom@24:  */
terom@24: function image_info (img, offset, key, tags) {
terom@24:     img._key = key;
terom@24:     img._tags = $A(tags);
terom@24:     img._offset = offset;
terom@24:     
terom@24:     img._tags.each(function(tag){
terom@24:         if (!$('tag_' + tag + '_images'))
terom@24:             new_tag(tag);
terom@23: 
terom@24:         tag_add_image(img, null, tag, false);
terom@24:     });
terom@24: 
terom@24:     var dir = img.up(2);
terom@24: 
terom@24:     if (!dir._images)
terom@24:         dir._images = new Array();
terom@24: 
terom@24:     dir._images.push(img._key);
terom@23: }
terom@23: 
terom@24: /*
terom@24:  * tag list manipulation code
terom@24:  */
terom@24: function _tag_name (tag_name) {
terom@24:     var tag_name_p = Builder.node("p", {id:"tag_" + tag_name + "_name", className: "draggable tag_name"}, [tag_name]);
terom@24: 
terom@24:     tag_name_p._tag = tag_name;
terom@24: 
terom@24:     return tag_name_p;
terom@23: }
terom@23: 
terom@24: function new_tag (tag_name) {
terom@24:     var tag_images = Builder.node("td", {className:"tag_images", id:"tag_" + tag_name + "_images"});
terom@24: 
terom@24:     tag_images._tag = tag_name;
terom@24:     tag_images._visibleCount = 0;
terom@24:     tag_images._images = new Array();
terom@24: 
terom@24:     var tag_row = Builder.node("tr", {className:"tag_row", id:"tag_" + tag_name}, [
terom@24:         Builder.node("td", {className:"tag", id:"tag_" + tag_name + "_tags"}, [
terom@24:             _tag_name(tag_name)
terom@24:         ]),
terom@24:         tag_images
terom@24:     ]);
terom@24: 
terom@24:     tag_row._tag = tag_name;
terom@24:     tag_row._tags = new Array(tag_name);
terom@24: 
terom@24:     $("tag_table").appendChild(tag_row);
terom@24: }
terom@24: 
terom@24: function tag_add_tag (new_tag, tag) {
terom@24:     var tag_row = $("tag_" + tag);
terom@24: 
terom@24:     if (tag_row._tags.indexOf(new_tag) != -1)
terom@24:         return false;
terom@24:     
terom@24:     tag_row._tags.push(new_tag);
terom@24: 
terom@24:     $("tag_" + tag + "_tags").appendChild(_tag_name(new_tag));
terom@24: 
terom@24: /*
terom@24:     new Ajax.Request("taggr2.py", {
terom@24:         parameters: {
terom@24:             act: 'tag',
terom@24:             tag: new_tag,
terom@24:             img: $("tag_" + tag + "_images")._images,
terom@24:         },
terom@24:         method: 'get'
terom@24:     });
terom@24: */
terom@24: }
terom@24: 
terom@24: function tag_remove_tag (tag_name) {
terom@24:     var tag_row = $("tag_" + tag_name + "_name").up(1);
terom@24:     array_remove(tag_row._tags, tag_name);
terom@24:     
terom@24:     $("tag_" + tag_row._tag + "_tags").removeChild($("tag_" + tag_name + "_name"));
terom@24: 
terom@24:     if (tag_row._tags.length == 0)
terom@24:         $("tag_table").removeChild(tag_row);
terom@24: }
terom@24: 
terom@24: function get_tag (tag_name, postfix) {
terom@24:     return $("tag_" + $("tag_" + tag_name).up(1)._tag + "_" + postfix);
terom@24: }
terom@24: 
terom@24: function tag_add_image (orig_img, copy_img, tag, saveToDB) {
terom@24:     var tag_images = $('tag_' + tag + '_images');
terom@24: 
terom@24:     if (tag_images._images.indexOf(orig_img._key) != -1)
terom@24:         return false;
terom@24: 
terom@24:     if (!copy_img)
terom@24:         copy_img = image_copy(orig_img);
terom@24: 
terom@24:     tag_images._images.push(orig_img._key)
terom@24:     orig_img._tags.push(tag);
terom@24: 
terom@24:     copy_img.id = "tag_" + tag + "_img_" + orig_img._key
terom@24:     copy_img._tag = tag;
terom@24: 
terom@24:     tag_images.appendChild(copy_img);
terom@24:     tag_images._visibleCount++;
terom@24:     
terom@24:     if (saveToDB) {
terom@24:         new Ajax.Request("taggr2.py", {
terom@24:             parameters: {
terom@24:                 act: 'tag',
terom@24:                 img: orig_img._key,
terom@24:                 tag: tag,
terom@24:             },
terom@24:             method: 'get'
terom@24: 
terom@24:         });
terom@24:     }
terom@24: }
terom@24: 
terom@24: function tag_add_images (images, tag_name) {
terom@24:     var tag_images = $('tag_' + tag_name + '_images');
terom@24:     var copy_img, img_keys = new Array();
terom@24: 
terom@24:     images.each(function(orig_img){
terom@24:         tag_add_image(orig_img, null, tag_name, false);
terom@24:         img_keys.push(orig_img._key);
terom@24:     });
terom@24: 
terom@24:     new Ajax.Request("taggr2.py", {
terom@24:         parameters: {
terom@24:             act: 'tag',
terom@24:             img: img_keys,
terom@24:             tag: tag_name,
terom@24:         },
terom@24:         method: 'get'
terom@24: 
terom@24:     });
terom@24: }
terom@24: 
terom@24: function tag_remove_image (img_key, tag_name) {
terom@24:     var tag_images = $("tag_" + tag_name + "_images");
terom@24: 
terom@24:     tag_images.removeChild($("tag_" + tag_name + "_img_" + img_key));
terom@24:     array_remove(tag_images._images, img_key);
terom@24: 
terom@24:     if (tag_images._images.length == 0)
terom@24:         $("tag_" + tag_name).hide();
terom@24: 
terom@24:     new Ajax.Request("taggr2.py", {
terom@24:         parameters: {
terom@24:             act: 'untag',
terom@24:             img: img_key,
terom@24:             tag: tag_name,
terom@24:         },
terom@24:         method: 'get',
terom@24:     });
terom@24: }
terom@24: 
terom@24: function hide_tag_image (tag, img) {
terom@24:     $("tagimg_" + tag + "_" + img).hide();
terom@24: 
terom@24:     if (--$("tag_" + tag + "_images")._visibleCount == 0)
terom@24:         $("tag_" + tag).hide();
terom@24: }
terom@24: 
terom@24: function show_tag_image (tag, img) {
terom@24:     $("tagimg_" + tag + "_" + img).hide();
terom@24: 
terom@24:     if ($("tag_" + tag + "_images")._visibleCount++ == 0)
terom@24:          $("tag_" + tag).show();
terom@24: }
terom@24: 
terom@24: /*
terom@24:  * Frontend image drag code
terom@24:  */
terom@24: var g_ghost;
terom@24: function drag_start (e) {
terom@24:     if (e.hasClassName("image") || e.hasClassName("tag_image"))
terom@24:         g_ghost = image_copy(e);
terom@24:     else {
terom@24:         var name;
terom@24: 
terom@24:         if (e.hasClassName("tag_name"))
terom@24:             name = e._tag;
terom@24:         else
terom@24:             name = $F($('new_tag'));
terom@24: 
terom@24:         g_ghost = Builder.node("span", {className: 'dragged'}, [name]);
terom@24:     }
terom@24: 
terom@24:     $('taggr').appendChild(g_ghost);
terom@24: 
terom@24:     g_ghost.style.position = "absolute";
terom@24: }
terom@24: 
terom@24: function drag_move (e, ev) {
terom@24:     g_ghost.style.left = ev.pointerX() - g_offset.left + "px";
terom@24:     g_ghost.style.top = ev.pointerY() - g_offset.top + "px";
terom@24: }
terom@24: 
terom@24: function drag_end_drop (e, s, ev) {
terom@24:     g_ghost.style.position = "static";
terom@24:     $('taggr').removeChild(g_ghost);
terom@24:     
terom@24:     if (e.hasClassName("image") || e.hasClassName("tag_image")) {
terom@24:         var selection = $$(".selection");
terom@24: 
terom@24:         if (selection.length)
terom@24:             tag_add_images($$(".selection"), s._tag);
terom@24:         else
terom@24:             tag_add_image(e, g_ghost, s._tag, true);
terom@24:             
terom@24: /*
terom@24:         if (!tag_add_image(e, g_ghost, s._tag, true))
terom@24:             // it was already in there
terom@24:             Effect.Shake("tagimg_" + s._tag + "_" + g_ghost._key);
terom@24: */            
terom@24:     } else if (e.hasClassName("tag_name")) {
terom@24:         null;   // breakpoint
terom@24:     } else {
terom@24:         tag_add_tag($F($('new_tag')), s._tag);
terom@24:     }
terom@24: }
terom@24: 
terom@24: function drag_end_fail (e, ev) {
terom@24:     if (e.hasClassName("tag_image")) {
terom@24:         tag_remove_image(e._key, e._tag);
terom@24:         $('taggr').removeChild(g_ghost);
terom@24:     } else if (e.hasClassName("tag_name")) {
terom@24:         tag_remove_tag(e._tag);
terom@24:     } else {
terom@24:         $('taggr').removeChild(g_ghost);
terom@24:     }
terom@24: }
terom@24: 
terom@24: function drag_cleanup (e, ev) {
terom@24:     g_ghost = null;
terom@24: }
terom@24: 
terom@24: function drag_hover (e, s, ev) {
terom@24:     s.addClassName("hover");
terom@24: }
terom@24: 
terom@24: function drag_unhover (e, s, ev) {
terom@24:     s.removeClassName("hover");
terom@24: }
terom@24: 
terom@24: /*
terom@24:  * Backend image click/drag code
terom@24:  */
terom@24: 
terom@23: var g_drag, g_hover, g_start, g_offset, g_targets;
terom@23: function check_mouse_down (ev) {
terom@23:     var e = ev.element();
terom@24:     
terom@24:     if (!ev.isLeftClick())
terom@24:         return true;
terom@23: 
terom@24:     if (e.hasClassName("image") || e.hasClassName("draggable") || e.hasClassName("tag_image")) {
terom@23:         g_drag = e;
terom@23:         g_start = false;
terom@23:         
terom@23:         var offset = e.cumulativeOffset();
terom@23: 
terom@23:         g_offset = {
terom@23:             'left': ev.pointerX() - offset.left,
terom@23:             'top': ev.pointerY() - offset.top
terom@23:         };
terom@23: 
terom@23:         g_hover = null;
terom@23: 
terom@24:         g_targets = $$(".tag_row");
terom@23: 
terom@23:     } else if (e.hasClassName("directory_link")) {
terom@23:         toggle_dir(e);
terom@23: 
terom@23:     } else {
terom@23:         return true;
terom@23:     }
terom@23:     
terom@23:     ev.stop();
terom@23:     return false;
terom@23: }
terom@23: 
terom@23: function check_mouse_up (ev) {
terom@23:     if (g_drag) {
terom@23:         if (g_start) {
terom@23:             if (g_hover) {
terom@23:                 drag_unhover(g_drag, g_hover, ev);
terom@23:                 drag_end_drop(g_drag, g_hover, ev);
terom@23:             } else
terom@23:                 drag_end_fail(g_drag, ev);
terom@23:             
terom@23:             drag_cleanup(g_drag);
terom@24:         } else if (g_drag.hasClassName("image") || g_drag.hasClassName("tag_image")) {
terom@24:             // in case image_click blocks and we get a mouse_move during it
terom@24:             var tmp = g_drag;
terom@24:             g_drag = null;
terom@24: 
terom@24:             image_click(tmp, ev);
terom@24:         }
terom@23: 
terom@23:         g_start = null;
terom@23:         g_drag = null;
terom@23:         g_hover = null;
terom@23: 
terom@23:         ev.stop();
terom@23:         return false;
terom@23:     }   
terom@23: }
terom@23: 
terom@23: function check_mouse_move (ev) {
terom@23:     if (g_drag) {
terom@23:         if (!g_start) {
terom@23:             drag_start(g_drag);
terom@23:             g_start = true;
terom@23:         }
terom@23: 
terom@23:         drag_move(g_drag, ev);
terom@23:         
terom@23:         Position.prepare();
terom@23: 
terom@23:         var px = ev.pointerX();
terom@23:         var py = ev.pointerY();
terom@23: 
terom@23:         if (g_hover) {
terom@23:             if (!Position.withinIncludingScrolloffsets(g_hover, px, py)) {
terom@23:                 drag_unhover(g_drag, g_hover, ev);
terom@23:                 g_hover = null;
terom@23:             }
terom@23:         } else {
terom@23:             for (var i=0;i<g_targets.length;i++)
terom@23:                 if (Position.withinIncludingScrolloffsets(g_targets[i], px, py)) {
terom@23:                     drag_hover(g_drag, g_targets[i], ev);
terom@23:                     g_hover = g_targets[i];
terom@24:                     break;
terom@23:                 }
terom@23:         }
terom@23: 
terom@23:         ev.stop();
terom@23:         return false;
terom@23:     }
terom@23: }
terom@23: 
terom@23: function check_drag_hover (ev) {
terom@23:     if (g_start) {
terom@24:         var e = ev.element();
terom@23: 
terom@24:         if (e.hasClassName("tag_row")) {
terom@23:             drag_hover(g_drag, e, ev);
terom@23:             g_hover = e;
terom@23:         }
terom@23:     }
terom@23: }
terom@23: 
terom@23: function check_drag_nohover (ev) {
terom@24:     if (g_start) {
terom@23:         var e = ev.element();
terom@23: 
terom@23:         if (g_hover && e == g_hover) {
terom@23:             drag_unhover(g_drag, g_hover, ev);
terom@23:             g_hover = null;
terom@23:         }
terom@23:     }
terom@23: }
terom@23: 
terom@24: /* 
terom@24:  * utility code
terom@24:  */
terom@24: function image_copy (img) {
terom@24:     copy = Builder.node("img", {
terom@24:         src: img.src,
terom@24:         className: "tag_image",
terom@23:     });
terom@23: 
terom@24:     copy._key = img._key;
terom@24:     copy._tags = img._tags;
terom@24:     
terom@24:     return copy;
terom@23: }
terom@23: 
terom@24: function array_remove (a, i) {
terom@24:     a.splice(a.indexOf(i), 1);
terom@23: }
terom@23: 
terom@24: /*
terom@24:  * events
terom@24:  */
terom@23: Event.observe(document, "mousedown", check_mouse_down);
terom@23: Event.observe(document, "mouseup", check_mouse_up);
terom@23: Event.observe(document, "mousemove", check_mouse_move);
terom@23: Event.observe(document, "mouseover", check_drag_hover);
terom@23: Event.observe(document, "mouseout", check_drag_nohover);
terom@24: Event.observe(document, "dragenter", check_drag_hover);     // worth a try...
terom@23: Event.observe(document, "dragexit", check_drag_nohover);
terom@23: