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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
|
(function($) {
$.organize = {
micro_thumb_draggable: {
distance: 10,
cursorAt: { left: -10, top: -10},
appendTo: "#gOrganizeContentPane",
helper: function(event, ui) {
var selected = $("li.ui-state-selected img"),
set = $('<div class="temp"></div>').css({zIndex: 2000, width: 80, height: Math.ceil(selected.length / 5) * 16 }),
offset = $(this).offset(),
click = { left: event.pageX - offset.left, top: event.pageY - offset.top };
selected.each(function(i) {
var row = parseInt(i / 5);
var j = i - (row * 5);
var o = $(this).offset();
var copy = $(this).clone()
.css({
width: $(this).width(), height: $(this).height(), display: "block",
margin: 0, position: 'absolute', outline: '5px solid #fff',
left: o.left - event.pageX, top: o.top - event.pageY
})
.appendTo(set)
.animate({width: 10, height: 10, outlineWidth: 1, margin: 1, left: (20 * j), top: (row * 20)}, 500);
});
return set;
},
start: function(event, ui) {
$("#gMicroThumbPanel").prepend("<div id=\"gPlaceHolder\"></div>");
$("#gMicroThumbPanel li.ui-state-selected").hide();
},
drag: function(event, ui) {
var container = $("#gMicroThumbPanel").get(0);
var scrollTop = container.scrollTop;
var height = $(container).height();
if (event.pageY > height + scrollTop) {
container.scrollTop += height;
} else if (event.pageY < scrollTop) {
container.scrollTop -= height;
}
},
stop: function(event, ui) {
$("li.ui-state-selected").show();
}
},
droppable: {
accept: "*",
tolerance: "pointer",
greedy: true,
drop: function(event, ui) {
// @todo do a ajax call to send the rearrange request to the zerver
// organize/move/target_id/
// post parameters
// before=id|after=id
// source=[id1, id2, ...]
// before or after not supplied then append to end
// return: json {
// result: success | msg,
// tree: null | new tree,
// content: new thumbgrid
// }
}
},
/**
* Dynamically initialize the organize dialog when it is displayed
*/
init: function(data) {
var self = this;
// Deal with ui.jquery bug: http://dev.jqueryui.com/ticket/4475 (target 1.8?)
$(".sf-menu li.sfHover ul").css("z-index", 68);
$("#gDialog").dialog("option", "zIndex", 70);
$("#gDialog").bind("dialogopen", function(event, ui) {
$("#gOrganize").height($("#gDialog").innerHeight() - 20);
$("#gMicroThumbPanel").height($("#gDialog").innerHeight() - 90);
$("#gOrganizeAlbumTree").height($("#gDialog").innerHeight() - 59);
});
$("#gDialog").bind("dialogclose", function(event, ui) {
window.location.reload();
});
$("#gDialog #gMicroThumbDone").click(function(event) {
$("#gDialog").dialog("close");
});
$(".gBranchText span").click($.organize.collapse_or_expand_tree);
$(".gBranchText").click($.organize.show_album);
$("#gMicroThumbPanel").selectable({filter: "li"});
$("#gMicroThumbPanel img").draggable($.organize.micro_thumb_draggable);
$(".gOrganizeBranch").droppable($.organize.droppable);
$("#gMicroThumbPanel").droppable($.organize.droppable);
},
/**
* Open or close a branch.
*/
collapse_or_expand_tree: function(event) {
event.stopPropagation();
$(event.currentTarget).toggleClass("ui-icon-minus").toggleClass("ui-icon-plus");
$("#gOrganizeChildren-" + $(event.currentTarget).attr("ref")).toggle();
},
/**
* When the text of a selection is clicked, then show that albums contents
*/
show_album: function(event) {
event.preventDefault();
if ($(event.currentTarget).hasClass("gBranchSelected")) {
return;
}
var id = $(event.currentTarget).attr("ref");
$(".gBranchSelected").removeClass("gBranchSelected");
$("#gOrganizeBranch-" + id).addClass("gBranchSelected");
var url = $("#gMicroThumbPanel").attr("ref").replace("__ITEM_ID__", id).replace("__OFFSET__", 0);
$.get(url, function(data) {
$("#gMicroThumbGrid").html(data);
});
}
};
})(jQuery);
|
