From 07375ca50a6709c8e2aa66b8bf763a739d75ddf1 Mon Sep 17 00:00:00 2001
From: Andrew Terranova <andrew.terranova@bazaarvoice.com>
Date: Mon, 24 Oct 2016 19:08:39 -0500
Subject: [PATCH] Adds an Emoji Substitution example (#110)

* Adds an Emoji Substitution example

* Monitors DOM for additions after initial load

* Fixes typos

* Fixes substitution ordering bug

* <textarea> bug fix. Also removes confusion between Elements and Nodes.
---
 emoji-substitution/README.md         |   9 +++
 emoji-substitution/emojiMap.js       | 115 +++++++++++++++++++++++++++
 emoji-substitution/icons/icon.png    | Bin 0 -> 3342 bytes
 emoji-substitution/icons/icon@2x.png | Bin 0 -> 8382 bytes
 emoji-substitution/manifest.json     |  24 ++++++
 emoji-substitution/substitute.js     |  93 ++++++++++++++++++++++
 examples.json                        |   9 +++
 7 files changed, 250 insertions(+)
 create mode 100644 emoji-substitution/README.md
 create mode 100644 emoji-substitution/emojiMap.js
 create mode 100644 emoji-substitution/icons/icon.png
 create mode 100644 emoji-substitution/icons/icon@2x.png
 create mode 100644 emoji-substitution/manifest.json
 create mode 100644 emoji-substitution/substitute.js

diff --git a/emoji-substitution/README.md b/emoji-substitution/README.md
new file mode 100644
index 0000000..cf98baa
--- /dev/null
+++ b/emoji-substitution/README.md
@@ -0,0 +1,9 @@
+# Emoji Substitution
+
+## What it does
+
+Replaces words that describe an emoji with the emoji itself.
+
+## What it shows
+
+A good example for beginners that can be used as a "make your first add-on" tutorial and / or referenced to create other add-ons.
\ No newline at end of file
diff --git a/emoji-substitution/emojiMap.js b/emoji-substitution/emojiMap.js
new file mode 100644
index 0000000..16213cd
--- /dev/null
+++ b/emoji-substitution/emojiMap.js
@@ -0,0 +1,115 @@
+/*
+ * This file contains the Map of word --> emoji substitutions.
+ */
+
+let dictionary = new Map();
+dictionary.set('apple', '🍎');
+dictionary.set('banana', '🍌');
+dictionary.set('bang', '💥');
+dictionary.set('baseball', '⚾');
+dictionary.set('basketball', '🏀');
+dictionary.set('beer', '🍺');
+dictionary.set('bicycle', '🚴');
+dictionary.set('bike', '🚴');
+dictionary.set('bomb', '💣');
+dictionary.set('boy', '👦');
+dictionary.set('bug', '🐛');
+dictionary.set('burger', '🍔');
+dictionary.set('burn', '🔥');
+dictionary.set('cake', '🎂');
+dictionary.set('candy', '🍬');
+dictionary.set('cat', '🐱');
+dictionary.set('celebration', '🎉');
+dictionary.set('cheeseburger', '🍔');
+dictionary.set('cookie', '🍪');
+dictionary.set('cool', '😎');
+dictionary.set('cry', '😢');
+dictionary.set('dog', '🐶');
+dictionary.set('doge', '🐕');
+dictionary.set('earth', '🌎');
+dictionary.set('explode', '💥');
+dictionary.set('fart', '💨');
+dictionary.set('fast', '💨');
+dictionary.set('female', '👩');
+dictionary.set('fire', '🔥');
+dictionary.set('fish', '🐟');
+dictionary.set('flame', '🔥');
+dictionary.set('flower', '🌹');
+dictionary.set('food', '🍕');
+dictionary.set('football', '🏈');
+dictionary.set('girl', '👧');
+dictionary.set('golf', '⛳');
+dictionary.set('hamburger', '🍔');
+dictionary.set('happy', '😀');
+dictionary.set('horse', '🐴');
+dictionary.set('hot', '🔥');
+dictionary.set('kiss', '😘');
+dictionary.set('laugh', '😂');
+dictionary.set('lit', '🔥');
+dictionary.set('lock', '🔒');
+dictionary.set('lol', '😂');
+dictionary.set('love', '😍');
+dictionary.set('male', '👨');
+dictionary.set('man', '👨');
+dictionary.set('monkey', '🐵');
+dictionary.set('moon', '🌙');
+dictionary.set('note', '📝');
+dictionary.set('paint', '🎨');
+dictionary.set('panda', '🐼');
+dictionary.set('party', '🎉');
+dictionary.set('pig', '🐷');
+dictionary.set('pizza', '🍕');
+dictionary.set('planet', '🌎');
+dictionary.set('rose', '🌹');
+dictionary.set('sad', '😢');
+dictionary.set('sleep', '😴');
+dictionary.set('smile', '😀');
+dictionary.set('smiley', '😀');
+dictionary.set('soccer', '⚽');
+dictionary.set('star', '⭐');
+dictionary.set('sun', '☀️');
+dictionary.set('sunglasses', '😎');
+dictionary.set('surprised', '😮');
+dictionary.set('tree', '🌲');
+dictionary.set('trophy', '🏆');
+dictionary.set('win', '🏆');
+dictionary.set('wind', '💨');
+dictionary.set('wine', '🍷');
+dictionary.set('wink', '😉');
+dictionary.set('woman', '👩');
+dictionary.set('world', '🌎');
+dictionary.set('wow', '😮');
+
+/*
+ * After all the dictionary entries have been set, sort them by length.
+ *
+ * Because iteration over Maps happens by insertion order, this avoids
+ * scenarios where words that are substrings of other words get substituted
+ * first, leading to the longer word's substitution never triggering.
+ * 
+ * For example, the 'woman' substitution would never get triggered
+ * if the 'man' substitution happens first because the input term 'woman'
+ * would become 'wo👨', and the search for 'woman' would not find any matches.
+ */
+let tempArray = Array.from(dictionary);
+tempArray.sort((pair1, pair2) => {
+  // Each pair is an array with two entries: a word, and its emoji.
+  // Ex: ['woman', '👩']
+  const firstWord = pair1[0];
+  const secondWord = pair2[0];
+
+  if (firstWord.length > secondWord.length) {
+    // The first word should come before the second word.
+    return -1;
+  }
+  if (secondWord.length > firstWord.length) {
+    // The second word should come before the first word.
+    return 1;
+  }
+
+  // The words have the same length, it doesn't matter which comes first.
+  return 0;
+});
+
+// Now that the entries are sorted, put them back into a Map.
+let sortedEmojiMap = new Map(tempArray);
diff --git a/emoji-substitution/icons/icon.png b/emoji-substitution/icons/icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..b35102aa985feeb50878177c7cc0467c5eaaa86c
GIT binary patch
literal 3342
zcmV+p4e|1cP)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm000B<X+uL$Nkc;*
zP;zf(X>4Tx062|}Ro!pfR1`mnZ(O7nKcKOW4i$^9Ra0BJ8yc;~21%2p=|UR0&DbiW
z$#rfTQ`a`O(`{9s_5yDV_yd5l2Of}kLK+Oj_Ok5(v`JGz71bo9J#^YYXp{DWs&KBa
zQ@dTpxRI}aIp=pi@6k0t$5)!;m`NF6-tt{FpOKHBn3g+MAqmexC-gw4rh87hTrL7G
z#)U`L!(So6-Zux@>;H3gR;i~0B%VTSS3P|m@o9jRsXML@Al^p#@G0Lx-0?i(9WEw_
zSYddU<1E8793KxjQ|c&UmW!m<wJPEz#Qifd`D_gH9D=nYPc7;iy3Be}cI}#B(pb7r
zQ2)<0Z#G)-dhzM<<|dEgyN}ggcgNHaf39n}NyINBzUKHDCVv(2y~bQ6jd(9W@|l`@
zq{8{hHx}zt?;zfZxN7)?sZhRX&6Fm%ZE|_eKB|VCYq~dzJ%bk!->TC>k>?{om1c9S
zUx<6_jj_<bFzzi(=30Ih>!T&^M{wWM#><F%5P#^}>IBbOSf*xP<^F{$j$aOQ5Y{cT
zROCL1M7^NKK<?M4#<(px;Nu~3TQXfUjub-vl4Az5h`EvTZbPkvoEw^(%X2^EKD8>L
z&(yA}mSw#iM0^;IB{ZO5!wl{^Sg-*ysE~&Yz8!E;Qv(A`lu*=Clo*MpVGd>OdF6n^
zam1Jntk;<}MrqIC5$=Q>n{*R}?8oOIDUw5En2dl--Xw34!z7E+5pr<Twj7JkV%^#F
z^FB1tE8`u5%(<RMUli}Gd(zOafAsejYx|L$X)B+22f)J)w3q|&`mZkiuq*PhLN2^}
zv+L>-OgyQ-soSab)C%saskMla`aQLVzg0+MZf20tJU&K{hZoBrUc+U4e9&<J19^6g
zw<TiDI@c3vSSRQQrH3Ur+aF1l-;_U<73B-%ymEJ2m)mwp_*D2-_)+*y_+I!KWZ{x<
zS@=n~B77rUjGfiv=VSBigL+%lGEKW)Q!u5Bv|D;f%1SRtuSmtnpVTc4Nn_F;)a>3o
zw|KmGEe4#xz17wBu{f`SS_4i66?j31EjY7n{zGfhONK~c+td!TS#B}JoR}5UAd7p&
z5phTyXSkK0xCeD3xaYP^o&J~#Xp9xFb0C;HHml5fA<%h1eR|qw7wxF+oN<lWx-aij
zl-K1neyXTku=K%xSu;&JP<gUTJ?bvd>L9T1Aits?sKNIwvGaN)^WO$I^cUV)HzL_|
z1K?{9p!>B*)`xfEv!4N6IG{J&h49W#Bz^(#YWw%`e_a{8n{G9m5AeR~_yl0%<7V@p
z<z{o^OZ2}6aLN1^Spac(61Cxm000QtNkl<ZXa&_;Yit}>6+Ux!*1KMN{RlKoz`?GY
zR7nF$Q@2r+jg#g<BPdZpB0$qn+Ne;ZA|X&|kSM|k2}+PaLP8)FHKmn+6cq^-kmwJ)
zwreLu2@RC0rA=HXr9mm+#*el4H8XtQUEj^_dS_pDqj03z*}0GJJnlK?o;$miEP^~w
zEXxv)5YEW9LsrK7oV3{M1RauaMO@t_qAZcH5{wp!r~lzu>PR3q^nK3D$KZ3V1jM?C
z^St<TvG+Ab)LDtzVY!saKw>49f~4ihb;VPzwAr>yImtvSeSKutv9~ZoW0sp)s;?#m
z`d~|3t~=U$O48m&4ahZE40&8GkgZOu*icU&6v2h%tB$H>&ZSQF_jEV3N6*M~+O2Hq
z>IBG*@~|?|29<g{u_m<V*jeM6xqhE76%~Ns3Sh2#dWR>I>8#iLfGtTgSEMy)shb8Y
z!@C@AMFr;mu%$E96&{!Wrpw_hecyY6k{nNTHQq6Lt{k{;zzy_?of(MT9cr@1uDI}&
z7zQJ6$na^(;-`e~3Q%~}U_B|0<*TG0=#sVv5F9h^-S(c*UzfsNpaA`D?zwI64~Lv_
zQI%3+Dad!B&2`;GGSJm{`_NmA$9xV8tjhu64*UF7BRr*rAt_U_@VYBso2U0lKxdmP
z9kBUA_<e^=l#Mdx56P{-K6Ko=fAgy3M9Oo_BC(gl8A80zPj#^MWH5#o$C`=(BdR9O
z;oKa~eASWTV|dO>$g#<HQeH1)q^yQfE(Si(z2+r=uAfVZ6+o*({lXF^KMKec+l?-D
z96WGxsKJufW+kx?hUAm6u<YIx5<#1;kPuLsu=aXz#*@L5DS3K$PKIAf%H)hIiKM58
z2EdHN$d7yt<@2NA!a?zDWxalG?6tKR<8i3H>blhrpd$D&uH1?kfNJhqJ|I!v*(8-j
zCYUz>=d+y(Q?N)lD=6EHe%0{EAA`LPX0#5UAA9Ya6xa!PnP>7Xoj<sm?-ayXs<A<&
z2}1H73TCgcX$zrr%^O<{cBwIt)v}!Aljw650Z$yhM)q!r(2z?;83#U_!i5byjXHIy
zh(d1tP*_fUZ^Z;;*DfUP@HSNMUPwiiT)*#M+M0`DNTDwrT_G9xHwlHati0=@a3vN)
z6n^ZNE5x0HJHj?<`!G)#pcXr%$SdwHiM0aA5e|g6fzHdpYBV=y<5=^n^Mh_Gz|uk9
z7DTqdcV}?xA-R-Y<P0pALczHhVk{ll6_G&JG#ZLo?MrtyBfTvKnF+$nttw@9hI${S
zGWRkT2(7@NW4W!<S-q^7uMh5yESUb;+ZrVe1Jz4(pJgp7FU7hF_4a*AT7qlM;e>AV
zqc619%R|pgAaK{*fb>&D%a#Y~+VBhv75L6Qt(O(x(G{|*;$+;5jc67@QZIdEQ&^lS
zI%^?i;-1{|;e{(xILiNNHX*WaXSi?x(vZ?`5AvGH{9{`Xadi;=|Hvcl1^#bf7|h>&
zprvm2+_bJioJ5gfkvmoKx-$44d#J6TgfK#syK{+|`<=;!);IGUtU^N&JF$*9(^~mX
z?4#dkUpSAud#ULjG`*n%!HizaElV6j%Rh)LbN0x!C9Q7&n2rAa)8*0!U)I<qxtr11
zJF%Cy*}^SEr~1NfvE0#Z$W28{!$HVM$6rm${zoTdX4ZpX*&2pj+`U=bux)*JP`>hs
zX4!L7gU<QvuS8s_VPGHr&9t0;J)Og%rAY?AsnL?hzS=IkHzMViO7Avga{qFhCo@3w
zAy$C8bb=*lK@w!oc^-XxF~oA3MBxkY(au#eZP`&ppUnYO`bO=dKJ%yniZ&o_9=w)<
zN*O@o7x65~3$iPjO1}yd`$t~MnO8w0WrpmGizi^u|33vFv*%eyv?I8G-O0CZ70pWD
zCoPrxWYI2v)`Z_06t$tBVFH>;;~Z6<T&NmPI&x_?n>EUhuDzF8jo9QtUKMF7jlG$v
z6-V3IiBu<Y*SvjwrozcmDM!B8cS7#`@(7sWlu|ZD_}~;b1A|z^BsO^zzWFJhfM>`W
zS57Bow-Lw?{LdHNp&0J|DT!{=)*O^+?50hqG!8y;T%wV%{Njh3QRmiq<cb94zK4#<
z<a9zGc8E<L6<ri%Xf!tZHdV_lmizqHzv1ad=ukd^1(iJbty6OGowzm)5AVs8C*2)U
zIk2}=dTzNU`>rJ6h%>*a0oo-DSj>I#<iF*qXV1ymH>dR*4ZZ*%UEAIyKlyeKHmnNy
z#Phgmy{xvsuz~Y(3V@gLPVaDJx(aKC0`k%O2l0l15LwFp&f!TMp2?$Q*UBjB_iR}`
zF`bt23)6Uof&;&<6M4A5?6Isg|M>ImI3)USsD_U;W9!;DK$~by3lvE7Z&?+x)f-ra
zTzhU}(H9!-<SP^MgU4Sf5T<BY*+;VZ+QD^l%erNi-G)feI+<~=3-26#(<qQD1laKG
z&qn{r9~a7Uo$sWd_N;A}uYZ2M@DM{+s+KsGa}M2qqsFLuDrBRKMtJfo$<=)s`$7%x
zM|EKrvE}IR#^tHspVO&;?}Yf%4hcJse!W7kIdDg(eCFd_;vn!@3|39}!9%U@Uoc@o
z17o4y*Xvr5W&{8Z#%In<%6}%Z+sk{Gg=F<=9941HaAs1q39c>R|9X9a0>&bl{>`6K
zq2RCZ8YAasrtga0ag=sb?tXj6$k9@KeT5qyI{sTX>E4C)uOc;+f?k3){IEgchX+TV
z@k8@n0W)FtPq(fLcSO(E5))?bqVD{WZ!Fc>xc7zg<!~x0z?fjvU#&m0`nr(O+N3ON
z!+=U<=GF*KLGQ}>f%QE$De@pM@;AJVET!%h6)=+k<~_RW)EnyN=Pi^3FY4VZe>*h;
zYrPYLR}g<SxOqU42YFQsQ_+QdfH=>K5B09ZxqA#RhwJ>aM<zKp=XN*UK5_wg8q<fL
zZ*#p0Xh7JF)qu8^Gt&F8m63b1f44z5in-j$pBom7IdY4q@OK;g@jz_wFhTM$_*^Uf
Y51pWfa{qOe_5c6?07*qoM6N<$f*ypGIRF3v

literal 0
HcmV?d00001

diff --git a/emoji-substitution/icons/icon@2x.png b/emoji-substitution/icons/icon@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5acdb195e5cc2e16ef7172052effbd65333b603
GIT binary patch
literal 8382
zcmV;vAVJ@WP)<h;3K|Lk000e1NJLTq003YB003YJ1^@s6;+S_h000B<X+uL$Nkc;*
zP;zf(X>4Tx062|}Ro!pfR1`mnZ(O7nKcKOW4i$^9Ra0BJ8yc;~21%2p=|UR0&DbiW
z$#rfTQ`a`O(`{9s_5yDV_yd5l2Of}kLK+Oj_Ok5(v`JGz71bo9J#^YYXp{DWs&KBa
zQ@dTpxRI}aIp=pi@6k0t$5)!;m`NF6-tt{FpOKHBn3g+MAqmexC-gw4rh87hTrL7G
z#)U`L!(So6-Zux@>;H3gR;i~0B%VTSS3P|m@o9jRsXML@Al^p#@G0Lx-0?i(9WEw_
zSYddU<1E8793KxjQ|c&UmW!m<wJPEz#Qifd`D_gH9D=nYPc7;iy3Be}cI}#B(pb7r
zQ2)<0Z#G)-dhzM<<|dEgyN}ggcgNHaf39n}NyINBzUKHDCVv(2y~bQ6jd(9W@|l`@
zq{8{hHx}zt?;zfZxN7)?sZhRX&6Fm%ZE|_eKB|VCYq~dzJ%bk!->TC>k>?{om1c9S
zUx<6_jj_<bFzzi(=30Ih>!T&^M{wWM#><F%5P#^}>IBbOSf*xP<^F{$j$aOQ5Y{cT
zROCL1M7^NKK<?M4#<(px;Nu~3TQXfUjub-vl4Az5h`EvTZbPkvoEw^(%X2^EKD8>L
z&(yA}mSw#iM0^;IB{ZO5!wl{^Sg-*ysE~&Yz8!E;Qv(A`lu*=Clo*MpVGd>OdF6n^
zam1Jntk;<}MrqIC5$=Q>n{*R}?8oOIDUw5En2dl--Xw34!z7E+5pr<Twj7JkV%^#F
z^FB1tE8`u5%(<RMUli}Gd(zOafAsejYx|L$X)B+22f)J)w3q|&`mZkiuq*PhLN2^}
zv+L>-OgyQ-soSab)C%saskMla`aQLVzg0+MZf20tJU&K{hZoBrUc+U4e9&<J19^6g
zw<TiDI@c3vSSRQQrH3Ur+aF1l-;_U<73B-%ymEJ2m)mwp_*D2-_)+*y_+I!KWZ{x<
zS@=n~B77rUjGfiv=VSBigL+%lGEKW)Q!u5Bv|D;f%1SRtuSmtnpVTc4Nn_F;)a>3o
zw|KmGEe4#xz17wBu{f`SS_4i66?j31EjY7n{zGfhONK~c+td!TS#B}JoR}5UAd7p&
z5phTyXSkK0xCeD3xaYP^o&J~#Xp9xFb0C;HHml5fA<%h1eR|qw7wxF+oN<lWx-aij
zl-K1neyXTku=K%xSu;&JP<gUTJ?bvd>L9T1Aits?sKNIwvGaN)^WO$I^cUV)HzL_|
z1K?{9p!>B*)`xfEv!4N6IG{J&h49W#Bz^(#YWw%`e_a{8n{G9m5AeR~_yl0%<7V@p
z<z{o^OZ2}6aLN1^Spac(61Cxm0010`Nkl<ZcmeHQ36xw_nf~8WTUS@_+0zLL5P=X7
zI(yQc4ap1|4<bnnI=BydTt>w+$2l%E<9KvnJdUHz8Acr#^q?U+qM&DtWbG_wgP;a6
z3rlB0fI#m{b=6zu`)>8?RCiZ(SJ&2oa8JK}uim@w-v9sp<^Feh?`d)YB-a(4WN4Z=
z9yvH?Mz=1kHG}5mx@NpZbDcFJ`c%=}DsiPuT&)tvhRUyrg>!A9Ne9lih&V60n!e4^
z+!MBCpFDN0qj~OzW3i;Nht=m@EB0P1c7<Mj09f03w-_t$5*xs~Jm1zduQKdZ&eKg<
zqFL_yadw6T^soeh7j6(6nH=u1aqo$XaOz;iz^3;2jY1`c41IPF#CsY7x!-Y|1KsWI
zPgT6*kFChTB8Sny^TkZX6o3YX36(>@ySFZz8Vu_1)C^e<pqEO-3`!3Gi&;Qc2h<Mo
zBBw?qb4V^>#^&lM9A)}VT}n`NhutTpv(I(3EqzhzS0!uqpJ7haq@zZP7IYLo<;Gl=
z^u>2IG#G~ah?M&(g?M)ZZ_Ba4zMeDSqtQfxxB%FM=)<O94`IYxZCl>uYiQav+U@zi
zPK_*RdU(AkKfPn6nAV<U8=SojyN!^x3wl;5uf=RIZ;K6o0!LqP@X0AHigno#1nVXZ
zqE#9}eW$axzRB8K{~prHtRC$=E>tR*1vJ8x?}Bpoo3l9k>W@f?dA&01j(Ebnb9FEI
zLWNer6!FmpX^~Ir%XZh{h*$Kxfl}l776+&Em+~$E5)AU(zU_6hec_U?X{NDJo#~7_
zqUi;<xV%8)I*vsAIvab}wl~MytS<%D?mvaHsWNOI@|N-n$c{#MR1k>G^_PYZX<^?+
z=?3txC-4a^6{Qm)R8QO?5B@6OA@W4t$Yb8nXI1$s44Q9%Ks);Q!a4r1|346Ltdcky
zR{Go5b8=i;e7XTE-Vy7yKOS7Y_b+T4Hf&Kran79OMF4a=)DCO+(hukX^IH-yDx@8L
z{zCEbxx&Pjpd9T(pWW`ntk0VD`|kI6&b8>AT##pu(cdhsb&jn@q^<uzqE5MVSP5^L
zD|Hvj{Zu6K6m`mUTmL?JCC?<!!ysEyvlaj=Uezd8?0=Um4AdA+axQKaEtJfb+g$IX
zAm~!TYoNy56Z`GrMZ_Q%A>`zOtZmEJ>7~X)@Q<a^o7dnVSEveqe+atkO1IN#Z!*{H
zc{JM!v$6n6+}g41y?R7{1fg1~bXyl0`hc4}+in;N_zPgMF<UDblK{L*>Q^k=sQa}C
zrN_oNB>FJ=>m<I<R!vjgN1oZA?6q`Y@lgGerMEJhhf%6qQk~1#1+ifIJL~b~@6gNi
zUrH}~@E0NQsZeCcEo8b*YwTuo?f%C+tWsqidM;xD@W$BIh4anw;4YY62qW-gx_4;B
zZ@AwkS_D(;wc4U9{5KvvoGE`9xgf^8J-=<JHA_Q}z}=K!oINpil4&g$Lq1}n=_O`a
z=n-N?%raqn)J!xdcCv!g&1Q+&la%YZ7=8X|Xc7~;<)}T0SP`>K+Jh0@2&AZn7p(0|
zZr2U-hj2Q19S0eWr`PRu7qc5;eb`*F|3MGKbiAY$08NNejBcyD)L#;Q0&XYrh8bE&
zhep26bLb+VcgDJUuM6IA=vfcTRK=%tL0dMci9F431n-xSQT8VIso+a<jy>j}QRX-O
z4*-0PSf<ID`oemQ_T6*a;@YVbeNUl)Qa9#krjFTe6vL7@@2#4c<YK+!<mTBsMmLS~
z=$wr4P9+n>TS2laQ%{v4IdhK34(kCu;43XHWRmmy1I;Lpz2qGy)5&9$$<Rcd#y`t-
zT+P%lgspeCoQqxa>4$!QdP|BCRIfO%cr|nk;#~KMhAmR*yG2?tZO8djb~;!(#-xa5
zGzLe9HU|-~Vumw(Ol&lmd??AlW<pv9TaEzE^Ae@!*&T1;eJDqjPbOF<PBANsQo_b@
zwn>44@>rFsnjErz3~s8)QdYvsm{9)!ihZtNo)|o00vR{Q;wlGNXGsY@J^D<P8Dx3f
z$Scd^v4x@RDj?Ak`?+@g?)5MXk8^UY60>@V$BEKW#Ni(=bxxg*IWM)j`nh&no`2bq
z4y;;;f-o*z=!zx?<a92Dz>O7q`~*M%M$yHDDg}HZr5HOYg%H9env~&q<^)};$_%M0
z)ulS3$z@XvDG%#nhERwf8%>5xV^1Iy-=vOIj+FZIFq`24jrx^JLy7DjSK2Xdb@D|_
z2Y0&C+T~#HfInNhdcha2k+)9l3AzP^BaeOHnKXEGunVd-Fl++!FnIHW=OAb=1CKK&
z8B$ZG%j62(nO*DG7vH{*q8R|*V_^_GwU=DB*6`_@9NVo!opbx3<%E>jDw9NIo<?#{
zuodWDX-Ru(jVDeXCy4K7B5|9-lAetWltT~^2&Sq`lj##oxpi4k=1enWT9qM~#7_vt
zD_@n(e@G;bKzowsIVKK~0PGiA9XWB<mWP{qrTG<0S~?QowgY&K-@@WR6S8wt>?ppt
z8s_|OUhw#4(Oyy%;GZWLRgU@%L1VAf9SyP{LV+hZfij<rJI>F}Ja_WvD1+Hmo!pzX
zvo5>CFwO5cw#^k}z9e(u^@1lQOxDuRIGM5mu5ts|J4&Mcpa6}bfG|JvD6UWpuN(MB
z;nEUVzPi?*f%%J>AO{Bo#B|g21LJ#|pFRF%)Nj!&RDvd!fK1S(k!~eC?^-eT1AqV+
z4;uo<jm^h-$(+AFka6I$C%pv4UYXo`$B8S&|4)U69uaTMF1x@wkp={SM*FO3YPzdh
z8O5=eXWaH4Xx@HALXreGV!m;_sH_rEifw5xdt`W;ZtJe~cvnySWX#r(1?KW*$}0lE
z)Q!bmqpQbyNq72wfx;EW$^xii=eA6cni+vf3|;>2yKUN|dwZ4DXQX|3C3WP&7<n){
zVcXzCbVFN>p)sX)1^jFWM!vt;SCucpzvc6S@}GBBYQdm{&K>V-nYif%E^|rvdahEg
zp5VV(LjH&yb*yjSS)oP2<b?)43GPOyII+TzfB#H{{Hn299=p3*zW=#OnK9ACH3&p;
zTx^&}s1Nk?Agq1x%T-!XT+8*D<uy~xn~6E^QvYV{goHjc^IpvC%ygreX^V;;#KN$h
zPsPMH&`OL@Nf9ow3lr@VS+_JK4}P&yuDjANldE)@SYybXnWo&fCL|qQt{gcLzhG#l
zwe~<^K5|o78m{nTm7VMAK{UrvH}c>IoBtcIyK2cew8n9o8lnh-0_gT(#WtGkh%UD`
zw#wGSy%I(oKHjF?2aCLVmML5Btx??>3mrmF+i9r`Hw83r`cjMRJlcm2Q4zFagepi|
z6aoEpm;2<`U#}Jig3uM(aF({)r>|%Vf^J<O7$_<;1FGu`w$yk`w<F*ASVSgOV-$kJ
z596FTtnrWUD^pJ22KZRzuR4e9Ao7@P0y|z`yS)^>?nK)#o+MLY!$A!gmMeu}8>Jj1
zm*H3V0{lhnbuO`c?Kg|cFu_i$!Ac@I0KL4@klG33F92#&HM;dz)j|qt!JS9t`Mv6?
z<J!#0rc9}ZIVgtDUoZ9%M$lv;dhs(Rf@XG$y+n+GH8Cgl3h=V9@m7QqSiS5SHKGaL
zgC5Y8wLUc#;@v+Udr~!Hk|||i$c8IQXwz^?xH!hZc+zFl%mMc_JXdkf*Z}>~DW;fk
zi*~XHA;xjbDJwCrB_&D#y68)AI6Q!Z5U!o&OUrO^SV`0}cLuZ?V=5y?W>gw*bS>J7
z@wNae@VrYv2k0SLgAx~U>ckwE58qeEfzuB_=an$Lj2y|tx-WV6vVcrSh<DyLyd1^b
zb4=(%H=y^P)bOUNolys$Gy9vBA&J9M#*1dwTLqW--W5Tt8)D--lv;=F@dppzhjrIi
zUmB`~w#*nxE*oN+PN-a$%g52A$qd1qjge6bK>7Ni{Ph1OqjXVKUb{7n@iaH)`!wpU
zh0;!i|93E=JX`?a%5`R3ed&T)D*7BOCof6%{~kTcbnp;c-DMn5AD=`4a8ks;a5a7W
zXi2qQa8(?`=e^^RSnV}%-FzA|W%$l^AYhglemn!Mo6a0Trz=%b^kZCo(Ob}o80N@Q
z-BFlx8dWI6`V}XLhB!Ggo+Da|ftjK?oe~7`%!gyn0c+Ztbm(#@*hcTNeqliM=#-Bw
z48|!-Wqn<U?f-gVQ0xvoS(;i;2Hi`Vt!`Ite_M%~;Zkkcpd5w$!5({0RAl|?pg1GZ
z42|Z~|9CD}pE7)+>^zZ5@zP20e71rd(drC1{Y~|uObtNMLD#bp_k<8ebB?)~iBQq~
zF@#s{FkR)OOVg)9051B;>FrxJAebMm#sC;6;fv*0Sr5DNS0Macy}+N5_Itdtp}zJ?
zpDe`qOD`JkVp=XEwo*=^qVXLOD`KuY7|n7eGN`BKanZl0060mx<SM_KkRP$oA@}C;
zll5@E_M?9l7L%_Q7;D1)pL|EDnwBh9`$a+b0jqhl{bD2h94TT`n7dk;=IpAEV@%Xc
zOb?{z(uGN_`{HYI<S%h4L3o?8bx(i$n640fYSJ&hQYF{V1vBvJ^zCCw?EPbOSDIh8
zWbHq^rdDzkvQZ|@F@VpZkZt!?tGH&wHBRKmapTzGl`k2DcYN6N&Ra^AS*3SaV}U4j
zUNXY%3mYSH{aZ0Uh#+9B;Im|Ep9A+ZbB0g8{=sq;5wYAtC2D^hQvbv{yxawyuo1y0
z5yU((rkEK?jD}V%4$3WP+&ZwHrVvT_Y81_J{g1B?i`9n6hduHvlZuECiM;E^kn|!l
zp;cug%uK3phm|&58<gADhE&9s$vw;ixoLQqdi3nn9vj{Kdp=qw3(&wZ+~N?i(%8{&
zPn$#CkFp3pLE`k{7jBD)1tDh=cBU=3{{qXPAn(DjFu~{IE7GpE94&&hlWuO8PVvci
zK85#4F;E$eC|<`s$Y`MrSpEt|BqpeZOc~s$8gGm-{r;J_{B(Cz4m}f-vn`g2*9XdF
z?*deKgwS5t5OUG5+T%CZzWC8ujG%#?j5&wTzN=K;j%bJB8{JMmz)xm}5u6zYMWAEH
z6EV4GOQ)Q96)$VS0xeGVsGc)!AkFOfrKBIsD_)R?lT;HcO*P?i>++!7a2@8d#u9Py
zH92wn6$;=KR`Sl4z6=_IevXt7u>6keAFXyQ^E+$FZw~cI^Q#V4o;lJEOX<YMhMF7Q
z2t%`Q0IT0HTs)y1!yA|S<&sId%)pdl4ThNo4Z8sNLb?f-t+bYc0O&1kwltq}uwu@Z
zLnmT#4y)!UkZu6UrHNdY=xI2YR+fPWE~lJct;<ad0&@9OQvwxGW%zyvE{G9h#tB$p
zz2hm(*;#*3!o~vibVtT_C;Tb3L1`+qR;`}$)Pu_cxvbHXDb0;zuJq?@9Z4v!F;oE%
zv_6jW<Xh`ea>_Iy2o7;k6S<K_ML+&={5}=^%<q{7uVbT-$j+GCmJq<`u@AzT$l1iy
zJdVbYyb8J8+r_NEiy;Hg=a9xhF)+Y&kcXC&;4)E>#|t&5Sm3kf0ooya7vn~Bjmar3
z{aAIO=qIZX7`LqHrZQ^oizbYIo2HrXOeSC~$12=XDlqb01bIv*I&yJ&xjH}(=^rJf
zq<^s7Mk!&)Wk?yTAGTv^#`p_fLNVm(n?DPVK-5P2XdTz>So8#1<DOx5Sa1q1;tJ^V
z`m7$yu#fA1I^~>3<I@b^mWx4M#As&2I<VIC=3~zs{6BsE9Y@d%$pi4vZ~CEZu*~Wn
z9n0Ue`{&;w91CJZ=<LUTb(~dsZ{9RE1T+WQPRtY0uXJ?VN7Wl;hsI-LEB4LYnIJ%n
zeWu=K%28(5`2xD?n+|kH2?A4u>Y0?0Ngl@h?A~)r#Q&Mxb>ZYG82!W;SWj5Kx0Bc>
zEzYgS;#^USbJ0V{ATmx57CUF%cyGc(k3O%!-}v?!QXWdIE#l+%7jlAgR^do{uO*v*
z-K_d9x2?MbV?UTg&pAv%;e0C5b)$NHQ;5IRi#QtTiY#}(RGKTK4TA!DHhtssuwogu
z0{`KyXC;Vbs0aVlCimaF2+a&E0*rB0#y}_N{B7fUM2)9+Faj7Hz|h2<jZercExl?<
zJPG^AyJrKX9F+%-U&=7L)E?j8$kH%vtQy`GjTElC8U1Pw1LiDe5=>1Z_<a1dt+QAD
z>Dzyl7fyGHQSPVMFDSP}@JSPCYksjy(c0G0t7s<=<RveO*aBnB%xxy-EK`XT<!jx)
zS~Rhw+IJi#Qid0<az;68ag(9e&X|1mpZ|bi>L}LkYw9VHFxJAnZRupWb#1LwM6l?W
zZ!;c8YZ%aaAC)97Ki_&<w(fgLxz7?TEw?a8SQ-w>xBmVbsf<8zvPJ|*tHu{4SWZW`
z;apz2bl*9!?hYz4zH7-+Bjn#JQI1V=AU6BN#uu-vkRLwyjQs5Jv+$vbvgiW2(k+6C
z<&}$SWbLxaGIe?>Mh30Km^>&dR6F7Mcg{sfiBHa+>5{E`Uy_{%&q;e{6u}8B6LeGG
z`MA@qH%yTa-+l#VxMFJlB6~D=CkEz&rfzq}migA~-{+MzAb>{jjm>p-F5N5T{>9RX
z7xLwpSb~n>!ms|@ALZC{ZFq<xVal{EK2X6G1d&oh>gHC<o$sF`dMU<x6JNdP7e?-F
z#ekL*^Z+6~tO9hp<MOW$9GAmSw*YucJ>19HJ<ro{Ez;as74qdz&%^709WnCZfg&iS
z!`iQ}*t4u3YZY-0XnDU+avf9qmwc(9M((kF{%@~@M!_Qb$Ee9D8RmN<EIi4u^WZD;
znQt7GAOG}}oH*I8#<Gntmc^^K!V6_H3ujp+A9YTIzbeeYGXoGT%6j(sPI>6zQ}VfQ
zJSE#uXB6|Fq+uxdq?I(2cEv-Eil}afS!0>aH+k&&e;yCga<&CK@$}w`mCK*Nm8;;O
z0aI>?CapvBK5^F(dEu3A_1KPQ30}!`OMEW{AB8GGqgOj6BJW!_6A#~&N~8iO;G@-y
z4JUetFgEo(ISy3<7wRo7)N*bBTipX|>TK(ilg(Z7qeowm=CfU@E#iZR0X}Pha=ao~
z4i%&u^A<BFhUI&A*I|kg)8#BL*W_}hSdQ)5v8OKin>j3YSm}*m;Vw|+9$l6Ax<wv@
zz=~-8Z2;q|-+NmA{2cmyoPtb~674@g2HAYnhcj4w=q`j1v9!bwA>u77WxfH6qCi{F
zh_dg|)f2;NI7@|()NJpyIb?ODjy~6OUU5l8zVgYrQbC~u{JbQBAMqL5bvul^fp#O*
zC%IhChz&|ttyh7G?Ho?ljX_zm`r#n{uRx>xwa?9yZ~ovJIeNTBNk3JH=K)0k89_18
zk_c=M%HcfoaVkkaCCowZ#;}32R8-nh&RHX|Ed23^|Ar+t_`I_8+A8_{N3KBVjAc@&
zBQKio)dmGYH4b~evc)@@*blS;-f2EKrZRR}Tcp|#YLxkSm$TlJA)0g$?&OP~x*Ds<
z=yJH|Dgjigf(aaf=f*^kDG<K?g<&F}LgdC{^-36A8<=kFzb^rPs?t#&>Lv}O<x8N6
zwB^n1uu5VF4BhVd!^AYzHwRL352E$x_NBFfknsl;Q;H`O*+EO0H#KYN&n7fplf!>*
zk^443Cud(xJcsOQefm4|dxh+<v7J&Ak~=oelKEFwp#m_TA2t)F=R?O!ldirV`<meD
zeWz&!L%B!`DkZl5VaRazvYiM^8`S&rhu)pTZ`Ds=;|jli<jHe#*LVM<w3m$|lc)7L
zR59pQ&!w=jXPeUaiMcZW`iWc`qB?{lS>m9AGW}5o@7^BUtu^djiRXdU<G`tIO)CIe
z0VNiFe8FsgIP_#8URz1eLd|EG_`6*%%40ju%Cl!W6`fq$Pv@MfjY!2vx^qgSQ52V{
zGtHVBk#(yl%iC5=!=m4~GVBq&V7g*QK2N6nT4$^~I_hgH(+Yq!5E}@=F7%6Ay<W53
z6PNu@z9zrh_p%&1)}oet_@PL8QvZQOC7>LRfno*(<4+|nZ|71+u8LbQw^G(DnIy~V
zYQ#V<I6uAH;WVf-T;}B3A2L_&`;muXnw-PK(4iT3G$!7f&d+wpIk2N^!y>1l_hj>1
z34y9ug5qHsn}7Md9C^A`nqTThXo-*P;S$&2cu|h0*{ZI7OHmdD_rie`FpfwFPx?;|
zOWl=~@}8S7NrXud@<3hL5IWjDj%&#Td@phCcFn_Xq+9xRWuz>M8NGLF!?a*T_M?L{
zO?{fG!0(SHNNS*t4-hh#hvSX|ymrL<95{Qmr4N0CM4RSA=u=Y_Py>AB807Oo!&QTV
zPK1Nbm~wM@_cKE<!<RxOj7BZ)o{4t4OF}p9J_Dsm5I7`j^3RL};N1}0zNpSD#p~-W
zr=(b~ulEMfXaPE7OajTifdbScUzq?@Ke2Zp7+Qe3hyRL^`1*PSudi<}!0YQtKh4R%
z`oIx%QZ_)lz#+Rsg->)fj8K%zfmJvd!e&Rw?t&}niuG@Cb&l8Qz6RY>coN|vfQ6|$
zPKULD-wq&FnN~X{_3(U}wSDmhJ>dHZ<_&;Mp=~=;R>mnG<7J=j!qweouG+iV!zfc~
zVAGkWRgG%hur%%d{r@<9&L%XN_{tn)n5W)y=9F9jIqCDsd&qPMe$%eKd>N~F7-dS~
zm@Hsuq3U}w5#uMYd3?qyPlH!OE4fgAb9uS#b~#=6jMWW$9?O=@F<C%zB{VfwY_-H!
zqubhy_MWTiFOEcB9s9J^6<<vZ#^Upb0+f>lc>b>Ew+m{6(<9C3Clu$a*h9G})^EnM
zT-P(fZ}dGIn;BZSr`f|GTM}{-fLAHVV&LK6i`nnjeFi_~S^0+im}ksxbE5c|XT!b+
zJf1xavfbxJ0IVDYsbP!g)<u`A&)JH$`VI3rTR&d;p`HJnt;cJ&peNs#alD#*Q>tTF
zfK77@-gw{yuCH+pG_*>Yzd~C2pZ<Hjee})i=hR?^rrT=O7wuk6zR4qa&0Bkybt9Zg
z2n@k!n%J~hSND9k+y1HQo=4C{_ZUib<ArvPwDObYB?$1l?Vo^`1>}jmjWx_1jkUbF
zprI8tVzA(@#BhM>F+2O}52N2ur-m{+_(%d$o+f!zS-JdU<H}Tqz@CWoSWoCno95%l
z<-Ew#Tf}WdZwJ5gp7Lq|$<#H1U^dKZdJ`9Z_N}HxPDkIZ5{>V`SD7^Q9&r^@cAT{K
z07x#N(8nsGLEWT*w2-ErcoT*bHi6cKs9u53X~f0?fln3-W&tcbU5X!AQE%AJBUmj^
zr3TQt(TU?5WihZ(aI5e_Nq(3pj3$r+d!6wXyrA$FUqjQbbTk+0e8DUr1;HAvfxgtY
zXjc=))2?>gt&d4>{Bc-76klvI#1Ab@0A#5)BOjKb%79PDBncGRQFX8`JSGQMv)yft
zf4sNLnMd$R8#Z)ti>H|5VgVEmncay+V95)WT6es)qO_!Zo^ClyG)q1JkZSQox>5;3
zPw1t&v=L)p1AEUaQ;j$#$eA;5PtFp{9D5KJoW@7J{>#yv16_TcPgSlu+J>tsY2f){
zrg0NMGLwyf?JBHCN?x|XaBuO7#nbTtxjC4UoP$rItr1(BhP8r~a8r1Tw^TwXi7+}5
z7PbP>4srEX*x4Dp7k(Q)rFPPeIVVoN)_!{KhGSTXnn<)nEI8l?6g&}nmx{jse^(;x
UIXhc7WB>pF07*qoM6N<$g5FeS$^ZZW

literal 0
HcmV?d00001

diff --git a/emoji-substitution/manifest.json b/emoji-substitution/manifest.json
new file mode 100644
index 0000000..c5dbeeb
--- /dev/null
+++ b/emoji-substitution/manifest.json
@@ -0,0 +1,24 @@
+{
+  "manifest_version": 2,
+  "applications": {
+    "gecko": {
+      "strict_min_version": "49.0.1"
+    }
+  },
+
+  "name": "Emoji Substitution",
+  "description": "Replaces words with emojis.",
+  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/emoji-substitution",
+  "version": "1.0",
+  "icons": {
+    "48": "icons/icon.png",
+    "96": "icons/icon@2x.png"
+  },
+
+  "content_scripts": [
+    {
+      "matches": ["<all_urls>"],
+      "js": ["./emojiMap.js", "./substitute.js"]
+    }
+  ]
+}
diff --git a/emoji-substitution/substitute.js b/emoji-substitution/substitute.js
new file mode 100644
index 0000000..c886063
--- /dev/null
+++ b/emoji-substitution/substitute.js
@@ -0,0 +1,93 @@
+/*
+ * This file is responsible for performing the logic of replacing
+ * all occurrences of each mapped word with its emoji counterpart.
+ */
+
+// emojiMap.js defines the 'sortedEmojiMap' variable.
+// Referenced here to reduce confusion.
+const emojiMap = sortedEmojiMap;
+
+/*
+ * For efficiency, create a word --> search RegEx Map too.
+ */
+let regexs = new Map();
+for (let word of emojiMap.keys()) {
+  // We want a global, case-insensitive replacement.
+  // @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+  regexs.set(word, new RegExp(word, 'gi'));
+}
+
+/**
+ * Substitutes emojis into text nodes.
+ * If the node contains more than just text (ex: it has child nodes),
+ * call replaceText() on each of its children.
+ *
+ * @param  {Node} node    - The target DOM Node.
+ * @return {void}         - Note: the emoji substitution is done inline.
+ */
+function replaceText (node) {
+  // Setting textContent on a node removes all of its children and replaces
+  // them with a single text node. Since we don't want to alter the DOM aside
+  // from substituting text, we only substitute on single text nodes.
+  // @see https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent
+  if (node.nodeType === Node.TEXT_NODE) {
+    // This node only contains text.
+    // @see https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType.
+
+    // Skip textarea nodes due to the potential for accidental submission
+    // of substituted emoji where none was intended.
+    if (node.parentNode &&
+        node.parentNode.nodeName === 'TEXTAREA') {
+      return;
+    }
+
+    // Because DOM manipulation is slow, we don't want to keep setting
+    // textContent after every replacement. Instead, manipulate a copy of
+    // this string outside of the DOM and then perform the manipulation
+    // once, at the end.
+    let content = node.textContent;
+
+    // Replace every occurrence of 'word' in 'content' with its emoji.
+    // Use the emojiMap for replacements.
+    for (let [word, emoji] of emojiMap) {
+      // Grab the search regex for this word.
+      const regex = regexs.get(word);
+
+      // Actually do the replacement / substitution.
+      // Note: if 'word' does not appear in 'content', nothing happens.
+      content = content.replace(regex, emoji);
+    }
+
+    // Now that all the replacements are done, perform the DOM manipulation.
+    node.textContent = content;
+  }
+  else {
+    // This node contains more than just text, call replaceText() on each
+    // of its children.
+    for (let i = 0; i < node.childNodes.length; i++) {
+      replaceText(node.childNodes[i]);
+    }    
+  }
+}
+
+// Start the recursion from the body tag.
+replaceText(document.body);
+
+// Now monitor the DOM for additions and substitute emoji into new nodes.
+// @see https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver.
+const observer = new MutationObserver((mutations) => {
+  mutations.forEach((mutation) => {
+    if (mutation.addedNodes && mutation.addedNodes.length > 0) {
+      // This DOM change was new nodes being added. Run our substitution
+      // algorithm on each newly added node.
+      for (let i = 0; i < mutation.addedNodes.length; i++) {
+        const newNode = mutation.addedNodes[i];
+        replaceText(newNode);
+      }
+    }
+  });
+});
+observer.observe(document.body, {
+  childList: true,
+  subtree: true
+});
diff --git a/examples.json b/examples.json
index 02e3a83..5adaeb5 100644
--- a/examples.json
+++ b/examples.json
@@ -207,6 +207,15 @@
       }
     ]
   },
+  {
+    "name": "Emoji Substitution",
+    "description": "Replaces words with emojis.",
+    "url": "https://github.com/mdn/webextensions-examples/tree/master/emoji-substitution",
+    "manifest_keys": [
+      "content_scripts"
+    ],
+    "javascript_modules": []
+  },
   {
     "name": "favourite-colour",
     "description": "An example options ui",