Dialogo directiva y provider

This commit is contained in:
Juan Ferrer Toribio 2017-01-17 11:10:12 +01:00
parent 93cd67a551
commit 95caaf052a
16 changed files with 139 additions and 21 deletions

View File

@ -24,9 +24,9 @@ function vnAppInterceptor($q, $rootScope, $document) {
},
response: function(response) {
switch (response.config.method) {
case 'PUT':
case 'POST':
showMessage('Data saved!');
case 'PUT':
case 'POST':
showMessage('Data saved!');
}
$rootScope.loading = false;
return response;

View File

@ -50,5 +50,6 @@ export {directive as Icon} from './icon/icon';
export {factory as IconMdl} from './icon/icon.mdl';
export {directive as Popover} from './popover/popover';
export {directive as Dialog} from './dialog/dialog';
export {COMPONENT as Title} from './title/title';
export {COMPONENT as Subtitle} from './subtitle/subtitle';

View File

@ -0,0 +1,72 @@
import {module} from '../module';
import * as resolveFactory from '../resolveDefaultComponents';
require('./style.css');
directive.$inject = ['$compile', '$document', 'vnDialog'];
export function directive($compile, $document, dialog) {
return {
restrict: 'A',
link: function($scope, $element, $attrs, $ctrl) {
$element.on('click', function(event) {
let child = $document[0].createElement($attrs.vnDialog);
$compile(child)($scope);
dialog.show(child);
event.preventDefault();
});
}
}
}
module.directive('vnDialog', directive);
provider.$inject = ['$document'];
function provider($document) {
let lastEvent;
let popup;
let background;
let self = {
onDialogMouseDown: function(event) {
lastEvent = event;
},
onBackgroundMouseDown: function(event) {
if (event != lastEvent)
self.hide();
},
hide: function() {
$document[0].body.removeChild (background);
background = null;
popup = null;
},
show: function(child) {
background = $document[0].createElement('div');
background.className = 'vn-background';
background.addEventListener('mousedown', this.onBackgroundMouseDown);
popup = $document[0].createElement('div');
popup.className = 'vn-dialog';
popup.addEventListener('mousedown', this.onDialogMouseDown);
popup.appendChild (child);
background.appendChild (popup);
let style = popup.style;
let screenMargin = 20;
let width = popup.offsetWidth;
let height = popup.offsetHeight;
let innerWidth = window.innerWidth;
let innerHeight = window.innerHeight;
if(width + screenMargin > innerWidth) {
width = innerWidth - dblMargin;
style.width = width +'px';
}
if(height + screenMargin > innerHeight) {
height = innerHeight - dblMargin;
style.height = height +'px';
}
$document[0].body.appendChild (background);
}
};
return self;
}
module.provider('vnDialog', function() {this.$get = provider;});

View File

@ -0,0 +1,22 @@
.vn-dialog {
position: relative;
box-shadow: 0 0 .4em rgba(1,1,1,.4);
background-color: white;
border-radius: .2em;
overflow: auto;
top: 50%;
left: 50%;
width: 400px;
margin-top: -150px;
margin-left: -200px;
}
.vn-background {
z-index: 100;
position: fixed;
left: 0;
top: 0;
height: 100%;
width: 100%;
background-color: rgba(1,1,1,.4);
}

View File

@ -20,8 +20,8 @@ export function directive($compile, $document, popover) {
}
module.directive(NAME, directive);
$get.$inject = ['$document'];
function $get($document) {
provider.$inject = ['$document'];
function provider($document) {
var lastEvent;
var popover;
var self = {
@ -90,4 +90,4 @@ function $get($document) {
};
return self;
}
module.provider('vnPopover', function() {this.$get = $get;});
module.provider('vnPopover', function() {this.$get = provider;});

View File

@ -2,7 +2,7 @@ import {module} from '../module';
export const NAME = 'vnSubtitle';
export const COMPONENT = {
template: require('./template.html'),
template: require('./index.html'),
transclude: true
};
module.component(NAME, COMPONENT);

View File

@ -2,7 +2,7 @@ import {module} from '../module';
export const NAME = 'vnTitle';
export const COMPONENT = {
template: require('./template.html'),
template: require('./index.html'),
transclude: true
};
module.component(NAME, COMPONENT);

View File

@ -0,0 +1,9 @@
<form name="form" ng-submit="form.$valid && $ctrl.submit()" pad-large>
<vn-vertical>
<vn-textfield label="New password" field="$ctrl.newPassword" focus></vn-textfield>
<vn-textfield label="Repeat password" field="$ctrl.repeatPassword"></vn-textfield>
</vn-vertical>
<vn-horizontal margin-large-top>
<vn-submit label="Change password"></vn-submit>
</vn-horizontal>
</form>

View File

@ -0,0 +1,12 @@
export default {
template: require('./index.html'),
bindings: {
client: '<'
},
controller: controller
};
controller.$inject = ['$element'];
function controller($element) {
this.submit = function () {};
}

View File

@ -26,3 +26,8 @@ export {NAME as CLIENT_ADDRESSES_DATA_EDIT_INDEX,
COMPONENT as CLIENT_ADDRESSES_DATA_EDIT_INDEX_COMPONENT} from './addresses-data-edit/index';
export {NAME as CLIENT_CONFIRM_INDEX,
COMPONENT as CLIENT_CONFIRM_INDEX_COMPONENT} from './confirm/index';
import {module} from '../module';
import {default as changePassword} from './change-password/index';
module.component('vnClientChangePassword', changePassword);

View File

@ -1,13 +1,14 @@
<form name="form" ng-submit="form.$valid && web.submit()" pad-medium >
<vn-card>
<vn-vertical pad-large>
<vn-title>Acceso Web</vn-title>
<vn-check label="Acceso web activo" field="web.client.active"></vn-check>
<vn-textfield label="Usuario" class="padd-medium-top margin-medium-top" field="web.client.user" focus></vn-textfield>
<vn-title>Web access</vn-title>
<vn-check label="Web access enabled" field="web.client.active"></vn-check>
<vn-textfield label="User" class="margin-medium-top" field="web.client.user" focus></vn-textfield>
</vn-vertical>
</vn-card>
<vn-vertical>
<vn-submit margin-small-top label="Guardar"></vn-submit>
</vn-vertical>
<vn-horizontal margin-small-top>
<vn-submit label="Save"></vn-submit>
<vn-button label="Change password" vn-dialog="vn-client-change-password"></vn-button>
</vn-horizontal>
</form>
<vn-confirm-client client="web.client" client-old="web.clientOld" state="web.state"></vn-confirm-client>

View File

@ -15,10 +15,7 @@ goto caseUsage
if not exist "%nginxPrefix%\temp" (mkdir "%nginxPrefix%\temp")
start /I nginx -c "%nginxConf%" -p "%nginxPrefix%"
call forever start forever.json
call forever list
cd @salix
gulp
gulp --gulpfile @salix\gulpfile.js
goto caseExit
:caseStop

4
dev.sh
View File

@ -12,9 +12,9 @@ case "$1" in
start|"")
$0 stop
echo "################################ Starting services"
forever start forever.json
"$nginxBin" -c "$nginxConf" -p "$nginxPrefix"
cd @salix && gulp
forever start forever.json
gulp --gulpfile @salix/gulpfile.js
;;
stop)
echo "################################ Stoping services"

View File

@ -27,4 +27,3 @@ boot(app, __dirname, function(err) {
if (require.main === module)
app.start();
});