Changing tag list to load content by ajax (fix #49) and updating the default sort order of backend lists (fix #49)

www/themes/jason-williamsca/assets/javascript/feedlayout.js

@@ -1,45 +1,64 @@
-(function($) {
-    "use strict"; // Start of use strict
-    
-    // If the feed is loaded immediadely on page load (i.e. we're not using ajax), reset the layout on each image load
-    $('.masonry img').each(function() {
-        $(this).one('load', () => {
-            $('.masonry').masonry()
-        })
-    })
-    
-    // Apply masonry layout to feed cards after content (including images) has been loaded
-    $(window).on('feedLoaded', function() {
-        if (!feedItemClass) feedItemClass = 'col-sm-12 col-md-6 col-xl-4'
-        
-        $('.masonry-item').addClass(feedItemClass)
-        $('.show-onfeedloaded').removeClass('d-none')
-
-        $('.masonry').masonry('reloadItems')
-        $('.masonry').masonry()
-        
-        // Every time an image loads, reset the layout
-        $('.masonry img').each(function() {
-            $(this).one('load', () => {
-                $('.masonry').masonry()
-            })
-        })
-    })
-    
-    // If there's tag data set once the page is loaded, create a tag cloud
-    $(function() {
-        if(typeof tagData !== 'undefined') {
-            var cloudWords = []
-            
-            tagData.forEach((tag) => {
-                cloudWords.push({text: tag.tag, weight: tag.count, link: '/feed/all/' + tag.tag})
-            })
-            
-            $('#tagcloud').jQCloud(cloudWords, {
-                autoResize: true,
-                removeOverflowing: true,
-                delay: 2
-            })
-        }
-    })
+(function($) {
+    "use strict"; // Start of use strict
+    
+    // If the feed is loaded immediadely on page load (i.e. we're not using ajax), reset the layout on each image load
+    $('.masonry img').each(function() {
+        $(this).one('load', () => {
+            $('.masonry').masonry()
+        })
+    })
+    
+    // Apply masonry layout to feed cards after content (including images) has been loaded
+    $(window).on('feedLoaded', function() {
+        if (!feedItemClass) feedItemClass = 'col-sm-12 col-md-6 col-xl-4'
+        
+        $('.masonry-item').addClass(feedItemClass)
+        $('.show-onfeedloaded').removeClass('d-none')
+
+        $('.masonry').masonry('reloadItems')
+        $('.masonry').masonry()
+        
+        // Every time an image loads, reset the layout
+        $('.masonry img').each(function() {
+            $(this).one('load', () => {
+                $('.masonry').masonry()
+            })
+        })
+    })
+    
+    // Render the tag cloud if/when tag data is loaded by the component
+    $(window).on('tagsLoaded', function(event, data) {
+        console.log(data.responseJSON)
+        
+        var cloudWords = []
+        
+        data.responseJSON.forEach((tag) => {
+            cloudWords.push({text: tag.tag, weight: tag.count, link: '/feed/all/' + tag.tag})
+        })
+        
+        $('#tagcloud').html('').height($('#tagcloud').width() * 4/3)
+
+        $('#tagcloud').jQCloud(cloudWords, {
+            autoResize: true,
+            removeOverflowing: true,
+            delay: 2
+        })
+    })
+    
+    // If there's tag data set once the page is loaded, create a tag cloud
+    $(function() {
+        if(typeof tagData !== 'undefined') {
+            var cloudWords = []
+            
+            tagData.forEach((tag) => {
+                cloudWords.push({text: tag.tag, weight: tag.count, link: '/feed/all/' + tag.tag})
+            })
+            
+            $('#tagcloud').jQCloud(cloudWords, {
+                autoResize: true,
+                removeOverflowing: true,
+                delay: 2
+            })
+        }
+    })
 })(jQuery); // End of use strict