Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 07-24-2012, 12:14 AM   PM User | #1
bosko2
New to the CF scene

 
Join Date: Jul 2012
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
bosko2 is an unknown quantity at this point
Tag cloud.js chaging the sortby to random?

Hi all,

First time poster and new forum member. I have this piece of javascript written by someone that has left the company, it's for a tag cloud, however I want to change how it is sorted/displayed. Currently it is returning the tags in alphabetical order. I want them to come back in random order. Below is the code:

Code:
(function($) {
    $.fn.tagCloud = function(options) {

        var defaults = { "fontMax": 200, "fontMin": 100, "fontUnit": "%",
            tagClass: "tagCloud", tagUrlFormatString: "{0}", maxTagLimit: 100
        },
       o = $.extend({}, defaults, options);

        var dataBlock = $(this).hide(),
		regx = /[\w\s\']+/g,
		dataTags = dataBlock.text(),
		tags = [],
		keywords,
		maxCount = 0,
		minCount = 1;

        while ((keywords = regx.exec(dataTags)) != null) {
            var key = $.trim(keywords[0].toLowerCase());

            if (key) {
                var tag = key;
                key = "tag" + key;

                if (tags[key] == null) {
                    tags[key] = tags.length;
                    tags.push(new tagElement(tag));
                }
                else
                    tags[tags[key]].Count++;

                maxCount = Math.max(tags[tags[key]].Count, maxCount);
				minCount = Math.min(tags[tags[key]].Count, minCount);
            }
        }
		
        if (tags.length > o.maxTagLimit) {
            tags.sort(sortByCount);
            tags.splice(o.maxTagLimit, tags.length - o.maxTagLimit);
			minCount = tags[tags.length - 1].Count;
        }
		
		var tagBlock = dataBlock.after("<div id='tagBlock' class='" + o.tagClass + "'></div>").next("div#tagBlock"),
            scaleFont = (o.fontMax - o.fontMin) / Math.max(maxCount - minCount, 1);

        tags.sort(sortByText);

        function tagElement(text) {
            this.Text = text;
            this.Count = 1;
        }

        function sortByCount(a, b) {
            return b.Count - a.Count;
        }

        function sortByText(a, b) {
            return ((a.Text < b.Text) ? -1 : ((a.Text > b.Text) ? 1 : 0));
        }

        for (var i = 0; i < tags.length; i++) {
            var tag = tags[i],
                fontsize = (tag.Count - minCount) * scaleFont + o.fontMin;

            tagBlock.append("<a href='" + o.tagUrlFormatString.replace("{0}", tag.Text) + "' title='" + tag.Count + " item(s)'>" + tag.Text + "</a>").children(":last").css("font-size", fontsize + o.fontUnit);
        }
    };
})(jQuery);

I know that there is a sortby.math function but I'm not too sure where to place it. Any ideas?

Thanks ahead, bosko2.
bosko2 is offline   Reply With Quote
Old 07-24-2012, 12:27 AM   PM User | #2
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,168
Thanks: 59
Thanked 3,993 Times in 3,962 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
Just replace this line:
Code:
    tags.sort(sortByText);
with this:
Code:
    tags.sort( function() { return Math.random() < 0.5 ? -1 : 1; } );
It's not a perfect random sort, but it should be good enough for most purposes.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 07-24-2012, 12:29 AM   PM User | #3
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,168
Thanks: 59
Thanked 3,993 Times in 3,962 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
Or you could do it thus:
Code:
    tags.sort(sortRandom);
    ...

function sortRandom() 
{ 
    return Math.random() < 0.5 ? -1 : 1; 
}
Really 100% the same thing.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 07-24-2012, 01:05 AM   PM User | #4
bosko2
New to the CF scene

 
Join Date: Jul 2012
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
bosko2 is an unknown quantity at this point
Thanks for that, do I need to delete all of the sortby functions after that first one?
bosko2 is offline   Reply With Quote
Old 07-24-2012, 01:08 AM   PM User | #5
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,168
Thanks: 59
Thanked 3,993 Times in 3,962 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
No, because they aren't being used.

They was a miniscule amount of code space and they are there if you ever decide you want to use them. Would be different if each was hundreds of lines long, but as is...
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 07-24-2012, 01:19 AM   PM User | #6
bosko2
New to the CF scene

 
Join Date: Jul 2012
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
bosko2 is an unknown quantity at this point
So should it look like this? Thanks again for your help mate.
Code:
(function($) {
    $.fn.tagCloud = function(options) {

        var defaults = { "fontMax": 200, "fontMin": 100, "fontUnit": "%",
            tagClass: "tagCloud", tagUrlFormatString: "{0}", maxTagLimit: 100
        },
       o = $.extend({}, defaults, options);

        var dataBlock = $(this).hide(),
		regx = /[\w\s\']+/g,
		dataTags = dataBlock.text(),
		tags = [],
		keywords,
		maxCount = 0,
		minCount = 1;

        while ((keywords = regx.exec(dataTags)) != null) {
            var key = $.trim(keywords[0].toLowerCase());

            if (key) {
                var tag = key;
                key = "tag" + key;

                if (tags[key] == null) {
                    tags[key] = tags.length;
                    tags.push(new tagElement(tag));
                }
                else
                    tags[tags[key]].Count++;

                maxCount = Math.max(tags[tags[key]].Count, maxCount);
				minCount = Math.min(tags[tags[key]].Count, minCount);
            }
        }
		
        if (tags.length > o.maxTagLimit) {
            tags.sort(sortByCount);
            tags.splice(o.maxTagLimit, tags.length - o.maxTagLimit);
			minCount = tags[tags.length - 1].Count;
        }
		
		var tagBlock = dataBlock.after("<div id='tagBlock' class='" + o.tagClass + "'></div>").next("div#tagBlock"),
            scaleFont = (o.fontMax - o.fontMin) / Math.max(maxCount - minCount, 1);

        tags.sort(sortRandom);

        function tagElement(text) {
            this.Text = text;
            this.Count = 1;
        }

        function sortRandom() { 
   			return Math.random() < 0.5 ? -1 : 1; 
		}

        function sortByText(a, b) {
            return ((a.Text < b.Text) ? -1 : ((a.Text > b.Text) ? 1 : 0));
        }

        for (var i = 0; i < tags.length; i++) {
            var tag = tags[i],
                fontsize = (tag.Count - minCount) * scaleFont + o.fontMin;

            tagBlock.append("<a href='" + o.tagUrlFormatString.replace("{0}", tag.Text) + "' title='" + tag.Count + " item(s)'>" + tag.Text + "</a>").children(":last").css("font-size", fontsize + o.fontUnit);
        }
    };
})(jQuery);
bosko2 is offline   Reply With Quote
Old 07-24-2012, 03:10 AM   PM User | #7
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,168
Thanks: 59
Thanked 3,993 Times in 3,962 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
Looks okay to me. Did you try it?
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 07-24-2012, 03:30 AM   PM User | #8
bosko2
New to the CF scene

 
Join Date: Jul 2012
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
bosko2 is an unknown quantity at this point
Yep, I'm sure it works, however the webpart (this is in SharePoint) wants to point to the default javascript library (ie. where this original script resides, however I don't have write access to this library to re-upload, I have uploaded to a different section on our portal, but I can't get the webpart to link to this file. Below is the header from the webpart:

Code:
<script type="text/javascript" src="/javascript/tagCloud.js"></script>
My file lives in another place outside this library, but when I update the src="" section the webpart just doesn't find it. The location of the updated javascript looks like: /SafetyEnvironment/SEMS/Documents/tagCloud.js
bosko2 is offline   Reply With Quote
Old 07-24-2012, 03:34 AM   PM User | #9
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,168
Thanks: 59
Thanked 3,993 Times in 3,962 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
Can't help you. Have never used Sharepoint.

No idea what "webpart" is, for that matter.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Old 07-24-2012, 03:39 AM   PM User | #10
bosko2
New to the CF scene

 
Join Date: Jul 2012
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
bosko2 is an unknown quantity at this point
It's basically html. So I just need to know how to make a file reference to my version in a particular library..
bosko2 is offline   Reply With Quote
Old 07-24-2012, 06:16 AM   PM User | #11
bosko2
New to the CF scene

 
Join Date: Jul 2012
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
bosko2 is an unknown quantity at this point
ok I worked it out, just enter the URL without the "". When it runs I get this error 'Unexpected end of file looking for tag.'

Any ideas?
bosko2 is offline   Reply With Quote
Old 07-24-2012, 07:43 PM   PM User | #12
Old Pedant
Supreme Master coder!

 
Old Pedant's Avatar
 
Join Date: Feb 2009
Posts: 23,168
Thanks: 59
Thanked 3,993 Times in 3,962 Posts
Old Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to allOld Pedant is a name known to all
Not a clue. Never seen that error before.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Old Pedant is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 01:17 AM.


Advertisement
Log in to turn off these ads.