Dagens Hiku på din webbplats.

Dagens Hiku är ett lugnt sifferspel med fyra nya bräden varje dag, från lätt till expert. Det är gratis att bädda in på en nyhetssajt eller webbplats, med två rader kod.

Regeln är kort: talet säger hur långt det hoppar, vågrätt eller lodrätt. Landar det på ett annat tal dras det mindre från det större. Målet är att få alla tal att försvinna. Bräden är desamma som i Hiku-appen för iPhone.

Så gör du

Klistra in koden nedan där spelet ska synas, till exempel i en artikel eller på en egen spelsida.
Publicera. Spelet hämtar dagens bräden själv och anpassar sin höjd.

HTML

<div data-hiku data-lang="sv"></div>
<script src="https://hikupuzzle.com/daily/embed.js" async></script>

Skriptet behöver bara finnas en gång per sida, även om sidan har flera spel.

Prova och kopiera

Välj inställningar, se spelet ändras och kopiera koden när ni är nöjda.

Kod

Inställningar

Inställningarna anges som attribut på <div data-hiku>.

Attribut	Värden	Vad det gör
`data-lang`	`nb`, `en`, `sv`, `da`, `fi`, `de`	Spelets språk: norska, engelska, svenska, danska, finska eller tyska. Utan detta används sidans eget språk (`<html lang="…">`), annars norska.
`data-theme`	`light`, `dark`	Låser färgerna. Utan detta följer spelet läsarens ljusa eller mörka läge.
`data-align`	`left`	Placerar spelet till vänster. Utan detta står det centrerat i det utrymme det får och är aldrig bredare än 480 pixlar.
`data-level`	`easy`, `medium`, `hard`, `expert`	Vilket av dagens fyra bräden som visas först. Utan detta öppnar spelet på den nivå läsaren spelade senast, annars på Lätt. Läsaren kan alltid byta.

Exempel, alltid ljust och med Medel först:

HTML

<div data-hiku data-lang="sv" data-theme="light" data-level="medium"></div>
<script src="https://hikupuzzle.com/daily/embed.js" async></script>

Utan skript

Tillåter inte publiceringssystemet skript kan spelet läggas in som en vanlig iframe. Då anpassar sig inte höjden själv, så ange den. 860 pixlar räcker för hela spelet, även när ett bräde är löst; spelet är aldrig bredare än 480 pixlar.

HTML utan skript

<iframe src="https://hikupuzzle.com/daily/?lang=sv"
  title="Dagens Hiku" loading="lazy"
  style="display:block;width:100%;max-width:480px;height:860px;border:0;margin:0 auto"></iframe>

Inställningarna anges då i adressen: ?lang=sv, &theme=dark, &level=hard. Placeringen styrs av ramens stil; ta bort margin:0 auto för att lägga den till vänster.

Integritet och drift

Inga kakor och ingen spårning. Inga speldata eller resultat skickas till oss. Resultat och stjärnor sparas bara i läsarens egen webbläsare. Länken till App Store innehåller namnet på webbplatsen spelet finns på, så att vi i App Store Connect kan se hur många som kom från varje sida totalt. Bara Apple får den uppgiften, och bara om läsaren trycker på länken. Vi räknar visningar med Cloudflare Web Analytics, utan kakor och utan att följa enskilda personer: vi ser hur många som öppnade spelet och på vilken webbplats, inte vem. I övrigt tar värdtjänsten emot vanliga tekniska förfrågningar när filerna laddas, som för alla webbsidor.
Tillgänglighet. Spelet kan spelas med skärmläsare och enbart tangentbord: varje ruta har ett namn och varje drag läses upp. Det följer ljust och mörkt läge, stänger av animationer för den som bett om det och är byggt enligt WCAG 2.2 nivå AA och testat med verktyget axe. Det gör det lättare för er att uppfylla kraven på tillgänglighet.
Isolerat spel. Själva spelet körs i en iframe från en annan adress och kan inte läsa eller påverka sidan runt omkring. Det lilla laddningsskriptet, embed.js, körs på er sida som andra externa skript: det skapar ramen och anpassar höjden, och gör inget annat. Källkoden är kort och kan läsas på embed.js. Redaktioner som inte tillåter externa skript använder iframe-versionen.
Lätt. Första gången laddas cirka 70 kB komprimerat. Ramen laddas först när läsaren närmar sig den.
Nya bräden vid midnatt i läsarens tidszon. Biblioteket räcker i tre år, och bräden är desamma som i appen.
Driftas på Cloudflare. Värdtjänsten ser läsarens IP-adress när filerna laddas, som för alla webbsidor.

För tekniska redaktioner

Rekommenderas vid höga säkerhetskrav

Använd iframe-versionen ovan. Då körs ingen kod från oss på er sida, bara i ramen. Det enda ni förlorar är att höjden inte anpassar sig själv.

Content Security Policy

Med laddningsskriptet behövs båda; med ren iframe bara den sista:

CSP

script-src https://hikupuzzle.com;
frame-src https://hikupuzzle.com;

Lägg till dem i era befintliga direktiv. Spelet i ramen hämtar filer från samma adress, och räkneskriptet från static.cloudflareinsights.com. Det sker inne i ramen och påverkar inte era regler.

Stabilitet

Adresserna …/daily/embed.js och …/daily/, och attributen i tabellen ovan, ligger kvar. Nya inställningar läggs till utan att ändra de befintliga.
Skriptet laddas med async och håller aldrig upp resten av sidan.
Är Cloudflare otillgängligt blir platsen där spelet skulle stå tom. Sidan runt omkring påverkas inte.

Villkor

Dagens Hiku är gratis att använda på nyhetssajter, bloggar och andra webbplatser. Det enda kravet är att länken till Hiku-appen i spelet står kvar som den är: dölj, ta bort eller täck inte över den.

Hör gärna av er till es@rubberduck.no när ni börjar använda det, så meddelar vi er innan ändringar som kan beröra er.

Kontakt

Har du frågor eller vill veta mer innan ni börjar? Skicka e-post till es@rubberduck.no.