button icon

añadida ruta de clientes

@salix/app/src/configroutes.js

@@ -17,7 +17,7 @@ function config($stateProvider, $urlRouterProvider) {
     
     core.splitingRegister.registerGraph(deps);
 
-    $urlRouterProvider.otherwise('/customer/edit');
+    $urlRouterProvider.otherwise('/client/client-index');
 
 	for (var file in routes)
     routes[file].forEach(function (route) {

@salix/client/index.js

@@ -1 +0,0 @@
-export * from './src/client';

@salix/client/package.json

@@ -1,17 +0,0 @@
-{
-  "name": "@salix/client",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "repository": {
-    "type": "git",
-    "url": "ssh://repository@git.verdnatura.es:/var/lib/git/salix-client"
-  },
-  "author": "",
-  "license": "ISC",
-  "dependencies": {
-  }
-}

@salix/client/src/client.js

@@ -1,10 +0,0 @@
-export * from './module';
-
-export {NAME as CLIENT_DATA_BASIC_INDEX,
-	COMPONENT as CLIENT_DATA_BASIC_INDEX_COMPONENT} from './client/databasic';
-export {NAME as CLIENT_LEFT_MENU,
-	COMPONENT as CLIENT_LEFT_MENU_COMPONENT} from './client/leftmenu';
-export {NAME as CLIENT_TOP_BAR,
-	COMPONENT as CLIENT_TOP_BAR_COMPONENT} from './client/topbar';
-export {NAME as CLIENT_INDEX,
-	COMPONENT as CLIENT_INDEX_COMPONENT} from './client/index';

@salix/client/src/leftmenu/actions.html

@@ -1,7 +0,0 @@
-<vn-horizontal>
-    <ul>
-        <li>Datos fiscales y facturación</li>
-        <li>Consignatarios</li>
-        <li>Acceso web</li>
-    </ul>
-</vn-horizontal>

@salix/client/src/leftmenu/leftmenu.html

@@ -1,4 +0,0 @@
-<vn-vertical>
-    <vn-descriptor></vn-descriptor>
-    <vn-actions></vn-actions>
-</vn-vertical>

@salix/client/src/leftmenu/leftmenu.js

@@ -1,9 +0,0 @@
-import template from './leftmenu.html';
-import {module} from '../module';
-
-const _NAME = 'leftmenu';
-export const NAME = module.core.util.getName(_NAME);
-export const COMPONENT = {
-    template: template
-};
-module.component(NAME, COMPONENT);

@salix/client/src/module.js

@@ -1,6 +0,0 @@
-import {ng} from '@salix/vendor';
-import * as core from 'core';
-
-const DEPENDENCIES = [];
-export const NAME = core.util.getModuleName('client');
-export const  module = ng.module(NAME,DEPENDENCIES);

@salix/core/src/buttonicon/buttonicon.bt.html

@@ -0,0 +1,3 @@
+<!-- por definir -->
+
+

@salix/core/src/buttonicon/buttonicon.bt.js

@@ -0,0 +1,23 @@
+import {module as _module} from '../module';
+import * as util from '../util';
+import * as constant from '../constants';
+import template from './buttonicon.bt.html';
+
+const _NAME = 'buttonicon';
+const DEFAULT_CLASS = 'mdl-button mdl-js-button mdl-button--icon';
+
+export const NAME = util.getFactoryName(_NAME + constant.MATERIAL_DESIGN_FRAMEWORK);
+
+export function factory() {
+    return {
+        template: template,
+        default: {
+            className: DEFAULT_CLASS,
+            enabled: 'true',
+            typeName: 'button',
+            image:'',
+        }
+    }
+}
+
+_module.factory(NAME, factory);

@salix/core/src/buttonicon/buttonicon.js

@@ -0,0 +1,19 @@
+import {module as _module} from '../module';
+import * as resolveFactory from '../resolveDefaultComponents';
+import * as util from '../util';
+
+const _NAME = 'buttonicon';
+export const NAME = util.getName(_NAME);
+
+directive.$inject = [resolveFactory.NAME];
+export function directive(resolve) {
+    return {
+        require: 'E',
+        template: function(_, attr) {
+            return resolve.getTemplate(_NAME, attr);
+        }
+    };
+}
+
+_module.directive(NAME, directive);
+

@salix/core/src/buttonicon/buttonicon.mt.html

@@ -0,0 +1,4 @@
+<button type = "*[typeName]*" class="*[className]*">
+    <i class="material-icons">*[image]*</i>
+</button>
+

@salix/core/src/buttonicon/buttonicon.mt.js

@@ -0,0 +1,23 @@
+import {module as _module} from '../module';
+import * as util from '../util';
+import * as constant from '../constants';
+import template from './buttonicon.mt.html';
+
+const _NAME = 'buttonicon';
+const DEFAULT_CLASS = 'mdl-button mdl-js-button mdl-button--icon';
+
+export const NAME = util.getFactoryName(_NAME + constant.MATERIAL_DESIGN_FRAMEWORK);
+
+export function factory() {
+    return {
+        template: template,
+        default: {
+            className: DEFAULT_CLASS,
+            enabled: 'true',
+            typeName: 'button',
+            image:'',
+        }
+    }
+}
+
+_module.factory(NAME, factory);

@salix/core/src/core.js

@@ -13,6 +13,9 @@ export {NAME as ROUTESLOADER, RoutesLoader} from './routesLoader'
 export {NAME as BUTTON,directive as ButtonDirective} from './button/button'
 export {NAME as BUTTONMT,factory as buttonmt} from './button/button.mt'
 export {NAME as BUTTONBT,factory as buttonbt} from './button/button.bt'
+export {NAME as BUTTONICON,directive as ButtoniconDirective} from './buttonicon/buttonicon'
+export {NAME as BUTTONICONMT,factory as buttoniconmt} from './buttonicon/buttonicon.mt'
+export {NAME as BUTTONICONBT,factory as buttoniconbt} from './buttonicon/buttonicon.bt'
 export {NAME as CHECK,directive as CheckDirective} from './check/check'
 export {NAME as CHECKMT,factory as checknmt} from './check/check.mt'
 export {NAME as CHECKBT,factory as checkbt} from './check/check.bt'
@@ -40,3 +43,12 @@ export {NAME as SPINNERMT,factory as spinnermt} from './spinner/spinner.mt'
 export {NAME as VN_MAINMENU,
 	COMPONENT as VN_MAINMENU_COMPONENT} from './mainmenu/mainmenu';
 
+export {NAME as ACTIONS,
+	COMPONENT as ACTIONS_COMPONENT} from './leftmenu/actions';
+export {NAME as DESCRIPTOR,
+	COMPONENT as DESCRIPTOR_COMPONENT} from './leftmenu/descriptor';
+export {NAME as LEFTMENU,
+	COMPONENT as LEFTMENU_COMPONENT} from './leftmenu/leftmenu';
+export {NAME as CLIENT_TOP_BAR,
+	COMPONENT as CLIENT_TOP_BAR_COMPONENT} from './topbar/topbar';
+

@salix/core/src/leftmenu/actions.html

@@ -0,0 +1,5 @@
+<vn-horizontal>
+    <ul>
+        <li ng-repeat="item in $ctrl.items">{{item}}</li>
+    </ul>
+</vn-horizontal>

@salix/core/src/leftmenu/actions.js

@@ -1,9 +1,13 @@
 import template from './actions.html';
 import {module} from '../module';
+import * as util from '../util';
 
 const _NAME = 'actions';
-export const NAME = module.core.util.getName(_NAME);
+export const NAME = util.getName(_NAME);
 export const COMPONENT = {
-    template: template
+    template: template,
+    bindings: {
+        items: '<'
+    }
 };
 module.component(NAME, COMPONENT);

@salix/core/src/leftmenu/descriptor.js

@@ -1,8 +1,9 @@
 import template from './descriptor.html';
 import {module} from '../module';
+import * as util from '../util';
 
 const _NAME = 'descriptor';
-export const NAME = module.core.util.getName(_NAME);
+export const NAME = util.getName(_NAME);
 export const COMPONENT = {
     template: template
 };

@salix/core/src/leftmenu/leftmenu.html

@@ -0,0 +1,4 @@
+<vn-vertical>
+    <vn-descriptor></vn-descriptor>
+    <vn-actions items = "$ctrl.items"></vn-actions>
+</vn-vertical>

@salix/core/src/leftmenu/leftmenu.js

@@ -0,0 +1,13 @@
+import template from './leftmenu.html';
+import {module} from '../module';
+import * as util from '../util';
+
+const _NAME = 'leftmenu';
+export const NAME = util.getName(_NAME);
+export const COMPONENT = {
+    template: template,
+    controller: function(){
+        this.items = ["Datos fiscales y facturación", "Consignatarios", "Acceso web"]
+    }
+};
+module.component(NAME, COMPONENT);

@salix/core/src/topbar/topbar.js

@@ -1,8 +1,9 @@
 import template from './topbar.html';
 import {module} from '../module';
+import * as util from '../util';
 
 const _NAME = 'topbar';
-export const NAME = module.core.util.getName(_NAME);
+export const NAME = util.getName(_NAME);
 export const COMPONENT = {
     template: template
 };

@salix/crud/src/client/client.js

@@ -0,0 +1,4 @@
+export {NAME as CLIENT_DATA_BASIC_INDEX,
+	COMPONENT as CLIENT_DATA_BASIC_INDEX_COMPONENT} from './databasic/index';
+export {NAME as CLIENT_INDEX,
+	COMPONENT as CLIENT_INDEX_COMPONENT} from './index/index';

@salix/crud/src/client/index/index.js

@@ -1,8 +1,9 @@
 import template from './index.html';
-import {module} from '../module';
+import {module} from '../../module';
 
 const _NAME = 'clientIndex';
-export const NAME = module.core.util.getName(_NAME);
+//export const NAME = module.getName(_NAME);
+export const NAME = "vnClientIndex";
 export const COMPONENT = {
     template: template
 };

@salix/crud/src/client/routes.js

@@ -1,8 +1,8 @@
 [{
-    url: '/client',
-    state: 'index',
+    url: '/client/client-index',
+    state: 'client-index',
     template: '<vn-client-index></vn-client-index>',
-    module: 'client',
+    module: 'crud',
     description: '',
     image: '',
 }

@salix/crud/src/crud.js

@@ -1,4 +1,5 @@
 export * from './module';
+export * from './client/client'
 
 export {NAME as CUSTOMER_INDEX,
 	COMPONENT as CUSTOMER_INDEX_COMPONENT} from './customer/index';

@salix/login/app/index.js

@@ -0,0 +1 @@
+export * from './src/app'

@salix/login/app/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@salix/app",
+  "version": "0.0.0",
+  "description": "",
+  "main": "index.js",
+   "repository": {
+    "type": "git",
+    "url": "http://git.verdnatura.es:/salix"
+  }  
+}

@salix/login/app/src/app.js

@@ -0,0 +1,10 @@
+import {bootstrap} from './bootstrap';
+import * as spliting from './spliting';
+import * as routes from './configroutes';
+
+import padding from './styles/layout.css'
+import margin from './styles/margin.scss'
+import layout from './styles/padding.scss'
+import background from './styles/background.scss'
+
+bootstrap();

@salix/login/app/src/bootstrap.js

@@ -0,0 +1,17 @@
+import {ng} from 'vendor';
+import {NAME} from 'core';
+
+export const bootstrap = () => {
+    const selector = 'selector'
+    
+    let _script = document.currentScript || (() => {
+        let scripts = document.getElementsByTagName('script');
+        return scripts[scripts.length - 1];
+    })();
+
+    let _element = _script && document.querySelector(_script.getAttribute(selector));
+    if (!_element) {
+        throw new Error("element is not defined");
+    }
+    ng.bootstrap(_element, [NAME]);    
+};

@salix/login/app/src/configroutes.js

@@ -0,0 +1,34 @@
+import * as core from 'core';
+import * as spliting from './spliting';
+import * as deps from './spliting/deps.json';
+
+function loader(route) {
+    return function ($ocLazyLoad, $q) {
+        return $q((resolve) => {
+            core.splitingRegister.execute(route.module).then(function (dependencies) {
+                var array = dependencies.map((item) => { return { name: item } });
+                resolve($ocLazyLoad.load(array));
+            });
+        });
+    };
+}
+
+function config($stateProvider, $urlRouterProvider) {
+    
+    core.splitingRegister.registerGraph(deps);
+
+    $urlRouterProvider.otherwise('/client/index');
+
+	for (var file in routes)
+    routes[file].forEach(function (route) {
+        $stateProvider.state(route.state, {
+            url: route.url,
+            template: route.template,
+            resolve: {
+                loader: loader(route)
+            }
+        })
+    });
+}
+
+core.module.config(config);

@salix/login/app/src/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@salix/core",
+  "version": "0.0.0",
+  "description": "",
+  "main": "index.js",  
+   "repository": {
+    "type": "git",
+    "url": "http://git.verdnatura.es:/salix"
+  }  
+}

@salix/login/app/src/spliting/deps.json

@@ -0,0 +1,4 @@
+{
+	"app": ["crud"],
+    "crud": []
+}

@salix/login/app/src/spliting/import.tpl.js

@@ -0,0 +1 @@
+import * as core from 'core';

@salix/login/app/src/spliting/require.tpl.js

@@ -0,0 +1,11 @@
+
+export const $module = () => {
+  return new Promise(resolve => {
+    require.ensure([], () => {
+      require('$module');
+      resolve('$module');
+    }, '$module');
+  });
+};
+
+core.splitingRegister.register('$module', $module);

@salix/login/app/src/styles/background.scss

@@ -0,0 +1,27 @@
+@import "colors";
+
+$bg-main: $color-green;
+$bg-minor: $color-orange;
+$bg-content: $color-light-grey;
+$bg-panel: $color-white;
+$bg-dark-bar: $color-black;
+$bg-dark-menu: $color-dark-grey;
+
+html [bg-main], .bg-main {
+  background-color: $bg-main;
+}
+html [bg-minor], .bg-minor {
+  background-color: $bg-minor;
+}
+html [bg-content], .bg-content {
+  background-color: $bg-content;
+}
+html [bg-panel], .bg-panel {
+  background-color: $bg-panel;
+}
+html [bg-dark-bar], .bg-dark-bar {
+   background-color: $bg-dark-bar;
+}
+html [bg-dark-menu], .bg-dark-menu {
+  background-color: darken($bg-dark-menu, 35%);
+}

@salix/login/app/src/styles/colors.scss

@@ -0,0 +1,7 @@
+
+$color-green: rgb(139,195,74);
+$color-orange: rgb(255,171,64);
+$color-dark-grey: #424242;
+$color-light-grey: gray;
+$color-white: white;
+$color-black: black;

@salix/login/app/src/styles/font-family.css

@@ -0,0 +1,24 @@
+@font-face {
+    font-family: roboto-italic;
+    src: url(./fonts/Roboto-Italic.ttf);
+}
+@font-face {
+    font-family: roboto-thin;
+    src: url(./fonts/Roboto-Thin.ttf);
+}
+@font-face {
+    font-family: roboto-regular;
+    src: url(./fonts/Roboto-Regular.ttf);
+}
+@font-face {
+    font-family: roboto-condensed-italic;
+    src: url(./fonts/Roboto-CondensedItalic.ttf);
+}
+@font-face {
+    font-family: roboto-bold;
+    src: url(./fonts/Roboto-Bold.ttf);
+}
+@font-face {
+    font-family: roboto-bold-condensed;
+    src: url(./fonts/Roboto-BoldCondensed.ttf);
+}

@salix/login/app/src/styles/layout.css

@@ -0,0 +1,110 @@
+
+html, body {
+  height: 100%;
+  margin: 0px;
+  padding: 0px;
+}
+
+html [full-height], .full-height {  
+  height: 100%; 
+}
+html [self-scroll], .self-scroll {  
+  overflow: auto; 
+}
+
+/* Horizontal & vertical */
+
+html [vn-horizontal], vn-horizontal, .vn-horizontal,
+html [vn-vertical], vn-vertical, .vn-vertical {
+    display: flex;
+}
+html [vn-horizontal], vn-horizontal, .vn-horizontal {
+    flex-direction: row;
+}
+vn-horizontal [reverse] {
+    flex-direction: row-reverse;
+}
+html [vn-vertical], vn-vertical, .vn-vertical {
+    flex-direction: column;
+}
+vn-vertical [reverse] {
+    flex-direction: column-reverse;
+}
+html [wrap] {
+    flex-wrap: wrap;
+}
+html [wrap-reverse] {
+    flex-wrap: wrap-reverse;
+}
+html [scrollable] {
+    min-height: 1px;
+    flex: 1;
+    flex-basis: 0.000000001px;
+}
+
+/* Horizontal & vertical childs */
+
+html [vn-auto],
+html [vn-none],
+html [vn-one],
+html [vn-two],
+html [vn-three],
+html [vn-four],
+html [vn-five],
+html [vn-six],
+html [vn-seven],
+html [vn-eight],
+html [vn-nine],
+html [vn-ten],
+html [vn-eleven],
+html [vn-twelve]{
+    flex-basis: 0.000000001px;
+}
+html [vn-auto], vn-auto, .vn-auto {
+    flex: 1;
+    flex-basis: auto;
+}
+html [vn-empty], vn-empty, .vn-empty {
+    display: block;
+}
+html [vn-none], vn-none, .vn-none {
+    flex: 1;
+    flex: none;
+}
+html [vn-one], vn-one, .vn-one {
+    flex: 1;
+}
+html [vn-two], vn-two, .vn-two {
+    flex: 2;
+}
+html [vn-three], vn-three, .vn-three {
+    flex: 3;
+}
+html [vn-four], vn-four, .vn-four {
+    flex: 4;
+}
+html [vn-five], vn-five, .vn-five {
+    flex: 5;
+}
+html [vn-six], vn-six, .vn-six {
+    flex: 6;
+}
+html [vn-seven], vn-seven, .vn-seven {
+    flex: 7;
+}
+html [vn-eight], vn-eight, .vn-eight {
+    flex: 8;
+}
+html [vn-nine], vn-nine, .vn-nine {
+    flex: 9;
+}
+html [vn-ten], vn-ten, .vn-ten {
+    flex: 10;
+}
+html [vn-eleven], vn-eleven, .vn-eleven {
+    flex: 11;
+}
+html [vn-twelve], vn-twelve, .vn-twelve {
+    flex: 12;
+}
+

@salix/login/app/src/styles/margin.scss

@@ -0,0 +1,85 @@
+$margin-none: 0;
+
+/* Small */
+
+$margin-small: 8px;
+$margin-small-top: 8px;
+$margin-small-left: 8px;
+$margin-small-right: 8px;
+$margin-small-bottom: 8px;
+
+/* Medium */
+
+$margin-medium: 16px;
+$margin-medium-top: 16px;
+$margin-medium-left: 16px;
+$margin-medium-right: 16px;
+$margin-medium-bottom: 16px;
+
+/* Large */
+
+$margin-large: 32px;
+$margin-large-top: 32px;
+$margin-large-left: 32px;
+$margin-large-right: 32px;
+$margin-large-bottom: 32px;
+
+/* None */
+
+html [margin-none], .margin-none {
+    margin: $margin-none;
+}
+
+/* Small */
+
+html [margin-small], .margin-small {
+    margin: $margin-small;
+}
+html [margin-small-top], .margin-small-top {
+  margin-top: $margin-small-top;
+}
+html [margin-small-left], .margin-small-left {
+  margin-left: $margin-small-left;
+}
+html [margin-small-right], .margin-small-right {
+  margin-right: $margin-small-right;
+}
+html [margin-small-bottom], .margin-small-bottom {
+  margin-bottom: $margin-small-bottom;
+}
+
+/* Medium */
+
+html [margin-medium], .margin-medium {
+  margin: $margin-medium;
+}
+html [margin-medium-top], .margin-medium-top {
+  margin-top: $margin-medium-top;
+}
+html [margin-medium-left], .margin-medium-left {
+  margin-left: $margin-medium-left;
+}
+html [margin-medium-right], .margin-medium-right {
+  margin-right: $margin-medium-right;
+}
+html [margin-medium-bottom], .margin-medium-bottom {
+  margin-bottom: $margin-medium-bottom;
+}
+
+/* Large */
+
+html [margin-large], .margin-large {
+  margin: $margin-large;
+}
+html [margin-large-top], .margin-large-top {
+  margin-top: $margin-large-top;
+}
+html [margin-large-left], .margin-large-left {
+  margin-left: $margin-large-left;
+}
+html [margin-large-right], .margin-large-right {
+  margin-right: $margin-large-right;
+}
+html [margin-large-bottom], .margin-large-bottom {
+  margin-bottom: $margin-large-bottom;
+}

@salix/login/app/src/styles/padding.scss

@@ -0,0 +1,85 @@
+$pad-none: 0;
+
+/* Small */
+
+$pad-small: 8px;
+$pad-small-top: 8px;
+$pad-small-left: 8px;
+$pad-small-right: 8px;
+$pad-small-bottom: 8px;
+
+/* Medium */
+
+$pad-medium: 16px;
+$pad-medium-top: 16px;
+$pad-medium-left: 16px;
+$pad-medium-right: 16px;
+$pad-medium-bottom: 16px;
+
+/* Large */
+
+$pad-large: 32px;
+$pad-large-top: 32px;
+$pad-large-left: 32px;
+$pad-large-right: 32px;
+$pad-large-bottom: 32px;
+
+/* None */
+
+html [pad-none], .pad-none {
+  padding: $pad-none;
+}
+
+/* Small */
+
+html [pad-small], .pad-small {
+    padding: $pad-small;
+}
+html [pad-small-top], .pad-small-top {
+  padding-top: $pad-small-top;
+}
+html [pad-small-left], .pad-small-left {
+  padding-left: $pad-small-left;
+}
+html [pad-small-right], .pad-small-right {
+  padding-right: $pad-small-right;
+}
+html [pad-small-bottom], .pad-small-bottom {
+  padding-bottom: $pad-small-bottom;
+}
+
+/* Medium */
+
+html [pad-medium], .pad-medium {
+  padding: $pad-medium;
+}
+html [pad-medium-top], .pad-medium-top {
+  padding-top: $pad-medium-top;
+}
+html [pad-medium-left], .pad-medium-left {
+  padding-left: $pad-medium-left;
+}
+html [pad-medium-right], .pad-medium-right {
+  padding-right: $pad-medium-right;
+}
+html [pad-medium-bottom], .pad-medium-bottom {
+  padding-bottom: $pad-medium-bottom;
+}
+
+/* Large */
+
+html [pad-large], .pad-large {
+  padding: $pad-large;
+}
+html [pad-large-top], .pad-medium-large {
+  padding-top: $pad-large-top;
+}
+html [pad-large-left], .pad-large-left {
+  padding-left: $pad-large-left;
+}
+html [pad-large-right], .pad-large-right {
+  padding-right: $pad-large-right;
+}
+html [pad-large-bottom], .pad-large-bottom {
+  padding-bottom: $pad-large-bottom;
+}