Changeset 7778

Timestamp:

Feb 28, 2020, 10:45:08 AM (3 years ago)

Author:

Nicklas Nordborg

Message:

References #2202: Include information from parent items in list pages

Change some styles and colors while data is lazy-loading to make the user feel that something is going on.

Location:

trunk/www/include

Files:

• scripts/lazy-parent-items.js (modified) (2 diffs)
• styles/table.css (modified) (2 diffs)

trunk/www/include/scripts/lazy-parent-items.js

@@ -53 +53 @@
   {
     var lazyItems = [];
-    // Collect 'item-id' from the first column until we have MAX_ITEMS_IN_BATCH
-    while (lazyNo < lazyElements.length && lazyItems.length < itemsInBatch)
+    while (lazyNo < lazyElements.length)
     {
       var e = lazyElements[lazyNo];
-      lazyNo++;
-      if (Data.get(e, 'index') == '0') 
+      var colIndex = Data.int(e, 'index');
+      if (colIndex == 0)
       {
+        // Collect 'item-id' from the first column until we have 'itemsInBatch' items
+        if (lazyItems.length == itemsInBatch) break;
         lazyItems[lazyItems.length] = Data.get(e, 'item-id');
       }
+      Doc.removeClass(e, 'not-loaded');
+      Doc.addClass(e, 'loading');
+      lazyNo++;
     }
     
@@ -109 +113 @@
         {
           e.innerHTML = item.data[col];
-          Doc.removeClass(e, 'not-loaded');
+          Doc.removeClass(e, 'loading');
+          Doc.removeClass(e, 'loaded');
           Doc.autoInitElements(e);
         }

trunk/www/include/styles/table.css

@@ -394 +394 @@
 }
 
-.lazy-parent.not-loaded
+.lazy-parent.not-loaded, .lazy-parent.loading
 {
   outline: 1px dotted #A0A0A0;
@@ -401 +401 @@
 }
 
-
+.lazy-parent.loading
+{
+  outline: 1px solid #D0D0D0;
+  background-color: rgba(236, 236, 128, 0.25);
+}
+
+
+
+
+