From 842fc0967cf631c8c2ebbeb7e75bebb7d02d9dbf Mon Sep 17 00:00:00 2001 From: Javier Arce <4933+javierarce@users.noreply.github.com> Date: Sat, 29 May 2021 12:43:55 +0200 Subject: [PATCH 1/2] Adds link to gh-pages --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index e0f14e2..b82c0eb 100644 --- a/README.md +++ b/README.md @@ -5,3 +5,4 @@ Makes your tab disappear when nobody is paying attention. ![favicon chameleon](./favicon-chameleon.gif) +[See it in action](https://javierarce.github.io/favicon-chameleon) From 357f99eac0519189036c58a1100abf84f78c0f80 Mon Sep 17 00:00:00 2001 From: Javier Arce <4933+javierarce@users.noreply.github.com> Date: Tue, 26 Nov 2024 10:22:06 +0100 Subject: [PATCH 2/2] Removes Twitter and adds Mastodon & Bluesky --- favicon | Bin 0 -> 1680 bytes favicons/bluesky.png | Bin 0 -> 2240 bytes favicons/mastodon.png | Bin 0 -> 1680 bytes favicons/twitter.ico | Bin 6518 -> 0 bytes index.html | 51 +++++++------- script.js | 151 ++++++++++++++++++++++++------------------ 6 files changed, 112 insertions(+), 90 deletions(-) create mode 100644 favicon create mode 100644 favicons/bluesky.png create mode 100644 favicons/mastodon.png delete mode 100644 favicons/twitter.ico diff --git a/favicon b/favicon new file mode 100644 index 0000000000000000000000000000000000000000..259676c0a9217ed353269ec3dccb50cca399dfba GIT binary patch literal 1680 zcmV;B252XO#7&rk08IL#|xZO0G(e>EFnil;< z(_%P@yr5~g+%%jiEW}xCagFAP8VsCtv}lj6MjsgJL*{I@^t7f%aEcLgs^N^mpQ!oa z-3*+f1XMM0t%(}d7PL9+A)MlTeefYJ9$v+{4qLF1fuW+SLDW=+P+bv%W+yy?^5PKc zt3xQ%D2GNXl*q_(L4gC=wHo0Y7{nJM=wjZ|2kxKKd|*V36+_ z2Jp{6aqQn4fm0QBC_WeO0VVL3s`xPwPSuakK8<0p`QZI1G<*Nuy}QFan3#r!IJ-v! ze2>Pk*}UTthp%`L=cra+gn@zh?9(WQI{2+a{v`g& zqxh~-EnW=7`qe=UXAA>aG&g|qLLanh35bAzI?*aO-8_Dc-)mEMFm zxz3Bf=}@>`1{TlrLp2}vi!~44ej_Y(*RBX0a!7JrQ+Ys+Ycl%+C{`}<^4(O=7?wzeP#^^H0Qw zO;2|mYOdUW`T3CeO7?D8;&RlSegR!9pc@pA>=6S#`#4PcFFX?v{9k{LlK$Qu;`P7! zoW4GT1$6TO8w;>!cY#0}@cug?(%-Y)C-|R!6ej)c8@UzlXi>I4A` z@JRxKq`zy6c%YBo3z7cz4Mc$Ga@d*qLnyPe#-7;$ibr-!0^Sai{;tik0Mcgx9!Wq* z>T)`369GzQdx&lG0-3uR^KK_b92&pg156@RNRRQ9ITw z>FLMJ`cBf{y0%xi{+BF3;&RfOa`;r3nNqz$FH}=@+~a!UB5a0rU>6NlkYr z0xU_5S1HMjpg6EY7T^=Sk+OA-EFdu8j^&}2OZYvI{^vL)sR0xRw)e^c1aG8lUEM7Y zpm%(;X5sWc{|ox*Z0p1Sfj}DY-Wxu_8zJ(5PXeTGN&4?e)3IZH=wBZLGOE-jES%ET zkBKGCf;Upil}6$ElgnC2UwP;svl#Gywe^HE(aq*XP}LopG3L4Ov4N za?_g{vN12auI+3N8K>Wyay{IC`}f^Gmw(%PBMH=hAU(C0ztPVt;3=Mvo}$vZ&(c%y zpbmx>#eUhH+a)eYp^t(nma{Z+%tMo>=vawOlOa=N| z#BisXaArOLr30_IBXe9hvLgsl4N!Fxj&um98kiuR8J~2f7YRpZ7krO`=iqZS#(fLp zJd}>~HTb-jJJRb#MQR#sb*tB#Yl3PMOkgcg)#gae`RyU;&9&yPSZC%+mQ|6CY!8l8 z-K06%4&&1ekrpwWEED$RXP~NsS0s-hy(R4N-Ml=Zs_Ct?C%Ym&MeN~@ygdE{sOk_n zeu@|_HA8xe*`i*KV;_L3o@h|ugc;SK!KQR8VT&3Vj`T-bL~(31tjI^8Y9LN=bUU*} zW-=V%@SSjLY!bIc7jPU|O>NPQ;3)iF1fPL||0b2!YHP-EaQH3wf(Q&82y zM{t%HgEI(Dv_#rfjlE(D^d|=YVrmHPAco*+YVa3f<(_}zG4NBPe;53>0)`(Bm)!QK agna>obe_C{6JZko0000o7*GFZq(C7Ek%SbWTLk0IYUvaJ@fqk|DFGP-}n3e|9sywd)-|f&|3Oh005w! z9N8Z5ibaNo8a#_)V&1`vlE}ls1}JWt*8{)QLL8@H7Z<=3wlx4XC0#%TfxtgNNgq&E z*Z|<8WboAvP%;_ED8m>s0MEcIcm(g^0jP2Oc6db|M|i+WW2-w)0)N3ID}6tgdz7Xk4_$oZ&noGBes5;;F2PI62l!gmk4 zz?Ha>E9SDfVu*#5Kb}m%Q^;O$`P1ki*#b|p1d*%#5B579TOkB1OrfG^qRA?gkW*<0 zgkAzcIBTk|9?L?(A4iP~Fo{S_Ppa{;22$+89mLXtnP0k*r3IZn;sf{YeJA!xFOFvC z+I68`A=9%)=msl~8rRWGw_I zSRB))-mBdB(76BNDx(#B8}hY-3`QEf%$@n17I(G-+8OFF_YJ#WbeA|xQ0kx01*VV{M z>=?BT4CbXJ$<;KyQkM$n+^B+LXyszFknZG`^{#hRIC*xJ36Iyk*Tm#*wa@Kp4;HAJ zV$7Y^GX^iVrJ=w}{rtAFMa;nH)msU318Zw?KVnF0X0@Z6Qnt@od_#`WjGKSKE$69c zW4E5X_h8cj9Y%Ah-IdtN0LUxlQ{|KT{VM->rp#D@$+bkcbBAb_VTUSq z-jwHtHD)<{V*1=6rmrZ*Uh~pg8MUK!m9d)ZlZ7A5B-iPG z3^CGs41d1INR6K}D4Onk)OT3j{Dq@FahJgdYQdf+z%aFtY8sai-*p6heD;>ekJ{o* z6D~|ELdn8RR=hUOQhFJr_X#pA=&`o(t&BVVqNCgRUd9e@sg&aX?z3A$RhrR5Wm>A* z2#y+;H?T;hwIzHg>dpHR;a}#Bu|Wyj8T;yV-EB&x(K)TNbDn1q0`S*g_14TYOvo%p zyG31R5rzgaQlrdXVnl literal 0 HcmV?d00001 diff --git a/favicons/mastodon.png b/favicons/mastodon.png new file mode 100644 index 0000000000000000000000000000000000000000..259676c0a9217ed353269ec3dccb50cca399dfba GIT binary patch literal 1680 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 - - Favicon Chameleon. Makes your tab disappear when nobody is paying attention. - - - - - - - - - - - - - - -

- Ok, now jump to another tab. -

- + + + Favicon Chameleon. Makes your tab disappear when nobody is paying attention. + + + + + + + + + + + + + + + +

+ Ok, now jump to another tab. +

+ + diff --git a/script.js b/script.js index 033265b..c898f44 100644 --- a/script.js +++ b/script.js @@ -1,111 +1,130 @@ -const SERVICES = { +const SERVICES = { tumblr: () => { - let title = 'Tumblr' - let favicon = 'favicons/tumblr.ico' + let title = "Tumblr"; + let favicon = "favicons/tumblr.ico"; return { - title, favicon - } + title, + favicon, + }; }, - twitter: () => { - let title = 'Twitter' - let favicon = 'favicons/twitter.ico' + mastodon: () => { + let title = "Home - Mastodon"; + let favicon = "favicons/mastodon.png"; return { - title, favicon - } + title, + favicon, + }; + }, + + bluesky: () => { + let title = "Following — Bluesky"; + let favicon = "favicons/bluesky.png"; + + return { + title, + favicon, + }; }, gmail: () => { - let title = 'Inbox' - let count = Math.round(Math.random() * 12) - let emailCount = count - let gmailIcon = 'favicons/gmail_' + let title = "Inbox"; + let count = Math.round(Math.random() * 12); + let emailCount = count; + let gmailIcon = "favicons/gmail_"; if (count === 11) { - count = 50 - emailCount = `${count}+` + count = 50; + emailCount = `${count}+`; } else if (count === 12) { - count = 100 - emailCount = `${count}+` + count = 100; + emailCount = `${count}+`; } - let favicon = `${gmailIcon}${count}.png` + let favicon = `${gmailIcon}${count}.png`; if (emailCount) { - title = `Inbox (${emailCount})` + title = `Inbox (${emailCount})`; } return { - title, favicon - } - } -} + title, + favicon, + }; + }, +}; class Chameleon { - constructor (enabledServices) { - this.enabledServices = enabledServices - this.services = SERVICES - this.hidden = 'hidden' - this.visibilityChange = 'visibilitychange' - - this.favicon = document.querySelector("[rel='shortcut icon']").href - this.title = document.title - - this.init() + constructor(enabledServices) { + this.enabledServices = enabledServices; + this.services = SERVICES; + this.hidden = "hidden"; + this.visibilityChange = "visibilitychange"; + + this.favicon = document.querySelector("[rel='shortcut icon']").href; + this.title = document.title; + + this.init(); } - init () { - if (typeof document.mozHidden !== 'undefined') { - this.hidden = 'mozHidden' - this.visibilityChange = 'mozvisibilitychange' - } else if (typeof document.msHidden !== 'undefined') { - this.hidden = 'msHidden' - this.visibilityChange = 'msvisibilitychange' - } else if (typeof document.webkitHidden !== 'undefined') { - this.hidden = 'webkitHidden' - this.visibilityChange = 'webkitvisibilitychange' + init() { + if (typeof document.mozHidden !== "undefined") { + this.hidden = "mozHidden"; + this.visibilityChange = "mozvisibilitychange"; + } else if (typeof document.msHidden !== "undefined") { + this.hidden = "msHidden"; + this.visibilityChange = "msvisibilitychange"; + } else if (typeof document.webkitHidden !== "undefined") { + this.hidden = "webkitHidden"; + this.visibilityChange = "webkitvisibilitychange"; } - document.addEventListener(this.visibilityChange, this.handleVisibilityChange.bind(this), false) + document.addEventListener( + this.visibilityChange, + this.handleVisibilityChange.bind(this), + false, + ); } - setDefaultFavicon () { - let title = this.title - let favicon = this.favicon + setDefaultFavicon() { + let title = this.title; + let favicon = this.favicon; - this.updateFavicon({ title, favicon}) + this.updateFavicon({ title, favicon }); } - updateFavicon (data) { - - let randomString = "?v=" + Math.round(Math.random() * 10000000) - let link = document.createElement('link') + updateFavicon(data) { + let randomString = "?v=" + Math.round(Math.random() * 10000000); + let link = document.createElement("link"); - link.type = 'image/x-icon' - link.rel = 'shortcut icon' - link.href = data.favicon + randomString + link.type = "image/x-icon"; + link.rel = "shortcut icon"; + link.href = data.favicon + randomString; - document.getElementsByTagName('head')[0].querySelector("[rel='shortcut icon']").remove() - document.getElementsByTagName('head')[0].appendChild(link) - document.title = data.title + document + .getElementsByTagName("head")[0] + .querySelector("[rel='shortcut icon']") + .remove(); + document.getElementsByTagName("head")[0].appendChild(link); + document.title = data.title; } - enableService () { - let i = Math.round(Math.random() * (this.enabledServices.length - 1)) - let service = this.enabledServices[i] + enableService() { + let i = Math.round(Math.random() * (this.enabledServices.length - 1)); + let service = this.enabledServices[i]; if (service && this.services[service]) { - this.updateFavicon(this.services[service]()) + this.updateFavicon(this.services[service]()); } } - handleVisibilityChange () { + handleVisibilityChange() { if (document[this.hidden]) { - this.enableService() + this.enableService(); } else { - this.setDefaultFavicon() + this.setDefaultFavicon(); } } }