aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--views/default/js/tidypics.php244
-rw-r--r--views/default/object/image.php243
2 files changed, 246 insertions, 241 deletions
diff --git a/views/default/js/tidypics.php b/views/default/js/tidypics.php
new file mode 100644
index 000000000..22815aa5a
--- /dev/null
+++ b/views/default/js/tidypics.php
@@ -0,0 +1,244 @@
+<?php
+ $photo_tags_json = $vars['photo_tags_json'];
+?>
+<script type="text/javascript" src="<?= $vars['url'] ?>mod/tidypics/vendors/jquery.imgareaselect-0.7.js"></script>
+<script type="text/javascript" src="<?= $vars['url'] ?>mod/tidypics/vendors/jquery.quicksearch.js"></script>
+
+<script type="text/javascript">
+
+ var coordinates = "";
+ var user_id = 0;
+ var tagging = 0;
+
+ // add to DOM as soon as ready
+ $(document).ready(function () {
+ $('ul#phototagging-menu li').quicksearch({
+ position: 'before',
+ attached: 'ul#phototagging-menu',
+ loaderText: '',
+ inputClass: 'input-filter',
+ labelText: "<p>Insert tag</p>",
+ delay: 100
+ });
+
+ $('#quicksearch').submit( function () { addTag() } );
+ }
+ );
+
+ // images are loaded so process tags
+ $(window).load(function () {
+ $('#tidypics_image').setupTags();
+ }
+ );
+
+ // get tags over image ready for mouseover
+ $.fn.setupTags = function()
+ {
+
+ image = this;
+
+ imgOffset = $(image).offset();
+
+ tags = <?php echo $photo_tags_json; ?>;
+
+ $(tags).each(function(){
+ appendTag(imgOffset, this);
+ });
+
+ $(image).hover(
+ function(){
+ $('.tidypics_tag').show();
+ },
+ function(){
+ $('.tidypics_tag').hide();
+ }
+ );
+
+ addTagEvents();
+
+ $('.phototag-links').hover(
+ function(){
+ code = this.id.substr(7); // cut off taglink to get unique id
+ $('#tag'+code).show();
+ },
+ function(){
+ code = this.id.substr(7);
+ $('#tag'+code).hide();
+ }
+ );
+
+ // make sure we catch and handle when the browser is resized
+ $(window).resize(function () {
+ $('.tidypics_tag').remove();
+
+ imgOffset = $(image).offset();
+
+ $(tags).each(function(){
+ appendTag(imgOffset, this);
+ });
+
+ addTagEvents();
+ });
+ }
+
+ function appendTag(offset, tag)
+ {
+ tag_top = parseInt(imgOffset.top) + parseInt(tag.y1);
+ tag_left = parseInt(imgOffset.left) + parseInt(tag.x1);
+
+ tag_div = $('<div class="tidypics_tag" id="tag'+tag.id+'"></div>').css({ left: tag_left + 'px', top: tag_top + 'px', width: tag.width + 'px', height: tag.height + 'px' });
+
+ tag_text_div = $('<div class="tidypics_tag_text">'+tag.text+'</div>').css({ left: tag_left + 'px', top: tag_top + 'px', width: tag.width + 'px', height: 20 + 'px' });
+
+ $('body').append(tag_div);
+ $('body').append(tag_text_div);
+ }
+
+ function addTagEvents()
+ {
+ $('.tidypics_tag').hover(
+ function(){
+ $('.tidypics_tag').show();
+ $(this).next('.tidypics_tag_text').show();
+ $(this).next('.tidypics_tag_text').css("z-index", 10000);
+ },
+ function(){
+ $('.tidypics_tag').show();
+ $(this).next('.tidypics_tag_text').hide();
+ $(this).next('.tidypics_tag_text').css("z-index", 0);
+ }
+ );
+ }
+
+
+ function selectUser(id, name)
+ {
+ user_id = id;
+ $("input.input-filter").val(name);
+ }
+
+ function startTagging()
+ {
+ if (tagging != 0)
+ {
+ stopTagging();
+ return;
+ }
+
+ tagging = 1;
+
+ $('#tag_control').text("Stop Tagging");
+
+ showTagInstruct();
+
+
+ $('#tidypics_image').hover(
+ function(){
+ $('.tidypics_tag').hide();
+ },
+ function(){
+ $('.tidypics_tag').hide();
+ }
+ );
+
+ $('img#tidypics_image').imgAreaSelect( {
+ borderWidth: 2,
+ borderColor1: 'white',
+ borderColor2: 'white',
+ disable: false,
+ hide: false,
+ onSelectEnd: showTagMenu,
+ onSelectStart: hideTagMenu
+ }
+ );
+ }
+
+ function stopTagging()
+ {
+ tagging = 0;
+
+ hideTagInstruct();
+ hideTagMenu();
+
+ $('#tag_control').text("Tag this photo");
+
+ $('img#tidypics_image').imgAreaSelect( {hide: true, disable: true} );
+
+ // restart tag hovering
+ $('#tidypics_image').hover(
+ function(){
+ $('.tidypics_tag').show();
+ },
+ function(){
+ $('.tidypics_tag').hide();
+ }
+ );
+ }
+
+ function showTagMenu(oObject, oCoordenates)
+ {
+ offsetX = -100;
+
+ imgOffset = $('#tidypics_image').offset();
+
+ // show the list of friends
+ if (oCoordenates.width != 0 && oCoordenates.height != 0) {
+ coordinates = oCoordenates;
+
+ top = imgOffset.top + oCoordenates.y2;
+ left = imgOffset.left + oCoordenates.x2 + offsetX;
+
+ $('#tag_menu').show().css({
+ "top": top + "px",
+ "left": left + "px"
+ });
+
+ $(".input-filter").focus();
+ }
+ }
+
+
+ function hideTagMenu()
+ {
+ $('#tag_menu').hide();
+ }
+
+ function showTagInstruct()
+ {
+ offsetY = -60;
+
+ imgOffset = $('#tidypics_image').offset();
+ imgWidth = $('#tidypics_image').width();
+
+ top = imgOffset.top + offsetY;
+ left = imgOffset.left;
+
+ $('#tagging_instructions').show().css({
+ "top": top + "px",
+ "left": left + "px"
+ });
+ }
+
+ function hideTagInstruct()
+ {
+ $('#tagging_instructions').hide();
+ }
+
+ function addTag()
+ {
+ // do I need a catch for no tag?
+
+ $("input#user_id").val(user_id);
+ $("input#word").val( $("input.input-filter").val() );
+
+ coord_string = '"x1":"' + coordinates.x1 + '",';
+ coord_string += '"y1":"' + coordinates.y1 + '",';
+ coord_string += '"width":"' + coordinates.width + '",';
+ coord_string += '"height":"' + coordinates.height + '"';
+
+ $("input#coordinates").val(coord_string);
+
+ //Show loading
+ //$("#tag_menu").replaceWith('<div align="center" class="ajax_loader"></div>');
+ }
+</script> \ No newline at end of file
diff --git a/views/default/object/image.php b/views/default/object/image.php
index 81e25f915..ec87aa248 100644
--- a/views/default/object/image.php
+++ b/views/default/object/image.php
@@ -204,6 +204,8 @@ if ($photo_tags) {
<?php
+ echo elgg_view('js/tidypics', array('photo_tags_json' => $photo_tags_json,) );
+
} // // end of individual image display
}
@@ -211,244 +213,3 @@ if ($photo_tags) {
?>
-<script type="text/javascript" src="<?= $vars['url'] ?>mod/tidypics/vendors/jquery.imgareaselect-0.7.js"></script>
-<script type="text/javascript" src="<?= $vars['url'] ?>mod/tidypics/vendors/jquery.quicksearch.js"></script>
-
-<script type="text/javascript">
-
- var coordinates = "";
- var user_id = 0;
- var tagging = 0;
-
- // add to DOM as soon as ready
- $(document).ready(function () {
- $('ul#phototagging-menu li').quicksearch({
- position: 'before',
- attached: 'ul#phototagging-menu',
- loaderText: '',
- inputClass: 'input-filter',
- labelText: "<p>Insert tag</p>",
- delay: 100
- });
-
- $('#quicksearch').submit( function () { addTag() } );
- }
- );
-
- // images are loaded so process tags
- $(window).load(function () {
- $('#tidypics_image').setupTags();
- }
- );
-
- // get tags over image ready for mouseover
- $.fn.setupTags = function()
- {
-
- image = this;
-
- imgOffset = $(image).offset();
-
- tags = <?php echo $photo_tags_json; ?>;
-
- $(tags).each(function(){
- appendTag(imgOffset, this);
- });
-
- $(image).hover(
- function(){
- $('.tidypics_tag').show();
- },
- function(){
- $('.tidypics_tag').hide();
- }
- );
-
- addTagEvents();
-
- $('.phototag-links').hover(
- function(){
- code = this.id.substr(7); // cut off taglink to get unique id
- $('#tag'+code).show();
- },
- function(){
- code = this.id.substr(7);
- $('#tag'+code).hide();
- }
- );
-
- // make sure we catch and handle when the browser is resized
- $(window).resize(function () {
- $('.tidypics_tag').remove();
-
- imgOffset = $(image).offset();
-
- $(tags).each(function(){
- appendTag(imgOffset, this);
- });
-
- addTagEvents();
- });
- }
-
- function appendTag(offset, tag)
- {
- tag_top = parseInt(imgOffset.top) + parseInt(tag.y1);
- tag_left = parseInt(imgOffset.left) + parseInt(tag.x1);
-
- tag_div = $('<div class="tidypics_tag" id="tag'+tag.id+'"></div>').css({ left: tag_left + 'px', top: tag_top + 'px', width: tag.width + 'px', height: tag.height + 'px' });
-
- tag_text_div = $('<div class="tidypics_tag_text">'+tag.text+'</div>').css({ left: tag_left + 'px', top: tag_top + 'px', width: tag.width + 'px', height: 20 + 'px' });
-
- $('body').append(tag_div);
- $('body').append(tag_text_div);
- }
-
- function addTagEvents()
- {
- $('.tidypics_tag').hover(
- function(){
- $('.tidypics_tag').show();
- $(this).next('.tidypics_tag_text').show();
- $(this).next('.tidypics_tag_text').css("z-index", 10000);
- },
- function(){
- $('.tidypics_tag').show();
- $(this).next('.tidypics_tag_text').hide();
- $(this).next('.tidypics_tag_text').css("z-index", 0);
- }
- );
- }
-
-
- function selectUser(id, name)
- {
- user_id = id;
- $("input.input-filter").val(name);
- }
-
- function startTagging()
- {
- if (tagging != 0)
- {
- stopTagging();
- return;
- }
-
- tagging = 1;
-
- $('#tag_control').text("Stop Tagging");
-
- showTagInstruct();
-
-
- $('#tidypics_image').hover(
- function(){
- $('.tidypics_tag').hide();
- },
- function(){
- $('.tidypics_tag').hide();
- }
- );
-
- $('img#tidypics_image').imgAreaSelect( {
- borderWidth: 2,
- borderColor1: 'white',
- borderColor2: 'white',
- disable: false,
- hide: false,
- onSelectEnd: showTagMenu,
- onSelectStart: hideTagMenu
- }
- );
- }
-
- function stopTagging()
- {
- tagging = 0;
-
- hideTagInstruct();
- hideTagMenu();
-
- $('#tag_control').text("Tag this photo");
-
- $('img#tidypics_image').imgAreaSelect( {hide: true, disable: true} );
-
- // restart tag hovering
- $('#tidypics_image').hover(
- function(){
- $('.tidypics_tag').show();
- },
- function(){
- $('.tidypics_tag').hide();
- }
- );
- }
-
- function showTagMenu(oObject, oCoordenates)
- {
- offsetX = -100;
-
- imgOffset = $('#tidypics_image').offset();
-
- // show the list of friends
- if (oCoordenates.width != 0 && oCoordenates.height != 0) {
- coordinates = oCoordenates;
-
- top = imgOffset.top + oCoordenates.y2;
- left = imgOffset.left + oCoordenates.x2 + offsetX;
-
- $('#tag_menu').show().css({
- "top": top + "px",
- "left": left + "px"
- });
-
- $(".input-filter").focus();
- }
- }
-
-
- function hideTagMenu()
- {
- $('#tag_menu').hide();
- }
-
- function showTagInstruct()
- {
- offsetY = -60;
-
- imgOffset = $('#tidypics_image').offset();
- imgWidth = $('#tidypics_image').width();
-
- top = imgOffset.top + offsetY;
- left = imgOffset.left;
-
- $('#tagging_instructions').show().css({
- "top": top + "px",
- "left": left + "px"
- });
- }
-
- function hideTagInstruct()
- {
- $('#tagging_instructions').hide();
- }
-
- function addTag()
- {
- // do I need a catch for no tag?
-
- $("input#user_id").val(user_id);
- $("input#word").val( $("input.input-filter").val() );
-
- coord_string = '"x1":"' + coordinates.x1 + '",';
- coord_string += '"y1":"' + coordinates.y1 + '",';
- coord_string += '"width":"' + coordinates.width + '",';
- coord_string += '"height":"' + coordinates.height + '"';
-
- $("input#coordinates").val(coord_string);
-
- //Show loading
- //$("#tag_menu").replaceWith('<div align="center" class="ajax_loader"></div>');
- }
-</script> \ No newline at end of file