Added desktop hover info tab

web/desktop.system

@@ -133,6 +133,12 @@
             margin-top: -6px;
             font-size: 110%;
         }
+
+        .launchIconText.longTextSplit{
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
         
         .navimenu {
             position: fixed;
@@ -766,13 +772,31 @@
                 animation: blink normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */
             }
 
+            /*
+                Hover file decriptor UI
+            */
+            .fileDescription {
+                width:200px;
+                position:fixed;
+                z-index:10;
+                background:white;
+                padding: 10px;
+                border: 1px solid #2c2c2c;
+                -webkit-box-shadow: 6px 5px 10px -3px rgba(0,0,0,0.75);
+                -moz-box-shadow: 6px 5px 10px -3px rgba(0,0,0,0.75);
+                box-shadow: 6px 5px 10px -3px rgba(0,0,0,0.75);
+                padding:2px;
+                word-wrap: break-word;
+            }
+
+
 
         /*
                 Z-index layering
                 Layer -1 : Background Images
                 Layer 0 - 99: Not focused tab
                 Layer 100: Focused tab drag drop layer
-                Layer 101: Focused Tab
+                Layer 101: Focused Tab / File Descriptor Tag
                 ...
                 Layer 400 - 499: Non-focused top most FloatWindows
                 Layer 500: Top Mot FloatWindow drag drop layer
@@ -843,7 +867,10 @@
     <div id="iconwrapper">
         
     </div>
-    
+
+    <!-- File Descriptors -->
+    <div id="fileDescriptor" class="fileDescription" style="font-size: 80%;display:none;z-index:101;">No Information</div>
+
     <!-- Navigation Menu-->
     <div id="navimenu" class="navimenu themeColor">
         <div class="item clickable system" onclick="toggleListMenu();" ontouchstart="toggleListMenu();" >
@@ -917,7 +944,7 @@
             </div>
         </div>
         
-      
+        
     </div>
 
     <div id="quickAccessPanel" class="" style="display:none;">
@@ -966,7 +993,6 @@
             <i class="power icon"></i> <span locale="quickAccess/poweroff">Power Off</span>
         </div>
     </div>
-
     <script>
 
         /*
@@ -1012,6 +1038,7 @@
         var clickDownOffset = [-1, -1];
         var renameMode = false;
         var operationTargetLaunchIcon;
+        var currentMousePosition = [-1, -1];
 
         //Document key bindings
         var ctrlHold = false;
@@ -3119,7 +3146,7 @@
                     style="width:${properties.iwidth}px; height:${properties.iheight}px;left:${properties.screenX}px; top:${properties.screenY}px;">
                     <span class="launchIconWrapper">
                         <img class="launchIconImage ${properties.size}" src="${properties.imagePath}" draggable="false"></img>
-                        <p class="launchIconText ${properties.size} ">${properties.shortenedName}</p>
+                        <p class="launchIconText ${properties.size}">${properties.shortenedName}</p>
                     </span>
                     </${htmlType}>`);
 
@@ -3154,6 +3181,50 @@
             }
         }
 
+        //Folder description box
+        var timeoutId;
+        function attachDescriptionBoxEvents(){
+            $(".launchIcon").off("hover").hover(function(event) {
+                let modulePath = $(this).attr("filepath");
+                let filename = $(this).attr("filename");
+                let filedata = JSON.parse( decodeURIComponent($(this).attr("filedata")));
+                
+                if (!timeoutId) {
+                    timeoutId = window.setTimeout(function() {
+                        let position = [currentMousePosition[0] + 10, currentMousePosition[1] + 10];
+                        timeoutId = null;
+                        console.log(filedata, position);
+                        $('#fileDescriptor').css('left',position[0] + "px");
+                        $('#fileDescriptor').css('top',position[1] + "px");
+                        if (filedata.IsShortcut){
+                            $('#fileDescriptor').html(`<p><i class="linkify icon"></i> ${filedata.ShortcutName}<br><i class="folder icon"></i> ${filedata.ShortcutPath}</p>`);
+                            $('#fileDescriptor').show();
+                        }else{
+                            $.ajax({
+                                url: "system/file_system/getProperties",
+                                data: {path: filedata.Filepath},
+                                success: function(data){
+                                    $('#fileDescriptor').html(`<p>${filedata.Filename}<br><i class="file outline icon"></i> ${formatBytes(data.Filesize)} (${data.MimeType})<br><i class="time icon"></i> ${data.LastModTime}</p>`);
+                                    $('#fileDescriptor').show();
+                                }
+                            })
+                            
+                        }
+                        
+                        
+                    }, 1500);
+                }
+            },
+            function () {
+                if (timeoutId) {
+                    window.clearTimeout(timeoutId);
+                    timeoutId = null;
+                }else {
+                    $('#fileDescriptor').hide();
+                }
+            });
+        }
+
         /*
             Share indicator settings
             This append or remove share from a particular file
@@ -3944,6 +4015,7 @@
                 }
                 
             }
+        
             //Clicked on a launch icon.
             var alreadyHighlighted = $(object).find(".launchIconWrapper").hasClass("selected");
             if (alreadyHighlighted){
@@ -3962,8 +4034,6 @@
                     $(".launchIconWrapper.selected").removeClass("selected");
                     $(object).find(".launchIconWrapper").addClass("selected");
                 }
-                
-
             }
         }
 
@@ -4166,6 +4236,10 @@
                 //console.log(event.which);
             }
         });
+        
+        $(document).on("mousemove", function(event){
+            currentMousePosition = [event.clientX, event.clientY];
+        });
 
         $(document).keyup(function(event) {
             let keycode = event.which || event.keyCode;
@@ -5317,10 +5391,12 @@
             if (callback == undefined) {
                 initDesktopFiles(launchOption, function(){
                     startThumbnailLoader();
+                    attachDescriptionBoxEvents();
                 });
             } else {
                 initDesktopFiles(launchOption, function(){
                     startThumbnailLoader();
+                    attachDescriptionBoxEvents();
                     callback()
                 });
             }
@@ -5995,7 +6071,8 @@
             hideAllContextMenus();
         }
 
-
+        //Function for converting bytes to human readable sizes
+        function formatBytes(a,b=2){if(0===a)return"0 Bytes";const c=0>b?0:b,d=Math.floor(Math.log(a)/Math.log(1024));return parseFloat((a/Math.pow(1024,d)).toFixed(c))+" "+["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"][d]}
 
         /*
             Background services for keeping desktop files updated

web/script/semantic/offline-font.css

@@ -51,7 +51,7 @@
   font-family: 'Lato';
   font-style: normal;
   font-weight: 700;
-  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v17/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2');
+  src: local('Lato Bold'), local('Lato-Bold'), url(fonts/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2');
   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
 }
 /* latin */
@@ -59,6 +59,6 @@
   font-family: 'Lato';
   font-style: normal;
   font-weight: 700;
-  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v17/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2');
+  src: local('Lato Bold'), local('Lato-Bold'), url(fonts/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2');
   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }