diff options
| author | fnuesse <felix.nuesse@t-online.de> | 2018-12-15 15:59:21 +0300 |
|---|---|---|
| committer | fnuesse <felix.nuesse@t-online.de> | 2018-12-15 15:59:21 +0300 |
| commit | 78c7512200608cf0c4f24287b792b51e314a007e (patch) | |
| tree | 126fb3a6a6b7404aca90226f4c8d59172aeeead1 | |
| parent | 67fbba1a84fb863377b637ed0dc905ef5924bd08 (diff) | |
implemented icon upload in icon-picker
Signed-off-by: fnuesse <felix.nuesse@t-online.de>
| -rw-r--r-- | js/app/directives/iconpicker.js | 27 | ||||
| -rw-r--r-- | templates/views/partials/icon-picker.html | 14 |
2 files changed, 34 insertions, 7 deletions
diff --git a/js/app/directives/iconpicker.js b/js/app/directives/iconpicker.js index 2fabf176..bf2e8c03 100644 --- a/js/app/directives/iconpicker.js +++ b/js/app/directives/iconpicker.js @@ -93,7 +93,32 @@ return false; }; - scope.useIcon = function() { + $('#iconPicker-CustomIcon').on('change', function(ev) { + + console.log("upload"); + scope.customIcon = {}; + + var f = ev.target.files[0]; + var fr = new FileReader(); + + fr.onload = function(ev2) { + scope.customIcon.data=ev2.target.result; + scope.$apply(); + }; + + fr.readAsDataURL(f); + }); + + scope.useIcon = function() { + + if(scope.customIcon){ + var data = scope.customIcon.data; + scope.credential.icon.type = data.substring(data.lastIndexOf(":")+1,data.lastIndexOf(";")); + scope.credential.icon.content = data.substring(data.lastIndexOf(",")+1, data.length); + $('#iconPicker').dialog('close'); + return; + } + $http.get(scope.selectedIcon.url).then(function(result) { var base64Data = window.btoa(result.data); var mimeType = 'svg+xml'; diff --git a/templates/views/partials/icon-picker.html b/templates/views/partials/icon-picker.html index f3d41b69..bf1e3480 100644 --- a/templates/views/partials/icon-picker.html +++ b/templates/views/partials/icon-picker.html @@ -13,17 +13,19 @@ </div> <div class="iconModifier"> <input id="iconPicker-Search" class="iconSearch" type="text" placeholder="{{ 'pick.icon.search' | translate }}"> + <input id="iconPicker-CustomIcon" class="iconSearch" type="file"/> <!-- <div ng-repeat="(groupName, icons) in iconGroups"> <a ng-click="jumpToGroup(groupName)">{{groupName}}</a> </div>--> - <div ng-if="selectedIcon"> - {{ 'selected.icon' | translate}}: <br /> + <div ng-if="selectedIcon || customIcon"> + {{ 'selected.icon' | translate}}: <br /> - <img ng-src="{{selectedIcon.url}}" height="32"> - <br /> - <button ng-click="useIcon()" ng-if="selectedIcon">{{ 'use.icon' | translate}}</button> - </div> + <img ng-src="{{selectedIcon.url}}" height="32" ng-if="!customIcon"> + <img src="{{customIcon.data}}" height="32" ng-if="customIcon"> + <br /> + <button ng-click="useIcon()">{{ 'use.icon' | translate}}</button> + </div> </div> </div> </div>
\ No newline at end of file |