From 8581b1a4f8c31946542c8e4fd36fb7c824fefd13 Mon Sep 17 00:00:00 2001 From: Ian Prest Date: Fri, 11 Sep 2015 22:54:51 -0400 Subject: [PATCH] Reworked UI for the "tools" -- Went with another tab, instead of the dialog, so you could better see the outcome of an action. -- Replaced the "move legend pairs" buttons with an "align legends" function, which I think covers most of the cases, while also offering more possibilities. --- img/keystrip.png | Bin 2654 -> 0 bytes img/left2middle.png | Bin 1138 -> 0 bytes img/middle2right.png | Bin 1140 -> 0 bytes img/right2left.png | Bin 1097 -> 0 bytes img/swaptopbottom.png | Bin 969 -> 0 bytes img/swaptopbottomnums.png | Bin 1054 -> 0 bytes kb.css | 79 ++++++++++-- kb.html | 216 +++++++++++-------------------- kb.js | 258 ++++++++++++++++++-------------------- switches.json | 6 +- 10 files changed, 257 insertions(+), 302 deletions(-) delete mode 100644 img/keystrip.png delete mode 100644 img/left2middle.png delete mode 100644 img/middle2right.png delete mode 100644 img/right2left.png delete mode 100644 img/swaptopbottom.png delete mode 100644 img/swaptopbottomnums.png diff --git a/img/keystrip.png b/img/keystrip.png deleted file mode 100644 index eaf43b4452dad755cbe4911223f26d1460d2f06b..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2654 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 diff --git a/img/left2middle.png b/img/left2middle.png deleted file mode 100644 index 37b8bea3298e5b6b838afc2ac7c34a5e58463ec6..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1138 zcmV-&1daQNP)h($2XskIMF-yr0~7=K00L|uRmUf*iWD(v$3<;rI!VC!`F6)c=LQMB!R%Km{(PZML5*t~@HVE6G zLkH?eAq+(b)oldXUo6Tl| zAkr86`}>2zU{6mE!LqE?YVGUmn_qE^F+!-Mq{Lt_C@VH!*FVZX@Yc4%Z9AX5{q<@8$ek$`3p2xaViTip?nW1Tj+Q@8N>gVK zY_I>0TRO?HeSzy|92Rno^PLftAN}&~tKLsr3$M2At$61~Y~iSQ^Zh;bTSfzWjNx-X zaLXoPzyD$^=BO~Q5j69Q%CgQ#{duYN(5c0g002LZ)Ra)!)>e|G;ncul+_;@LRb-(}Hldq+^R)L^ayd#;2CjiRY&z)*0Oo>8%V$1HP z)2_CC&rpi3U0KYi;kj3~qK)M*Y)ng+%&TlUEPQZsCkf*ZKiX=2dsopB@o)W5u=m7g zTTOF0EJYT$G`(Dwr;9B5^%fId;Qa8ibH#7p_BMapwC9td`!Q+39)_UMCZ_(xyQKyt zRG-bhC;#P^z~z=lEGCtN2C9K-pc<$Ks)7CoK-b6DuWeJJtgrv4pqj7Oe7)xDHD9m! zdd=5szJ7ILB1tllNGQKW5(I%H$yIgqzFkV<-h3Es%~b;^La4H`G8hb|@d%b>{}rl#04ilEun+a diff --git a/img/middle2right.png b/img/middle2right.png deleted file mode 100644 index 68941c6d935bfffb4ed5961598491235afda7ff4..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1140 zcmV-)1dIELP)h($2XskIMF-yr0~8Dm`7-g?0000TX;fHrLvL+uWo~o;00000Lvm$d zbY)~9cWHEJAV*0}P-HG;2LJ#A>PbXFRA}DqnqN#?RUF5E_w@F*a{`8-#68 zA_TkbL1c?0-1_I9-ripBtq;Wx5SBLmvzp!CFbouc zVT@Up^>{o8XFt!c00?m$rkZ=oDdR?M&t2#-mo+pjaI8Q8jTc1 zB@0JJM*M#N;NT#|ah%y~9v&WE>2X2`#<;SwQm5194O9?>nVA_u5LP;t5K>=XKQ}jr z03a5Nt%*xf6e}t!GNN2s4Bh%mNvDUwV5qLHjz*(vvWgG_0Q9)>}+khG7(C z{ngQ#I&A5;0p}|pmmGS1XW7oDAGvYvq<8Y>JV(UEiJOtxsn_=6ZwHUmJd6N9oZ@BXxj*YFyWG9M_U&tt)wR;~5B9ZepYrW9A&3Oe z{K#)O4)?>C(-B*(aie;aaSkYoMo<5Jq3f*^YbgN$pwxc&xn<`oOY%L&k)?Y^G|EcC zMt?c`Qy74*YI1*lW%l;spL{rYv{ieNo+0FYdrwYo6Vj+~m-fy3WJmhsVbwP)MK})2ptgC+XEeCjEZ( zN{Cmo1e&p9&_g9sX!Z}o!S_!+5np*gNDDvTP#!H#JwB=2g5qb6beZ4WQ~s{>pLi(U zf9&%ecaII)RBnO`3mXmeSh-1?(_~^w?H^sVr*cH@>h^XoxIP`f6OmV4btoEdV_S~B zQ>Dv!)~6WBB`es)DMZD(C|On!c{jy%fowuFoZ?s_Ruf-)%B{bUr~xsEEdcE6-g9DgisowdcA&ndOGnOkv9_rAs7tm_4+hiUsO~?2pJt6 zm1Q}9H%^3fI-SvIOaqjnD2#DIy*R2j{0AD8VVFE8c2Nr# zRx1EN^6wIl$HTI0adB}WfMSg6>gxP{e-e-4IPQOu_5T1nP%FCUlexD50000h($2XskIMF-yr0~8D`!d%f10000TX;fHrLvL+uWo~o;00000Lvm$d zbY)~9cWHEJAV*0}P-HG;2LJ#Azez+vRA}Dqntww8ZKbP<1t)IO zADGhaK-x?~AsQIlWZF!aP_$h^SEL1P=|B+2XlTKKEDnl}EX%fkTI}c+md$Q%Q#Pid zsI8O^)Y?gV{*%|sk6x~S*rhIuk@H7P={k|ZlWm(98 zz!(dH;BvX*c+66wtEvTGv=Mh5j zgF{0@UaxmxU;v4tn3tC~I5@amaY6{jxU{sCFqD;*g+if(sv?8{0F!i#EXxLi0RSL8_uKVv|GF>55@f>p z2dZu6T-9Y4eK6R2$^H8bk(VE3Ohpy%oo+ak&9bprEa^Zd)m7!$FOHQreiuxh{qQZ% zpI7X;lnTtq?aS|cFj;@`{kOB2XX_A@=%bPD6ZLTQ+VR4bhNc8v41D=RaK)_n{Ws%_ z_QSji(D2<~N#%J*Ww{|S^Qv;S|FgeCD}$zi)?0Ft!S*0*Izi zvJ9e8ELDeLHlhq3&s{%btL^1FttVg8(@AE7H5yrJefL;DsQk~hQU3Oid@yVleEFCv~4v4GuDk^Jx^vTGW&aaf- zQM|0-BYyYZRXY_v*nVzT{p&BEk0x#+xS|@TdyjsNpoa1beHZ52`u~_)l>c*G#Nd3P z@#E94sC~!k3TwJ=)^u;U^mKN`SgZ2C9K>%6>G>zMfti zsOIZ6U$6Ok&DU$bUi0;uuUFUbDT<0jBI&0Ihr<*_sQ}gM_2c8?OP?ds7Lp_d0s*~V zuR?mG(MSjx9v+ruIep?%6vuHq&#M4M2w{vf>Wibc!+)VcS(Z(6fvd1C(dg2@4io^G z&E}Djk<0`g9UV2B%}+s_nwolgdKMNIGL4cD(%ISB($ex2)NZ#|RaG@KH2D4g3|Rxg zV9@XPI~x;m@X3IGuQyTs*k34&lUnKA(sV{EZlyk2h{4~e4qTvYuNP>b!B6`%h~ P00000NkvXXu0mjf(uxRq diff --git a/img/swaptopbottom.png b/img/swaptopbottom.png deleted file mode 100644 index 77c26c08130db5bc1d5ed990b619f82dee78de6c..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 969 zcmV;)12+7LP)h($2XskIMF-yr0~8G>JCX@c0000TX;fHrLvL+uWo~o;00000Lvm$d zbY)~9cWHEJAV*0}P-HG;2LJ#AKS@MERA}DqnqNp$Q5?sA_ip!Y*SleVNCE{DN|VHw z7S@F#TMN>phcY+D%84-PVJi$`>60K5v=W4bRfNWnOHYeE1j1s0k$Xu+)Ec2+4kNrn)z z+wDG|&tkD)48vHhR)%46vLs0ep=2^CNs??#8jXe^2!p|ZVOVZ(Vq$`2*-$8ikt7+3 zMAkbRAw<)3ZEdYir<0A6=lS{hd7kIjyA&bR)YP=Ryo{&Q>AYA>rBXFDHF6>X07X%C zb#=*PGB1q~LI9xMI6)LeilP8OScyD(5P16uiR)#pvFc>|P3Q5wn!gN6l4K^6*;LXN zoRoe)*mh&Vaqs%&Qti)B0ZI509qMvG@I_~(R<4~cyin@n8)WXan~zfY$`L6z`gkeX zS!s}q5-%)CfN5}SGX>LN8A;Bl#bGCyN~u!jl+rTc!vZI65QNp)n6$rCD(I`KOOa2cBxO@3V^7+uD@^Xt%9>Isg{5ch zX3xv`+Tv5|xm)9(Gs@gc?S6CTg?#{U@anaOUAUx3N}|Hj(Q&pMfI581WjnSv6RnSHJ2irCN`x^|%_BzYgJe zI-QmuC6!9yI9@EJUay~L} zilxLbjHYQtJ@~0-&wocrlBCS(T)YW_kZml$O(s(`8dWCc)YO#8WC8%(<#G)V569zi zr6D4O`uqDm9uENEEiEn0&CO1yGaL>p#Px|pA{-9e?RJ~ZX0ccR0J7~He!rh#7^Bgs r1WKBw8yg#0md$mSU>wIOKgYiV1K?>Y{9@7)00000NkvXXu0mjfF+aeJ diff --git a/img/swaptopbottomnums.png b/img/swaptopbottomnums.png deleted file mode 100644 index 7e87c1be617148edd128d5ef32f26bd3563a30ec..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1054 zcmV+(1mXLMP)h($2XskIMF-yr0~8Jfve+yB0000TX;fHrLvL+uWo~o;00000Lvm$d zbY)~9cWHEJAV*0}P-HG;2LJ#Alu1NERA}Dq+HXh{X&3THh$6DpIF z?!#?VgZ(kxgZxuOS<0N1vak}d76#$fhY&=9_6mfA%{VL;S^8v11WOx6M*1a{P-}?{ z{SeWOcd+lx?2fZ@AFNGGH0c=MrFlN?v%~y&-{+b4oj)Ldimt9MQ50F01pS9EXx%Y71h<%q9~^RVHgI+SXEWSFid07G;Ool1VKOurGD)1?+=AS zy}i9imSv~Y+1J-Mcg8WsJkJ*t6xi){)1Zo?jE#*ciZXX%F~((OWs{SW6aXX=iFtJy zkH_=#^UYKO0LO8Kg@vlB&g&|SF#s?N9;53z$8i9lz3aPqE%vPjgX5Q{o=jwK@ zrT=Fu%d*L2a={d{*l~%M*N>kauf2NuXcqIiY{1a|8fNUi3uq*H3ZD zC8^{WZhqz`qvv+#gzCu^%z{#jW(`0zg%-*n8YK-gE0}^b2@7gL7ffblYp=#-{fmV5 z{zcSqW-%s07d;ohwfnbR(&n%E_Pi>8aGQe^DA;nV+8mbq0RT3gIJsjrWsnNB<+$tX zOE&;;TaS2awy&YdZYFDGvY;09o1yu<8g|jmH~A*9HXP7v#%pe z3q?^zMn)VC$1-X(BO?Q2JTNez>*j4lD2lS%?SddI1Bwvhd7h{@j@AYLyN0qXYjT5s zeQ26C`>g{704|qnaBz@J=+MxR%jNnA^?JP>9Uart)1)ae#;vWbjg5^Tp_P@D<>lpd zb#;+QgpeAD#bS|2M3SVMni{v;4FHh(x+D+?h@zO8nMnea=lSB|;!r4*;vrd<)1vGD Y1D-})-T~$|tpET307*qoM6N<$f^WC<6aWAK diff --git a/kb.css b/kb.css index bfca0c0..d038232 100644 --- a/kb.css +++ b/kb.css @@ -92,7 +92,7 @@ html, body { #keyboard .selected .keyborder, #keyboard .selected .decal .keyborder { border-color: red !important; border-style: solid; } #keyboard .ghosted { opacity: 0.5; } #keyboard .decal .keyborder { border-style: none !important; background: transparent !important; } -#keyboard .hover .decal .keyborder, +#keyboard .hover .decal .keyborder, #keyboard .selected .decal .keyborder { border-style: dashed !important; border-width: 1px; } /* Key labels */ @@ -294,7 +294,7 @@ for i in (1..9) { /* Combining rectangle glyph */ .combine-rect:before { content: '\25AD'; - font-style: normal; + font-style: normal; /*margin: 0 -0.66em 0 -0.33em;*/ } @@ -372,18 +372,73 @@ table.summarytable th, table.summarytable td { padding: 2px 5px; } -table.imgtable th, table.imgtable td { - padding: 2px; +settings-key(size, adjust = 0) { + position: relative; + width: size px; + height: size px; + float: left; + + outerPad = 6 + innerPad = 3 + innerSize = (size - outerPad * 2) + labelSize = (innerSize - innerPad * 2) + + & .keyborder { + position: absolute; + width: size px; + height: size px; + border-style: solid; + border-width: 1px; + border-color: black; + border-radius: 5px; + background-color: #cccccc; + pointer-events: none; + } + & .keylabels { + position: absolute; + left: outerPad px; + top: 3px; + width: innerSize px; + height: (innerSize - adjust) px; + padding: innerPad px; + border-style: solid; + border-width: 1px; + border-color: rgba(0,0,0,0.1); + background-color: #fcfcfc; + border-radius: 3px; + pointer-events: none; + } + & .keylabel { + position: absolute; + width: labelSize px; + height: (labelSize - adjust) px; + pointer-events: none; + } + & .keylabel div { + position: absolute; + width: labelSize px; + max-width: labelSize px; + height: (labelSize - adjust) px; + pointer-events: none; + } + & .keylabel div * { + pointer-events: all; + } } -table.keytable { - border: 1px solid black; - border-collapse: collapse; -} -table.keytable th, table.keytable td { - padding: 2px; +#label-move-src, #label-move-dst { + settings-key(108, 8); + .keylabel9, .keylabel10, .keylabel11 { overflow: visible; } + input { z-index: 1; } } -table.keystable th, table.keystable td { - padding: 5px; +#text-align { + settings-key(108); + .keylabel button { + display: inline-block; + font-size: 16px; + width: 28px; + z-index: 1; + float: none; + } } diff --git a/kb.html b/kb.html index 5416145..d45db1c 100644 --- a/kb.html +++ b/kb.html @@ -86,8 +86,8 @@ Nav Bar / Header Color Swatches @@ -106,8 +106,6 @@ Nav Bar / Header
@@ -837,7 +836,73 @@ Nav Bar / Header
- + +
+ +
+
Remove Legends:
+
+
+ +
+
+ +
Misc:
+
+ +
+ +
+ +
+
Align Legends:
+
+
+
+
+
+ +
+
+
+
+
+ +
+
Move Legends:
+
+
+
+
+
+
+
+
+
+
  
+
+
+
+
+
+
+
+
+   + +
+ +
+ +
+ + All tools will affect the selected keys only; if no keys are selected, tools will affect all keys. + +
+ +
+ +
@@ -1010,147 +1075,6 @@ Options Dialog
- - - diff --git a/kb.js b/kb.js index a56785b..722feed 100644 --- a/kb.js +++ b/kb.js @@ -280,11 +280,11 @@ thisk += key.width + " x " + key.height; if(!key.decal) { var foo = key.color; // next line refused to work with key.color. - var colourname = reverseColors[foo]; + var colourname = reverseColors[foo]; if(!colourname) { // not a defined name colourname = ""; } - thisk += " " + colourname + " (" + key.color + ")"; + thisk += " " + colourname + " (" + key.color + ")"; } if(kcounts[thisk]) { kcounts[thisk]++; @@ -327,133 +327,128 @@ }; // for printing the summary only. Modified from http://stackoverflow.com/questions/468881/print-div-id-printarea-div-only/7532581#7532581 answered Feb 27 '14 at 17:47 - $scope.printDiv = function(divName){ - var printContents = document.getElementById(divName).innerHTML; - document.getElementById("summary_print").innerHTML = printContents; - document.getElementById("body_all").style.display = "none"; - document.getElementById("summary_print").style.display = ""; - window.print(); - document.getElementById("summary_print").innerHTML = ""; - document.getElementById("body_all").style.display = ""; - document.getElementById("summary_print").style.display = "none"; - }; - - $scope.removeLegends = function(param) { - var prop = 'labels'; - switch (param) { - case 'all' : var re = /.*/; break; - case 'alphas' : var re = /^[A-Za-z]$/; break; - case 'nums' : var re = /^[0-9]*$/; break; - case 'punct' : var re = /^[\`\~\!\@\#\$\%\^\&\*\(\)\-\_\=\+\[\{\]\}\;\:\'\"\,\<\.\>\/\?\\\|]$/; break; - case 'fn' : var re = /F\d\d?/; break; - case 'specials' : var re = /<.*>/; break; - case 'others' : var re = /^[^A-Za-z0-9\`\~\!\@\#\$\%\^\&\*\(\)\-\_\=\+\[\{\]\}\;\:\'\"\,\<\.\>\/\?\\\|]$|^[A-Za-z\s][A-Za-z\s]+$|\&\#.*|\&.*?;/; break; - case 'decals' : { - angular.forEach($scope.keys(), function(key) { - if(key.decal) { - for (var i=0; i<=11; i++){ - if (key.labels[i]){ - var lab = ""; - update(key,prop,lab,i); // should we wipe the textSize and textColor too? - renderKey(key); - } - } - } - }); break; - } - } - angular.forEach($scope.keys(), function(key) { - if(!key.decal) { - for (var i=0; i<=11; i++){ - if (key.labels[i]){ - var lab = key.labels[i]; - lab = lab.replace(re, ''); - update(key,prop,lab,i); // should we wipe the textSize and textColor too? - renderKey(key); - } - } - } - }); + $scope.printDiv = function(divName) { + var printContents = document.getElementById(divName).innerHTML; + document.getElementById("summary_print").innerHTML = printContents; + document.getElementById("body_all").style.display = "none"; + document.getElementById("summary_print").style.display = ""; + window.print(); + document.getElementById("summary_print").innerHTML = ""; + document.getElementById("body_all").style.display = ""; + document.getElementById("summary_print").style.display = "none"; + }; + + $scope.removeLegendsButtons = [ + { label: "All", re: /.*/, tooltip: "Remove all the legends from all the keys. Does not remove decals." }, + { label: "Alphas", re: /^[A-Za-z]$/, tooltip: "Remove the legends from all the Alphabetical keys." }, + { label: "Numbers", re: /^[0-9]*$/, tooltip: "Remove the legends from all the Number keys." }, + { label: "Punctuation", re: /^[\`\~\!\@\#\$\%\^\&\*\(\)\-\_\=\+\[\{\]\}\;\:\'\"\,\<\.\>\/\?\\\|]$/, tooltip: "Remove the legends from all the Punctuation keys." }, + { label: "Function", re: /F\d\d?/, tooltip: "Remove the legends from all the Function keys." }, + { label: "Specials", re: /<.*>/, tooltip: "Remove the special legends, like FontAwesome, WebFont, images, etc, and anything between them in the same slot." }, + { label: "Others", re: /^[^A-Za-z0-9\`\~\!\@\#\$\%\^\&\*\(\)\-\_\=\+\[\{\]\}\;\:\'\"\,\<\.\>\/\?\\\|]$|^[A-Za-z\s][A-Za-z\s]+$|\&\#.*|\&.*?;/, tooltip: "Remove the legends from (almost) all the other keys except decals." }, + { label: "Decals", re: /.*/, decals: true, tooltip: "Remove the legends from all the Decals." }, + ]; + $scope.removeLegends = function(button) { + var keys = $scope.selectedKeys.length > 0 ? $scope.selectedKeys : $scope.keys(); + transaction("remove-legends", function() { + angular.forEach(keys, function(key) { + if(key.decal === (!!button.decals)) { + for(var i=0; i<12; i++) { + if(key.labels[i]) { + update(key,"labels",key.labels[i].replace(button.re,''),i); // should we wipe the textSize and textColor too? + renderKey(key); + } + } + } + }); + }); + }; + + var align = { hmask:0x0f, hcenter:0x00, left:0x01, right:0x02, vmask:0xf0, vcenter:0x00, top:0x10, bottom:0x20, center:0x00, }; + $scope.alignLegendsButtons = [ + { label: "↖", flags: align.left | align.top }, + { label: "↑", flags: align.hcenter | align.top }, + { label: "↗", flags: align.right | align.top }, + { label: "←", flags: align.left | align.vcenter }, + { label: "●", flags: align.hcenter | align.vcenter }, + { label: "→", flags: align.right | align.vcenter }, + { label: "↙", flags: align.left | align.bottom }, + { label: "↓", flags: align.hcenter | align.bottom }, + { label: "↘", flags: align.right | align.bottom }, + ]; + + function moveLabel(key, from, to) { + key.labels[to] = key.labels[from]; + key.labels[from] = ''; + key.textColor[to] = key.textColor[from]; + key.textColor[from] = ''; + key.textSize[to] = key.textSize[from]; + key.textSize[from] = 0; + } + + function alignSingleRow(key, flags, left, middle, right) { + var render = false; + switch(flags) { + case align.left: + if(!key.labels[left]) { render = true; moveLabel(key, middle, left); moveLabel(key, right, middle); } + if(!key.labels[left]) { render = true; moveLabel(key, middle, left); } + break; + case align.right: + if(!key.labels[right]) { render = true; moveLabel(key, middle, right); moveLabel(key, left, middle); } + if(!key.labels[right]) { render = true; moveLabel(key, middle, right); } + break; + case align.hcenter: + if(key.labels[left] && !key.labels[middle] && !key.labels[right]) { render = true; moveLabel(key, left, middle); } + if(key.labels[right] && !key.labels[middle] && !key.labels[left]) { render = true; moveLabel(key, right, middle); } + break; + } + return render; + } + + $scope.alignLegends = function(flags) { + var keys = $scope.selectedKeys.length > 0 ? $scope.selectedKeys : $scope.keys(); + transaction("align-legends", function() { + angular.forEach(keys, function(key) { + if(!key.decal) { + var render = false; + for(var i = 0; i < 12; i += 3) // horizontal alignment + render = alignSingleRow(key, flags & align.hmask, i, i+1, i+2) || render; + for(var i = 0; i < 3; i += 1) // vertical alignment + render = alignSingleRow(key, (flags & align.vmask) >> 4, i, i+3, i+6) || render; + if(render) renderKey(key); + } + }); + }); }; $scope.unhideDecals = function() { - var prop = 'decal'; - angular.forEach($scope.keys(), function(key) { - if(key.decal) { - update(key,prop,false); - renderKey(key); - } - }); - }; - - $scope.moveLegends = function(moveOrSwap,a,b,c,d) { - var move = (moveOrSwap == 'move'? true : false); - var all = ($scope.selectedKeys.length>0 ? false : true); - - angular.forEach($scope.keys(), function(key) { - var ndx =$scope.selectedKeys.indexOf(key); - if(!key.decal && (ndx>=0 || all) && move) { - if ((key.labels[a] && key.labels[b]) && !((key.labels[c] || key.labels[d]))) - { - key.labels[c] = key.labels[a]; - key.labels[d] = key.labels[b]; - key.labels[a] = ''; - key.labels[b] = ''; - key.textColor[c] = key.textColor[a]; - key.textColor[d] = key.textColor[b]; - key.textColor[a] = ''; - key.textColor[b] = ''; - key.textSize[c] = key.textSize[a]; - key.textSize[d] = key.textSize[b]; - key.textSize[a] = ''; - key.textSize[b] = ''; - }; - }; - if(!key.decal && (ndx>=0 || all) && !move) { - if (key.labels[a] && key.labels[b]) - { - var swap = key.labels[b]; - key.labels[b] = key.labels[a]; - key.labels[a] = swap; - var swap = key.textColor[b]; - key.textColor[b] = key.textColor[a]; - key.textColor[a] = swap; - var swap = key.textSize[b]; - key.textSize[b] = key.textSize[a]; - key.textSize[a] = swap; - }; - }; - renderKey(key); - - }); + var keys = $scope.selectedKeys.length > 0 ? $scope.selectedKeys : $scope.keys(); + transaction("unhide-decals", function() { + angular.forEach(keys, function(key) { + if(key.decal) { + update(key,'decal',false); + renderKey(key); + } + }); + }); }; + $scope.moveFromId = null; + $scope.moveToId = null; $scope.moveSingleLegends = function() { - var fromId = document.querySelector('input[name = "fromId"]:checked').value; - // alert(fromId); - var toId = document.querySelector('input[name = "toId"]:checked').value; - // alert(toId); - var all = ($scope.selectedKeys.length>0 ? false : true); - if ((fromId >=0) && (toId >= 0)) - {angular.forEach($scope.keys(), function(key) { - var ndx =$scope.selectedKeys.indexOf(key); - if(!key.decal && (ndx>=0 || all)) { - if (key.labels[fromId] && !(key.labels[toId])) - { - key.labels[toId] = key.labels[fromId]; - key.labels[fromId] = ''; - key.textColor[toId] = key.textColor[fromId]; - key.textColor[fromId] = ''; - key.textSize[toId] = key.textSize[fromId]; - key.textSize[fromId] = ''; - }; - }; - renderKey(key); - }) - } - }; - - + var keys = $scope.selectedKeys.length > 0 ? $scope.selectedKeys : $scope.keys(); + if($scope.moveFromId >= 0 && $scope.moveToId >= 0) { + transaction("move-legends", function() { + angular.forEach(keys, function(key) { + if(!key.decal && key.labels[$scope.moveFromId] && !key.labels[$scope.moveToId]) { + moveLabel(key, $scope.moveFromId, $scope.moveToId); + renderKey(key); + } + }); + }); + } + }; + // Helper function to select a single key function selectKey(key,event) { if(key) { @@ -550,7 +545,7 @@ $scope.palettes.forEach(function(palette) { palette.colors.forEach(function(color) { color.css = $color.sRGB8(color.r,color.g,color.b).hex(); - reverseColors[color.css] = palette.name + " " + color.name; + reverseColors[color.css] = palette.name + " " + color.name; }); }); }); @@ -1561,21 +1556,6 @@ } }; - $scope.showTools = function(event) { - if(activeModal) activeModal.dismiss('cancel'); - activeModal = $modal.open({ - templateUrl:"toolsDialog.html", - controller:"modalCtrl", - scope:$scope, - resolve: { params: function() { return { moveStep:$scope.moveStep, sizeStep:$scope.sizeStep, rotateStep:$scope.rotateStep }; } } - }); - activeModal.result.then(function(params) { $.extend($scope, params); }); - if(event) { - event.preventDefault(); - event.stopPropagation(); - } - }; - // Clipboard functions var clipboard = {}; $scope.cut = function(event) { diff --git a/switches.json b/switches.json index e868025..8ed7a89 100644 --- a/switches.json +++ b/switches.json @@ -1,9 +1,8 @@ { "cherry": { "mount": "cherry", "name": "Cherry MX Mount", "brands": { "aula": { "brand": "aula", "name": "AULA (HiDeep Inc.)", "switches": { - "Blue": { "part": "Blue", "name": "AULA Blue", "feel": "clicky", "weight": 50 } + "Blue": { "part": "Blue", "name": "AULA Blue", "feel": "clicky", "weight": 50 } }}, - "cherry": { "brand": "cherry", "name": "Cherry Electrical Products", "switches": { "MX1A-A1xx": { "part": "MX1A-A1xx", "name": "MX White", "feel": "clicky", "weight": 70 }, "MX1A-11xx": { "part": "MX1A-11xx", "name": "MX Black", "feel": "linear", "weight": 60 }, @@ -80,6 +79,3 @@ }} }} } - - -