diff options
Diffstat (limited to '_www/index.html')
| -rw-r--r-- | _www/index.html | 229 |
1 files changed, 229 insertions, 0 deletions
diff --git a/_www/index.html b/_www/index.html new file mode 100644 index 0000000..ce76842 --- /dev/null +++ b/_www/index.html @@ -0,0 +1,229 @@ +<!DOCTYPE html lang="id"> +<html> + <head> + <title>Project Kamusku</title> + + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + + <script type="text/javascript" src="/kamusku.js"></script> + <script type="text/javascript" src="/index.js"></script> + + <!-- Global site tag (gtag.js) - Google Analytics --> + <script async src="https://www.googletagmanager.com/gtag/js?id=UA-2502278-8"></script> + <script> + window.dataLayer = window.dataLayer || [] + function gtag() { + dataLayer.push(arguments) + } + gtag("js", new Date()) + + gtag("config", "UA-2502278-8") + </script> + + <style> + a { + text-decoration: none; + } + body { + font-family: sans-serif; + margin: 0px auto; + width: 800px; + padding: 0px; + line-height: 1.25em; + } + h2 { + border-bottom: 1px solid silver; + } + input, + button { + height: 32px; + } + pre { + overflow: auto; + background-color: cornsilk; + color: black; + padding: 1.25em; + border-radius: 5px; + line-height: 1em; + } + .topbar { + background: aliceblue; + font-size: 24px; + padding: 1em; + height: 24px; + } + .topbar .title { + float: left; + } + .topbar .menu-item { + float: right; + } + .unduh { + display: inline-block; + } + .unduh-item { + float: left; + border: 1px solid silver; + border-radius: 5px; + padding: 6px; + margin: 10px 10px; + } + .row { + width: 100%; + display: flex; + } + .f-left { + width: 100%; + display: flex; + flex-flow: column; + height: 32px; + } + .b-right { + width: 200px; + display: flex; + flex-flow: column; + margin-left: 10px; + height: 32px; + } + .kelas-kata, + .contoh { + margin-left: 2em; + } + + @media only screen and (max-width: 992px) { + body { + width: 90%; + } + .unduh-item { + text-align: center; + min-width: 200px; + max-width: 50%; + } + } + </style> + </head> + <body> + <div class="topbar"> + <div class="title">Proyek Kamusku</div> + <div class="menu"></div> + </div> + + <p> + Proyek sumber terbuka implementasi HTTP API dan antar-muka perintah untuk Kamus Besar Bahasa + Indonesia. + </p> + + <h2>HTTP API</h2> + + <p>Kamusku HTTP API adalah jantung dari semua implementasi klien.</p> + + <h3>API Definisi</h3> + <p>HTTP API untuk mencari definisi dari satu atau lebih kata.</p> + <p>Format permintaan,</p> + <pre> +GET /definisi?kata=<string>,... +</pre + > + + <p>Format respons dalam JSON,</p> + <pre> +{ + "<string>": { + "dasar": "<string>", + "pesan": "<string>", + "definisi": [{ + "isi": "<string>", + "kelas": [<string>], + "contoh": [<string>] + }, + ... + ] + } +} +</pre + > + + <p> + Jika kata tidak ditemukan atau bila kata bukan kata baku, bagian "pesan" akan berisi keterangan yang + menjelaskan galat dari pencarian. + </p> + <p> + Berikut contoh pemanggilan API untuk mencari definisi dari kata "kamus", "bahaza" (kata tidak + ditemukan), dan "analisa" (kata tidak baku): + <a href="/api/definisi?kata=kamus,bahaza,analisa" target="_blank"> + /api/definisi?kata=kamus,bahaza,analisa + </a> + </p> + + <h2>Definisi kata</h2> + + <div class="row"> + <div class="f-left"> + <input type="text" id="kata" maxlength="64" value="kamus,bahaza,analisa" /> + </div> + <div class="b-right"> + <button onclick="cariDefinisi()">Cari definisi</button> + </div> + </div> + + <p class="note">Catatan: Pisahkan kata dengan koma untuk mencari lebih dari satu kata.</p> + + <div id="definisi-result"></div> + + <h2>Bot Telegram</h2> + + <p> + Dengan tersedianya API, membuka banyak implementasi terbuka lain, salah satunya yaitu Bot untuk + aplikasi Telegram: + <a href="https://t.me/KamuskuBot" target="_blank"> https://t.me/KamuskuBot </a> + </p> + <p> + Untuk saat ini, KamuskuBot hanya punya satu perintah yaitu "/definisi". Cara menggunakan perintah + ini hampir sama dengan program kamusku yaitu dengan memberikan kata yang dicari, contohnya, + </p> + <pre> +/definisi kamus,bahasa +</pre + > + + <h2>Program kamusku</h2> + + <p>Program kamusku yaitu antar-muka untuk mencari definisi dari kata lewat baris perintah.</p> + <p> + Program ini sangat sederhana, cara menggunakannya cukup dengan memberikan kata yang dicari setelah + nama program, misalnya, + </p> + <pre> +$ kamusku kamus,bahasa +</pre + > + <p>maka akan mencetak definisi dari kata "kamus" dan "bahasa" ke layar,</p> + <pre> +=== bahasa + Definisi #1: sistem lambang bunyi yang arbitrer, yang digunakan oleh + anggota suatu masyarakat untuk bekerja sama, berinteraksi, dan + mengidentifikasikan diri + Kelas #1: Nomina: kata benda + Kelas #2: Linguistik: - + + Definisi #2: percakapan (perkataan) yang baik; tingkah laku yang baik; sopan santun + Kelas #1: Nomina: kata benda + Contoh #1: baik budi --nya + + ... + +=== kamus + Definisi #1: karya rujukan atau acuan dalam bentuk cetak maupun digital yang memuat kata dan ungkapan, dapat disusun menurut abjad atau tema, berisi keterangan tentang makna, pemakaian, atau terjemahan + Kelas #1: Nomina: kata benda + + Definisi #2: buku yang memuat kumpulan istilah atau nama yang disusun menurut abjad beserta penjelasan tentang makna dan pemakaiannya + Kelas #1: Nomina: kata benda + + ... +</pre + > + + <div class="unduh"></div> + </body> +</html> |