This is an automated email from the ASF dual-hosted git repository. sebawagner pushed a commit to branch feature/OPENMEETINGS-2275-update-whiteboard-tool-panel-with-proposal in repository https://gitbox.apache.org/repos/asf/openmeetings.git
commit 0947371cd534662fba370724d9da6c50b2e0192b Author: Sebastian Wagner <sebawag...@apache.org> AuthorDate: Sun May 3 11:42:29 2020 +1200 OPENMEETINGS-2275 Update whiteboard tools bar with proposed design changes. --- .../apache/openmeetings/web/room/wb/WbPanel.html | 58 +++++++++++----------- .../apache/openmeetings/web/room/wb/raw-wb-area.js | 1 + .../openmeetings/web/room/wb/raw-wb-board.js | 14 +++++- openmeetings-web/src/main/webapp/css/raw-wb.css | 13 +++++ 4 files changed, 56 insertions(+), 30 deletions(-) diff --git a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html index 15c7970..4e5f7fb 100644 --- a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html +++ b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/WbPanel.html @@ -81,7 +81,7 @@ </div> <div id="wb-area" class="wb-tab tab-pane" role="tabpanel"> <div class="wb-with-zoom"> - <div class="wb-zoom-block pr-3 pl-3"></div> + <div class="wb-zoom-block"></div> <div class="scroll-container"> <div class="canvases"></div> <div class="bottom-bumper"></div> @@ -90,7 +90,7 @@ <div class="tools"></div> </div> <div id="wb-zoom" class="wb-zoom row no-gutters"> - <div class="col"> + <div class="col-auto"> <div class="doc-group input-group input-group-sm" aria-label="..."> <div class="input-group-prepend"> <button type="button" class="btn btn-outline-secondary up" wicket:message="title:256"> @@ -105,39 +105,41 @@ <div class="last-page input-group-text">1</div> </div> <div class="input-group-append"> - <button type="button" class="btn btn-outline-secondary down" wicket:message="title:257"> + <button type="button" class="btn-outline-secondary down" wicket:message="title:257"> <i class="fas fa-share"></i> </button> </div> </div> </div> - <div class="col input-group input-group-sm" aria-label="..."> - <div class="input-group-prepend"> - <button type="button" class="btn btn-outline-secondary zoom-out" wicket:message="title:259"> - <i class="fas fa-search-minus"></i> - </button> - </div> - <select class="zoom" data-custom-val="1.20"> - <option value="FULL_FIT"><wicket:message key="zoom.FULL_FIT"/></option> - <option value="PAGE_WIDTH"><wicket:message key="zoom.PAGE_WIDTH"/></option> - <option value="custom">120%</option> - <option value="0.50">50%</option> - <option value="0.75">75%</option> - <option value="1.00">100%</option> - <option value="1.25">125%</option> - <option value="1.50">150%</option> - <option value="2.00">200%</option> - <option value="3.00">300%</option> - <option value="4.00">400%</option> - </select> - <div class="input-group-append"> - <button type="button" class="btn btn-outline-secondary zoom-in" wicket:message="title:260"> - <i class="fas fa-search-plus"></i> - </button> + <div class="col-auto"> + <div class="zoom-group input-group input-group-sm" aria-label="..."> + <div class="input-group-prepend"> + <button type="button" class="btn btn-outline-secondary zoom-out" wicket:message="title:259"> + <i class="fas fa-search-minus"></i> + </button> + </div> + <select class="zoom text-dark" data-custom-val="1.20"> + <option value="FULL_FIT"><wicket:message key="zoom.FULL_FIT"/></option> + <option value="PAGE_WIDTH"><wicket:message key="zoom.PAGE_WIDTH"/></option> + <option value="custom">120%</option> + <option value="0.50">50%</option> + <option value="0.75">75%</option> + <option value="1.00">100%</option> + <option value="1.25">125%</option> + <option value="1.50">150%</option> + <option value="2.00">200%</option> + <option value="3.00">300%</option> + <option value="4.00">400%</option> + </select> + <div class="input-group-append"> + <button type="button" class="btn btn-outline-secondary zoom-in" wicket:message="title:260"> + <i class="fas fa-search-plus"></i> + </button> + </div> </div> </div> - <div class="col settings-group"> - <button type="button" class="btn btn-outline-secondary btn-sm settings" wicket:message="title:lbl.settings.whiteboard"> + <div class="col-auto settings-group"> + <button type="button" class="btn-outline-secondary btn-sm settings" wicket:message="title:lbl.settings.whiteboard"> <i class="fas fa-cog"></i> </button> </div> diff --git a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-area.js b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-area.js index 0770af9..f3d7ed6 100644 --- a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-area.js +++ b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-area.js @@ -232,6 +232,7 @@ var DrawWbArea = function() { self.removeDeleteHandler(); } __initTab(tabsNav.find('li')); + console.log("this", tabs, tabs.find('.wb-tab-content .wb-tab')); tabs.find('.wb-tab-content .wb-tab').each(function() { $(this).data().setRole(role); }); diff --git a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-board.js b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-board.js index 387a7a6..30c1cec 100644 --- a/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-board.js +++ b/openmeetings-web/src/main/java/org/apache/openmeetings/web/room/wb/raw-wb-board.js @@ -116,14 +116,24 @@ var Wb = function() { function _updateZoomPanel() { const ccount = canvases.length; if (ccount > 1 && role === PRESENTER) { - zoomBar.find('.doc-group').show(); + zoomBar.find('.doc-group input').prop("disabled", false); + zoomBar.find('.doc-group button').prop("disabled", false); + zoomBar.find('.doc-group .curr-slide').removeClass("text-muted"); + zoomBar.find('.doc-group .curr-slide').addClass("text-dark"); + zoomBar.find('.doc-group .input-group-text').removeClass("text-muted"); const ns = 1 * slide; zoomBar.find('.doc-group .curr-slide').val(ns + 1).attr('max', ccount); zoomBar.find('.doc-group .up').prop('disabled', ns < 1); zoomBar.find('.doc-group .down').prop('disabled', ns > ccount - 2); zoomBar.find('.doc-group .last-page').text(ccount); } else { - zoomBar.find('.doc-group').hide(); + zoomBar.find('.doc-group .curr-slide').val(0); + zoomBar.find('.doc-group .last-page').text("-"); + zoomBar.find('.doc-group .curr-slide').addClass("text-muted"); + zoomBar.find('.doc-group .curr-slide').removeClass("text-dark"); + zoomBar.find('.doc-group .input-group-text').addClass("text-muted"); + zoomBar.find('.doc-group input').prop("disabled", true); + zoomBar.find('.doc-group button').prop("disabled", true); } } function _setSlide(_sld) { diff --git a/openmeetings-web/src/main/webapp/css/raw-wb.css b/openmeetings-web/src/main/webapp/css/raw-wb.css index 2f78fd0..f53d23e 100644 --- a/openmeetings-web/src/main/webapp/css/raw-wb.css +++ b/openmeetings-web/src/main/webapp/css/raw-wb.css @@ -326,8 +326,21 @@ html[dir="rtl"] .room-block .sb-wb .wb-block { .wb-area .wb-zoom input { width: 50px } +.wb-area .wb-zoom { + min-width: 360px +} .wb-area .wb-zoom .settings-group { display: none; + margin-left: 2px; +} +.wb-area .wb-zoom .doc-group { + margin-left: 5px; +} +.wb-area .wb-zoom .zoom-group { + margin-left: 2px; +} +.wb-area .wb-zoom { + padding-top: 2px; } #wb-rename-menu { display: none;