Commit b6285217 authored by hadi's avatar hadi
Browse files

inline edit is moved from angular-material-dashboard to this module

parent 9053b0e9
Pipeline #15109294 passed with stage
in 3 minutes and 48 seconds
......@@ -19,7 +19,8 @@
"dist/angular-material-weburger-common.css"
],
"dependencies": {
"angular-material-weburger": "https://gitlab.com/weburger/angular-material-weburger.git#^0.2.2"
"angular-material-weburger": "https://gitlab.com/weburger/angular-material-weburger.git#^0.2.2",
"angular-xeditable": "^0.8.1"
},
"resolutions": {
"angular": "^1.6.0"
......
......@@ -16,11 +16,13 @@
<link rel="stylesheet" href="bower_components/pikaday/css/pikaday.css" />
<link rel="stylesheet" href="bower_components/handsontable/dist/handsontable.css" />
<link rel="stylesheet" href="bower_components/angular-material-weburger/dist/angular-material-weburger.css" />
<link rel="stylesheet" href="bower_components/angular-xeditable/dist/css/xeditable.css" />
<!-- endbower -->
<!-- endbuild -->
<!-- build:css({.tmp/serve,src}) styles/app.css -->
<!-- injector:css -->
<link rel="stylesheet" href="styles/am-wb-inline.css">
<link rel="stylesheet" href="styles/feature-list.css">
<link rel="stylesheet" href="styles/main.css">
<!-- endinjector -->
......@@ -94,6 +96,7 @@
<script src="bower_components/handsontable/dist/handsontable.js"></script>
<script src="bower_components/ngHandsontable/dist/ngHandsontable.js"></script>
<script src="bower_components/angular-material-weburger/dist/angular-material-weburger.js"></script>
<script src="bower_components/angular-xeditable/dist/js/xeditable.js"></script>
<!-- endbower -->
<!-- endbuild -->
......@@ -107,8 +110,10 @@
<script src="scripts/controllers/dialogmodel.js"></script>
<script src="scripts/controllers/features.js"></script>
<script src="scripts/controllers/video-player.js"></script>
<script src="scripts/directives/am-wb-inline.js"></script>
<script src="scripts/runs/settings.js"></script>
<script src="scripts/runs/widgets.js"></script>
<script src="scripts/runs/xeditable-options.js"></script>
<!-- endinjector -->
<!-- endbuild -->
</body>
......
.editable-click, a.editable-click, .editable-click:hover, a.editable-click:hover
{
border: inherit;
text-decoration: inherit;
color: inherit;
}
.editable-empty:hover {
color: inherit;
}
.my-editable:hover {
border: solid 1px;
}
.my-editable>.xedit-icon {
display: none;
cursor: pointer;
border-left: solid 1px;
height: 100%;
/* position: relative; */
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
top: 0;
right: 0;
bottom: 0;
/* z-index: 10; */
vertical-align: top;
}
.my-editable:hover>.xedit-icon {
display: inline-table;
}
.my-editable>.xedit-icon>ng-md-icon {
height: 100%;
/* position: relative; */
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
top: 0;
right: 0;
bottom: 0;
vertical-align: top;
}
/* Ling view if ther is and link value */
.feature-list-link{
......
......@@ -23,7 +23,10 @@
*/
'use strict';
angular.module('ngMaterialWeburgerCommon', [ 'ngMaterialWeburger' ]);
angular.module('ngMaterialWeburgerCommon', [
'ngMaterialWeburger',
'xeditable', //https://github.com/vitalets/angular-xeditable
]);
/*
* The MIT License (MIT)
......@@ -376,6 +379,77 @@ angular.module('ngMaterialWeburgerCommon')
});
// Global functions
});
/*
* Copyright (c) 2015-2025 Phoinex Scholars Co. http://dpq.co.ir
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
'use strict';
angular.module('ngMaterialWeburgerCommon')
/**
* @ngdoc directive
* @name amWbInline
* @description # amWbInline
*/
.directive('amWbInline', function($q, $parse) {
/**
* Link data and view
*/
function postLink(scope, attr, elem, ngModel) {
scope.$watch(function(){
return ngModel.$modelValue;
}, function(value) {
scope.myDataModel = value;
});
scope.$watch('myDataModel', function(value){
ngModel.$setViewValue(value);
})
scope.myDataModel = ngModel.$viewValue;
scope.ok = function(d){
ngModel.$setViewValue(d);
if(typeof scope.amWbInlineOnSave !== 'undefined'){
scope.$data = d;
scope.amWbInlineOnSave(scope);
}
}
}
return {
restrict : 'E',
transclude : true,
replace: true,
require: '^ngModel',
scope: {
amWbInlineType: '@',
amWbInlineEnable: '<',
amWbInlineLabel: '@?',
amWbInlineOnSave: '&?'
},
templateUrl : 'views/directives/am-wb-inline.html',
link: postLink
};
});
/*
* The MIT License (MIT)
*
......@@ -550,6 +624,55 @@ angular.module('ngMaterialWeburgerCommon')
});
});
/*
* Copyright (c) 2015-2025 Phoinex Scholars Co. http://dpq.co.ir
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
'use strict';
angular.module('ngMaterialWeburgerCommon')
/**
* تنظیمات مربوط به افزونه xeditable
*
*/
.run(function(editableOptions, editableThemes, $rootScope) {
// editableOptions.theme = 'default'; // Default theme. Can be also 'bs2', 'bs3'
editableThemes['angular-material'] = {
formTpl: '<form class="editable-wrap"></form>',
noformTpl: '<span class="editable-wrap"></span>',
controlsTpl: '<md-input-container class="editable-controls" ng-class="{\'md-input-invalid\': $error}"></md-input-container>',
inputTpl: '',
errorTpl: '<div ng-messages="{message: $error}"><div class="editable-error" ng-message="message">{{$error}}</div></div>',
buttonsTpl: '<span class="editable-buttons"></span>',
submitTpl: '<md-button type="submit" class="md-primary">save</md-button>',
cancelTpl: '<md-button type="button" class="md-warn" ng-click="$form.$cancel()">cancel</md-button>'
};
editableThemes['angular-material'].submitTpl = '<md-button class="md-icon-button md-primary" ng-click="$form.$submit()"><wb-icon>done<wb-icon></md-button>';
editableThemes['angular-material'].cancelTpl = '<md-button class="md-icon-button md-warn" ng-click="$form.$cancel()"><wb-icon>cancel<wb-icon></md-button>';
editableOptions.theme = 'angular-material';
// editableOptions.isDisabled="false";
editableOptions.iconSet="font-awesome";
});
angular.module('ngMaterialWeburgerCommon').run(['$templateCache', function($templateCache) {
'use strict';
......@@ -642,4 +765,9 @@ angular.module('ngMaterialWeburgerCommon').run(['$templateCache', function($temp
" <div layout=row layout-wrap layout-align=\"center center\"> <video width={{wbModel.setting.width}} height={{wbModel.setting.height}} ng-attr-autoplay=\"{{wbModel.setting.autoplay | trueOrUndefined}}\" ng-attr-controls=\"{{wbModel.setting.controls | trueOrUndefined}}\" ng-attr-loop=\"{{wbModel.setting.loop | trueOrUndefined}}\" poster={{wbModel.setting.poster}} preload={{wbModel.setting.preload}}> <source src={{wbModel.content.url}} type=\"{{wbModel.content.mimeType}}\"> Your browser does not support the video tag. It seems your browser is too old! </video> </div>"
);
$templateCache.put('views/directives/am-wb-inline.html',
"<div ng-switch=amWbInlineType> <div ng-switch-when=text editable-text=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=textarea editable-textarea=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=email editable-email=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=tel editable-tel=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=number editable-number=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=range editable-range=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=url editable-url=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=search editable-search=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=color editable-color=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=date editable-date=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=time editable-time=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=month editable-month=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=week editable-week=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=password editable-password=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=datetime editable-datetime-local=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> <div ng-switch-when=file editable-file=$parent.myDataModel onaftersave=$parent.ok($data) layout=row ng-class=\"{'my-editable' : $parent.amWbInlineEnable}\" md-colors=\"::{borderColor: 'primary-100'}\"> <ng-transclude flex></ng-transclude> <div class=xedit-icon ng-show=$parent.amWbInlineEnable md-colors=\"::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}\"> <wb-icon>edit</wb-icon> </div> </div> </div>"
);
}]);
.feature-list-link{cursor:pointer}
\ No newline at end of file
.my-editable>.xedit-icon,.my-editable>.xedit-icon>ng-md-icon{height:100%;box-sizing:border-box;margin:0;padding:0;top:0;right:0;bottom:0;vertical-align:top}.editable-click,.editable-click:hover,a.editable-click,a.editable-click:hover{border:inherit;text-decoration:inherit;color:inherit}.editable-empty:hover{color:inherit}.my-editable:hover{border:1px solid}.my-editable>.xedit-icon{display:none;cursor:pointer;border-left:solid 1px}.my-editable:hover>.xedit-icon{display:inline-table}.feature-list-link{cursor:pointer}
\ No newline at end of file
......@@ -23,4 +23,7 @@
*/
'use strict';
angular.module('ngMaterialWeburgerCommon', [ 'ngMaterialWeburger' ]);
angular.module('ngMaterialWeburgerCommon', [
'ngMaterialWeburger',
'xeditable', //https://github.com/vitalets/angular-xeditable
]);
/*
* Copyright (c) 2015-2025 Phoinex Scholars Co. http://dpq.co.ir
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
'use strict';
angular.module('ngMaterialWeburgerCommon')
/**
* @ngdoc directive
* @name amWbInline
* @description # amWbInline
*/
.directive('amWbInline', function($q, $parse) {
/**
* Link data and view
*/
function postLink(scope, attr, elem, ngModel) {
scope.$watch(function(){
return ngModel.$modelValue;
}, function(value) {
scope.myDataModel = value;
});
scope.$watch('myDataModel', function(value){
ngModel.$setViewValue(value);
})
scope.myDataModel = ngModel.$viewValue;
scope.ok = function(d){
ngModel.$setViewValue(d);
if(typeof scope.amWbInlineOnSave !== 'undefined'){
scope.$data = d;
scope.amWbInlineOnSave(scope);
}
}
}
return {
restrict : 'E',
transclude : true,
replace: true,
require: '^ngModel',
scope: {
amWbInlineType: '@',
amWbInlineEnable: '<',
amWbInlineLabel: '@?',
amWbInlineOnSave: '&?'
},
templateUrl : 'views/directives/am-wb-inline.html',
link: postLink
};
});
/*
* Copyright (c) 2015-2025 Phoinex Scholars Co. http://dpq.co.ir
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*/
'use strict';
angular.module('ngMaterialWeburgerCommon')
/**
* تنظیمات مربوط به افزونه xeditable
*
*/
.run(function(editableOptions, editableThemes, $rootScope) {
// editableOptions.theme = 'default'; // Default theme. Can be also 'bs2', 'bs3'
editableThemes['angular-material'] = {
formTpl: '<form class="editable-wrap"></form>',
noformTpl: '<span class="editable-wrap"></span>',
controlsTpl: '<md-input-container class="editable-controls" ng-class="{\'md-input-invalid\': $error}"></md-input-container>',
inputTpl: '',
errorTpl: '<div ng-messages="{message: $error}"><div class="editable-error" ng-message="message">{{$error}}</div></div>',
buttonsTpl: '<span class="editable-buttons"></span>',
submitTpl: '<md-button type="submit" class="md-primary">save</md-button>',
cancelTpl: '<md-button type="button" class="md-warn" ng-click="$form.$cancel()">cancel</md-button>'
};
editableThemes['angular-material'].submitTpl = '<md-button class="md-icon-button md-primary" ng-click="$form.$submit()"><wb-icon>done<wb-icon></md-button>';
editableThemes['angular-material'].cancelTpl = '<md-button class="md-icon-button md-warn" ng-click="$form.$cancel()"><wb-icon>cancel<wb-icon></md-button>';
editableOptions.theme = 'angular-material';
// editableOptions.isDisabled="false";
editableOptions.iconSet="font-awesome";
});
.editable-click, a.editable-click, .editable-click:hover, a.editable-click:hover
{
border: inherit;
text-decoration: inherit;
color: inherit;
}
.editable-empty:hover {
color: inherit;
}
.my-editable:hover {
border: solid 1px;
}
.my-editable>.xedit-icon {
display: none;
cursor: pointer;
border-left: solid 1px;
height: 100%;
/* position: relative; */
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
top: 0;
right: 0;
bottom: 0;
/* z-index: 10; */
vertical-align: top;
}
.my-editable:hover>.xedit-icon {
display: inline-table;
}
.my-editable>.xedit-icon>ng-md-icon {
height: 100%;
/* position: relative; */
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
top: 0;
right: 0;
bottom: 0;
vertical-align: top;
}
\ No newline at end of file
<div ng-switch="amWbInlineType">
<!-- TEXT -->
<div ng-switch-when="text"
editable-text="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- TEXTAREA -->
<div ng-switch-when="textarea"
editable-textarea="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- EMAIL -->
<div ng-switch-when="email"
editable-email="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- TEL -->
<div ng-switch-when="tel"
editable-tel="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- NUMBER -->
<div ng-switch-when="number"
editable-number="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- RANGE -->
<div ng-switch-when="range"
editable-range="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- URL -->
<div ng-switch-when="url"
editable-url="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- SEARCH -->
<div ng-switch-when="search"
editable-search="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- COLOR -->
<div ng-switch-when="color"
editable-color="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- DATE -->
<div ng-switch-when="date"
editable-date="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"
md-colors="::{color: 'primary',backgroundColor: 'primary-100', borderColor: 'primary-100'}">
<wb-icon>edit</wb-icon>
</div>
</div>
<!-- TIME -->
<div ng-switch-when="time"
editable-time="$parent.myDataModel"
onaftersave="$parent.ok($data)"
layout="row"
ng-class="{'my-editable' : $parent.amWbInlineEnable}"
md-colors="::{borderColor: 'primary-100'}">
<ng-transclude flex></ng-transclude>
<div class="xedit-icon" ng-show="$parent.amWbInlineEnable"