Updated desktop filename render logic

web/desktop.system

@@ -994,6 +994,9 @@
             <i class="power icon"></i> <span locale="quickAccess/poweroff">Power Off</span>
         </div>
     </div>
+    <div>
+        <canvas id="textWidthCanvas"></canvas>
+    </div>
     <script>
 
         /*
@@ -3041,6 +3044,21 @@
             desktopGrids = JSON.parse(JSON.stringify(slots));
         }
 
+        function getTextPixelWidth(measureText){
+            let canvas = document.getElementById('textWidthCanvas');
+            let ctx = canvas.getContext('2d');
+            let text = ctx.measureText(measureText);
+            let estimatedFilenameSize = text.width;
+            if (desktopIconSize == "small"){
+                estimatedFilenameSize = estimatedFilenameSize * 0.8679245283018868;
+            }else if (desktopIconSize == "big"){
+                estimatedFilenameSize = estimatedFilenameSize * 1.509433962264151;
+            }else{
+                estimatedFilenameSize = estimatedFilenameSize * 1.2452830188679245;
+            }
+            return estimatedFilenameSize;
+        }
+
         function appendIconAtLocation(filedata, screenX, screenY, iheight, iwidth, updateMode=false) {
             //Get the icon from extension
             var icon = ao_module_utils.getIconFromExt(filedata.Ext.substring(1, filedata.Ext.length));
@@ -3083,19 +3101,29 @@
                 imagePath = shortcutImage;
                 type = "shortcut";
             }
-            //Check if filename is english only.
-            if (/^[a-zA-Z\d .-=+]+$/.test(filename)) {
-                maxlength = 20;
+            //Check if it is under small text mode
+            if (size == "small"){
+                maxlength = 46;
+            }else if (size == "big"){
+                maxlength = 80;
             }else{
-                //Check if it is under small text mode
-                if (size == "small"){
-                    maxlength = 10;
-                }
+                maxlength = 66;
             }
+            
+
+            var estimatedFilenameSize = getTextPixelWidth(filename);
+            console.log(filename, estimatedFilenameSize);
           
+            shortenedName = filename;
+            if (type != "shortcut" && estimatedFilenameSize > (maxlength * 2 - 10)) {
+                var newFilenameLength = getTextPixelWidth(shortenedName + "...");
+                while (newFilenameLength >= (maxlength * 2 - 10)){
+                    shortenedName = shortenedName.substr(0, shortenedName.length - 1);
+                    newFilenameLength = getTextPixelWidth(shortenedName + "...");
+                    console.log(shortenedName, newFilenameLength);
+                }
 
-            if (type != "shortcut" && filename.length > maxlength) {
-                shortenedName = filename.substring(0, maxlength) + "...";
+                shortenedName = shortenedName + "...";
             }
             var compressedFiledata = ao_module_utils.objectToAttr(filedata);
             if (updateMode){
@@ -5461,15 +5489,8 @@
                 launchOption = {
                     noflash: true
                 };
-            }else{
-                $(".launchIcon").each(function*(){
-                    if ($(this).attr("tyoe") == "dummy"){
-                        //Do not remove this
-                        return;
-                    }
-                    $(this).remove();
-                });
             }
+
             if (callback == undefined) {
                 initDesktopFiles(launchOption, function(){
                     startThumbnailLoader();