integration/v2/js/keyword-mosaic.js
author Anthony Ly <anthonyly.com@gmail.com>
Thu, 27 Jun 2013 17:38:53 +0200
changeset 188 aa163c5df6e3
parent 187 be4eb4db3418
parent 183 f752e362bf62
child 189 037ff36ba217
permissions -rw-r--r--
Merge
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
179
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     1
$(function() {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     2
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     3
    $('.masonry-177').masonry({
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     4
        columnWidth: 177,
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     5
        itemSelector: '.item-masonry'
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     6
    });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     7
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
     8
    function updateMasonry() {
182
dde608cfd823 small fix
veltr
parents: 181
diff changeset
     9
        $('.masonry-177').masonry('layout');
179
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    10
    }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    11
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    12
    var keywordsobj = {};
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    13
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    14
    $(".item-masonry").each(function(i, element) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    15
        $(element)
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    16
            .attr("data-keywords")
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    17
            .split(",")
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    18
            .forEach(function(kw) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    19
                var keyword = kw.replace(/(^\s+|\s+$)/g,''),
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    20
                    basekw = keyword.toLowerCase();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    21
                if (!keywordsobj.hasOwnProperty(basekw)) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    22
                    keywordsobj[basekw] = {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    23
                        keyword: keyword,
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    24
                        basekeyword: basekw,
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    25
                        count: 0,
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    26
                        items: $(),
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    27
                        enabled: true
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    28
                    };
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    29
                }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    30
                kwobj = keywordsobj[basekw];
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    31
                kwobj.count++;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    32
                kwobj.items.push(element);
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    33
            });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    34
    });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    35
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    36
    var keywordslist = [];
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    37
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    38
    for (var k in keywordsobj) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    39
        if (keywordsobj.hasOwnProperty(k)) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    40
            keywordslist.push(keywordsobj[k]);
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    41
        }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    42
    }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    43
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    44
    keywordslist.sort(function(a, b) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    45
        return b.count - a.count;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    46
    });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    47
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    48
    var filterlist = $(".filters");
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    49
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    50
    function updateKeywords() {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    51
        var enabledItems = $();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    52
        keywordslist.forEach(function(kw) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    53
            if (kw.enabled) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    54
                enabledItems = enabledItems.add(kw.items);
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    55
                kw.li.removeClass("disabled");
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    56
            } else {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    57
                kw.li.addClass("disabled");
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    58
            }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    59
        });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    60
        $(".item-masonry").addClass("disabled");
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    61
        enabledItems.removeClass("disabled");
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    62
    }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    63
    
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    64
    keywordslist.slice(0,100).forEach(function(kw) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    65
        var li = $('<li class="box-shadow-2">'),
181
f0dc53d8b462 Updated styles for mosaic filtering
veltr
parents: 179
diff changeset
    66
            texta = $('<a class="display-keyword" href="#">'),
f0dc53d8b462 Updated styles for mosaic filtering
veltr
parents: 179
diff changeset
    67
            actiona = $('<a class="icon-action" href="#">');
f0dc53d8b462 Updated styles for mosaic filtering
veltr
parents: 179
diff changeset
    68
        texta.text(kw.keyword + ' ');
f0dc53d8b462 Updated styles for mosaic filtering
veltr
parents: 179
diff changeset
    69
        li.append(actiona);
f0dc53d8b462 Updated styles for mosaic filtering
veltr
parents: 179
diff changeset
    70
        li.append(texta);
179
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    71
        kw.li = li;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    72
        li.click(function() {
183
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    73
            var allothersdisabled = keywordslist.reduce(function(mem, k) {
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    74
                return mem && (k === kw || !k.enabled);
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    75
            }, true);
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    76
            if (allothersdisabled) {
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    77
                keywordslist.forEach(function(k) {
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    78
                    k.enabled = true;
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    79
                });
f752e362bf62 Changed behaviour on click
veltr
parents: 182
diff changeset
    80
            } else {
179
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    81
                keywordslist.forEach(function(k) {
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    82
                    k.enabled = false;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    83
                });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    84
                kw.enabled = true;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    85
            }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    86
            updateKeywords();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    87
            return false;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    88
        });
181
f0dc53d8b462 Updated styles for mosaic filtering
veltr
parents: 179
diff changeset
    89
        actiona.click(function() {
179
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    90
            kw.enabled = !kw.enabled;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    91
            updateKeywords();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    92
            return false;
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    93
        });
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    94
        filterlist.append(li);
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    95
    })
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    96
        
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    97
    $('.toggle-comment').click(function(e){
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    98
        e.preventDefault();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
    99
        $('.show-comment, .hide-comment').hide();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   100
        if($('.mosaic').length){
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   101
            $('.mosaic').removeClass('mosaic').addClass('mosaic-comment');
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   102
            $('.hide-comment').show();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   103
        }else{
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   104
            $('.mosaic-comment').removeClass('mosaic-comment').addClass('mosaic');
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   105
            $('.show-comment').show();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   106
        }
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   107
        updateMasonry();
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   108
    });
187
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   109
188
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   110
    //filters
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   111
    $('.filters a').each(function(){
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   112
        var text = $.trim($(this).text());
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   113
        if(text.length > 26){
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   114
            $(this).text(text.substr(0, 26) + '...')
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   115
        }
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   116
    });
Anthony Ly <anthonyly.com@gmail.com>
parents: 187 183
diff changeset
   117
187
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   118
//##################
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   119
/*
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   120
    $(document).on('click','.display-keyword', function(e){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   121
        e.preventDefault();
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   122
        var ul = $(this).parents('ul'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   123
            li = $(this).parents('li'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   124
            iconAction = li.find('.icon-action'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   125
            index = li.index(),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   126
            keyword = $(this).attr('data-keyword');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   127
        
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   128
        if(!li.hasClass('disabled') && ul.find('li.disabled').length){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   129
            ul.find('li').each(function(k, v){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   130
                var displayKeyword = $(v).find('.display-keyword'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   131
                    iconAction = $(v).find('.icon-action'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   132
                    keyword = $.trim(displayKeyword.attr('data-keyword'));
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   133
                enabledDisplayKeyword($(v), keyword, iconAction);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   134
            });
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   135
        }else{
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   136
            ul.find('li').each(function(k, v){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   137
                if(index != k){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   138
                    var displayKeyword = $(v).find('.display-keyword'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   139
                        iconAction = $(v).find('.icon-action'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   140
                        keyword = displayKeyword.attr('data-keyword');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   141
                    disabledDisplayKeyword($(v), keyword, iconAction);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   142
                }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   143
            });
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   144
            enabledDisplayKeyword(li, keyword, iconAction);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   145
        }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   146
    });
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   147
    $('.icon-action').bind('click', function(e){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   148
        e.preventDefault();
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   149
        var li = $(this).parents('li');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   150
        toggleDisplayKeyword(li);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   151
    });
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   152
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   153
    function toggleDisplayKeyword(li){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   154
        var displayKeyword = li.find('.display-keyword'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   155
            iconAction = li.find('.icon-action'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   156
            keyword = displayKeyword.attr('data-keyword');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   157
        if(li.hasClass('disabled')){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   158
            enabledDisplayKeyword(li, keyword, iconAction);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   159
        }else{
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   160
            disabledDisplayKeyword(li, keyword, iconAction);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   161
        }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   162
    }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   163
    function enabledDisplayKeyword(li, keyword, iconAction){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   164
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   165
        $('ul.mosaic > li').each(function(k, v){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   166
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   167
            var keywords = $(v).attr('data-keywords'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   168
                item = $(v);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   169
            keywords = keywords.split(',');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   170
            for(var i=0; i<= keywords.length; i++){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   171
                if($.trim(keywords[i]) == keyword){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   172
                    item.find('.curtain').hide();
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   173
                }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   174
            }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   175
        });
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   176
        $('li.keyword-'+keyword).find('.curtain').hide();
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   177
        iconAction.addClass('cross');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   178
    }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   179
    function disabledDisplayKeyword(li, keyword, iconAction){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   180
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   181
        $('ul.mosaic > li').each(function(k, v){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   182
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   183
            var keywords = $(v).attr('data-keywords'),
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   184
                item = $(v);
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   185
            keywords = keywords.split(',');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   186
            for(var i=0; i<= keywords.length; i++){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   187
                if($.trim(keywords[i]) == keyword){
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   188
                    item.find('.curtain').show();
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   189
                }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   190
            }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   191
        });
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   192
        iconAction.addClass('circle');
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   193
    }
Anthony Ly <anthonyly.com@gmail.com>
parents: 179
diff changeset
   194
*/
179
b7fabb9e5d9f updated tagcloud behaviour
veltr
parents:
diff changeset
   195
});