[SE] Fix styles and escape HTML in title, show scroll

ONLYOFFICE · Mar 11, 2024 · 01e4157 · 01e4157
1 parent 5ac746d
commit 01e4157
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 10 deletions.
diff --git a/apps/spreadsheeteditor/embed/js/ApplicationController.js b/apps/spreadsheeteditor/embed/js/ApplicationController.js
@@ -195,11 +195,36 @@ SSE.ApplicationController = new(function(){
         $box.find('li').off();
         $box.empty();
 
-        var tpl = '<li id="worksheet{index}">{title}</li>';
+        var tpl = '<li id="worksheet{index}" {style}>{title}</li>';
         for (var i = 0; i < maxPages; i++) {
             if (api.asc_isWorksheetHidden(i)) continue;
 
-            var item = tpl.replace(/\{index}/, i).replace(/\{title}/,api.asc_getWorksheetName(i).replace(/\s/g,'&nbsp;'));
+            var styleAttr = "";
+            var color = api.asc_getWorksheetTabColor(i);
+            if (color) {
+                styleAttr = 'style="box-shadow: inset 0 4px 0 rgba({r}, {g}, {b}, {a})"'
+                    .replace(/\{r}/, color.r)
+                    .replace(/\{g}/, color.g)
+                    .replace(/\{b}/, color.b)
+                    .replace(/\{a}/, color.a);
+            }
+
+            // escape html
+            var name = api.asc_getWorksheetName(i).replace(/[&<>"']/g, function (match) {
+                return {
+                    '&': '&amp;',
+                    '<': '&lt;',
+                    '>': '&gt;',
+                    '"': '&quot;',
+                    "'": '&#39;'
+                }[match];
+            });
+
+            var item = tpl
+                .replace(/\{index}/, i)
+                .replace(/\{title}/, name)
+                .replace(/\{style}/, styleAttr);
+
             $(item).appendTo($box).on('click', handleWorksheet);
         }
 

diff --git a/apps/spreadsheeteditor/embed/resources/less/application.less b/apps/spreadsheeteditor/embed/resources/less/application.less
@@ -20,30 +20,25 @@
     white-space: nowrap;
     box-shadow: inset 0 1px 0 #cacaca;
     overflow: scroll;
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-
-    &::-webkit-scrollbar {
-      display: none;
-    }
 
     li {
       display: inline-block;
       border-radius: 0;
-      padding: 4px 10px 0;
+      padding: 0 10px 0;
       line-height: 24px;
       margin-right: -1px;
       margin-left: 0;
       border-top: 1px solid #cacaca;
       border-right: 1px solid #cacaca;
       border-left: 1px solid #cacaca;
       color: rgba(0, 0, 0, 0.8);
+      font-size: 11px;
+      font-weight: bold;
 
       &.active {
         box-shadow: inset 0 4px 0 #49795d;
         background-color: #DDDDDD;
         color: #000;
-        font-weight: bold;
       }
     }
   }