Archive for Pemrograman

Script mute backsound pada HTML5

Mungkin ada yang masih bingung, bagaimana cara membuat tombol yang berfungsi untuk “mute”. Biasanya sih kalau buat game kan ada backsoundnya dan bisa diatur apakah mau di on/off. Nah, pada posting kali ini akan dibahas bagaimana cara membuat tombol untuk mengatur backsound tersebut.

Oke, langsung saja… Cekidot…

Yang perlu dipersiapkan:
1. File backsound dalam .mp3/.ogg
2. Icon sebagai tombol mute
3. Script dalam .html

<html>
<head>
<audio id="backsound" src="backsound.mp3" autoplay="autoplay"></audio> 
<style>
body {
margin: 0px;
padding: 0px;
overflow: hidden;
}
canvas {
border : dashed red;
}
img.button { 
display: block;
margin: -20% 20% 0 5%;
width: 50px; 
}
#gameUI {
height: 480px;
position: absolute; 
width: 320px;
}
</style>
</head>
<body>
<div id="container"></div>
<canvas width="320" height="480"></canvas>
<div id="gameUI"><img src="icon2.png" class="button" id="mute"></div>
<script>
//backsound mute
var audio = document.getElementById('backsound');
document.getElementById('mute').addEventListener('click', function (e){
	e = e || window.event;
	audio.muted = !audio.muted;
	e.preventDefault();
}, false);
</script>
</body>
</html>

Mudah kan?
Semoga bermanfaat.

Advertisements

Game Hijaiyah Match #HTML5

Sedikit share aplikasi Game Edukasi Pengenalan Huruf Hijaiyah dengan HTML5.

Game Hijaiyah Match merupakan game pengenalan huruf hijaiyah untuk anak-anak. Pemain diminta untuk mencocokan huruf hijaiyah dan bacaannya dalam huruf latin. Game ini bersifat drag and drop dan berbasis web. Aplikasi game ini menyajikan huruf hijaiyah dalam tulisan arab sebagai obyek yang harus di-drag dan area dropzone berupa huruf latin yang merupakan bacaan dari huruf hijaiyah tersebut.

Yang digunakan dalam pengembangan aplikasi ini adalah
a. Library HTML5 Sound : buzz.js
Buzz adalah library javascript yang membantu dengan mudah memasukkan dan mengelola suara pada website dengan menggunakan tag audio yang ada pada HTML5. Selengkapnya dapat dilihat disini.

b. Framework : kinetic-v4.5.4.min.js
KineticJS adalah HTML5 Canvas Javascript Framework yang memberikan konteks 2 dimensi (2d) dengan memungkinkan interaktivitas kanvas untuk aplikasi desktop dan mobile. Selengkapnya dapat dilihat disini.

Hasil game bisa di download disini. Untuk mencoba game hijaiyah ini, silahkan menuju link ini.

Menambahkan Backsound pada Game menggunakan BuzzJs

Buzz adalah library javascript yang membantu dengan mudah memasukkan dan mengelola suara pada website dengan menggunakan tag audio yang ada pada HTML5.

Yang perlu kita persiapkan untuk menambahkan sound dalam game:
1. Buzz.js yang dapat diunduh disini
2. Sound dalam format .ogg atau .mp3

Nah, dari script yang sudah dibuat kita hanya perlu menambahkan script dibawah ini pada bagian body.

<script src="buzz.js"></script>
<script>
var gameSound = new buzz.sound( "backsound", {
formats: [ "ogg", "mp3" ]
});
gameSound.play()
  .fadeIn()
  .loop()
  .bind( "timeupdate", function() {
   var timer = buzz.toTimer( this.getTime() );
   document.getElementById( "timer" ).innerHTML = timer;
});
</script>

Mudahkan…

Memvalidasi kode CSS dan HTML

Kesalahan menulis kode pada HTML dan CSS berakibat pada efek yang diharapkan tidak muncul. Meneliti sendiri kode yang salah terkadang sangat sulit. Untuk itu, kenapa tidak menggunakan validator saja..

Oke, ini dia layanan yang menyediakan pemeriksaan kode :
1. Validator Kode CSS
2. Validator Kode HTML berupa addons pada firefox dan Validator Kode HTML berupa addons pada Chrome
Silahkan mencoba. 😀

Game Hijaiyah Match dengan Construct2

Hijaiyah Match
Sekedar iseng-iseng utak-atik project Drag and Drop Matching Game.
Disini saya hanya mengganti frame dan obyek yang dicocokan berupa huruf hijaiyah.

Silahkan unduh disini untuk mencoba memainkan.

Untuk menjalankannya:
buka project ini pada Construct2 lalu tekan F5.

Cetak Input Data menjadi PDF dengan FPDF

Bermula dari tugas mata kuliah Proyek Khusus di Prodi yang meminta kami untuk membuat cetak otomatis surat penunjukan dosen pembimbing tugas akhir.

Aplikasi dibuat dengan php agar data dosen dan mahasiswa yang dibutuhkan nantinya dapat diimport dari server SIA (Sistem Informasi Akademik).

 Diharapkan dengan aplikasi ini :

1. Admin dapat menginputkan surat hanya dengan menginput nim, otomatis nama dapat terinput tanpa mengetik secara manual.

2. Dosen dapat melihat mahasiswa siapa saja yang beliau bimbing.

Selengkapnya

Membuat Segitiga Pascal dengan Java

Ini dia sourcodenya…
import java.util.ArrayList;
import java.util.List;

public class SegitigaPascal {

public static void main(String[] args) {
int n = 10;
int segitiga[][] = new int[n + 1][n + 1];
for (int i = 0; i <= n; i++) {
for (int j = 0; j <= i; j++) {
if (j == 0 || j == i) {
segitiga[i][j] = 1;
} else {
… continue reading this entry.

Program Menentukan Bilangan Prima dengan C++

#include <iostream.h>
#include <conio.h>
int main()
{
int bil, jum, i;
cout << "Masukkan bilangan bulat positif : ";
cin >> bil;
jum = 0;
for (i=1; i<=bil; i++)
if (bil%i==0)
jum++;
if (jum==2)
cout << "Bilangan tersebut adalah bilangan prima \n";
else
cout << "Bukan bilangan prima \n";
return 0;
}

Output:

Konversi Biner ke Desimal dengan Java

Tinggal copas aja ke Netbeans…
Try it…

import java.util.Scanner;
public class BinerToDec {
public static void main ( String[] args ){
Scanner input = new Scanner(System.in);
int a;
int m =0;
int x = 0;
double hsl=0;

System.out.print(“Masukkan Bilangan Biner : “);
a = input.nextInt();

System.out.print(“Konversi ke Desimal : “);
System.out.println();
hasil(a,m, x,hsl);
System.out.println();
}
static void hasil(int a, int m, int x,double hsl)
{
Selanjutnya

Konversi Desimal ke Biner dengan Java

package JavaApplication2;

class Rekursi {
void DesimalkeBiner(int n) {
if (n>1) {
DesimalkeBiner(n/2);
}
System.out.print(n%2);
}
}

class main{
public static void main(String[]args) {
Selanjutnya

« Previous entries