Oppaat / Käyttäjäskriptit

Käyttäjäskripteillä voi lisätä omaa JavaScriptiä olemassaoleville verkkosivuille tehden näistä paremmin omia tarpeita vastaavia. Yksinkertaisimmillaan niillä voi esimerkiksi poistaa sivulta mainoksen tai muuttaa räikeän värisen taustan maltillisemmaksi. Esimerkissäni käyttämäni skripti on kuitenkin tätä monimutkaisempi.

Yleensä näiden ajamiseen käytetään käyttäjäskriptinhallintaselainlisäosaa. Käytän itse Wildmonkey-nimistä selainlisäosaa, jonka saa ainakin Firefoxiin ja Chromeen. Muita lisäosia on mm. Violentmonkey, Tampermonkey ja Userscripts – jokaiselle selaimelle löytyy varmasti omansa. Googlella löydät nämä, mutta valitettavasti olen laatinut ohjeet vain Wildmonkeylle (Chromiumilla) ja Tampermonkeylle (Firefoxilla).

Käyttäjäskriptit varsinkin epämääräisistä lähteistä kannattaa tarkistaa haittakoodin varalta. Yksi tapa on copy-pastettaa skripti parille eri tekoälylle ja kysyä näiltä, löytyykö seasta haittakoodia. Tekoälyt tuntuvat olevan hyviä tällaisen koodin kanssa. Vaihtoehtoisesti tai lisäksi voit näyttää skriptiä ohjelmointiin perehtyneelle tuttavallesi ja kysyä tältä, vaikuttaako skriptissä olevan jotain vaarallista.

Wildmonkey


Tämä ensimmäinen ohje käsittelee Wildmonkeyn käyttöä, Tampermonkeyn ohje tulee sen jälkeen. Ensimmäiseksi tulee asentaa Wildmonkey. Firefoxin versio löytyy täältä ja Chromen täältä.

Kun Wildmonkey on asennettu, on helpointa laittaa se näkyväksi Toolbariin ("Pin to toolbar"). Opaskuvissa on käytössä Chromium-selain. Ylempi punainen nuoli osoittaa, mistä lisäosavalikko aukeaa ja alempi nuoli osoittaa lisäosavalikon kohtaa, josta painamalla saat lisäosan näkymään Toolbariin.



Kun Wildmonkey on nyt Toolbarissa, paina sen kuvaketta (ylempi nuoli osoittaa) ja sen jälkeen avautuvassa pienessä valikossa Settings-tekstiä (alempi nuoli osoittaa).



Wildmonkeyn mukana tulee pari esimerkkiskriptiä, jotka voit poistaa, vaikka se ei ole välttämätöntä. Poistaminen tapahtuu miinusmerkistä, jota kuvan punainen nuoli osoittaa. Ensin sinun tulee toki valita listalta skripti jonka haluat poistaa klikkaamalla sitä hiirellä. Miinusmerkin vasemmalla puolella on plusmerkki, josta taas voit lisätä uuden, tyhjän skriptin. Tee näin.



Nuolet ylös ja alas näiden vieressä oikealla siirtävät skriptejä listalla ylemmäs tai alemmas, ja tämän on tarkoitus auttaa siten, että enemmän käyttämäsi skriptit on ylempänä ja löydät ne nopeammin. Tämä on käytännöllistä erityisesti manuaalisesti ajettavien skriptien kanssa, eli niiden joille ei ole määritelty Urls-kentässä mitään osoitetta.

Kun olet lisännyt uuden tyhjän skriptin, kirjoita skriptin nimeksi haluamasi Name-kohtaan. Esimerkissäni se on superhissi.js. Type-kohdassa valitaan vaihtoehdoista JavaScript. Code-kohtaan tyypillisesti copypastetetetaan, eli kopioidaan ja liitetään itse skriptin koodi. Opastan myöhemmin yksityiskohtaisemmin kopioinnin ja liittämisen.

Urls-kohta jätetään tyhjäksi silloin, jos skriptiä ei haluta ajaa automaattisesti millään sivulla vaan sitä käytetään itse käsin klikkaamalla tarpeen vaatiessa. Mikäli taas se halutaan ajaa automaattisesti (kuten superhissi.js:n kohdalla asia on), laitetaan sen verkkosivun tarkka osoite, jolla skripti halutaan ajaa automaattisesti. Jos skripti halutaan ajaa useammalla sivulla, voidaan erotella osoitteet rivinvaihdolla. Tämä skripti on kuitenkin suunniteltu juuri tiettyä, numerotunnuksin varustettua chathuonetta varten, joten sitä ei lähtökohtaisesti haluta muualla ajaa.

Koodin kopiointi ja liittäminen tapahtuu siten, että avataan koodin lähde, esimerkiksi verkkosivu jolla koodi on. Koodihan on siis vain tekstiä pohjimmiltaan. Kyseisellä verkkosivulla valitaan koodiosio hiirellä, eli laitetaan hiiri koodin alku- eli yläosaan ja painetaan hiiren nappi alas, jonka jälkeen vedetään hiiri koodin loppu- eli alaosaan. Kun teet näin, näet koodin "värjäytyvän" eli valittu teksti muuttuu väriltään erilaiseksi kuin sivun muu teksti. Kun oikea tekstiosio on valittu, painetaan CTRL-C.

