diff --git a/data/System/TagMeAjaxHelper.txt b/data/System/TagMeAjaxHelper.txt index 8fe9932..d386d33 100644 --- a/data/System/TagMeAjaxHelper.txt +++ b/data/System/TagMeAjaxHelper.txt @@ -12,8 +12,8 @@ text=" - + " requires="JQUERYPLUGIN::TEXTBOXLIST, JQUERYPLUGIN::AUTOCOMPLETE, JQUERYPLUGIN::SIMPLEMODAL, JQUERYPLUGIN::HOVERINTENT, JQUERYPLUGIN::QUERYOBJECT" }%
  @@ -29,7 +29,6 @@ then="%MAKETEXT{"all webs"}%" else="%MAKETEXT{"[[[_1].WebHome][[_1]]] web" args="%URLPARAM{"tpweb"}%"}%" }% -
Screenshot of tags on a topic, style=blog
----++++ "ajax" option +---++++ "jqui" An experimental interactive user interface is also provided, implemented using the latest version of JQueryPlugin in TagMeAjaxHelper. +All features work without having to re-load the topic: + * Auto-complete tag names. Saves newly selected tags immediately + * If auto-complete fails to match the entered tag and the user submits + it, the tag is immediately created and applied + * Access tag cloud in a modal dialogue at the click of a button. Check-box + toggles are applied immediately (show cloud for just this web/all webs, + just my tags/all tags) + * Clicking a tag from the topic's tag list or tag cloud takes you to + the TagMeSearch topic, where the tag cloud will still be generated + from the originating web (avoids reliance on browser back button + when exploring a web via tag cloud) + Include it into your WebTopBar (See WebTopBarExample) or any part of your skin that has horizontal space to spare, as follows: %INCLUDE{"%SYSTEMWEB%.TagMeAjaxHelper" section="jqui"}% -
Screenshot of experimental jQuery UI
+
Screenshot of experimental jQuery UI
Dependencies: * JQueryPlugin - * =textboxlist= - * =simplemodal= - * =autocomplete= - * =hoverintent= + * [[JQueryTextboxList][textboxlist]] + * [[JQuerySimpleModal][simplemodal]] + * [[JQueryAutocomplete][autocomplete]] + * [[JQueryQueryObject][queryobject]] * FilterPlugin ---+++ Create, Rename, Delete tags @@ -361,25 +373,25 @@ topic. Use the standard preference setting topics, such as | Version: | %$VERSION% | | Release: | %$RELEASE% | | Change History: |   | -| 31 Jan 2010: | [[Main.PaulHarvey][Paul Harvey]]: Added an interactive user interface implemented with JQuery | +| 31 Jan 2010: | Foswiki:Main.PaulHarvey: Added an interactive user interface implemented with JQuery | | 11 Jun 2009: | Foswiki port, and moved settings out of this topic | -| 30 Aug 2008: | Colas Nahaboo: enhancements to the "blog" style: Bundles, count of known tags, option to delete tags | -| 28 Aug 2008: | Colas Nahaboo: prefix & suffix options renamed as header & footer. New parameter style to TAGME to be able to define different UI style for the default "show" action of TAGME. Implemented a first one, "blog" for the simpler case of authors managing the same tags | -| 26 Aug 2008: | Colas Nahaboo: prefix & suffix options to TAGME | -| 16 Oct 2007: | Arthur Clemens: added backward compatible example template. | +| 30 Aug 2008: | Foswiki:Main.ColasNahaboo: enhancements to the "blog" style: Bundles, count of known tags, option to delete tags | +| 28 Aug 2008: | Foswiki:Main.ColasNahaboo: prefix & suffix options renamed as header & footer. New parameter style to TAGME to be able to define different UI style for the default "show" action of TAGME. Implemented a first one, "blog" for the simpler case of authors managing the same tags | +| 26 Aug 2008: | Foswiki:Main.ColasNahaboo: prefix & suffix options to TAGME | +| 16 Oct 2007: | Foswiki:Main.ArthurClemens: added backward compatible example template. | | 26 Sep 2007: | Foswiki:Main.CrawfordCurrie Item4728 fixed incorrect cloud font sizes to reflect relative importance of tags actually being displayed | -| 11 Sep 2007: | Arthur Clemens: updated example template to TWiki template convention. | -| 11 Jun 2007: | Arthur Clemens: fixed sizing of tags with the same tag count; fixed CSS class for select box; updated documentation with "How to put tags on every page". | -| 07 Jun 2007: | Arthur Clemens: removed dependency on (unreleased) TWiki 4.2. | -| 21 May 2007: | TWiki:Main.WillNorris: added =view.tagme.tmpl= and updated installation instructions. | -| 30 Apr 2007: | Arthur Clemens: fixed calculation of sizes in tag cloud; if =mincount= is passed only the shown tags are calculated. | -| 18 Apr 2007: | Arthur Clemens: added permissions for rename and delete; added TagMeChangeRequests. | -| 17 Apr 2007: | TWiki:Main.CrawfordCurrie for [[http://www.escapestudios.co.uk/][Escape Studios]]: contributed support for incremental refinement of tag searches. | -| 12 Apr 2007: | TWiki:Main.CrawfordCurrie contributed ability to search for multiple tags. TWiki:Main.SvenDowideit for [[http://www.escapestudios.co.uk/][Escape Studios]]: added parameters needed for custom search result display. | -| 05 Apr 2007: | Arthur Clemens: The "topic tags" select box is now created with Javascript to prevent the tag options getting indexed by search engines. The former select box is used for noscript fallback. | -| 02 Apr 2007: | Arthur Clemens: Added "Delete Tag" interface. Added tabbed interface for Create, Rename, Delete tags. | -| 30 Mar 2007: | Arthur Clemens: Added "Rename Tag" interface. | -| 22 Mar 2007: | Arthur Clemens: Added option =NORMALIZE_TAG_INPUT= (to be set to 0) to allow any word as tag name (including upper case, punctuation characters and spaces). Moved "Create New Tag" to dedicated page. Created CSS styles in =tagme.css=. Added =mincount= parameter to =TAGME{tpaction="showalltags"}=. | +| 11 Sep 2007: | Foswiki:Main.ArthurClemens: updated example template to TWiki template convention. | +| 11 Jun 2007: | Foswiki:Main.ArthurClemens: fixed sizing of tags with the same tag count; fixed CSS class for select box; updated documentation with "How to put tags on every page". | +| 07 Jun 2007: | Foswiki:Main.ArthurClemens: removed dependency on (unreleased) TWiki 4.2. | +| 21 May 2007: | Foswiki:Main.WillNorris: added =view.tagme.tmpl= and updated installation instructions. | +| 30 Apr 2007: | Foswiki:Main.ArthurClemens: fixed calculation of sizes in tag cloud; if =mincount= is passed only the shown tags are calculated. | +| 18 Apr 2007: | Foswiki:Main.ArthurClemens: added permissions for rename and delete; added TagMeChangeRequests. | +| 17 Apr 2007: | Foswiki:Main.CrawfordCurrie for [[http://www.escapestudios.co.uk/][Escape Studios]]: contributed support for incremental refinement of tag searches. | +| 12 Apr 2007: | Foswiki:Main.CrawfordCurrie contributed ability to search for multiple tags. TWiki:Main.SvenDowideit for [[http://www.escapestudios.co.uk/][Escape Studios]]: added parameters needed for custom search result display. | +| 05 Apr 2007: | Foswiki:Main.ArthurClemens: The "topic tags" select box is now created with Javascript to prevent the tag options getting indexed by search engines. The former select box is used for noscript fallback. | +| 02 Apr 2007: | Foswiki:Main.ArthurClemens: Added "Delete Tag" interface. Added tabbed interface for Create, Rename, Delete tags. | +| 30 Mar 2007: | Foswiki:Main.ArthurClemens: Added "Rename Tag" interface. | +| 22 Mar 2007: | Foswiki:Main.ArthurClemens: Added option =NORMALIZE_TAG_INPUT= (to be set to 0) to allow any word as tag name (including upper case, punctuation characters and spaces). Moved "Create New Tag" to dedicated page. Created CSS styles in =tagme.css=. Added =mincount= parameter to =TAGME{tpaction="showalltags"}=. | | 14 Nov 2006: | Fix IE browser crash issue on print (forms can't be named "tags"; debug by TWiki:Main.KevinKalmbach) | | 14 Oct 2006: | Fix show default problem introduced by version 07 Oct 2006 (contributed by TWiki:Main.ChristianSuenkel) | | 07 Oct 2006: | nostatus="on" parameter for add/remove tag (contributed by TWiki:Main.FredMorris) | @@ -401,7 +413,7 @@ topic. Use the standard preference setting topics, such as __Related Topics:__ %SYSTEMWEB%.TagMeViewAllTags, %SYSTEMWEB%.TagMeViewMyTags, %SYSTEMWEB%.TagMeSearch, %SYSTEMWEB%.TagMeDebugViewTags, %SYSTEMWEB%.TagMeDebugSearch, %SYSTEMWEB%.TagMeAjaxHelper, [[%SYSTEMWEB%.Plugins][Plugins]], %SYSTEMWEB%.DeveloperDocumentationCategory, %SYSTEMWEB%.AdminDocumentationCategory, %SYSTEMWEB%.DefaultPreferences, %USERSWEB%.SitePreferences -%META:FILEATTACHMENT{name="jqui.png" attr="h" comment="Screenshot of experimental jQuery UI" date="1264982400" path="jqui.png" size="16289" user="ProjectContributor" version="1.1"}% +%META:FILEATTACHMENT{name="jquery.tagmeui.png" attr="h" comment="Screenshot of experimental jQuery UI" date="1264982400" path="jquery.tagmeui.png" size="16289" user="ProjectContributor" version="1.1"}% %META:FILEATTACHMENT{name="tag_add.gif" attr="h" comment="Button: add tag" date="1141691885" path="tag_add.gif" size="857" user="ProjectContributor" version="1.1"}% %META:FILEATTACHMENT{name="tag_remove.gif" attr="h" comment="Button: remove tag" date="1141697484" path="tag_remove.gif" size="862" user="ProjectContributor" version="1.1"}% %META:FILEATTACHMENT{name="alltagcloud.gif" attr="h" comment="Screenshot of view all tags tag cloud" date="1141693726" path="alltagcloud.gif" size="8087" user="ProjectContributor" version="1.1"}% diff --git a/pub/System/TagMeAjaxHelper/Makefile b/pub/System/TagMeAjaxHelper/Makefile new file mode 100644 index 0000000..f5c211a --- /dev/null +++ b/pub/System/TagMeAjaxHelper/Makefile @@ -0,0 +1,6 @@ +FOSWIKI_ROOT=~/foswiki/trunk/core +TARGET= \ + jquery.tagmeui.js \ + jquery.tagmeui.css + +-include $(FOSWIKI_ROOT)/pub/System/JQueryPlugin/Makefile.include diff --git a/pub/System/TagMeAjaxHelper/jquery.tagmeui.css b/pub/System/TagMeAjaxHelper/jquery.tagmeui.css new file mode 100644 index 0000000..d433f96 --- /dev/null +++ b/pub/System/TagMeAjaxHelper/jquery.tagmeui.css @@ -0,0 +1 @@ +#tagmeTagCloud{padding-top:1em;}#tagmejqtagstatus, #tagmejqtag{float:left;}#tagmejqtag{text-decoration:underline;}#tagmejqtag:hover{color:#C0FFC0;background-color:#778899;cursor:pointer;}#tagmejqtagstatus{width:16px;}#tagmejqtagstatus.spinning{background-image:url('spinner.gif');background-repeat:no-repeat;}#tagmejqtag.spinning{background-image:url('cloudspinner.gif');}#tagmejqtag{background-image:url('tag.png');background-position:right;background-repeat:no-repeat;padding-right:16px;margin-right:0.5em;} diff --git a/pub/System/TagMeAjaxHelper/jquery.tagmeui.css.gz b/pub/System/TagMeAjaxHelper/jquery.tagmeui.css.gz new file mode 100644 index 0000000..89a45fc Binary files /dev/null and b/pub/System/TagMeAjaxHelper/jquery.tagmeui.css.gz differ diff --git a/pub/System/TagMeAjaxHelper/jquery.tagmeui.js b/pub/System/TagMeAjaxHelper/jquery.tagmeui.js new file mode 100644 index 0000000..23eee2d --- /dev/null +++ b/pub/System/TagMeAjaxHelper/jquery.tagmeui.js @@ -0,0 +1,17 @@ +'use strict';jQuery(document).ready(function(){(function($){$.fn.tagmeui=function(options){$(this).each(function(){var tagmeui=new TagMeUI($(this),options);tagmeui.initTagField();});return this;};function TagMeUI(caller,options){var that=this;this.caller=caller;this.urlQuery=$.query;this.cloudQuery=this.urlQuery.copy();this.cloudQuery.SET('skin','text');this.cloudQuery.SET('contenttype','text/plain');this.cloudQuery.SET('section','cloud');this.tags=foswiki.TagMePlugin.jquitags.split(',');if(!this.cloudQuery.get('qcallingweb')){this.cloudQuery.SET('qcallingweb',foswiki.web);} +this.settings={cloudSpinner:'#tagmejqtag',cloudContainer:'#tagmejqcloud',cloudWeb:(function(){var web=that.cloudQuery.get('qcallingweb');if(!web){web=foswiki.web;} +if(!that.cloudQuery.get('tpweb')){that.cloudQuery.SET('tpweb',web);} +return web;}()),cloudGetUrl:foswiki.scriptUrlPath+'/view/'+ +foswiki.systemWebName+'/TagMeAjaxHelper',cloudUiJustThisWeb:'#tagmeCheckboxJustThisWeb',cloudUiJustMe:'#tagmeCheckboxJustMe',cloudModalOpts:{opacity:7,position:['50px',null],maxWidth:(document.width-50),persist:true,onShow:function(){$('#simplemodal-overlay').click(function(){$.modal.close();});}},taglistSpinner:'#tagmejqtagstatus',taglistContainer:'#tagmejqcontainer',taglistInputField:'#tagmejqinputfield',tagLinkUrl:foswiki.scriptUrlPath+'/view/'+ +foswiki.systemWebName+'/TagMeSearch',tagLinkTitle:'Other topics with this tag',tagPostUrl:foswiki.scriptUrlPath+'/viewauth/'+foswiki.web+ +'/'+foswiki.topic,autocompleteUrl:foswiki.scriptUrlPath+'/view/'+ +foswiki.systemWebName+'/TagMeAjaxHelper',autocompleteOpts:{extraParams:{section:'tagquery',contenttype:'text/plain',skin:'text'},autoFill:true,matchCase:false,multiple:false,max:0,mustMatch:false}};$.extend(this.settings,options);} +TagMeUI.prototype.actOnMissingTag=function(tagName,inList,action,finishHandler){var didModify=false,that=this;if($.inArray(tagName,inList)===-1){$(this.settings.taglistSpinner).addClass('spinning');$.post(this.settings.postUrl,{tpaction:action,tptag:tagName,contenttype:'text/plain',skin:'tagmejquiajax'},function(data){that.linkifyTagText(that.settings.taglistContainer);$(that.settings.taglistSpinner).removeClass('spinning');finishHandler(tagName);});didModify=true;} +return didModify;};TagMeUI.prototype.linkifyTagText=function(selector){var that=this;$(selector+' > form > div.jqTextboxListContainer > span:not(.linkified)').each(function(index,tagSpan){var tagQuery=$.query.copy(),theTag=$(tagSpan).text();function removeTextNodes(element){$(element).contents().filter(function(){if(this.nodeType===Node.TEXT_NODE){this.textContent='';}});return;} +tagQuery.SET('tag',theTag);tagQuery.SET('qcallingweb',foswiki.web);removeTextNodes(tagSpan);$(tagSpan).append(''+theTag+'');$(tagSpan).addClass('linkified');});return;};TagMeUI.prototype.loadCloud=function(){var that=this;function initDialogue(){function setQueryWithCheckbox(qkey,qvalue,checkbox,sense){if($(checkbox).is(':checked')===sense){that.cloudQuery.SET(qkey,qvalue);}else{that.cloudQuery=that.cloudQuery.remove(qkey);}} +if($('#simplemodal-container').width()>$(document).width()-50){$('#simplemodal-container').width($(document).width()-50);} +$(that.settings.cloudUiJustThisWeb).click(function(){setQueryWithCheckbox('tpweb',that.settings.cloudWeb,that.settings.cloudUiJustThisWeb,false);that.loadCloud();});$(that.settings.cloudUiJustMe).click(function(){setQueryWithCheckbox('tpuser','me',that.settings.cloudUiJustMe,true);that.loadCloud();});} +$(this.settings.cloudSpinner).addClass('spinning');$(this.settings.cloudContainer).load(this.settings.cloudGetUrl+ +this.cloudQuery.toString(),function(){$(that.settings.cloudSpinner).removeClass('spinning');$(that.settings.cloudContainer).modal(that.settings.cloudModalOpts);initDialogue();});};TagMeUI.prototype.initTagField=function(){var that=this;$(this.settings.taglistInputField).textboxlist({onSelect:function(input){var selectedTags=input.currentValues,didAdd=false;$.each(selectedTags,function(index,tagName){if(that.actOnMissingTag(tagName,that.tags,'add',function(tagName){that.tags.push(tagName);})){didAdd=true;}});if(!didAdd){$.each(that.tags,function(index,tagName){if(!that.actOnMissingTag(tagName,selectedTags,'remove',function(tagName){that.tags.pop(tagName);})){that.linkifyTagText(that.settings.taglistContainer);}});}},autocomplete:this.settings.autocompleteUrl,autocompleteOpts:this.settings.autocompleteOpts});this.linkifyTagText(this.settings.taglistContainer);$(this.settings.cloudSpinner).click(function(){that.loadCloud();});};}(jQuery));$.fn.tagmeui();});; diff --git a/pub/System/TagMeAjaxHelper/jquery.tagmeui.js.gz b/pub/System/TagMeAjaxHelper/jquery.tagmeui.js.gz new file mode 100644 index 0000000..1ce5854 Binary files /dev/null and b/pub/System/TagMeAjaxHelper/jquery.tagmeui.js.gz differ diff --git a/pub/System/TagMeAjaxHelper/jqui.css b/pub/System/TagMeAjaxHelper/jquery.tagmeui.uncompressed.css similarity index 93% rename from pub/System/TagMeAjaxHelper/jqui.css rename to pub/System/TagMeAjaxHelper/jquery.tagmeui.uncompressed.css index 78958a1..8345021 100644 --- a/pub/System/TagMeAjaxHelper/jqui.css +++ b/pub/System/TagMeAjaxHelper/jquery.tagmeui.uncompressed.css @@ -1,6 +1,6 @@ -#tagmejqcontainer { +#tagmeTagCloud { + padding-top: 1em; } - #tagmejqtagstatus, #tagmejqtag { float: left; } diff --git a/pub/System/TagMeAjaxHelper/jqui.js b/pub/System/TagMeAjaxHelper/jquery.tagmeui.uncompressed.js similarity index 85% rename from pub/System/TagMeAjaxHelper/jqui.js rename to pub/System/TagMeAjaxHelper/jquery.tagmeui.uncompressed.js index 37612d1..40ec89e 100644 --- a/pub/System/TagMeAjaxHelper/jqui.js +++ b/pub/System/TagMeAjaxHelper/jquery.tagmeui.uncompressed.js @@ -15,7 +15,7 @@ * more details, published at http://www.gnu.org/copyleft/gpl.html * * @author: Paul Harvey - * @date: 2010-02-10 + * @date: 2010-02-11 * @see: http://foswiki.org/Extensions/TagMePlugin#jqui */ @@ -24,6 +24,15 @@ jQuery(document).ready(function () { (function ($) { $.fn.tagmeui = function (options) { + /* TODO: + * - Prevent multiple instantiations on DOM elements. + * - There isn't much need for this.each/chaining. Re-factor to use + * jquery metadata plugin, and so opts can be extracted from DOM + * element. Eg: $('#myTagMeDivWithMetaData').tagmeui({extra: 'opts'}); + * - Modify TagMePlugin itself to support hard removal of tags, + * instead of the bogus vote count subtraction currently + * - There is no meaningful feedback to user if ajax calls fail + * (auth/permissions, etc) */ $(this).each(function () { var tagmeui = new TagMeUI($(this), options); @@ -37,7 +46,7 @@ jQuery(document).ready(function () { var that = this; this.caller = caller; - this.urlQuery = $.parsequery(window.location.search); + this.urlQuery = $.query; this.cloudQuery = this.urlQuery.copy(); this.cloudQuery.SET('skin', 'text'); this.cloudQuery.SET('contenttype', 'text/plain'); @@ -85,6 +94,7 @@ jQuery(document).ready(function () { taglistInputField: '#tagmejqinputfield', tagLinkUrl: foswiki.scriptUrlPath + '/view/' + foswiki.systemWebName + '/TagMeSearch', + tagLinkTitle: 'Other topics with this tag', tagPostUrl: foswiki.scriptUrlPath + '/viewauth/' + foswiki.web + '/' + foswiki.topic, autocompleteUrl: foswiki.scriptUrlPath + '/view/' + @@ -138,7 +148,8 @@ jQuery(document).ready(function () { var that = this; $(selector + ' > form > div.jqTextboxListContainer > span:not(.linkified)').each( function (index, tagSpan) { - var tagQuery = $.parsequery().copy(); + var tagQuery = $.query.copy(), + theTag = $(tagSpan).text(); /* There must be an easier way to remove the textNode from a span; but ** I don't know it... yet. .text('') destroys child elements we want to @@ -155,20 +166,21 @@ jQuery(document).ready(function () { return; } - theTag = $(tagSpan).text(); tagQuery.SET('tag', theTag); tagQuery.SET('qcallingweb', foswiki.web); removeTextNodes(tagSpan); $(tagSpan).append('' + - theTag + ''); + tagQuery.toString() + '" title="' + + that.settings.tagLinkTitle + '">' + theTag + ''); $(tagSpan).addClass('linkified'); } ); return; }; - + + /* Populates a hidden div with the tag cloud and then displays it + * with simplemodal. Some messiness to bind events on the cloud modal */ TagMeUI.prototype.loadCloud = function () { var that = this; @@ -181,6 +193,8 @@ jQuery(document).ready(function () { } } + /* Would be nice if simplemodal had more sensible autosizing + * with content. */ if ($('#simplemodal-container').width() > $(document).width() - 50) { $('#simplemodal-container').width($(document).width() - 50); } @@ -244,7 +258,6 @@ jQuery(document).ready(function () { }, autocomplete: this.settings.autocompleteUrl, - autocompleteOpts: this.settings.autocompleteOpts }); @@ -255,6 +268,8 @@ jQuery(document).ready(function () { }); }; - $.fn.tagmeui(); }(jQuery)); + + /* Install tagmeui using default options */ + $.fn.tagmeui(); }); \ No newline at end of file diff --git a/pub/System/TagMePlugin/jqui.png b/pub/System/TagMePlugin/jquery.tagmeui.png similarity index 100% rename from pub/System/TagMePlugin/jqui.png rename to pub/System/TagMePlugin/jquery.tagmeui.png