From 087b1d9a61f106b16b10ea3c4440ddaaa69842c5 Mon Sep 17 00:00:00 2001 From: Daniel Herrero Date: Wed, 14 Feb 2018 09:21:43 +0100 Subject: [PATCH 1/8] refactor zoomImage --- client/core/src/directives/zoom-image.js | 20 +--------------- client/core/src/styles/zoom-image.css | 29 ++++-------------------- 2 files changed, 5 insertions(+), 44 deletions(-) diff --git a/client/core/src/directives/zoom-image.js b/client/core/src/directives/zoom-image.js index dc75eda40..5703e4c64 100644 --- a/client/core/src/directives/zoom-image.js +++ b/client/core/src/directives/zoom-image.js @@ -4,7 +4,6 @@ export function directive($timeout) { let idContainer = 'zoomImage'; let container; let background; - let image; function createContainers(src) { if (document.getElementById(idContainer)) { @@ -15,31 +14,21 @@ export function directive($timeout) { background = document.createElement('div'); background.className = 'zoomImage-background'; + background.style.backgroundImage = `url(${src})`; container.appendChild(background); - image = document.createElement('img'); - image.src = src; - container.appendChild(image); - document.body.appendChild(container); - - $timeout(() => { - resizeImage(); - container.className = 'open'; - }, 250); } function addListeners() { background.addEventListener('click', destroyContainers); document.addEventListener('keydown', e => keyDownHandler(e)); - window.addEventListener('resize', resizeImage); } function removeListeners() { if (container) { background.removeEventListener('click', destroyContainers); document.removeEventListener('keydown', e => keyDownHandler(e)); - window.removeEventListener('resize', resizeImage); } } @@ -60,13 +49,6 @@ export function directive($timeout) { image = undefined; } - function resizeImage() { - if (image) { - image.style.marginLeft = `-${Math.floor(image.clientWidth / 2)}px`; - image.style.marginTop = `-${Math.floor(image.clientHeight / 2)}px`; - } - } - return { restrict: 'A', priority: 9999, diff --git a/client/core/src/styles/zoom-image.css b/client/core/src/styles/zoom-image.css index f21db8d13..87130d918 100644 --- a/client/core/src/styles/zoom-image.css +++ b/client/core/src/styles/zoom-image.css @@ -9,32 +9,11 @@ div#zoomImage, div#zoomImage .zoomImage-background { top: 0; z-index: 11; } -div#zoomImage{ - opacity: 0; - transition: visibility 0s, opacity 0.5s linear; -} div#zoomImage .zoomImage-background{ - background: rgba(0, 0, 0, 0.7); + background-color: rgba(0, 0, 0, 0.7); cursor: zoom-out; -} -div#zoomImage img{ - z-index: 12; - position: fixed; - max-height: 98%; - max-width: 98%; - left: 50%; - top: 50%; - opacity: 0; - transition: visibility 0s, opacity 1s linear; -} - -div#zoomImage.open { - visibility: visible; - opacity: 1; -} - -div#zoomImage.open img{ - visibility: visible; - opacity: 1; + background-repeat: no-repeat; + background-position: center center; + background-size: auto 98%; } \ No newline at end of file From 20506bdc59ccbf92e124f7d237e8150c42786cc0 Mon Sep 17 00:00:00 2001 From: Daniel Herrero Date: Wed, 14 Feb 2018 09:25:41 +0100 Subject: [PATCH 2/8] re-refactor zoomImage --- client/core/src/directives/zoom-image.js | 1 - 1 file changed, 1 deletion(-) diff --git a/client/core/src/directives/zoom-image.js b/client/core/src/directives/zoom-image.js index 5703e4c64..0bae2ef8b 100644 --- a/client/core/src/directives/zoom-image.js +++ b/client/core/src/directives/zoom-image.js @@ -46,7 +46,6 @@ export function directive($timeout) { container = undefined; background = undefined; - image = undefined; } return { From e4595da2a7bb438f1233c0d8eb5bce3ea53e872c Mon Sep 17 00:00:00 2001 From: Juan Ferrer Toribio Date: Wed, 14 Feb 2018 10:03:00 +0100 Subject: [PATCH 3/8] E2E test partially fixed --- .../src/components/main-menu/main-menu.html | 19 ++++++++++--------- e2e/helpers/extensions.js | 16 ++++++++-------- e2e/helpers/selectors.js | 1 - gulpfile.js | 2 +- services/loopback/common/locale/en.json | 3 ++- 5 files changed, 21 insertions(+), 20 deletions(-) diff --git a/client/salix/src/components/main-menu/main-menu.html b/client/salix/src/components/main-menu/main-menu.html index 4bd1f950f..116aab0c9 100644 --- a/client/salix/src/components/main-menu/main-menu.html +++ b/client/salix/src/components/main-menu/main-menu.html @@ -1,14 +1,5 @@
-
    -
  • - {{::lang}} -
  • -
-
  • @@ -16,6 +7,16 @@
+ +
    +
  • + {{::lang}} +
  • +