aboutsummaryrefslogtreecommitdiff
path: root/views/default/object
diff options
context:
space:
mode:
authorCash Costello <cash.costello@gmail.com>2009-04-01 12:00:19 +0000
committerCash Costello <cash.costello@gmail.com>2009-04-01 12:00:19 +0000
commit74f7d6c4109851a83a2310900ac15e29e4254aea (patch)
tree0f093296a77674eb59d0365514c0d2ba2b541baa /views/default/object
parent37349d19e336a5d60578969ba156e45e707c40cf (diff)
downloadelgg-74f7d6c4109851a83a2310900ac15e29e4254aea.tar.gz
elgg-74f7d6c4109851a83a2310900ac15e29e4254aea.tar.bz2
The first part of Pedro's tagging code
Diffstat (limited to 'views/default/object')
-rw-r--r--views/default/object/image.php309
1 files changed, 300 insertions, 9 deletions
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