From 75b72dd97a2ec724d9f210c3623cb1035883ee4d Mon Sep 17 00:00:00 2001 From: Jon Lambson Date: Wed, 23 Aug 2017 13:26:31 -0600 Subject: [PATCH 1/6] added angular module --- assets/oauth3.org | 2 +- css/lib/angucomplete/angucomplete-alt.css | 70 +++++++++++++++++++++++ index.html | 2 + js/app.js | 2 +- js/controllers/dns-controller.js | 2 +- js/controllers/music-controller.js | 1 + js/controllers/website-controller.js | 17 ++++++ js/lib/angular/angucomplete-alt.min.js | 2 + templates/website.html | 16 ++++++ 9 files changed, 111 insertions(+), 3 deletions(-) create mode 100644 css/lib/angucomplete/angucomplete-alt.css create mode 100644 js/lib/angular/angucomplete-alt.min.js diff --git a/assets/oauth3.org b/assets/oauth3.org index 5f68ea1..9a7aa32 160000 --- a/assets/oauth3.org +++ b/assets/oauth3.org @@ -1 +1 @@ -Subproject commit 5f68ea19e22d05bebc6a289da0a89a714442e6d2 +Subproject commit 9a7aa3261f2ad97ebd436c8b1e86d168cf93023d diff --git a/css/lib/angucomplete/angucomplete-alt.css b/css/lib/angucomplete/angucomplete-alt.css new file mode 100644 index 0000000..82bc75d --- /dev/null +++ b/css/lib/angucomplete/angucomplete-alt.css @@ -0,0 +1,70 @@ +.angucomplete-title .highlight { + color: red; +} +.angucomplete-holder { + position: relative; +} + +.angucomplete-dropdown { + border-color: #ececec; + border-width: 1px; + border-style: solid; + border-radius: 2px; + width: 250px; + padding: 6px; + cursor: pointer; + z-index: 9999; + position: absolute; + /*top: 32px; + left: 0px; + */ + margin-top: -6px; + background-color: #ffffff; +} + +.angucomplete-searching { + color: #acacac; + font-size: 14px; +} + +.angucomplete-description { + font-size: 14px; +} + +.angucomplete-row { + padding: 5px; + color: #000000; + margin-bottom: 4px; + clear: both; +} + +.angucomplete-selected-row { + background-color: lightblue; + color: #ffffff; +} + +.angucomplete-image-holder { + padding-top: 2px; + float: left; + margin-right: 10px; + margin-left: 5px; +} + +.angucomplete-image { + height: 34px; + width: 34px; + border-radius: 50%; + border-color: #ececec; + border-style: solid; + border-width: 1px; +} + +.angucomplete-image-default { + /* Add your own default image here + background-image: url('/assets/default.png'); + */ + background-position: center; + background-size: contain; + height: 34px; + width: 34px; +} diff --git a/index.html b/index.html index c06650f..723b13c 100644 --- a/index.html +++ b/index.html @@ -5,6 +5,7 @@ Launch-pad + @@ -30,6 +31,7 @@ + diff --git a/js/app.js b/js/app.js index 64662f0..6e04297 100644 --- a/js/app.js +++ b/js/app.js @@ -1,4 +1,4 @@ -var app = angular.module('launchpad', ['oauth3.org', 'ui.router', 'LocalStorageModule']); +var app = angular.module('launchpad', ['oauth3.org', 'ui.router', 'LocalStorageModule', 'angucomplete-alt']); app.config(['$stateProvider', '$urlRouterProvider', 'localStorageServiceProvider', function ($stateProvider, $urlRouterProvider, localStorageServiceProvider) { diff --git a/js/controllers/dns-controller.js b/js/controllers/dns-controller.js index 76bca52..f3c904a 100644 --- a/js/controllers/dns-controller.js +++ b/js/controllers/dns-controller.js @@ -1,4 +1,4 @@ -app.controller('DnsController', [ +app.controller('dnsCtrl', [ '$scope', function($scope) { var vm = this; diff --git a/js/controllers/music-controller.js b/js/controllers/music-controller.js index e4087ea..3bb323d 100644 --- a/js/controllers/music-controller.js +++ b/js/controllers/music-controller.js @@ -2,4 +2,5 @@ app.controller('musicCtrl', [ '$scope', function($scope) { var vm = this; + }]); diff --git a/js/controllers/website-controller.js b/js/controllers/website-controller.js index b3498f9..9961caf 100644 --- a/js/controllers/website-controller.js +++ b/js/controllers/website-controller.js @@ -252,4 +252,21 @@ app.controller('websiteCtrl', [ vm.domains = els; }); vm.listSites(); + + + $scope.domain = [ + { domainName: "jon.lambson.daplie.com" }, + { domainName: "music.daplie.me" }, + { domainName: "jon.daplie.me" } + ]; + + $scope.localDomainSearch = function(str, domain) { + var matches = []; + domain.forEach(function(domain) { + if ((domain.domainName.toLowerCase().indexOf(str.toString().toLowerCase()) >= 0)) { + matches.push(domain); + } + }); + return matches; + }; }]); diff --git a/js/lib/angular/angucomplete-alt.min.js b/js/lib/angular/angucomplete-alt.min.js new file mode 100644 index 0000000..e30193e --- /dev/null +++ b/js/lib/angular/angucomplete-alt.min.js @@ -0,0 +1,2 @@ +/*! Copyright (c) 2014 Hidenari Nozaki and contributors | Licensed under the MIT license */ +!function(a,b){"use strict";"undefined"!=typeof module&&module.exports?module.exports=b(require("angular")):"function"==typeof define&&define.amd?define(["angular"],b):b(a.angular)}(window,function(a){"use strict";a.module("angucomplete-alt",[]).directive("angucompleteAlt",["$q","$parse","$http","$sce","$timeout","$templateCache","$interpolate",function(a,b,c,d,e,f,g){function h(b,f,g,h){function w(a,c){a&&("object"==typeof a?(b.searchStr=C(a),z({originalObject:a})):"string"==typeof a&&a.length>0?b.searchStr=a:console&&console.error&&console.error("Tried to set "+(c?"initial":"")+" value of angucomplete to",a,"which is an invalid value"),F(!0))}function x(a){na=null,b.hideResults(a),document.body.removeEventListener("click",x)}function y(a){return a.which?a.which:a.keyCode}function z(a){"function"==typeof b.selectedObject?b.selectedObject(a,b.selectedObjectData):b.selectedObject=a,F(a?!0:!1)}function A(a){return function(c){return b[a]?b[a](c):c}}function B(a){z({originalObject:a}),b.clearSelected&&(b.searchStr=null),U()}function C(a){return b.titleField.split(",").map(function(b){return D(a,b)}).join(" ")}function D(a,b){var c,d;if(b){c=b.split("."),d=a;for(var e=0;e'+f[0]+""):a,d.trustAsHtml(e)}function F(a){b.notEmpty=a,ia=b.searchStr,b.fieldRequired&&h&&b.inputName&&h[b.inputName].$setValidity(ha,a)}function G(a){var c=y(a);if(c!==l&&c!==j)if(c===k||c===n)a.preventDefault();else if(c===i)a.preventDefault(),!b.showDropdown&&b.searchStr&&b.searchStr.length>=fa&&(V(),b.searching=!0,Y(b.searchStr));else if(c===m)U(),b.$apply(function(){ea.val(b.searchStr)});else{if(0===fa&&!b.searchStr)return;b.searchStr&&""!==b.searchStr?b.searchStr.length>=fa&&(V(),ga&&e.cancel(ga),b.searching=!0,ga=e(function(){Y(b.searchStr)},b.pause)):b.showDropdown=!1,ia&&ia!==b.searchStr&&!b.clearSelected&&b.$apply(function(){z()})}}function H(a){!b.overrideSuggestions||b.selectedObject&&b.selectedObject.originalObject===b.searchStr||(a&&a.preventDefault(),e.cancel(ga),R(),B(b.searchStr))}function I(a){var b=getComputedStyle(a);return a.offsetHeight+parseInt(b.marginTop,10)+parseInt(b.marginBottom,10)}function J(){return la.getBoundingClientRect().top+parseInt(getComputedStyle(la).maxHeight,10)}function K(){return f[0].querySelectorAll(".angucomplete-row")[b.currentIndex]}function L(){return K().getBoundingClientRect().top-(la.getBoundingClientRect().top+parseInt(getComputedStyle(la).paddingTop,10))}function M(a){la.scrollTop=la.scrollTop+a}function N(){var a=b.results[b.currentIndex];b.matchClass?ea.val(C(a.originalObject)):ea.val(a.title)}function O(a){var c=y(a),d=null,e=null;c===n&&b.results?(b.currentIndex>=0&&b.currentIndex=1?(b.$apply(function(){b.currentIndex--,N()}),ma&&(e=L(),e<0&&M(e-1))):0===b.currentIndex&&b.$apply(function(){b.currentIndex=-1,ea.val(b.searchStr)})):c===o?b.results&&b.results.length>0&&b.showDropdown?b.currentIndex===-1&&b.overrideSuggestions?H():(b.currentIndex===-1&&(b.currentIndex=0),b.selectResult(b.results[b.currentIndex]),b.$digest()):b.searchStr&&b.searchStr.length>0&&H():c===m&&a.preventDefault()}function P(a){return function(c,d,e,f){d||e||f||!c.data||(c=c.data),b.searching=!1,Z(D(aa(c),b.remoteUrlDataField),a)}}function Q(a,c,d,e){b.searching=ka,c||d||e||(c=a.status),0!==c&&c!==-1&&(b.remoteUrlErrorCallback?b.remoteUrlErrorCallback(a,c,d,e):console&&console.error&&console.error("http error"))}function R(){ja&&ja.resolve()}function S(d){var e={},f=b.remoteUrl+encodeURIComponent(d);b.remoteUrlRequestFormatter&&(e={params:b.remoteUrlRequestFormatter(d)},f=b.remoteUrl),b.remoteUrlRequestWithCredentials&&(e.withCredentials=!0),R(),ja=a.defer(),e.timeout=ja.promise,ka=!0,c.get(f,e).then(P(d)).catch(Q).finally(function(){ka=!1})}function T(c){R(),ja=a.defer(),b.remoteApiHandler(c,ja.promise).then(P(c)).catch(Q)}function U(){b.showDropdown=!1,b.results=[],la&&(la.scrollTop=0)}function V(){b.showDropdown=ca,b.currentIndex=b.focusFirst?0:-1,b.results=[]}function W(a){var c,d,e,f,g=b.searchFields.split(","),h=[];for("undefined"!=typeof b.parseInput()&&(a=b.parseInput()(a)),c=0;c=0;d&&(h[h.length]=b.localData[c])}return h}function X(a,c,d){if(!d)return!1;for(var e in c)if(c[e].toLowerCase()===d.toLowerCase())return b.selectResult(a),!0;return!1}function Y(a){!a||a.length0)for(b.results=[],d=0;d=0)?na=null:(_=e(function(){U(),b.$apply(function(){b.searchStr&&b.searchStr.length>0&&ea.val(b.searchStr)})},s),R(),b.focusOut&&b.focusOut(),b.overrideSuggestions&&b.searchStr&&b.searchStr.length>0&&b.currentIndex===-1&&H())},b.resetHideResults=function(){_&&e.cancel(_)},b.hoverRow=function(a){b.currentIndex=a},b.selectResult=function(a){b.matchClass&&(a.title=C(a.originalObject),a.description=D(a.originalObject,b.descriptionField)),b.clearSelected?b.searchStr=null:b.searchStr=a.title,z(a),U()},b.inputChangeHandler=function(a){return a.length
{{ result.title }}
{{result.description}}
'),{restrict:"EA",require:"^?form",scope:{selectedObject:"=",selectedObjectData:"=",disableInput:"=",initialValue:"=",localData:"=",localSearch:"&",remoteUrlRequestFormatter:"=",remoteUrlRequestWithCredentials:"@",remoteUrlResponseFormatter:"=",remoteUrlErrorCallback:"=",remoteApiHandler:"=",id:"@",type:"@",placeholder:"@",textSearching:"@",textNoResults:"@",remoteUrl:"@",remoteUrlDataField:"@",titleField:"@",descriptionField:"@",imageField:"@",inputClass:"@",pause:"@",searchFields:"@",minlength:"@",matchClass:"@",clearSelected:"@",overrideSuggestions:"@",fieldRequired:"=",fieldRequiredClass:"@",inputChanged:"=",autoMatch:"@",focusOut:"&",focusIn:"&",fieldTabindex:"@",inputName:"@",focusFirst:"@",parseInput:"&"},templateUrl:function(a,b){return b.templateUrl||w},compile:function(a){var b=g.startSymbol(),c=g.endSymbol();if("{{"!==b||"}}"!==c){var d=a.html().replace(/\{\{/g,b).replace(/\}\}/g,c);a.html(d)}return h}}}])}); diff --git a/templates/website.html b/templates/website.html index da3db76..f5168ce 100644 --- a/templates/website.html +++ b/templates/website.html @@ -75,3 +75,19 @@ + + + + + +
+
From 2dc2dcf9fe416da02afdaaa16a6ef45ff754b1d7 Mon Sep 17 00:00:00 2001 From: Jon Lambson Date: Wed, 23 Aug 2017 17:07:15 -0600 Subject: [PATCH 2/6] added fake array --- js/controllers/website-controller.js | 9 +++++---- templates/website.html | 26 +++++++++++--------------- 2 files changed, 16 insertions(+), 19 deletions(-) diff --git a/js/controllers/website-controller.js b/js/controllers/website-controller.js index 9961caf..74cd889 100644 --- a/js/controllers/website-controller.js +++ b/js/controllers/website-controller.js @@ -254,16 +254,17 @@ app.controller('websiteCtrl', [ vm.listSites(); + $scope.domain = [ - { domainName: "jon.lambson.daplie.com" }, - { domainName: "music.daplie.me" }, - { domainName: "jon.daplie.me" } + { domain: "jon.lambson.daplie.com" }, + { domain: "music.daplie.me" }, + { domain: "jon.daplie.me" } ]; $scope.localDomainSearch = function(str, domain) { var matches = []; domain.forEach(function(domain) { - if ((domain.domainName.toLowerCase().indexOf(str.toString().toLowerCase()) >= 0)) { + if ((domain.domain.toLowerCase().indexOf(str.toString().toLowerCase()) >= 0)) { matches.push(domain); } }); diff --git a/templates/website.html b/templates/website.html index f5168ce..53e0de0 100644 --- a/templates/website.html +++ b/templates/website.html @@ -76,18 +76,14 @@ - - - - -
-
+
+
From 441b38edcf43cba4043bd221e4b0e36341a37d37 Mon Sep 17 00:00:00 2001 From: Jon Lambson Date: Wed, 23 Aug 2017 17:22:01 -0600 Subject: [PATCH 3/6] added better fake data --- js/controllers/website-controller.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/js/controllers/website-controller.js b/js/controllers/website-controller.js index 74cd889..1cb3d84 100644 --- a/js/controllers/website-controller.js +++ b/js/controllers/website-controller.js @@ -256,9 +256,10 @@ app.controller('websiteCtrl', [ $scope.domain = [ - { domain: "jon.lambson.daplie.com" }, - { domain: "music.daplie.me" }, - { domain: "jon.daplie.me" } + { amount: "0", createdAt: "1498687134570", domain: "asdf.daplie.me", id: "1a38260bac84e0c4f8c1edf3600d98ba", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "asdf", tld: "daplie.me", updatedAt: "1498687134570" }, + { amount: "0", createdAt: "1499722035396", domain: "two.daplie.me", id: "2ea60504fa2a917a5b3736c53a564fa4", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "two", tld: "daplie.me", updatedAt: "1499722035396" }, + { amount: "0", createdAt: "1502725301216", domain: "jon.lambson.daplie.me", id: "23117a47d1ef60a360b46a703afc1c67", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "jon.lambson", tld: "daplie.me", updatedAt: "1502725301216" }, + { amount: "0", createdAt: "1502990579539", domain: "joncloud.daplie.me", id: "ec7e4d8643537d7602fffd61b36e1676", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "joncloud", tld: "daplie.me", updatedAt: "1502990579539" } ]; $scope.localDomainSearch = function(str, domain) { From 7012c253a38cf3c41a7d7da6f9352bf84093dd51 Mon Sep 17 00:00:00 2001 From: Jon Lambson Date: Wed, 23 Aug 2017 17:46:02 -0600 Subject: [PATCH 4/6] pull' --- assets/oauth3.org | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/oauth3.org b/assets/oauth3.org index 9a7aa32..effee98 160000 --- a/assets/oauth3.org +++ b/assets/oauth3.org @@ -1 +1 @@ -Subproject commit 9a7aa3261f2ad97ebd436c8b1e86d168cf93023d +Subproject commit effee987beca6f0522a93533d65de1e7ed246987 From f59cdd96a0427061f346eec189e7a7a5e01b1349 Mon Sep 17 00:00:00 2001 From: Jon Lambson Date: Wed, 23 Aug 2017 17:56:18 -0600 Subject: [PATCH 5/6] fixed list, need to test --- js/controllers/website-controller.js | 9 +-------- templates/website.html | 1 + 2 files changed, 2 insertions(+), 8 deletions(-) diff --git a/js/controllers/website-controller.js b/js/controllers/website-controller.js index ee31b86..3147fb5 100644 --- a/js/controllers/website-controller.js +++ b/js/controllers/website-controller.js @@ -303,18 +303,11 @@ app.controller('websiteCtrl', [ Auth.api('domains.list', {}).then(function (els) { console.log('domains.list els', els); vm.domains = els; + $scope.domain = vm.domains; }); vm.listSites(); - - $scope.domain = [ - { amount: "0", createdAt: "1498687134570", domain: "asdf.daplie.me", id: "1a38260bac84e0c4f8c1edf3600d98ba", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "asdf", tld: "daplie.me", updatedAt: "1498687134570" }, - { amount: "0", createdAt: "1499722035396", domain: "two.daplie.me", id: "2ea60504fa2a917a5b3736c53a564fa4", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "two", tld: "daplie.me", updatedAt: "1499722035396" }, - { amount: "0", createdAt: "1502725301216", domain: "jon.lambson.daplie.me", id: "23117a47d1ef60a360b46a703afc1c67", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "jon.lambson", tld: "daplie.me", updatedAt: "1502725301216" }, - { amount: "0", createdAt: "1502990579539", domain: "joncloud.daplie.me", id: "ec7e4d8643537d7602fffd61b36e1676", session: "mmIoFLxbobxdhfSV8HWhokUGMRy-i5TIUZ_9c5ywGhYSuRi1KHh_aVSgBixxyHPW@oauth3.org", sld: "joncloud", tld: "daplie.me", updatedAt: "1502990579539" } - ]; - $scope.localDomainSearch = function(str, domain) { var matches = []; domain.forEach(function(domain) { diff --git a/templates/website.html b/templates/website.html index 8358702..2cc3b1e 100644 --- a/templates/website.html +++ b/templates/website.html @@ -84,6 +84,7 @@ +
Date: Thu, 24 Aug 2017 11:02:31 -0600 Subject: [PATCH 6/6] combox added --- css/lib/angucomplete/angucomplete-alt.css | 8 ++---- js/controllers/website-controller.js | 16 +++++++++-- templates/website.html | 34 ++++++++++------------- 3 files changed, 31 insertions(+), 27 deletions(-) diff --git a/css/lib/angucomplete/angucomplete-alt.css b/css/lib/angucomplete/angucomplete-alt.css index 82bc75d..c3f5ace 100644 --- a/css/lib/angucomplete/angucomplete-alt.css +++ b/css/lib/angucomplete/angucomplete-alt.css @@ -10,15 +10,13 @@ border-width: 1px; border-style: solid; border-radius: 2px; - width: 250px; + width: 100%; padding: 6px; cursor: pointer; z-index: 9999; position: absolute; - /*top: 32px; + top: 32px; left: 0px; - */ - margin-top: -6px; background-color: #ffffff; } @@ -39,7 +37,7 @@ } .angucomplete-selected-row { - background-color: lightblue; + background-color: steelblue; color: #ffffff; } diff --git a/js/controllers/website-controller.js b/js/controllers/website-controller.js index 3147fb5..9f0be2b 100644 --- a/js/controllers/website-controller.js +++ b/js/controllers/website-controller.js @@ -25,8 +25,8 @@ function handleFiles(ev) { window.document.body.addEventListener('change', handleFiles); app.controller('websiteCtrl', [ - '$scope', '$q', 'Auth', 'azp@oauth3.org' -, function ($scope, $q, Auth, Oauth3) { + '$scope', '$q', 'Auth', 'azp@oauth3.org', '$timeout' +, function ($scope, $q, Auth, Oauth3, $timeout) { var vm = this; vm.domains = []; @@ -307,6 +307,18 @@ app.controller('websiteCtrl', [ }); vm.listSites(); + vm.triggerDropdown = function() { + $timeout(function() { + var el = document.querySelector('.trigger-dropdown'); + angular.element(el).triggerHandler('focus'); + }, 0); + }; + + $scope.$watch('vm.selectedDomain', function(domainSelected) { + if (domainSelected !== undefined) { + vm.selectDomain(vm.selectedDomain.title); + } + }); $scope.localDomainSearch = function(str, domain) { var matches = []; diff --git a/templates/website.html b/templates/website.html index 2cc3b1e..e2d4dd0 100644 --- a/templates/website.html +++ b/templates/website.html @@ -24,15 +24,23 @@
. - +
+
+ +
-
- -
    -
    • -
@@ -81,18 +89,4 @@ - - - - -