Welcome, guest ( Login )

» Home (JDC Blog)
» Forums

Page Tags

tags

Search Tags:
WikiHome » WikiZone » CommunityExperiments » JotTaggingExperiment » TagCloudLibImplementationV1

TagCloudLibImplementationV1

Version 1, changed by ehaugo. 11/10/2005.   Show version history

TagCloudLib Implementation: V1

Pages in this experiment:

  • TagForm -- the form used to tag a page (i.e. add tags to a page's main/tags property)
  • TagCloudLib -- the library
  • TagCloudCSS -- default L&F for a cloud
  • TagPivot -- displays related pages when you click on a tag in the cloud

Sample pages that use a tag cloud

  • AllForumReplyTags -- sample page that displays a tag cloud for all tags in the forum replies (see below)
  • RelatedTagCloudPlugin -- An improved related tag plugin that uses a tag cloud (see below for a code snapshot)

AllForumReplyTags code

<jot:include node="TagCloudCSS" />
<jot:include node="TagCloudLib" />
<jot:script>

var allTagsResult = jot.lib.search({forFormName: "ForumReplyForm", collect: "it/main/tags"});
var allTagsArray = allTagsResult.getItems();
allTagsArray.sort();

//hack to remove tags that have characters that cause problems -- e.g. &
for (i=0; i<allTagsArray.length; i++) {
  if (allTagsArray[i].indexOf("&") > 0)
    allTagsArray[i]="";
}

var tagCloudArray = createTagCloud(allTagsArray);
displayTagCloud(tagCloudArray);

</jot:script>


RelatedTagCloudPlugin code

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:jot="http://www.foopee.com/ns/s3/srvtmpl/">

<jot:extension target="sidebarBottom">

<style>
.tag-separator {
  color: #ddd;
}
.tag-box {
  background-color: #eee;
  text-align: justify;
  padding: 3px;
  margin: 5px;
}
.tag {
  color: #0063dc;
  text-decoration: none;
}
.tagger {
  color: #999;
}
.tagger-log {
  color: #777;
}
a.tag:visited:hover,
a.tag:hover {
  color: #eee;
  background: #0063dc;
}
a.tag:visited {
  color: #0063dc;
  text-decoration: none;
}
.sidebarBox {
  padding: 7px;
}
</style>

<!-- pull in tagging functions from the tag library -->
<jot:include node="/WikiHome/TagCloudLib" />

<div id="related-tags-plugin" class="sidebarBox">
<jot:if test="${util:isDefined(page/main/tags)}">
<jot:then>
<a href="wiki:/${page/name}?edit=1&amp;form=/TagForm">Tag this page</a>
</jot:then>
<jot:else>
No tags -- <a href="wiki:/${page/name}?edit=1&amp;form=/TagForm">tag this page</a>
</jot:else>
</jot:if>
<br /><br />

<jot:script>
<![CDATA[

//Display the tag cloud for this page
var pg  = jot.pages[page.path];
if (typeof pg.main.tags != "undefined") {
  var tagCloudArray = createTagCloud(pg.main.tags);
  displayTagCloud(tagCloudArray);
}

//returns a link to the user's profile, as appropriate for this wiki
function getUserProfileLink(user) {
  return("<a href='/WikiHome/MemberProfiles/"+user+"-profile'  class='tagger'>"+user+"</a>");
}

//List users who have tagged this page
if (typeof pg.main.tags != "undefined") {
  try { var tot = pg.revision; } catch (e) {}
  // Write each change to an array
  var taggerArray = new Array();
  var alreadyCounted = new Array();

  for (i=1; i<=tot; i++) {
    if (i>1) {
      var currRev = pg.otherRevision(i);
      var prevRev = currRev.prevRevision;
      //make sure main/tags property is defined for all pages before accessing it
      if (typeof currRev.main.tags != "undefined" && typeof prevRev.main.tags != "undefined") {
        if (currRev.main.tags != prevRev.main.tags && typeof alreadyCounted[currRev.user] == "undefined") {
          //taggerArray.push("<a href='"+currRev.user+"-profile' class='tagger'>" +  currRev.user + "</a>");
          taggerArray.push(getUserProfileLink(currRev.user));
          alreadyCounted[currRev.user] = "yep";
        }
      }
    }
  }

  //write out list of taggers
  if (taggerArray.length>0) {
    jot.out.write("<br/><span class='tagger-log'>Taggers:</span><br/>\r\n");
    for (j=0; j<taggerArray.length; j++) {
      jot.out.write(taggerArray[j] + "<br/>\r\n");
    }
  }
}
]]>
</jot:script>

</div>

</jot:extension>

</html>

Attachments (0)

  File By Size Attached Ver.