diff options
-rw-r--r-- | languages/en.php | 6 | ||||
-rw-r--r-- | vendors/jquery.imgareaselect-0.6.2.js | 554 | ||||
-rw-r--r-- | vendors/jquery.quicksearch.js | 345 | ||||
-rw-r--r-- | views/default/object/image.php | 309 | ||||
-rw-r--r-- | views/default/tidypics/css.php | 43 |
5 files changed, 1247 insertions, 10 deletions
diff --git a/languages/en.php b/languages/en.php index 6b2d51374..20c1f3cee 100644 --- a/languages/en.php +++ b/languages/en.php @@ -53,6 +53,12 @@ 'image:none' => "No images have been added yet.",
'image:back' => "Back",
'image:next' => "Next",
+
+ // tagging
+ 'image:doclickfortag' => 'Click on the faces of people to label them.',
+ 'image:finish_tagging' => 'Stop labeling',
+ 'image:tagthisphoto' => 'Tag this photo',
+ 'image:actiontag' => 'Tag',
//widgets
diff --git a/vendors/jquery.imgareaselect-0.6.2.js b/vendors/jquery.imgareaselect-0.6.2.js new file mode 100644 index 000000000..76f77ee98 --- /dev/null +++ b/vendors/jquery.imgareaselect-0.6.2.js @@ -0,0 +1,554 @@ +/*
+ * imgAreaSelect jQuery plugin
+ * version 0.6.2
+ *
+ * Copyright (c) 2008 Michal Wojciechowski (odyniec.net)
+ *
+ * Dual licensed under the MIT (MIT-LICENSE.txt)
+ * and GPL (GPL-LICENSE.txt) licenses.
+ *
+ * http://odyniec.net/projects/imgareaselect/
+ *
+ */
+
+jQuery.imgAreaSelect = { onKeyPress: null };
+
+jQuery.imgAreaSelect.init = function (img, options) {
+ var $area = jQuery('<div></div>'),
+ $border1 = jQuery('<div></div>'),
+ $border2 = jQuery('<div></div>'),
+ $outLeft = jQuery('<div></div>'),
+ $outTop = jQuery('<div></div>'),
+ $outRight = jQuery('<div></div>'),
+ $outBottom = jQuery('<div></div>'),
+ left, top, imgOfs, imgWidth, imgHeight, parent, parOfs, parScroll,
+ adjusted, zIndex = 0, fixed, $p, startX, startY, moveX, moveY,
+ resizeMargin = 10, resize = [ ], V = 0, H = 1,
+ keyDown, d, aspectRatio, x1, x2, y1, y2, x, y,
+ selection = { x1: 0, y1: 0, x2: 0, y2: 0, width: 0, height: 0 };
+
+ var $a = $area.add($border1).add($border2);
+ var $o = $outLeft.add($outTop).add($outRight).add($outBottom);
+
+ function viewX(x)
+ {
+ return x + imgOfs.left + parScroll.left - parOfs.left;
+ }
+
+ function viewY(y)
+ {
+ return y + imgOfs.top + parScroll.top - parOfs.top;
+ }
+
+ function selX(x)
+ {
+ return x - imgOfs.left - parScroll.left + parOfs.left;
+ }
+
+ function selY(y)
+ {
+ return y - imgOfs.top - parScroll.top + parOfs.top;
+ }
+
+ function evX(event)
+ {
+ return event.pageX + parScroll.left - parOfs.left;
+ }
+
+ function evY(event)
+ {
+ return event.pageY + parScroll.top - parOfs.top;
+ }
+
+ function adjust()
+ {
+ imgOfs = jQuery(img).offset();
+ imgWidth = jQuery(img).width();
+ imgHeight = jQuery(img).height();
+
+ if (jQuery(parent).is('body'))
+ parOfs = parScroll = { left: 0, top: 0 };
+ else {
+ parOfs = jQuery(parent).offset();
+ parScroll = { left: parent.scrollLeft, top: parent.scrollTop };
+ }
+
+ left = viewX(0);
+ top = viewY(0);
+ }
+
+ function update(resetKeyPress)
+ {
+ $a.css({
+ left: viewX(selection.x1) + 'px',
+ top: viewY(selection.y1) + 'px',
+ width: Math.max(selection.width - options.borderWidth * 2, 0) + 'px',
+ height: Math.max(selection.height - options.borderWidth * 2, 0) + 'px'
+ });
+ $outLeft.css({ left: left + 'px', top: top + 'px',
+ width: selection.x1 + 'px', height: imgHeight + 'px' });
+ $outTop.css({ left: left + selection.x1 + 'px', top: top + 'px',
+ width: selection.width + 'px', height: selection.y1 + 'px' });
+ $outRight.css({ left: left + selection.x2 + 'px', top: top + 'px',
+ width: imgWidth - selection.x2 + 'px', height: imgHeight + 'px' });
+ $outBottom.css({ left: left + selection.x1 + 'px', top: top + selection.y2 + 'px',
+ width: selection.width + 'px', height: imgHeight - selection.y2 + 'px' });
+
+ if (resetKeyPress !== false) {
+ if (jQuery.imgAreaSelect.keyPress != docKeyPress)
+ jQuery(document).unbind(jQuery.imgAreaSelect.keyPress,
+ jQuery.imgAreaSelect.onKeyPress);
+
+ if (options.keys)
+ jQuery(document).bind(jQuery.imgAreaSelect.keyPress,
+ jQuery.imgAreaSelect.onKeyPress = docKeyPress);
+ }
+ }
+
+ function areaMouseMove(event)
+ {
+ if (!adjusted) {
+ adjust();
+ adjusted = true;
+
+ $a.one('mouseout', function () { adjusted = false; });
+ }
+
+ x = selX(evX(event)) - selection.x1;
+ y = selY(evY(event)) - selection.y1;
+
+ resize = [ ];
+
+ if (options.resizable) {
+ if (y <= resizeMargin)
+ resize[V] = 'n';
+ else if (y >= selection.height - resizeMargin)
+ resize[V] = 's';
+ if (x <= resizeMargin)
+ resize[H] = 'w';
+ else if (x >= selection.width - resizeMargin)
+ resize[H] = 'e';
+ }
+
+ $border2.css('cursor', resize.length ? resize.join('') + '-resize' :
+ options.movable ? 'move' : '');
+ }
+
+ function areaMouseDown(event)
+ {
+ if (event.which != 1) return false;
+
+ adjust();
+
+ if (options.resizable && resize.length > 0) {
+ jQuery('body').css('cursor', resize.join('') + '-resize');
+
+ x1 = viewX(resize[H] == 'w' ? selection.x2 : selection.x1);
+ y1 = viewY(resize[V] == 'n' ? selection.y2 : selection.y1);
+
+ jQuery(document).mousemove(selectingMouseMove);
+ $border2.unbind('mousemove', areaMouseMove);
+
+ jQuery(document).one('mouseup', function () {
+ resize = [ ];
+
+ jQuery('body').css('cursor', '');
+
+ if (options.autoHide)
+ $a.add($o).hide();
+
+ options.onSelectEnd(img, selection);
+
+ jQuery(document).unbind('mousemove', selectingMouseMove);
+ $border2.mousemove(areaMouseMove);
+ });
+ }
+ else if (options.movable) {
+ moveX = selection.x1 + left;
+ moveY = selection.y1 + top;
+ startX = evX(event);
+ startY = evY(event);
+
+ jQuery(document).mousemove(movingMouseMove)
+ .one('mouseup', function () {
+ options.onSelectEnd(img, selection);
+
+ jQuery(document).unbind('mousemove', movingMouseMove);
+ });
+ }
+ else
+ jQuery(img).mousedown(event);
+
+ return false;
+ }
+
+ function aspectRatioXY()
+ {
+ x2 = Math.max(left, Math.min(left + imgWidth,
+ x1 + Math.abs(y2 - y1) * aspectRatio * (x2 >= x1 ? 1 : -1)));
+ y2 = Math.round(Math.max(top, Math.min(top + imgHeight,
+ y1 + Math.abs(x2 - x1) / aspectRatio * (y2 >= y1 ? 1 : -1))));
+ x2 = Math.round(x2);
+ }
+
+ function aspectRatioYX()
+ {
+ y2 = Math.max(top, Math.min(top + imgHeight,
+ y1 + Math.abs(x2 - x1) / aspectRatio * (y2 >= y1 ? 1 : -1)));
+ x2 = Math.round(Math.max(left, Math.min(left + imgWidth,
+ x1 + Math.abs(y2 - y1) * aspectRatio * (x2 >= x1 ? 1 : -1))));
+ y2 = Math.round(y2);
+ }
+
+ function doResize(newX2, newY2)
+ {
+ x2 = newX2;
+ y2 = newY2;
+
+ if (options.minWidth && Math.abs(x2 - x1) < options.minWidth) {
+ x2 = x1 - options.minWidth * (x2 < x1 ? 1 : -1);
+
+ if (x2 < left)
+ x1 = left + options.minWidth;
+ else if (x2 > left + imgWidth)
+ x1 = left + imgWidth - options.minWidth;
+ }
+
+ if (options.minHeight && Math.abs(y2 - y1) < options.minHeight) {
+ y2 = y1 - options.minHeight * (y2 < y1 ? 1 : -1);
+
+ if (y2 < top)
+ y1 = top + options.minHeight;
+ else if (y2 > top + imgHeight)
+ y1 = top + imgHeight - options.minHeight;
+ }
+
+ x2 = Math.max(left, Math.min(x2, left + imgWidth));
+ y2 = Math.max(top, Math.min(y2, top + imgHeight));
+
+ if (aspectRatio)
+ if (Math.abs(x2 - x1) / aspectRatio > Math.abs(y2 - y1))
+ aspectRatioYX();
+ else
+ aspectRatioXY();
+
+ if (options.maxWidth && Math.abs(x2 - x1) > options.maxWidth) {
+ x2 = x1 - options.maxWidth * (x2 < x1 ? 1 : -1);
+ if (aspectRatio) aspectRatioYX();
+ }
+
+ if (options.maxHeight && Math.abs(y2 - y1) > options.maxHeight) {
+ y2 = y1 - options.maxHeight * (y2 < y1 ? 1 : -1);
+ if (aspectRatio) aspectRatioXY();
+ }
+
+ selection.x1 = selX(Math.min(x1, x2));
+ selection.x2 = selX(Math.max(x1, x2));
+ selection.y1 = selY(Math.min(y1, y2));
+ selection.y2 = selY(Math.max(y1, y2));
+ selection.width = Math.abs(x2 - x1);
+ selection.height = Math.abs(y2 - y1);
+
+ update();
+
+ options.onSelectChange(img, selection);
+ }
+
+ function selectingMouseMove(event)
+ {
+ x2 = !resize.length || resize[H] || aspectRatio ? evX(event) : viewX(selection.x2);
+ y2 = !resize.length || resize[V] || aspectRatio ? evY(event) : viewY(selection.y2);
+
+ doResize(x2, y2);
+
+ return false;
+ }
+
+ function doMove(newX1, newY1)
+ {
+ x2 = (x1 = newX1) + selection.width;
+ y2 = (y1 = newY1) + selection.height;
+
+ selection.x1 = selX(x1);
+ selection.y1 = selY(y1);
+ selection.x2 = selX(x2);
+ selection.y2 = selY(y2);
+
+ update();
+
+ options.onSelectChange(img, selection);
+ }
+
+ function movingMouseMove(event)
+ {
+ var newX1 = Math.max(left, Math.min(moveX + evX(event) - startX,
+ left + imgWidth - selection.width));
+ var newY1 = Math.max(top, Math.min(moveY + evY(event) - startY,
+ top + imgHeight - selection.height));
+
+ doMove(newX1, newY1);
+
+ event.preventDefault();
+ return false;
+ }
+
+ function startSelection(event)
+ {
+ sizePredef = 70;
+
+ adjust();
+
+ selection.x1 = selX(startX = x1 = x2 = evX(event)) - parseInt(sizePredef/2);
+ selection.y1 = selY(startY = y1 = y2 = evY(event)) - parseInt(sizePredef/2);
+
+ selection.x2 = selection.x1 + sizePredef;
+ selection.y2 = selection.y1 + sizePredef;
+
+ selection.width = 70;
+ selection.height = 70;
+
+ console.log(selection);
+
+ resize = [ ];
+
+ update();
+ $a.add($o).show();
+
+ jQuery(document).unbind('mouseup', cancelSelection)
+ .mousemove(selectingMouseMove);
+ $border2.unbind('mousemove', areaMouseMove);
+
+ options.onSelectStart(img, selection);
+
+ jQuery(document).one('mouseup', function () {
+ if (options.autoHide || (selection.width * selection.height == 0))
+ $a.add($o).hide();
+
+ options.onSelectEnd(img, selection);
+
+ jQuery(document).unbind('mousemove', selectingMouseMove);
+ $border2.mousemove(areaMouseMove);
+ });
+ }
+
+ function cancelSelection()
+ {
+ //Ocultamos cualquier menu
+ jQuery('#cont-menu').hide();
+ jQuery(document).unbind('mousemove', startSelection);
+ $a.add($o).hide();
+
+ selection.x1 = selection.y1 = selection.x2 = selection.y2 =
+ selection.width = selection.height = 0;
+
+ options.onSelectChange(img, selection);
+ options.onSelectEnd(img, selection);
+ }
+
+ function imgMouseDown(event)
+ {
+ if (event.which != 1) return false;
+
+ jQuery(document).one('mousemove', startSelection)
+ .one('mouseup', cancelSelection);
+
+ jQuery(document).trigger('mousemove',event);
+
+ return false;
+ }
+
+ function windowResize()
+ {
+ adjust();
+ update(false);
+ x1 = viewX(selection.x1);
+ y1 = viewY(selection.y1);
+ x2 = viewX(selection.x2);
+ y2 = viewY(selection.y2);
+ }
+
+ var docKeyPress = function(event) {
+ var k = options.keys, d = 10, t,
+ key = event.keyCode || event.which;
+
+ if (!isNaN(k.arrows)) d = k.arrows;
+ if (!isNaN(k.shift) && event.shiftKey) d = k.shift;
+ if (!isNaN(k.ctrl) && event.ctrlKey) d = k.ctrl;
+ if (!isNaN(k.alt) && (event.altKey || event.originalEvent.altKey)) d = k.alt;
+
+ if (k.arrows == 'resize' || (k.shift == 'resize' && event.shiftKey) ||
+ (k.ctrl == 'resize' && event.ctrlKey) ||
+ (k.alt == 'resize' && (event.altKey || event.originalEvent.altKey)))
+ {
+ switch (key) {
+ case 37:
+ d = -d;
+ case 39:
+ t = Math.max(x1, x2);
+ x1 = Math.min(x1, x2);
+ x2 = Math.max(t + d, x1);
+ if (aspectRatio) aspectRatioYX();
+ break;
+ case 38:
+ d = -d;
+ case 40:
+ t = Math.max(y1, y2);
+ y1 = Math.min(y1, y2);
+ y2 = Math.max(t + d, y1);
+ if (aspectRatio) aspectRatioXY();
+ break;
+ default:
+ return;
+ }
+
+ doResize(x2, y2);
+ }
+ else {
+ x1 = Math.min(x1, x2);
+ y1 = Math.min(y1, y2);
+
+ switch (key) {
+ case 37:
+ doMove(Math.max(x1 - d, left), y1);
+ break;
+ case 38:
+ doMove(x1, Math.max(y1 - d, top));
+ break;
+ case 39:
+ doMove(x1 + Math.min(d, imgWidth - selX(x2)), y1);
+ break;
+ case 40:
+ doMove(x1, y1 + Math.min(d, imgHeight - selY(y2)));
+ break;
+ default:
+ return;
+ }
+ }
+
+ return false;
+ };
+
+ this.setOptions = function(newOptions)
+ {
+ options = jQuery.extend(options, newOptions);
+
+ if (newOptions.x1 != null) {
+ selection.x1 = newOptions.x1;
+ selection.y1 = newOptions.y1;
+ selection.x2 = newOptions.x2;
+ selection.y2 = newOptions.y2;
+ newOptions.show = true;
+ }
+
+ if (newOptions.keys)
+ options.keys = jQuery.extend({ shift: 1, ctrl: 'resize' },
+ newOptions.keys === true ? { } : newOptions.keys);
+
+ parent = jQuery(options.parent).get(0);
+
+ adjust();
+
+ $p = jQuery(img);
+
+ while ($p.length && !$p.is('body')) {
+ if (!isNaN($p.css('z-index')) && $p.css('z-index') > zIndex)
+ zIndex = $p.css('z-index');
+ if ($p.css('position') == 'fixed') fixed = true;
+
+ $p = $p.parent();
+ }
+
+ x1 = viewX(selection.x1);
+ y1 = viewY(selection.y1);
+ x2 = viewX(selection.x2);
+ y2 = viewY(selection.y2);
+ selection.width = x2 - x1;
+ selection.height = y2 - y1;
+
+ update();
+
+ if (newOptions.hide)
+ $a.add($o).hide();
+ else if (newOptions.show)
+ $a.add($o).show();
+
+ $o.addClass(options.classPrefix + '-outer');
+ $area.addClass(options.classPrefix + '-selection');
+ $border1.addClass(options.classPrefix + '-border1');
+ $border2.addClass(options.classPrefix + '-border2');
+
+ $a.css({ borderWidth: options.borderWidth + 'px' });
+ $area.css({ backgroundColor: options.selectionColor, opacity: options.selectionOpacity });
+ $border1.css({ borderStyle: 'solid', borderColor: options.borderColor1 });
+ $border2.css({ borderStyle: 'dashed', borderColor: options.borderColor2 });
+ $o.css({ opacity: options.outerOpacity, backgroundColor: options.outerColor });
+
+ aspectRatio = options.aspectRatio && (d = options.aspectRatio.split(/:/)) ?
+ d[0] / d[1] : null;
+
+ if (options.disable || options.enable === false) {
+ $a.unbind('mousemove', areaMouseMove).unbind('mousedown', areaMouseDown);
+ jQuery(img).add($o).unbind('mousedown', imgMouseDown);
+ jQuery(window).unbind('resize', windowResize);
+ }
+ else if (options.enable || options.disable === false) {
+ if (options.resizable || options.movable)
+ $a.mousemove(areaMouseMove).mousedown(areaMouseDown);
+
+ if (!options.persistent)
+ jQuery(img).add($o).mousedown(imgMouseDown);
+ jQuery(window).resize(windowResize);
+ }
+
+ jQuery(options.parent).append($o.add($a));
+
+ options.enable = options.disable = undefined;
+ };
+
+ if (jQuery.browser.msie)
+ jQuery(img).attr('unselectable', 'on');
+
+ jQuery.imgAreaSelect.keyPress = jQuery.browser.msie ||
+ jQuery.browser.safari ? 'keydown' : 'keypress';
+
+ $a.add($o).css({ display: 'none', position: fixed ? 'fixed' : 'absolute',
+ overflow: 'hidden', zIndex: zIndex > 0 ? zIndex : '0' });
+ $area.css({ borderStyle: 'solid' });
+
+ initOptions = {
+ borderColor1: '#000',
+ borderColor2: '#fff',
+ borderWidth: 1,
+ classPrefix: 'imgareaselect',
+ movable: true,
+ resizable: true,
+ selectionColor: '#fff',
+ selectionOpacity: 0.2,
+ outerColor: '#000',
+ outerOpacity: 0.2,
+ parent: 'body',
+ onSelectStart: function () {},
+ onSelectChange: function () {},
+ onSelectEnd: function () {}
+ };
+
+ options = jQuery.extend(initOptions, options);
+ this.setOptions(options);
+};
+
+jQuery.fn.imgAreaSelect = function (options) {
+ options = options || {};
+
+ this.each(function () {
+ if (jQuery(this).data('imgAreaSelect'))
+ jQuery(this).data('imgAreaSelect').setOptions(options);
+ else {
+ if (options.enable === undefined && options.disable === undefined)
+ options.enable = true;
+
+ jQuery(this).data('imgAreaSelect', new jQuery.imgAreaSelect.init(this, options));
+ }
+ });
+
+ return this;
+};
diff --git a/vendors/jquery.quicksearch.js b/vendors/jquery.quicksearch.js new file mode 100644 index 000000000..d572514e7 --- /dev/null +++ b/vendors/jquery.quicksearch.js @@ -0,0 +1,345 @@ +jQuery(function ($) {
+ $.fn.quicksearch = function (opt) {
+
+ function is_empty(i)
+ {
+ return (i === null || i === undefined || i === false) ? true: false;
+ }
+
+ function strip_html(input)
+ {
+ var regexp = new RegExp(/\<[^\<]+\>/g);
+ var output = input.replace(regexp, "");
+ output = $.trim(output.toLowerCase().replace(/\n/, '').replace(/\s{2,}/, ' '));
+ return output;
+ }
+
+ function get_key()
+ {
+ var input = strip_html($('input[rel="' + options.randomElement + '"]').val());
+
+ if (input.indexOf(' ') === -1)
+ {
+ return input;
+ }
+ else
+ {
+ return input.split(" ");
+ }
+ }
+
+ function test_key(k, value, type)
+ {
+ if (type === "string")
+ {
+ return test_key_string(k, value);
+ }
+ else
+ {
+ return test_key_arr(k, value);
+ }
+ }
+
+ function test_key_string(k, value)
+ {
+ return (value.indexOf(k) > -1);
+ }
+
+ function test_key_arr(k, value)
+ {
+ for (var i = 0; i < k.length; i++) {
+ var test = value.indexOf(k[i]);
+ if (test === -1) {
+ return false;
+ }
+ }
+ return true;
+ }
+
+ function select_element(el)
+ {
+ if (options.hideElement === "grandparent")
+ {
+ return $(el).parent().parent();
+ }
+ else if (options.hideElement === "parent")
+ {
+ return $(el).parent();
+ }
+ else
+ {
+ return $(el);
+ }
+ }
+
+ function stripe(el)
+ {
+ if (doStripe)
+ {
+ var i = 0;
+ select_element(el).filter(':visible').each(function () {
+
+ for (var j = 0; j < stripeRowLength; j++)
+ {
+ if (i === j)
+ {
+ $(this).addClass(options.stripeRowClass[i]);
+
+ }
+ else
+ {
+ $(this).removeClass(options.stripeRowClass[j]);
+ }
+ }
+ i = (i + 1) % stripeRowLength;
+ });
+ }
+ }
+
+ function fix_widths(el)
+ {
+ $(el).find('td').each(function () {
+ $(this).attr('width', parseInt($(this).css('width')));
+ });
+ }
+
+ function loader(o) {
+ if (options.loaderId)
+ {
+ var l = $('input[rel="' + options.randomElement + '"]').parent().find('.loader');
+ if (o === 'hide')
+ {
+ l.hide();
+ }
+ else
+ {
+ l.show();
+ }
+ }
+ }
+
+ function place_form() {
+ var formPosition = options.position;
+ var formAttached = options.attached;
+
+ if (formPosition === 'before') {
+ $(formAttached).before(make_form());
+ } else if (formPosition === 'prepend') {
+ $(formAttached).prepend(make_form());
+ } else if (formPosition === 'append') {
+ $(formAttached).append(make_form());
+ } else {
+ $(formAttached).after(make_form());
+ }
+ }
+
+ function make_form_label()
+ {
+ if (!is_empty(options.labelText)) {
+ return '<label for="' + options.randomElement + '" '+
+ 'class="' + options.labelClass + '">'
+ + options.labelText
+ + '</label> ';
+ }
+ return '';
+ }
+
+ function make_form_input()
+ {
+ var val = (!is_empty(options.inputText)) ? options.inputText : ""
+ return '<input type="text" value="' + val + '" rel="' + options.randomElement + '" class="' + options.inputClass + '" id="' + options.randomElement + '" /> ';
+ }
+
+ function make_form_loader()
+ {
+ if (!is_empty(options.loaderImg)) {
+ return '<img src="' + options.loaderImg + '" alt="Loading" id="' + options.loaderId + '" class="' + options.loaderClass + '" />';
+ } else {
+ return '<span id="' + options.loaderId + '" class="' + options.loaderClass + '">' + options.loaderText + '</span>';
+ }
+ }
+
+ function make_form()
+ {
+ var f = (!options.isFieldset) ? 'form' : 'fieldset';
+ /*return '<' + f + ' action="#" ' + 'id="'+ options.formId + '" ' + 'class="quicksearch">' +
+ make_form_label() + make_form_input() + make_form_loader() +
+ '</' + f + '>';*/
+ return make_form_label() + make_form_input() + make_form_loader()
+ }
+
+ function focus_on_load()
+ {
+ $('input[rel="' + options.randomElement + '"]').get(0).focus();
+ }
+
+ function toggle_text() {
+ $('input[rel="' + options.randomElement + '"]').focus(function () {
+ if ($(this).val() === options.inputText) {
+ $(this).val('');
+ }
+ });
+ $('input[rel="' + options.randomElement + '"]').blur(function () {
+ if ($(this).val() === "") {
+ $(this).val(options.inputText);
+ }
+ });
+ }
+
+ function get_cache(el)
+ {
+ return $(el).map(function(){
+ return strip_html(this.innerHTML);
+ });
+ }
+
+ function init()
+ {
+ place_form();
+ if (options.fixWidths) fix_widths(el);
+ if (options.focusOnLoad) focus_on_load();
+ if (options.inputText != "" && options.inputText != null) toggle_text();
+
+ cache = get_cache(el);
+
+ stripe(el);
+ loader('hide');
+ }
+
+ function qs()
+ {
+ clearTimeout(timeout);
+ timeout = setTimeout(function () {
+
+ loader('show');
+
+ setTimeout(function () {
+ options.onBefore();
+
+ var k = get_key();
+ var k_type = (typeof k);
+ var i = 0;
+
+ k = options.filter(k);
+
+ if (k != "")
+ {
+ if (typeof score[k] === "undefined")
+ {
+ score[k] = new Array();
+ cache.each(function (i) {
+ if (test_key(k, cache[i], k_type))
+ {
+ score[k][i] = true;
+ }
+ });
+ }
+
+ if (score[k].length === 0)
+ {
+ select_element(el).hide();
+ }
+ else
+ {
+ /*console.log(score[k].length);
+ if(score[k].length==1)
+ {
+ //$(el).parents('ul').find('li:visible:eq(0) a').addClass('selected');
+ }
+ else
+ {
+ //$(el).parents('ul').find('li:visible:eq(0) a').removeClass('selected')
+ }*/
+
+ $(el).each(function (i) {
+ if (score[k][i])
+ {
+ select_element(this).show();
+ }
+ else
+ {
+ select_element(this).hide();
+ }
+ }
+ );
+
+ if($(el).parents('ul').find('li:visible').length==1)
+ $(el).parents('ul').find('li:visible:eq(0) a').addClass('selected');
+ else
+ $(el).parents('ul').find('li:visible:eq(0) a').removeClass('selected');
+
+ }
+ }
+ else
+ {
+ select_element(el).show();
+ }
+
+ stripe(el);
+ }, options.delay/2);
+
+ setTimeout( function () {
+ loader('hide');
+ }, options.delay/2);
+
+ options.onAfter();
+
+ }, options.delay/2);
+ }
+
+ var options = $.extend({
+ position: 'prepend',
+ attached: 'body',
+ formId: 'quicksearch',
+ labelText: 'Quick Search',
+ labelClass: 'qs_label',
+ inputText: null,
+ inputClass: 'qs_input',
+ loaderId: 'loader',
+ loaderClass: 'loader',
+ loaderImg: null,
+ loaderText: 'Loading...',
+ stripeRowClass: null,
+ hideElement: null,
+ delay: 500,
+ focusOnLoad: false,
+ onBefore: function () { },
+ onAfter: function () { },
+ filter: function (i) {
+ return i;
+ },
+ randomElement: 'qs' + Math.floor(Math.random() * 1000000),
+ isFieldset: false,
+ fixWidths: false
+ }, opt);
+
+ var timeout;
+ var score = {};
+ var stripeRowLength = (!is_empty(options.stripeRowClass)) ? options.stripeRowClass.length : 0;
+ var doStripe = (stripeRowLength > 0) ? true : false;
+ var el = this;
+ var cache;
+ var selector = $(this).selector;
+
+ $.fn.extend({
+ reset_cache: function () {
+ el = $(selector);
+ cache = get_cache(el);
+ }
+ });
+
+ init();
+
+ $('input[rel="' + options.randomElement + '"]').keydown(function (e) {
+ var keycode = e.keyCode;
+ if (!(keycode === 9 || keycode === 13 || keycode === 16 || keycode === 17 || keycode === 18 || keycode === 38 || keycode === 40 || keycode === 224))
+ {
+ qs();
+ }
+ });
+
+ //$('#quicksearch').submit( function () { addTag()});
+
+ return this;
+ };
+});
\ No newline at end of file diff --git a/views/default/object/image.php b/views/default/object/image.php index 3aa9bab8e..e4401a950 100644 --- a/views/default/object/image.php +++ b/views/default/object/image.php @@ -81,16 +81,147 @@ echo '<div id="tidypics_desc">' . autop($desc) . '</div>'; echo '<div id="tidypics_image_full">'; echo '<div id="tidypics_image_nav">' . $back . $next . '</div>'; - if ($next) echo '<a href="' . $vars['url'] . 'pg/photos/view/' . $_SESSION['image_sort'][$current+1] . '">'; - echo '<img src="' . $vars['url'] . 'mod/tidypics/thumbnail.php?file_guid=' . $file_guid . '&size=large" border="0" alt="' . $title . '"/>'; - if ($next) echo '</a>'; - echo '</div>'; ?> - <div id="tidypics_controls"> -<div class="tidypics_download"><p><a href="<?php echo $vars['url']; ?>action/tidypics/download?file_guid=<?php echo $file_guid; ?>"><?php echo elgg_echo("image:download"); ?></a></p></div> - </div> +<div id='tagging_instructions'> + <table> + <tbody> + <tr> + <td width='375' align='center'><div id='instructions_default_message'><?php echo elgg_echo('image:doclickfortag'); ?></div></td> + <td valign='middle'><button class='submit_button' onclick='closeInfoTag()'><?php echo elgg_echo('image:finish_tagging'); ?></button></td> + </tr> + </tbody> + </table> +</div> + +<?php + $viewer = get_loggedin_user(); + $friends = get_entities_from_relationship('friend', $viewer->getGUID(), false, 'user', '', 0); - <div id="tidypics_info"> +?> +<div id='cont-image'> + <div id="cont-menu"> +<?php + $content = "<input type='hidden' name='entity_guid' value='$file_guid' />"; + $content .= "<ul id='phototagging-menu'>"; + $content .= "<li class='owner'><a href='#' rel='{$viewer->getGUID()}'> {$viewer->name} (" . elgg_echo('me') . ")</a></li>"; + + if($friends) foreach($friends as $friend) + { + $content .= "<li><a href='#' rel='{$friend->getGUID()}'>{$friend->name}</a></li>"; + } + + $content .= "</ul>"; + + $content .= " + <fieldset> + <button class='submit_button' type='submit'>" . elgg_echo('image:actiontag') . "</button> + </fieldset>"; + + echo elgg_view('input/form', array('internalid' => 'quicksearch', 'internalname' => 'form-phototagging', 'class' => 'quicksearch', 'action' => "{$vars['url']}action/tidypics/phototagging", 'body' => $content)) +?> + </div> +<?php + $photo_tags = get_annotations($file_guid,'object','image','phototag'); + +if ($photo_tags) foreach ($photo_tags as $photo_tag) +{ + $data_tag = unserialize($photo_tag->value); + + + if($data_tag->type == 'user') + $data_tag->data = get_entity($data_tag->value); + else + $data_tag->data = $data_tag->value; + + echo "<div class='phototag' rel='{$photo_tag->id}' style='margin-left:{$data_tag->x1}px; margin-top:{$data_tag->y1}px; width:{$data_tag->width}px;'>"; + if($data_tag->type == 'user') + echo "<em>{$data_tag->data->name}</em>"; + else + echo "<em>{$data_tag->data}</em>"; + echo "<span style='width:" . ((int)$data_tag->width - 2) . "px; height:" . ((int)$data_tag->height - 2) . "px;'></span>"; + echo "</div>"; +}else +{ + echo "<div class='phototag'></div>"; +} + + if ($next) + $click = "onclick='toggleLink()'"; + + echo '<img ' . $click . ' src="' . $vars['url'] . 'mod/tidypics/thumbnail.php?file_guid=' . $file_guid . '&size=large" border="0" alt="' . $title . '"/>'; + +?> +</div> + +</div> + +<div id="tidypics_controls"> +<ul> + <li><a href="javascript:void(0)" onclick="showInfoTag()"><?= elgg_echo('image:tagthisphoto') ?></a></li> + <li><a href="<?php echo $vars['url']; ?>action/tidypics/download?file_guid=<?php echo $file_guid; ?>"><?php echo elgg_echo("image:download"); ?></a></li> +</ul> +</div> + +<?php + $photo_tags = get_annotations($entity_guid,'object','image','phototag','',0,20,0); + + if ($photo_tags) + { +?> + <div id="tidypics_phototags"> + <h3> <?= elgg_echo('image:inthisphoto') ?></h3> + <ul> +<?php + $users = array(); + $objects = array(); + + if ($photo_tags) foreach ($photo_tags as $photo_tag) + { + $data_tag = unserialize($photo_tag->value); + + $name = ""; + + $object = new stdClass(); + + if($data_tag->type == 'user') + { + $data_tag->data = get_entity($data_tag->value); + $object->img = elgg_view("profile/icon",array('entity' => $data_tag->data, 'size' => 'topbar', 'override' => true)); + $object->name = $data_tag->data->name; + $object->rel = $data_tag->data->getUrl(); + }else + { + $data_tag->data = $data_tag->value; + $object->img = "<img border='0' title='object' src='{$vars['url']}mod/tidypics/graphics/tag_yellow.png' />"; + $object->name = $data_tag->data; + $object->rel = "#"; + } + + $object->html = "<li><a class='phototag-links' href='{$object->rel}' rel='{$photo_tag->id}'>$object->img<span>{$object->name}</span></a></li>"; + + if($data_tag->type == 'user') + $users[] = $object; + + else + $objects[] = $object; + } + + if(!empty($users)) foreach ($users as $user) + echo $user->html; + + if(!empty($objects)) foreach ($objects as $object) + echo $object->html; + +?> + </ul> + </div> +<?php + } + +?> + + +<div id="tidypics_info"> <?php if (!is_null($tags)) { ?> @@ -107,4 +238,164 @@ } } // end of tidypics image display -?>
\ No newline at end of file +?> + <script type="text/javascript" src="<?= $vars['url'] ?>/mod/tidypics/vendors/jquery.imgareaselect-0.6.2.js"></script> + <script type="text/javascript" src="<?= $vars['url'] ?>/mod/tidypics/vendors/jquery.quicksearch.js"></script> + + <script type="text/javascript"> + + var coordinates; + + jQuery(document).ready(function(){ + + jQuery('#cont-menu ul li').quicksearch({ + position: 'before', + attached: '#cont-menu ul', + loaderText: '', + inputClass: 'input-filtro', + labelText:"<p><?= elgg_echo('image:inserttag') ?></p>", + delay: 100 + }) + + jQuery('#cont-menu ul').before("<p> o escoge a una persona:</p>"); + + //avoid submit + jQuery('#quicksearch').submit( function () { addTag()}); + + + setTimeout("fixContImage()",1000); + + //fix position + jQuery('#cont-image .phototag em').height() + + //Este evento lo que hace es que cuando hace foco en el input se desmarcan todos + jQuery('.input-filtro').focus(function(){jQuery("#cont-menu li a[class*='selected']").removeClass('selected');}) + + }); + + + jQuery('#cont-menu li a').click(function(){ + //Limpiamos todos + jQuery("#cont-menu li a[class*='selected']").removeClass('selected'); + + jQuery(this).toggleClass('selected'); + }) + + + + + + var sUrl = "<?= $vars['url'] . 'pg/photos/view/' . $_SESSION['image_sort'][$current+1] ?>"; + + function toggleLink() + { + if(jQuery('#tagging_instructions:hidden').length) + location.href = sUrl; + } + + function showInfoTag() + { + if(jQuery('#tagging_instructions:hidden').length) + { + jQuery('#tagging_instructions').show(); + activeTagSystem(); + } + } + + function closeInfoTag() + { + jQuery('#tagging_instructions').hide(); + jQuery('div[class*=imgareaselect]').remove(); + jQuery('#cont-menu').hide(); + jQuery('#cont-image img').unbind('mousedown'); + } + + function activeTagSystem() + { + jQuery('#image_full img').imgAreaSelect({selectionColor: 'white', + maxWidth: 200, + maxHeight: 200, + minWidth: 60, + minHeight: 60, + borderWidth: 2, + onSelectEnd: mostrarMenu, + onSelectStart: ocultarMenu}); + } + + function ocultarMenu() + { + jQuery('#cont-menu').hide(); + coordinates = ""; + } + + function mostrarMenu(oObject, oCoordenates) + { + constX = -70; + constY = 1; + //console.log(oCoordenates); + //Mostramos el menu + if (oCoordenates.width != 0 && oCoordenates.height != 0) { + coordinates = oCoordenates; + jQuery('#cont-menu').show().css({ + "margin-top": oCoordenates.y2+constY + "px", + "margin-left": oCoordenates.x2+constX + "px" + }); + jQuery(".input-filtro").focus(); + } + } + + function addTag() + { + jQuery('#phototagging-menu li:hidden').find('a').removeClass('selected'); + oForm = jQuery('#quicksearch'); + oEl = jQuery('#quicksearch ul li:has(.selected)'); + if(jQuery('#quicksearch ul li:has(.selected)').length == 1) + oForm.append("<input type='hidden' name='user_id' value='" + oEl.find('a').attr('rel') + "'") + else + oForm.append("<input type='hidden' name='word' value='" + oForm.find('input.input-filtro').val() + "'") + + if(coordinates.x1!=0) + { + sStr = ""; + for (x in coordinates) + sStr += x + ':' + coordinates[x] + '/'; + + oForm.append("<input type='hidden' name='coordinates' value='" + sStr + "' />"); + + } + + //Show loading + jQuery("#cont-menu label, #cont-menu input, #cont-menu p, #cont-menu span, #cont-menu button, #cont-menu ul, #cont-menu fieldset").hide(); + jQuery("#cont-menu ").append('<div align="center" class="ajax_loader"></div>'); + + + return false; + //oForm.submit(); + + } + + jQuery(".phototag span").hover(function() { + jQuery(this).prev("em").stop(true, true).animate({opacity: "show"}, "fast").css({'display':'block','-moz-border-radius-topleft':'2px','-moz-border-radius-topright':'2px','-moz-border-radius-bottomleft':'2px','-moz-border-radius-bottomright':'2px'}); + }, function() { + jQuery(this).prev("em").animate({opacity: "hide"}, "fast"); + }); + + function fixContImage() + { + jQuery('#cont-image').width(jQuery('#cont-image img').width()); + jQuery('#cont-image').height(jQuery('#cont-image img').height()); + setTimeout("if(jQuery('#cont-image').width() < jQuery('#cont-image img').width()) setTimeout(\"fixContImage()\",500);",300); + } + + jQuery('a.phototag-links').hover(function() { + iRel = jQuery(this).attr('rel'); + jQuery('div.phototag[rel*='+ iRel + ']').find("em").stop(true, true).animate({opacity: "show"}, "fast").css({'display':'block','-moz-border-radius-topleft':'2px','-moz-border-radius-topright':'2px','-moz-border-radius-bottomleft':'0px','-moz-border-radius-bottomright':'0px'}); + jQuery('div.phototag[rel*='+ iRel + ']').find("span").css({'border':'1px solid white','border-top':'none'} ); + }, function() { + iRel = jQuery(this).attr('rel'); + jQuery('div.phototag[rel*='+ iRel + ']').find("em").animate({opacity: "hide"}, "fast"); + jQuery('div.phototag[rel*='+ iRel + ']').find("span").css("border","none"); + + }); + + </script>
\ No newline at end of file diff --git a/views/default/tidypics/css.php b/views/default/tidypics/css.php index 6559ec5be..0f5b8baeb 100644 --- a/views/default/tidypics/css.php +++ b/views/default/tidypics/css.php @@ -23,6 +23,18 @@ margin-bottom:10px; margin:10px; } +#tidypics_controls ul { +list-style:none; +margin:0px; +padding:8px; +} + +#tidypics_controls ul li { +padding:2px 10px 2px 22px; +margin:2px 0px; +display:inline; +} +/* .tidypics_download a { font:12px/100% Arial, Helvetica, sans-serif; font-weight:bold; @@ -43,7 +55,7 @@ background:#0054a7; color:white; text-decoration:none; } - +*/ .tidypics_album_images { float:left; width:153px; @@ -147,4 +159,33 @@ padding:0 0 5px; } .river_object_album_comment { background: url(<?php echo $vars['url']; ?>_graphics/river_icons/river_icon_comment.gif) no-repeat left -1px; +} + +/* ----------- tagging ---------------- */ +#tagging_instructions { +background:#FFFBE2 none repeat scroll 0 0; +border:1px solid #FFE222; +margin:10px; +padding:10px; +display:none; +} + +#cont-image { +margin:0px auto; +background:white none repeat scroll 0 0; +border:1px solid #DDDDDD; +padding:10px; +overflow:hidden; +} + +#cont-menu { +border:1px solid #3B5999; +width:200px; +position:absolute; +z-index:10000; +display:none; +background:#fff; +padding:5px; +font-size:12px; +text-align:left; }
\ No newline at end of file |