- The cheat sheet is using an
external script.
- To revert to hass-hue-icons, click
here.
+
+
+
+ Load Another Library
+
+
+
+
+ {{lib.name}} by {{lib.author}}
+
+
+
+
+
+
+ Hass Hue Icons by arallsopp
+
+
+
+
diff --git a/docs/build/tester/iconfinder.js b/docs/build/tester/iconfinder.js
index 0294a7e..4ba79ad 100644
--- a/docs/build/tester/iconfinder.js
+++ b/docs/build/tester/iconfinder.js
@@ -4,49 +4,72 @@ var app = angular.module("aaIconFinder", ['ngMaterial', 'ngMessages']);
app.controller('AppCtrl', ['$scope', '$http','$mdToast',
function($scope, $http, $mdToast) {
$scope.searchTerm = '';
-
- $scope.init = function(){
+ $scope.supportedLibraries = [{
+ name: 'bha-icons',
+ url: 'https://cdn.jsdelivr.net/gh/hulkhaugen/hass-bha-icons/dist/hass-bha-icons.js',
+ map: 'BHA_ICONS_MAP',
+ author: 'hulkhaugen',
+ repo: 'https://github.com/hulkhaugen/hass-bha-icons'
+ }, {
+ name: 'crypto-icons',
+ url: 'https://cdn.jsdelivr.net/gh/GH2user/hass-crypto-icons/dist/hass-crypto-icons.js',
+ map: 'CRYPTO_ICONS_MAP',
+ author: 'GH2user',
+ repo: 'https://github.com/GH2user/hass-crypto-icons'
+ }, {
+ name: 'custom-icons',
+ url: 'https://cdn.jsdelivr.net/gh/Mariusthvdb/custom-icons/custom-icons.js',
+ map: 'CUSTOM_ICONS_MAP',
+ author: 'Mariusthvdb',
+ repo: 'https://github.com/Mariusthvdb/custom-icons'
+ }];
+ $scope.activeExternalLibrary = false;
+
+ $scope.init = function () {
$scope.parseURLParams();
};
// set up current icon if provided
- $scope.parseURLParams = function() {
+ $scope.parseURLParams = function () {
let params = new URLSearchParams(document.location.search);
$scope.searchTerm = params.get('search')
? params.get('search')
: '';
- if(params.get('library')){
+ if (params.get('library')) {
console.log('loading external library');
$scope.externalLibrary = params.get('library');
$scope.mapName = params.get('map');
+
+ $scope.activeExternalLibrary = $scope.supportedLibraries.find(lib => lib.url == $scope.externalLibrary);
+
$scope.loadExternalIconLibrary();
- }else{
+ } else {
console.log('using default library');
$scope.externalLibrary = false;
$scope.importFromScript();
}
};
- $scope.copyDirectLink = function(){
+ $scope.copyDirectLink = function () {
let url = new URL(window.location.toString()),
params = new URLSearchParams(url.search);
- if (params.get('search')){
- params.set('search',$scope.searchTerm)
- }else{
+ if (params.get('search')) {
+ params.set('search', $scope.searchTerm)
+ } else {
params.append('search', $scope.searchTerm);
}
- $scope.copyToClipboard(url.origin + url.pathname + '?' + params.toString(),'Link copied to clipboard')
+ $scope.copyToClipboard(url.origin + url.pathname + '?' + params.toString(), 'Link copied to clipboard')
};
- $scope.copyToClipboard = function (content,msg) {
+ $scope.copyToClipboard = function (content, msg) {
let copyElement = document.createElement("textarea");
copyElement.style.position = 'fixed';
copyElement.style.opacity = '0';
- copyElement.textContent = (content);
+ copyElement.textContent = (content);
let body = document.getElementsByTagName('body')[0];
body.appendChild(copyElement);
@@ -54,44 +77,44 @@ app.controller('AppCtrl', ['$scope', '$http','$mdToast',
document.execCommand('copy');
body.removeChild(copyElement);
- $scope.showToast(typeof (msg)==="undefined" ? 'Copied to clipboard' : msg);
+ $scope.showToast(typeof (msg) === "undefined" ? 'Copied to clipboard' : msg);
};
- $scope.showToast = function(message){
+ $scope.showToast = function (message) {
$mdToast.show(
$mdToast.simple()
.textContent(message)
.hideDelay(3000))
- .then(function() {
+ .then(function () {
// Toast dismissed.
- }).catch(function() {
+ }).catch(function () {
//toast failed or got closed over
});
};
- $scope.updateSearchTerm = function(text){
+ $scope.updateSearchTerm = function (text) {
$scope.searchTerm = text;
};
- $scope.loadExternalIconLibrary = function(){
+ $scope.loadExternalIconLibrary = function () {
var scriptEl = document.createElement('script');
console.log('starting');
scriptEl.setAttribute('src', $scope.externalLibrary);
- scriptEl.setAttribute('type','text/javascript');
- scriptEl.onload = function($scope){
+ scriptEl.setAttribute('type', 'text/javascript');
+ scriptEl.onload = function ($scope) {
var scope = angular.element(document.querySelector('#outer')).scope();
- scope.$apply(function(){
+ scope.$apply(function () {
scope.importFromVariableScript();
});
};
document.head.appendChild(scriptEl);
};
- $scope.importFromVariableScript = function() {
+ $scope.importFromVariableScript = function () {
/* BASED ON scope.importFromScript which is neater */
console.log('importing from variable script');
@@ -118,7 +141,7 @@ app.controller('AppCtrl', ['$scope', '$http','$mdToast',
};
- $scope.importFromScript = function() {
+ $scope.importFromScript = function () {
console.log('importing!');
let icons = [];
for (const icon in HUE_ICONS_MAP) {
@@ -137,22 +160,33 @@ app.controller('AppCtrl', ['$scope', '$http','$mdToast',
};
-
/**
* Create filter function for a query string
*/
- $scope.matchesSearchTerm = function(icon){
- if(!$scope.searchTerm){
+ $scope.matchesSearchTerm = function (icon) {
+ if (!$scope.searchTerm) {
return true;
- }else {
+ } else {
let searchTerms = $scope.searchTerm.toLowerCase().split(' ');
- for(let i=0;i