verdnatura/salix
verdnatura
/
salix
3
4
Fork 0
Code Issues Pull Requests 57 Releases Wiki Activity

vnPopover code clean, vnSearchbar popover bugs solved

This commit is contained in:
Juan 2018-03-17 20:59:02 +01:00
parent 378f053b18
commit 1c8b541e83
3 changed files with 39 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
client/core/src/components/popover/popover.js
View File

@ -88,6 +88,9 @@ export default class Popover extends Component {
this.showTimeout = this.$timeout(() => {
this.element.style.display = 'none';
this.showTimeout = null;
if (this.onClose)
this.onClose();
}, 250);
this.document.removeEventListener('keydown', this.docKeyDownHandler);
@ -95,9 +98,6 @@ export default class Popover extends Component {
if (this.deregisterCallback)
this.deregisterCallback();
if (this.onClose)
this.onClose();
}
/**
@ -186,35 +186,3 @@ ngModule.component('vnPopover', {
onClose: '&?'
}
});
class PopoverService {
constructor($document, $compile, $transitions, $rootScope) {
this.$compile = $compile;
this.$rootScope = $rootScope;
this.$document = $document;
this.stack = [];
}
show(child, parent, $scope) {
let element = this.$compile('<vn-popover/>')($scope || this.$rootScope)[0];
let popover = element.$ctrl;
popover.parent = parent;
popover.child = child;
popover.show();
popover.onClose = () => {
this.$document[0].body.removeChild(element);
if ($scope) $scope.$destroy();
};
this.$document[0].body.appendChild(element);
return popover;
}
showComponent(componentTag, $scope, parent) {
let $newScope = $scope.$new();
let childElement = this.$compile(`<${componentTag}/>`)($newScope)[0];
this.show(childElement, parent, $newScope);
return childElement;
}
}
PopoverService.$inject = ['$document', '$compile', '$transitions', '$rootScope'];
ngModule.service('vnPopover', PopoverService);

30
client/salix/src/components/searchbar/searchbar.html
View File

@ -1,14 +1,18 @@
<form ng-submit="$ctrl.onSubmit()">
<vn-horizontal>
<vn-textfield vn-one label="Search" model="$ctrl.stringSearch"></vn-textfield>
<vn-icon
pad-medium-top
ng-if="$ctrl.advanced"
ng-click="$ctrl.onpenFilters($event)"
icon="keyboard_arrow_down"
style="cursor: pointer;">
</vn-icon>
<vn-button ng-if="$ctrl.label" vn-none label="{{$ctrl.label}}"></vn-button>
<vn-icon-button ng-if="!$ctrl.label" icon="search" ng-click="$ctrl.clearFilter()"></vn-icon-button>
</vn-horizontal>
</form>
<vn-horizontal>
<vn-textfield vn-one label="Search" model="$ctrl.stringSearch"></vn-textfield>
<vn-icon
pad-medium-top
ng-if="$ctrl.advanced"
ng-click="$ctrl.onpenFilters($event)"
icon="keyboard_arrow_down"
style="cursor: pointer;">
</vn-icon>
<vn-button ng-if="$ctrl.label" vn-none label="{{$ctrl.label}}"></vn-button>
<vn-icon-button ng-if="!$ctrl.label" icon="search" ng-click="$ctrl.clearFilter()"></vn-icon-button>
</vn-horizontal>
</form>
<vn-popover
vn-id="popover"
on-close="$ctrl.onPopoverClose()">
</vn-popover>

39
client/salix/src/components/searchbar/searchbar.js
View File

@ -1,12 +1,10 @@
import ngModule from '../../module';
export default class Controller {
constructor($element, $scope, $document, $compile, vnPopover, $timeout, $state, $transitions) {
constructor($element, $scope, $compile, $timeout, $state, $transitions) {
this.element = $element[0];
this.$scope = $scope;
this.$document = $document;
this.$ = $scope;
this.$compile = $compile;
this.vnPopover = vnPopover;
this.$timeout = $timeout;
this.stringSearch = '';
this.$state = $state;
@ -91,23 +89,32 @@ export default class Controller {
filter = this.getFiltersFromString(this.stringSearch);
}
this.child = this.vnPopover.showComponent(this.popover, this.$scope, this.element);
this.$child = this.$compile(`<${this.popover}/>`)(this.$.$new());
// XXX: ¿Existe una forma más adecuada de acceder al controlador de un componente?
var childCtrl = angular.element(this.child).isolateScope().$ctrl;
var childCtrl = this.$child.isolateScope().$ctrl;
childCtrl.filter = Object.assign({}, filter);
childCtrl.onSubmit = filter => this.onChildSubmit(filter);
if (this.data)
childCtrl.data = Object.assign({}, this.data);
event.preventDefault();
this.$.popover.parent = this.element;
this.$.popover.child = this.$child[0];
this.$.popover.show();
}
onPopoverClose() {
this.$child.scope().$destroy();
this.$child.remove();
this.$child = null;
}
onChildSubmit(filter) {
this.$.popover.hide();
this.stringSearch = this.createStringFromObject(filter);
this.clearFilter();
this.$timeout(() => {
this.onSubmit();
});
this.$timeout(() => this.onSubmit());
}
onSubmit() {
@ -120,12 +127,6 @@ export default class Controller {
if (this.onSearch)
this.onSearch();
if (angular.element(this.child)) {
if (angular.element(this.child).scope())
angular.element(this.child).scope().$destroy();
angular.element(this.child).remove();
}
delete this.child;
this.pushFiltersToState(filter);
}
@ -139,12 +140,10 @@ export default class Controller {
let filter = JSON.parse(decodeURIComponent(this.$state.params.q));
this.stringSearch = this.createStringFromObject(filter);
}
this.$timeout(() => {
this.onSubmit();
});
this.$timeout(() => this.onSubmit());
}
}
Controller.$inject = ['$element', '$scope', '$document', '$compile', 'vnPopover', '$timeout', '$state', '$transitions'];
Controller.$inject = ['$element', '$scope', '$compile', '$timeout', '$state', '$transitions'];
ngModule.component('vnSearchbar', {
template: require('./searchbar.html'),