From 6824c594c90721866911367e2b054d13b26e1b1f Mon Sep 17 00:00:00 2001 From: Michael Campagnaro Date: Tue, 19 Mar 2019 22:54:00 -0400 Subject: [PATCH] Add code --- .gitignore | 2 + LICENSE.md | 21 ++++++++++ README.md | 20 +++++++++ icons/herp128.png | Bin 0 -> 5165 bytes icons/herp48.png | Bin 0 -> 1523 bytes index.js | 103 ++++++++++++++++++++++++++++++++++++++++++++++ manifest.json | 23 +++++++++++ 7 files changed, 169 insertions(+) create mode 100644 .gitignore create mode 100644 LICENSE.md create mode 100644 README.md create mode 100644 icons/herp128.png create mode 100644 icons/herp48.png create mode 100644 index.js create mode 100644 manifest.json diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..d7b6b77 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.web-extension-id diff --git a/LICENSE.md b/LICENSE.md new file mode 100644 index 0000000..264d3ea --- /dev/null +++ b/LICENSE.md @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2016 Tanner Stokes + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..158032a --- /dev/null +++ b/README.md @@ -0,0 +1,20 @@ +Replaces YouTube comments with random herp derps. This is modification of github.com/twstokes/herpderp + +Note: Ignores iframe embedded videos, including the chat replay iframe on YouTube livestream vids. + +## Install + +* I have a signed xpi that you can immediately install. Open `build/` and drag the xpi into Firefox. + +## Development + +### Local Testing + +In Firefox, open about:debugging and click `Load Temporary Add-on...` then select `manifest.json`. +file. + +### Signing and Building + +* Install web-ext with `$ npm install --global web-ext` +* Generate an unlisted xpi with 'web-ext sign --channel unlisted --api-key --api-secret `. Those keys can be obtained from https://addons.mozilla.org/en-US/developers/addon/api/key/ +* Drag downloaded xpi into Firefox. diff --git a/icons/herp128.png b/icons/herp128.png new file mode 100644 index 0000000000000000000000000000000000000000..d7e82e36517ceff9e16e9467d67354d5a6bed56a GIT binary patch literal 5165 zcmbW5)mIb@w8cl78M>sTKR~2QK$;nlW~8K~hwhYa5Co*9OF9IH?(UKhh5-g7C8cxV zdjEubAI{z{=jp6-)?VlLNlQbC5J(FI004x_Z^7^WdC3139>zaaGrr3CXEdIW_nz7= zFi#(IcWZ#0m5YTnld_Y!jrBWgbE}VTqt=oD0Qs~sSWd@x`OpO9sH1zA@4t&aY@eB3 z#^ph>FqKHlG8M@4AG7=h85iR8au1~q4AV|JgEN$bxxC?6>Jip(^U*O{k*aFW@_XFJ zqOcg9NDBi;P(!08Y}szt?F9XFEafqs(<+opvCZh{-lbM*GbMFB)rmT}??PSYdazSc zKm^=c16bTCT>)YMV=(|dfR`RX1b9vazzqT6hG6zYV)i^+?|ZfmaNPj70$Tp>Z6VN? z>Ck|apXFrnL(5@i?b@){HNaxi zNL#Qzw>VgWLNS}Y(^OefVx`^Bnh+DB-`Q6nIE!0{h+tKck0wUKrl}NJ0UJ%C;=xi=9eEU=exG0@k>utMI$l(j&Ilk(ZJXPu4Y+vtMrfKUte zs1>z7i6;eL5m5}7MO|GznGJDt6&nj=KHYkJeB9ZA8L#Y~o45^9%8&yHL_)_#8)$nr zY<0d^3xnHNt(sGO`}{(fkIP(>zzgu&0=CoWXP=Xzi>U#OK{p#U&1jk)Y@6SXuu;rt@W70PE3=K{56sHaq$cF%gtoJBB|o{0F(vc1>CSq7rr+rVZz{qFwH=qTZl;g94W`2lJV z_T+QZUGQ8-O$lOZ$Yq_ydI+^P7e$VX_aPoOhIc+6yvV}QsRm)MOUT2);c>n*H5j-3 zOYd2A&$m4M+k?NE?_#-_b(6<%Sbkxqnj3G}q+;KqgT61ScJNRWu)N@RXmq9}qvB+k zC>)Y`LIiKcAhweoMNz3Q;rj>YjeBe`oA%)Ab`Y^NUS8Zn^FW39Wm1gFa#njty?T+Y z74~QRXzVy_FGsbXgtAm3sI9yJ2WJEzBmMybP^Z9V1ejx^RXoy`O z)@j=Tg_9yxMO=$-eT#dEAivqz7}-gylJ6F&`6!vTGcPYCF&`U!(u`GIY3>`J*}T_l zzWpRt`Zb0SqV3(?;OkYNL*^O53u~>J7Pn35#~VwD(yFSe>S{G1z5@i@=I8k#d^$Nv zDUo4t_~3gtgHv=r)YSCk)OSgB)wQ26R5k=XG!=|K04pkPF4dO-fnBdSZMnE5|6Jyo zw5QWUez;zgW^3&3Hm9aGq^CEfrUmX_iawksUR*SJ9T*OMwyUak%;ztxX=!nId?0bA zv|sq|Y&+xmaaVg;M~BZCMaNxbC5~QAto=33N`0}*!_DLV{>)JPjN{gp^3ykEh4Y=! zER8;O_0SU4?ez4UPL_`baCSp&*2$cTF4$ypV}|?X!fuljD^pxWDFS*l4Ee?8CC)MK z<>lpnbqKZ09DHYDlAE2adWf!VKbG*=A)vvjinc4>@GN=|?flyZa#*bWFB->8kN{H( zeKE&>TU}jUZ#kUI0JvT8m@fIMt!DAIX@re$MZ#GCb(C<3`xU955^JUWC3M)MVul;~N(;@0E1hMySX$CK{Cbkxz(0%Uo$8Xsbl1~d2{*8iC+D}L5M#2^`?trb}yie*l% zqo(bG__76Uo)IEf<>&0hR#nl7JHIU=ik?Rve3d~-2ewIczrcGS?(e(0v~a8@8%v+&_M_THxB)8f7+c{(-2>_mwxn z%9iryf4zud`Z}93u2+d=L4)YS3p*3IeW`Oajq^*{)F z3Ww&0dJD+MkK!{JMs`E;;fc2+GnFIC?Lhd z0zIh+dO)yQ7_j1l3Y^gZ6K8478M$;qye1`p@dVQ{PY{vknOdbOr?KkN~?=AQTIfNmB4D#u0 z15yYWTu*AcI{z*Bb# z1bx|)%+t&8li&A_O%rQtZ;i68AAD_%d0&2Fkg&o8_^p1K!h}s`i3C4BxQeOq#^0>X z%zPmLG-!^twzi6wWUz50sit#hiaOESQY~vT5F?u%bjb$u{OGz=DK@>@39&#J`olGW9RxP{eT{;G8XbNic^D;LzRW>hFAX%qR zw-qj$o`Kxm^Bf)Vzlz{q$yQHRd(JzcH9a-NPuIC|0bokaNKG9vgw`%6aF*sg;2$i= zB#&nb+4Pwaj*?CB@bHM_MD7X0Ccc_;D1v`}Jvl(TR*L~VRSck?tvmEQhNJ*|-)&17d%^j2#^EeohoB>j+J~M-#;M^H$f<8U0n%;%33Q%h1XgOE`#5DMD)X; zpG{=LnWH3T)g?klT;JOR-j2Y$lH8YLA=|yUjMbHuKn{(Ob?)@gOKhkS?FVKAS6W^k z!|ce!#J6i%Q05IrNbkcR?)a;Q5%yIf*jKNn6FF{ngKlSD(~gUGn+M;KU)0|bGz^;i zo0^sklA&&kN|wc!F-ex6lT9KHJ(r~z=52xRq$j1pFD%W-iyc;d_@3djzGqEf9SPwf z(S>4xSq5I{=J#Cp!crD;gJ$uq#;IuH(CVtjbt%DbOuEu79EZ|IR_ZEtZO?hHP zaCA8F+2PgRy4km~;nEU7Qz7$7z2)(Q8U$4(-{Wmm^LEy%e;M=qC~CJ}EcdTaYpX$n z;X=!5pi$>U>a3Wp^< zzvYnc_vYE7y!F#{U30iDo_xu$HddsdIOjr_q#7aK+m7?ysy{N0xIG!^WPo|>xKj31 z*3yBC^)d`VlX08pOS_Ym*7NNQ)8oB8SpvDcL>=5T{;%gn%{dYBW_GD#$Yz)Br^oyM zoY0*=evozK9xAC+R!}bKuYC_nYYq6gGnQt#f1rAGa=qqFHyPYz+{~+xE|=$fcznIa ziZ+15KJH9G3JY$~?wW~#XI7|w;wlgOw;xjUP^midiLe#7Xs1()m()7ddc)}J6v@da z)Ke5KUCpv+!WJlj6YIYz_Cahw$K%~W3>}_aqVyeSthr>ckI!qO#)gKDyZx$$y%)zo zoKWIteH;yUk-%6S3K~TQ7LN{3gQ&s-{5x=p+?CAb{Q4t$6aHg9Ql<>P*?H}kz&M>J z2x&mZH94KTpm>`b-oJV!b-lt0voTUp^$&i!-=a&%l)RVZejrjB%73J&sUrVk{b!@_ zmhq_$7h@-feqYUzfQ%0a;LOs+I?K%X;D^6JzO7aiII_~}u{)8ephjIbQ`z@rml`Xk zh{Te{f1y$r^qkjo-*E_*i9h}#-80>@u*CX0meOYbU_3zj6-^?ZxUlEpMs&F0%kZ~p zmwUzHmzUC8HweVOprMx+N#v`q2o^6k)7lKLnsz4;0^A*~!UDh6s+fRb75H>T? zen1e2G^{|WEg(NT8?-Ac5E&OPI$MqNJ2jfY56=s=Xc|oD0%$0&cay_y&v96q2(S8N zQC@6WSH=;F-?w3AV>4Z$jXGIH{_t-u?(F0enk(zoJo9WG-iER`7{^3{@e|G-G zcvvsf2F~YDW#(-T&B#3K@$^F1{$ct+ZF`l_A`Xq57=Z$}mH%ud`S_-_c<2z+)9dby zN6VL^$E)GAY+)a`#xXHDu}xy#Bau?X?}Km3d1vm_ zH)i^ak>nf^a2wUm4~hMu{`~E$yH95snE#fCgh7B8aC}2=607AlFFn^*XzAl`-YFMbM9D^;p+GN>C zWo2!$cTCjKXi)u&ex8piPS>cBYU#3ZizFgw{I9t%8cK%9%_4Z+Q$6acRP0x;Acm>0 zO5-sbqfRlrTmp;T+@gy#2jq4YEaixUNPB(I?zFm!vYQF?W;P zR`~bVz7Z6z0jksp zMGbV4%HQQ0;cQLp*lJEAd{AkUdF3dX`Gpc&4>_QJ#ekWGig9Pl1EA+`l253-E3zQv z;^Y2EQjCjXsf>xmMcyIslrUQPjh347eZVGK%g5BTKbA5#)n+Ip-t~Sb5`6VY z6Umgwo)K{W#jJdhz)y1AK)LkA+Fd>sXPmwm_f1{VHr(Tiv(!P8^0S9 z*h^M2RUCZeEsdVphPerIro8rDgb{@lyS98neh`usXV0U)m>BTPnHNt+nm+S4@>czB zjhh@kJr&{{iyCE%Px7+TCiim3(xy@oHR}2{{AP(2$*GAyVsZ`MZkv zAN(I)TYO?vA4M-4etD@&+*y$29NCZl_z|=FCNi^{=CcIAxV3e5xe=Yhp~@tCB(8M! z?`w(h;c*?N{bu@P>znb_#{e0@BCtCoBgogUq#S1!rCTGcU}j1xDm@*YjP$mK{~+eVj|w)aM31rs z$P?lcMB3w%++&4(LR?&a*t(a52OMr!!S{Lpsa%TIWo`Wx##6>lhIrXJ*FSRg|G`%O iX9#9CKk|gn4kcFDTZ%F)oa8#=y;IS*Ghc5X53J%a7^7!9klXNMBzc8?y#^wgK!%Mn+&Z zFfcI65JcBOgIrwP84kBKHnMf=a!#FMoa>s#5(yBa$KxiZRLZnWCNTmEPGZuABaQ7i z8q~5ZV?SU@CX>)9rI}176beNm5x?Jm?b@~8-rl`?_iov;1$tRo*|B5Cfb8A7ci?r| zvSlVih9O!T&`2cf{P{Nn1HYU-%V*8vFJ5?$9~WlMXrR=Z${aK2@`5-Ym17CcJ12b@px2Ky>#gk_P%`iGQb@?co10c z-@m_O$Bw+bJaE&|(b3S*04Q~Jb+*rJ4`4+}QB;pdZg0oAjlx3Dwr%h8^IJn9US2Mh zma;&AR#X`K_PqsLQ>L&bOFE7o{R{PC>sI&|tBe*#9Czc!jVDf=*sx&(`~`@ut*sb$ z?%dha)6?DE4Fjz3n(`Y#cl6n_GqP+0qF4wHTDfv1Jc8W3c<~};F*AAc z%A~g!5oW#;DB@mW#*ZSl!-3w`BF|)h}PZgm)f2 zdISRm7Hq&1Y+NoE9_`+}`{c=!OP4N144P?U!Gim9*RJ)~*B72X{p$AZWF!*n>Y5Y` z7CwGFLzeSUP$-q%Zp17IHT1-$p~gm8QOrqjX6A^M+Y)M& zAb=hy#44b}!^191>_Tc6+e3#AojZ39fdxy1JRbGb)C@N@3EA0$_&FgGV{T2$Q&mw> zcsl)_QY}AU9vbpX5&~sJ5d4&qSS+`xDed?Fv1t>6DL_aT%BjyMH#gI9D5GV7erzT_ zpKn|rw<#?x&B@96!jfCrQD_)upAtp1NdxTyXOQK5%nS}nD8!=ZVoXIr2NRO?_Q8W> zZf;PL6j)NK+qC_M=K8B8pG{>lNHb!uXSvY4wfdAX*2Pd2MR?Xi0|h`+7cQ8Y>GdL< z5y)mNqdcOLeSdQ$ixz3k%_fDPG;q76lTVwx-Sch7gL1bU+{CR)2zF6dwW6XzpO1Y1 zzaN^e_q4Sk;s5!rL;me$h Math.floor(Math.random() * max); + +// builds a string with random herps and derps +const derpString = (length = 20) => { + const randomLength = randomInt(length) + 1; + const randomDerp = randomInt(2) ? "herp" : "derp"; + + return Array.from({ length: randomLength }, () => randomDerp).join(" "); +}; + +// herp derps an element +const derpElement = element => { + const c = element; + // preserve the original contents + c.derpOriginal = c.textContent; + // swap between the two when clicked + c.onclick = () => { + c.clicked = !c.clicked; + c.textContent = c.clicked ? c.derpOriginal : c.derpString; + }; + + // add derped class + c.classList.add("derped"); + // create a derp string for this comment + c.derpString = derpString(); + // change the contents + c.textContent = c.derpString; + c.clicked = false; +}; + +const checkComment = commentElement => { + const c = commentElement; + // if everything is fine, return + if (c.clicked && c.textContent === c.derpOriginal) return; + if (!c.clicked && c.textContent === c.derpString) return; + + // otherwise, fix the comment + // the only case of malformed comment encountered so far are these two cases: + if (c.textContent.indexOf(c.derpString) !== -1) { + // in the case of the new comment being appended after the derp string, + // just grab it and put it in the derpOriginal variable + const idx = c.derpString.length; + c.derpOriginal = c.textContent.substring(idx); + c.textContent = c.textContent.substring(0, idx); + c.clicked = false; + return; + } + + if (c.textContent.indexOf(c.derpOriginal) !== -1) { + // Same issue but the comment was appended after derpOriginal + const idx = c.derpOriginal.length; + c.derpOriginal = c.textContent.substring(idx); + c.textContent = c.derpString; + c.clicked = false; + } +}; + +const init = commentsSection => { + // selectors for comments + const selectors = ["#content-text"]; + // build the full selector string + const derpSelectorString = selectors + .map(sel => `${sel}:not(.derped)`) + .join(", "); + const checkSelectorString = selectors.map(sel => `${sel}.derped`).join(", "); + + // Only watch for child list changes, as we're watching the comments container + const mutationConfig = { attributes: false, childList: true, subtree: true }; + + // Create a MutationObserver + // This object will monitor the comments for DOM changes + const observer = new MutationObserver(() => { + // Check that everything's fine with the already derped comments + // This is necessary because youtube does a lot of wizardry with comments in-between videos + document.querySelectorAll(checkSelectorString).forEach(checkComment); + // Derp all un-derped comments + document.querySelectorAll(derpSelectorString).forEach(derpElement); + }); + + observer.observe(commentsSection, mutationConfig); +}; + +// Check every so often if comments are loaded or not. Once they are, the timeout +// stops until the user leaves youtube or reloads the page. This needs to be +// done since comments are added in the DOM through js at an undetermined point +// through Youtube's execution. +const checkCommentsLoaded = () => { + setTimeout(() => { + // This selector is awful, but Youtube re-uses a lot of the DOM (the + // selector for the comments is re-used across a bunch of pages) so we need + // the exact path to the comments to match + const commentsSection = document.querySelector("html body ytd-app ytd-comments ytd-item-section-renderer #contents"); + if (commentsSection !== null) { + init(commentsSection); + } + else { + checkCommentsLoaded(); + } + }, 500); +}; + +checkCommentsLoaded(); diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..7f2b2c8 --- /dev/null +++ b/manifest.json @@ -0,0 +1,23 @@ +{ + "manifest_version": 2, + "name": "YouTube Herp Derp", + "description": "Replaces YouTube comments with herp derps. Forked from github.com/twstokes/herpderp", + "homepage_url": "https://michael.is", + "version": "1.0", + "icons": { + "48": "icons/herp48.png", + "128": "icons/herp128.png" + }, + "content_scripts": [ + { + "run_at": "document_idle", + "all_frames": false, // Ignore iframes. + "matches": [ + "https://apis.google.com/*", + "https://plus.googleapis.com/*", + "https://www.youtube.com/*" + ], + "js": ["./index.js"] + } + ] +}