Vaihtoehtoinen tapa on valita koko sivun teksti painamalla CTRL-A ja sen jälkeen CTRL-C, liittämällä tekstin Notepadiin tai vastaavaan yksinkertaiseen tekstieditoriin ja poistamalla ylimääräisen tekstin ja jättämällä vain koodiosan, jonka jälkeen valitset Notepadissa taas kaiken ja painat CTRL-C. Näin koodi on "leikepöydällä" ja valmiina liitettäväksi selainlisäosaan.

Liittäminen tapahtuu painamalla CTRL-V siellä mihin haluat tekstin liittää sen jälkeen kun se on kopioitu "leikepöydälle". Tässä tapauksessa haluat liittää koodin Wildmonkeyn Code-osioon, joten klikkaat Code-tekstin alla olevaa muita isompaa tekstikenttää hiirellä, jonka jälkeen painat CTRL-V.

Kun tämä kaikki on tehty, voit sulkea Wildmonkeyn välilehden ja mikäli teit kaiken oikein ja skripti on toimiva, päivittämällä sen verkkosivun jolla haluat skriptin käyttöön saat skriptin toimintaan.

Tampermonkey


Tampermonkey on selainlisäosa, käyttäjäskriptinhallintalisäosa. Se toimii suurimmassa osassa selaimia, tätä kirjoittaessani valikoimassa on Chrome, Edge, Safari, Opera Next ja Firefox. Safarille Tampermonkey maksanee 2–3 euroa, muille selaimille se on tietääkseni ilmainen. Mikäli olet Safari-käyttäjä ja siksi valitset Tampermonkeyn, kannattaa ainakin kokeilla sitä ensin jollain selaimella jolle sen saa ilmaiseksi varoaksesi turhaa rahanhaaskausta, jos Tampermonkey ei vastaisikaan toiveitasi.

Ensimmäiseksi Tampermonkey tietenkin asennetaan selaimeen. Lisäosan omalta kotisivulta löytyy linkit joka selaimelle. Koska Wildmonkeyn kanssa käytin Chromiumia, käytän nyt Firefoxia selaimena lisätäkseni oppaan monipuolisuutta kokonaisuutena.

Asentaessa rastita ruutu, johon vasemmanpuoleinen punainen nuoli osoittaa. Mikäli et käytä Firefoxin yksityisselaustilaa, ei tuon rastittaminen ole välttämätöntä. Sen jälkeen paina oikeanpuoleinen punaisen nuolen osoittamaa Add-nappia.



Seuraavaksi rastita "Pin extension to toolbar" (vasemmanpuoleinen nuoli) jotta löydät lisäosan tarvittaessa helposti. Sen jälkeen paina OK (oikeanpuoleinen nuoli).



Toolbarista pitäisi nyt löytyä Tampermonkeyn kuvake (ylempi punainen nuoli). Sitä klikkaamalla aukeaa valikko, josta valitaan "Create a new script" (alempi punainen nuoli).



Avautuu ruutu, jossa on Tampermonkeyn "vakioskripti". Ruutu näyttää tältä:



Pyyhi pois tuo lyhyt vakioskripti ja kopioi sekä liitä sen tilalle haluttu skripti (esimerkissäni superhissi.js). Tarkemmat ohjeet skriptin liittämiseen löytyy Wildmonkey-oppaan lopusta; kopiointi ja liittäminen tapahtuu samaan CTRL-C & CTRL-V -tyyliin. Vaikka tekstissä näkyy värejä, se on todellisuudessa tavallista "mustavalkoista" tekstiä jonka Tampermonkey automaattisesti värittää JavaScriptin syntaksiin pohjautuen. Älä siis välitä väreistä.



Ylävasemmalla on File-valikon avaava painike (ylempi punainen nuoli). Klikkaa sitä, jolloin aukeaa valikko ja valikosta klikkaa Save (alempi punainen nuoli). Sen alla on "Save to disk" joka saattaa hämätä; sitä ei kuitenkaan tarvitse painaa, vaan se on tarkoitettu esimerkiksi varmuuskopioiden nopeaan tekemiseen skriptistä jos skriptiä itse muokkaa. Jos sitä painaa, se vain tallettaa skriptin vakiolatauskansioon (usein Downloads-niminen).



Tampermonkey ottaa oikeat asetukset, kuten millä sivuilla skripti ajetaan automaattisesti, käyttöön suoraan skriptin alkuosasta (esim. @match ja @run-at). Avautuvan näkymän pitäisi olla allaolevan kaltainen.



Jos näin on, kaiken pitäisi olla kunnossa ja voit siirtyä kokeilemaan, josko skripti toimii. Jos olet jo sivulla jolla skriptiä on tarkoitus käyttää, päivitä kyseinen sivu.