diff --git a/apps/spreadsheeteditor/embed/index.html b/apps/spreadsheeteditor/embed/index.html index 760e242090..d6258c016a 100644 --- a/apps/spreadsheeteditor/embed/index.html +++ b/apps/spreadsheeteditor/embed/index.html @@ -224,9 +224,9 @@
- -
diff --git a/apps/spreadsheeteditor/embed/index.html.deploy b/apps/spreadsheeteditor/embed/index.html.deploy index 65013a74ca..a45bc63a83 100644 --- a/apps/spreadsheeteditor/embed/index.html.deploy +++ b/apps/spreadsheeteditor/embed/index.html.deploy @@ -205,10 +205,18 @@ } -
-
- +
+
+
+
+ + +
+
    +
      diff --git a/apps/spreadsheeteditor/embed/index_loader.html b/apps/spreadsheeteditor/embed/index_loader.html index b566166412..bea3fba963 100644 --- a/apps/spreadsheeteditor/embed/index_loader.html +++ b/apps/spreadsheeteditor/embed/index_loader.html @@ -286,7 +286,15 @@
      -
        +
        +
        + + +
        +
          +
          diff --git a/apps/spreadsheeteditor/embed/index_loader.html.deploy b/apps/spreadsheeteditor/embed/index_loader.html.deploy index 50e66e1569..65dd8ba7e4 100644 --- a/apps/spreadsheeteditor/embed/index_loader.html.deploy +++ b/apps/spreadsheeteditor/embed/index_loader.html.deploy @@ -270,10 +270,18 @@ '
          '); -
          -
          -
            +
            +
            +
            +
            + + +
            +
              +
                diff --git a/apps/spreadsheeteditor/embed/js/ApplicationController.js b/apps/spreadsheeteditor/embed/js/ApplicationController.js index a4fba466f0..9c35c4e82c 100644 --- a/apps/spreadsheeteditor/embed/js/ApplicationController.js +++ b/apps/spreadsheeteditor/embed/js/ApplicationController.js @@ -229,11 +229,16 @@ SSE.ApplicationController = new(function(){ $(item).appendTo($box).on('click', handleWorksheet); } + setActiveWorkSheet(api.asc_getActiveWorksheetIndex()); + } + + function setupScrollButtons() { var $container = $('#worksheet-container'); var $prevButton = $('#worksheet-list-button-prev'); var $nextButton = $('#worksheet-list-button-next'); + var $box = $('#worksheets'); - var handleScroll = function() { + var handleScrollButtonsState = function() { if ($container[0].scrollWidth > $container[0].clientWidth) { var scrollLeft = $container.scrollLeft(); var scrollWidth = $container[0].scrollWidth; @@ -255,17 +260,22 @@ SSE.ApplicationController = new(function(){ } }; - $container.on('scroll', handleScroll); - $(window).on('resize', handleScroll); + $container.on('scroll', handleScrollButtonsState); + $(window).on('resize', handleScrollButtonsState); - handleScroll(); + handleScrollButtonsState(); + + var buttonWidth = $('.worksheet-list-buttons').outerWidth(); $prevButton.on('click', function() { $($box.children().get().reverse()).each(function () { var $tab = $(this); - var left = $tab.position().left - 62; + + var offsetAdjust = $tab.outerWidth() * buttonWidth / $box.outerWidth() * 0.05; + var left = $tab.position().left - buttonWidth; + if (left < 0) { - $container.scrollLeft($container.scrollLeft() + left - 26); + $container.scrollLeft($container.scrollLeft() + left + offsetAdjust); return false; } }); @@ -275,15 +285,16 @@ SSE.ApplicationController = new(function(){ var rightBound = $container.width(); $box.children().each(function () { var $tab = $(this); + + var offsetAdjust = $tab.outerWidth() * rightBound / $box.outerWidth() * 0.05; var right = $tab.position().left + $tab.outerWidth(); + if (right > rightBound) { - $container.scrollLeft($container.scrollLeft() + right - rightBound + ($container.width() > 400 ? 20 : 5)); + $container.scrollLeft($container.scrollLeft() + right - rightBound + offsetAdjust); return false; } }); }); - - setActiveWorkSheet(api.asc_getActiveWorksheetIndex()); } function onDownloadUrl(url, fileType) { @@ -492,6 +503,8 @@ SSE.ApplicationController = new(function(){ } }); + // setupScrollButtons(); + Common.Gateway.documentReady(); Common.Analytics.trackEvent('Load', 'Complete'); } @@ -564,6 +577,7 @@ SSE.ApplicationController = new(function(){ onDocumentContentReady(); onSheetsChanged(); + setupScrollButtons(); break; } diff --git a/apps/spreadsheeteditor/embed/resources/less/application.less b/apps/spreadsheeteditor/embed/resources/less/application.less index 535722c7b8..edc715e624 100644 --- a/apps/spreadsheeteditor/embed/resources/less/application.less +++ b/apps/spreadsheeteditor/embed/resources/less/application.less @@ -19,27 +19,11 @@ .worksheet-list-buttons { display: flex; - padding: 2px 12px 0 10px; + padding: 1px 12px; height: 24px; position: fixed; background: #f7f7f7; - - button { - display: inline-block; - position: relative; - border: 0; - min-width: 20px; - border-radius: 1px; - - &:disabled { - opacity: 0.4; - cursor: default; - } - } - - button:hover:not(:disabled) { - background-color: #e8e8e8; - } + border-right: 1px solid #c0c0cd; } @media screen and (min--moz-device-pixel-ratio:0) { @@ -121,7 +105,7 @@ padding: 0; margin: 0; white-space: nowrap; - margin-left: 62px; + margin-left: 68px; li { display: inline-block;