APLIKASI TIDAK DIKEMBANGKAN LAGI
Cuma template javascript yang dibangun menggunakan VueJS dan framework/library lainnya:
- AlaSQL (local storage database)
- ShowdownJS (markdown)
- Date-FNS
- Bootstrap-v4
- Bootstrap-Vue
- Bootswatch Theme (alternatif Bootstrap tema)
- Lodash
- Dan lainnya.
Tipe soal yang didukung:
- Pilihan Ganda (PG).
- Multi Jawaban (MJ).
- Benar/Salah (BS).
- Isian (IS) untuk jawaban singkat.
- Esai (ES) untuk jawaban terperinci.
Cuma tautkan file-file assetnya di html dan tambahkan pengaturan seperti di bawah ini:
<html>
<head>
<!-- .... -->
<link href="/quiz/app/quiz.css" rel="stylesheet">
</head>
<body>
<script>
window.EnixApp = {
quiz: {
// ....
}
}
</script>
<div id="EnixApp-quiz"></div>
<script src="/quiz/assets/vendor-all.js"></script>
<script src="/quiz/app/quiz.js"></script>
</body>
</html>{
"soal_1": {},
"soal_2": {},
"soal_3": {},
"soal_<n>": {}
}Penomoran di atas wajib berurutan.
Contoh skema bisa dilihat di direktori assets.
{
"soal_1": {
"tipe": "pg",
"body": "Pemain sepakbola yang pernah membela klub Real Madrid di antaranya....",
"opsi": {
"column": 2,
"items": {
"opsi_1": {
"body": "Cristiano Ronaldo"
},
"opsi_2": {
"body": "Santiago Solari"
},
"opsi_3": {
"body": "Luis Suarez"
},
"opsi_<n>": {
"body": "..."
}
}
}
}
}Untuk opsi_ wajib berurutan.
Minimal opsi jawaban untuk tipe soal Pilihan Ganda (PG) adalah 3 (tiga).
{
"soal_1": {
"tipe": "mj",
"body": "Pemain sepakbola yang pernah membela klub Real Madrid di antaranya....",
"opsi": {
"column": 2,
"items": {
"opsi_1": {
"body": "Cristiano Ronaldo"
},
"opsi_2": {
"body": "Santiago Solari"
},
"opsi_3": {
"body": "Luis Suarez"
}
}
}
}
}Untuk opsi_ wajib berurutan.
Minimal opsi jawaban untuk tipe soal Multi Jawaban (MJ) adalah 3 (tiga).
{
"tipe": "bs",
"body": "Pemain sepakbola *Cristiano Ronaldo* pernah membela <em>Manchester United</em>.",
"opsi": {
"column": 2
}
}{
"soal_4": {
"tipe": "is",
"body": "Jumlah Trofi Liga Champions yang dimenangkan Real Madrid saat ini berjumlah....",
},
"soal_5": {
"tipe": "es",
"body": "Sebutkan 5 pemain yang membela Real Madrid pada musim 2018/2019.",
}
}Untuk kolom opsi jawaban hanya bernilai 1 atau 2 (number/integer), opsional (default: 1).
{
"tipe": "pg",
"body": "Pemain sepakbola *Cristiano Ronaldo* pernah membela <em>Manchester United</em>.",
"opsi": {
"column": 2
}
} window.EnixApp = {
quiz: {
baseUri: "/quiz/",
source: "/quiz/assets/quiz_data.json",
duration: 5, // seconds
interval: 60, // seconds
onInterval: function(data) {
// console.log(data)
// kirim data server setiap 60 detik
// lihat pengaturan `interval`
// console.info('Menyimpan data ke server.', new Date())
},
onFinish: function(data) {
// console.warn('Waktu habis!', new Date())
}
}
}contoh URL untuk pengaturan di atas:
http://example.com/quiz
Download aja source code di branch gh-pages ini.
Tampilan log aktivitas.Tabel data.Konfigurasi waktu mulai dengan format 00:00:00.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent