diff --git a/client/core/src/directives/index.js b/client/core/src/directives/index.js index 9a6531b1e8..02f9221499 100644 --- a/client/core/src/directives/index.js +++ b/client/core/src/directives/index.js @@ -5,3 +5,4 @@ import './validation'; import './acl'; import './on-error-src'; import './zoom-image'; +import './visible-by'; diff --git a/client/core/src/directives/specs/zoom-image.spec.js b/client/core/src/directives/specs/zoom-image.spec.js index 1ee7bbd797..85787bd4b0 100644 --- a/client/core/src/directives/specs/zoom-image.spec.js +++ b/client/core/src/directives/specs/zoom-image.spec.js @@ -55,17 +55,17 @@ describe('Directive zoomImage', () => { let image = getCompiledImage(``); image[0].click(); findContainer = document.getElementById(idContainer); - let findNewImage = findContainer.querySelector('img'); + let findNewImage = findContainer.querySelector('.zoomImage-background'); - expect(findNewImage.src).toEqual(srcDefault); + expect(findNewImage.style.backgroundImage).toEqual(`url("${srcDefault}")`); }); it('should create new image, into zoom container, with src likes zoomImage value', () => { let image = getCompiledImage(``); image[0].click(); findContainer = document.getElementById(idContainer); - let findNewImage = findContainer.querySelector('img'); + let findNewImage = findContainer.querySelector('.zoomImage-background'); - expect(findNewImage.src).toEqual(srcZoom); + expect(findNewImage.style.backgroundImage).toEqual(`url("${srcZoom}")`); }); }); diff --git a/client/core/src/directives/visible-by.js b/client/core/src/directives/visible-by.js new file mode 100644 index 0000000000..e05079fb5d --- /dev/null +++ b/client/core/src/directives/visible-by.js @@ -0,0 +1,17 @@ +import ngModule from '../module'; + +function vnVisibleBy(aclService) { + return { + restrict: 'A', + priority: -1, + link: function($scope, $element, $attrs) { + let acls = $attrs.vnVisibleBy.split(','); + if (!aclService.aclPermission(acls)) { + $element[0].style.visibility = 'hidden'; + } + } + }; +} +vnVisibleBy.$inject = ['aclService']; + +ngModule.directive('vnVisibleBy', vnVisibleBy); diff --git a/client/core/src/directives/zoom-image.js b/client/core/src/directives/zoom-image.js index dc75eda403..0bae2ef8be 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); } } @@ -57,14 +46,6 @@ export function directive($timeout) { container = undefined; background = undefined; - 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 { diff --git a/client/core/src/styles/zoom-image.css b/client/core/src/styles/zoom-image.css index f21db8d13a..87130d918a 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 diff --git a/client/item/routes.json b/client/item/routes.json index 74dbe6dadb..863a8a4b90 100644 --- a/client/item/routes.json +++ b/client/item/routes.json @@ -80,17 +80,6 @@ "icon": "folder" } },{ - "url" : "/picture", - "state": "item.card.picture", - "component": "vn-item-picture", - "params": { - "item": "$ctrl.item" - }, - "menu": { - "description": "Picture", - "icon": "folder" - } - }, { "url" : "/barcode", "state": "item.card.barcode", "component": "vn-item-barcode", diff --git a/client/item/src/descriptor/item-descriptor.html b/client/item/src/descriptor/item-descriptor.html index 3837e838a0..b7a8c9a1f4 100644 --- a/client/item/src/descriptor/item-descriptor.html +++ b/client/item/src/descriptor/item-descriptor.html @@ -3,10 +3,14 @@ - + + ng-src="http://verdnatura.es/vn-image-data/catalog/200x200/{{::$ctrl.item.image}}" + zoom-image="http://verdnatura.es/vn-image-data/catalog/900x900/{{::$ctrl.item.image}}" on-error-src/> + +
Id: {{$ctrl.item.id}}
diff --git a/client/item/src/item.js b/client/item/src/item.js index 6ba7dd8cf1..9ddba12ad0 100644 --- a/client/item/src/item.js +++ b/client/item/src/item.js @@ -11,6 +11,5 @@ import './tags/item-tags'; import './history/item-history'; import './niche/item-niche'; import './botanical/item-botanical'; -import './picture/item-picture'; import './barcode/item-barcode'; diff --git a/client/item/src/list/list.html b/client/item/src/list/list.html index 00f498d4ef..b3bee25709 100644 --- a/client/item/src/list/list.html +++ b/client/item/src/list/list.html @@ -8,8 +8,7 @@ on-search="$ctrl.search(index)" advanced="true" popover="vn-item-filter-panel" - ignore-keys = "['page', 'size', 'search']" - > + ignore-keys = "['page', 'size', 'search']"> diff --git a/client/item/src/locale/es.yml b/client/item/src/locale/es.yml index a80590f67e..34b6be39a5 100644 --- a/client/item/src/locale/es.yml +++ b/client/item/src/locale/es.yml @@ -13,7 +13,6 @@ Item history: Historial del artículo Item tags: Tags del artículo Niche: Nicho Picture: Foto -Item pictures: Fotos del artículo Barcode: Código barras Item barcode: Código de barras del artículo Changed by: Cambiado por diff --git a/client/item/src/picture/item-picture.html b/client/item/src/picture/item-picture.html deleted file mode 100644 index 93acec3c9a..0000000000 --- a/client/item/src/picture/item-picture.html +++ /dev/null @@ -1,5 +0,0 @@ - - - Item pictures - - \ No newline at end of file diff --git a/client/item/src/picture/item-picture.js b/client/item/src/picture/item-picture.js deleted file mode 100644 index 20fdd84990..0000000000 --- a/client/item/src/picture/item-picture.js +++ /dev/null @@ -1,5 +0,0 @@ -import ngModule from '../module'; - -ngModule.component('vnItemPicture', { - template: require('./item-picture.html') -}); diff --git a/client/salix/src/components/main-menu/main-menu.html b/client/salix/src/components/main-menu/main-menu.html index 4bd1f950f9..116aab0c91 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}} +
    • +