Tuesday 9 July 2013

Open GL

Setelah melewati masa-masa sulit membuat tugas CGI kemarin, akhirnya saya bisa melanjutkan juga ke mata kuliah yang berikutnya yaitu OpenGL.  Kalo kalian nanya apa itu OpenGL aku juga belom paham bener sih. Yang aku tahu sih OpenGL itu kepanjangan dari Open Graphic Library. Open GL itu bukan merupakan bahasa pemrograman.  Katanya sih OpenGL itu suatu spesifikasi grafik Low Level yang bisa digunakan untuk keperluan pemrograman grafis.  Jadi dengan OpenGL kita bisa membuat objek 2Dimensi maupun 3Dimensi.

Pada matakulah kali ini, OpenGL saya gunakan pada bahasa pemrograman C/c++. Yah, berikut contoh program yang saya buat.


#include <stdio.h>
#include <stdlib.h>
#include <string.h>
#include <stdarg.h>
#include <glut.h>

void mydisplay()
{
       glClear(GL_COLOR_BUFFER_BIT);
       glBegin(GL_TRIANGLES);
       glVertex2f(-0.5, -0.5);
       glVertex2f(-0.5, 0.5);
       glVertex2f(0.5, 0.5);
       glEnd();
       glFlush();
}
int main(int argc, char** argv)
{
       glutCreateWindow("simple");
       glutDisplayFunc(mydisplay);
       glutMainLoop();
}


Nah program ini kalo dijalankan hasilnya akan seperti ini 

Itu tadi adalah contoh objek 2Dimensi yang sudah saya buat, Kalo contoh objek 3Dimensinya seperti ini ya guys.


#include <stdio.h>
#include <stdlib.h>
#include <string.h>
#include <stdarg.h>
#include <glut.h>

float z_pos=-10.0f;
float rot=0.0f;

void resize(int width, int height)
{
       glViewport(0, 0, width, height);
       glMatrixMode(GL_PROJECTION);
       glLoadIdentity();
       gluPerspective(45.0, (float)width/(float)height, 1.0, 300.0);
       glMatrixMode(GL_MODELVIEW);
       glLoadIdentity();
}

void myTimeOut(int id)
{
       // called if timer event
       // ...advance the state of animation incrementally...
       rot+=10;
       glutPostRedisplay(); // request redisplay
       glutTimerFunc(100, myTimeOut, 0); // request next timer event
}

void myKeyboard(unsigned char key,int x, int y)
{
       if((key=='<')||(key==',')) z_pos-=0.1f;
       if((key=='>')||(key=='.')) z_pos+=0.1f;
}

void mydisplay(void)
{
       glClear(GL_COLOR_BUFFER_BIT );
       //glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
       glLoadIdentity();
       glTranslatef(0.0,0.0f,z_pos);
       glRotatef(rot, 0, 1, 0);
       glBegin(GL_QUADS);
       // Front Face, red
       glColor3f(1.0,0.0,0.0);
       glVertex3f(-1.0f, -1.0f, 1.0f);
       glVertex3f( 1.0f, -1.0f, 1.0f);
       glVertex3f( 1.0f, 1.0f, 1.0f);
       glVertex3f(-1.0f, 1.0f, 1.0f);
       // Back Face, green
       glColor3f(0.0,1.0,0.0);
       glVertex3f( 1.0f, -1.0f, -1.0f);
       glVertex3f( 1.0f, 1.0f, -1.0f);
       glVertex3f(-1.0f, 1.0f, -1.0f);
       glVertex3f(-1.0f, -1.0f, -1.0f);
       // Top Face, blue
       glColor3f(0.0,0.0,1.0);
       glVertex3f(-1.0f, 1.0f, -1.0f);
       glVertex3f(-1.0f, 1.0f, 1.0f);
       glVertex3f( 1.0f, 1.0f, 1.0f);
       glVertex3f( 1.0f, 1.0f, -1.0f);
       // Bottom Face, yellow
       glColor3f(1.0,1.0,0.0);
       glVertex3f(-1.0f, -1.0f, -1.0f);
       glVertex3f( 1.0f, -1.0f, -1.0f);
       glVertex3f( 1.0f, -1.0f, 1.0f);
       glVertex3f(-1.0f, -1.0f, 1.0f);
       // Right face, cyan
       glColor3f(0.0,1.0,1.0);
       glVertex3f( 1.0f, -1.0f, -1.0f);
       glVertex3f( 1.0f, 1.0f, -1.0f);
       glVertex3f( 1.0f, 1.0f, 1.0f);
       glVertex3f( 1.0f, -1.0f, 1.0f);
       glVertex3f(-1.0f, -1.0f, -1.0f);
       glVertex3f(-1.0f, -1.0f, 1.0f);
       glVertex3f(-1.0f, 1.0f, 1.0f);
       glVertex3f(-1.0f, 1.0f, -1.0f);
       glEnd();
       glFlush();
       glutSwapBuffers();
}

void init()
{
       glClearColor( 0.0, 0.0, 0.0, 1.0 ); // A Background Clear Color
       glMatrixMode(GL_PROJECTION);
       glLoadIdentity();
       gluPerspective(45, (GLdouble)500.0/(GLdouble)500.0, 0, 100);
       glMatrixMode(GL_MODELVIEW);
       return;
}

int main(int argc, char** argv)
{
       glutInit(&argc,argv);
       //glutInitDisplayMode( GLUT_DOUBLE /*| GLUT_DEPTH*/ );
       glutInitDisplayMode( GLUT_DOUBLE);
       glutInitWindowSize(500,500);
       glutInitWindowPosition(0,0);
       glutCreateWindow("simple");
       // callbacks
       glutDisplayFunc(mydisplay);
       glutKeyboardFunc(myKeyboard);
       glutTimerFunc(100, myTimeOut, 0);
       glutReshapeFunc(resize);
       init();
       glutMainLoop();
       return 0;
}


Hasilnya adalah:

Friday 5 July 2013

CGI (Common Gateway Interface)

Akhirnya setelah sekian lama tidak memperbaharui postingan kali ini, aku bisa juga membuat pot baru.
Kali ini tentang mata kuliah yang aku pelajari yaitu CGI atau Common Gateway Interface. Common Gateway Interface adalah Sekumpulan aturan yang mengarahkan bagaimana sebuah server web berkomunikasi dengan sebagian software dalam mesin yang sama dan bagaimana sebagian dari software (CGI Program) berkomunikasi dengan server web.

Pada postingan kali ini aku akan memberikan contoh program tugas yang diberikan oleh Bapak dosen di kampusku.   Tugasnya adalah membuat "Lamp Controller". Jadi dalam tugas ini dibutuhkan hardaware berupa arduino uno lengkap dengan lampu LED nya yang berwarna merah-kuning-hijau. Nantinya dibutuhkan file php ataupun html untuk mengontrol lampu dan juga file.cgi sebagai CGInya.

pertama kita buat dulu file cgi-nya. Disini saya membuat file actuator.cpp yg kemudian nantinya saya ubah menjadi actuator.cgi

#using <System.dll>
#include <iostream>
#include <stdlib.h>
#include <fstream>
#include <conio.h>
#include <string>

using namespace System;
using namespace System::IO::Ports;
using namespace std;

int main(){
      char *data;
      int a,b,c,d,e;

      cout<<"Content-Type:b text/html"<<endl<<endl;
      cout<<"<title>Tugas CGI</title>"<<endl;
   
      data = getenv("QUERY_STRING");
        
      if(data==NULL)
      {
            cout <<"<p>Kesalahan pada pengiriman data<p>"<<endl;
      }
      else if (sscanf (data,"a=%ld & b=%ld & c=%ld",&a,&b,&c) !=3)
      {
            cout <<"<p> Data salah, masukkan data numerik</p> "<<endl;
      }
      else
      {

      if (a==1){
                cout <<"<p> Lampu Merah Menyala</p> "<<endl;
                cout <<"<form> "<<endl;
                cout <<"<input type = \"button\" value = \"Back\" onclick=\"window.location='http://167.205.66.247/TugasCGI/lampu.php'\">" <<endl;
                cout <<"</form> "<<endl;
               
                SerialPort^ mySerialPort = gcnew SerialPort("COM15");
                mySerialPort->BaudRate = 9600;
                mySerialPort->Parity = Parity::None;
                mySerialPort->StopBits = StopBits::One;
                mySerialPort->DataBits = 8;
                mySerialPort->Handshake = Handshake::None;
               
                mySerialPort->Open();
                mySerialPort->Write("a");
                mySerialPort->Close();
      
         }else{
                SerialPort^ mySerialPort = gcnew SerialPort("COM15");
                mySerialPort->BaudRate = 9600;
                mySerialPort->Parity = Parity::None;
                mySerialPort->StopBits = StopBits::One;
                mySerialPort->DataBits = 8;
                mySerialPort->Handshake = Handshake::None;
               
                mySerialPort->Open();
                mySerialPort->Write("s");
                mySerialPort->Close();
         }

      if (b==1){
                cout <<"<p> Lampu Kuning Menyala</p> "<<endl;
                cout <<"<form> "<<endl;
                cout <<"<input type = \"button\" value = \"Back\" onclick=\"window.location='http://167.205.66.247/TugasCGI/lampu.php'\">" <<endl;
               
                SerialPort^ mySerialPort = gcnew SerialPort("COM15");
                mySerialPort->BaudRate = 9600;
                mySerialPort->Parity = Parity::None;
                mySerialPort->StopBits = StopBits::One;
                mySerialPort->DataBits = 8;
                mySerialPort->Handshake = Handshake::None;
               
                mySerialPort->Open();
                mySerialPort->Write("d");
                mySerialPort->Close();
         }else{
                SerialPort^ mySerialPort = gcnew SerialPort("COM15");
                mySerialPort->BaudRate = 9600;
                mySerialPort->Parity = Parity::None;
                mySerialPort->StopBits = StopBits::One;
                mySerialPort->DataBits = 8;
                mySerialPort->Handshake = Handshake::None;
               
                mySerialPort->Open();
                mySerialPort->Write("f");
                mySerialPort->Close();
         }
    
      if (c==1){
                cout <<"<p> Lampu Hijau Menyala</p> "<<endl;
                cout <<"<form> "<<endl;
                cout <<"<input type = \"button\" value = \"Back\" onclick=\"window.location='http://167.205.66.247/TugasCGI/lampu.php'\">" <<endl;
               
                SerialPort^ mySerialPort = gcnew SerialPort("COM15");
                mySerialPort->BaudRate = 9600;
                mySerialPort->Parity = Parity::None;
                mySerialPort->StopBits = StopBits::One;
                mySerialPort->DataBits = 8;
                mySerialPort->Handshake = Handshake::None;
               
                mySerialPort->Open();
                mySerialPort->Write("g");
                mySerialPort->Close();
         }else{
                SerialPort^ mySerialPort = gcnew SerialPort("COM15");
                mySerialPort->BaudRate = 9600;
                mySerialPort->Parity = Parity::None;
                mySerialPort->StopBits = StopBits::One;
                mySerialPort->DataBits = 8;
                mySerialPort->Handshake = Handshake::None;
               
                mySerialPort->Open();
                mySerialPort->Write("h");
                mySerialPort->Close();
         }
         return 0;
         }
}


selanjutnya buat file lampu.php
 

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta name="Description" content="Information architecture, Web Design, Web Standards." />
<meta name="Keywords" content="your, keywords" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Distribution" content="Global" />
<meta name="Author" content="Erwin Aligam - ealigam@gmail.com" />
<meta name="Robots" content="index,follow" />

<link rel="stylesheet" href="images/MarketPlace2.css" type="text/css" />
<link rel="shortcut icon" href="abc.gif">
<title>Lamp Controller</title>
<script language="JavaScript" type="text/javascript">
var d=new Date();
var monthname=new Array("Januari","Februari","Maret","April","Mei","Juni","Juli","Agstus",
"September","Oktober","November","Desember");
var TODAY = d.getDate() + " " + monthname[d.getMonth()] + " " + d.getFullYear();
</script>

<script language="javascript" type="text/javascript" src="swfobject.js" ></script>
<script type="text/javascript" src="textsizer.js"></script>
</head>

<style type="text/css">
<!--
body {
       background-image: none;
       background-repeat: no-repeat;
}
#wrap #content-wrap #rightcolumn #FlashID {
       text-align: center;
}
tengaahhh {
       text-align: center;
}
foot {
       text-align: center;
}
vote {
       color: #666;
}
voting {
       font-weight: bold;
}
vvvv {
       font-weight: bold;
}
jajaja {
       color: #326ea1;
}
.style1 {color: #1F9A82}
.style2 {
       font-size: 36px;
       font-weight: bold;
}
.style4 {
       color: #FF0000;
       font-weight: bold;
}
-->
</style>
</head>

<body onLoad="show3()">
<div id="wrap">
  <div id="header">
    <div id="header-links">
<p><span class="style1">
         Tanggal,</span>
  <script language="JavaScript" type="text/javascript">
      document.write(TODAY);      </script>
</p>         
    </div>
         <!--header ends-->
  </div>
             
    <p align="center" class="style2">LAMP CONTROLLER </p>
    <p align="center"><img src="images/IMG-20130613-04847.jpg" width="315" height="211"></p>
    <p align="center">&nbsp;</p>
    <div align="center" id="x"><blink><span class="style4"> Pilih Lampu yang Akan Dinyalakan !!
</span></blink></div>

 

   <p align="center"><a href="http://167.205.66.247/cgi-bin/actuator.cgi?a=1&b=0&c=0" 
 title="Nyalakan Lampu Merah" ><img src="images/ans-4_03.png" alt="" width="50" height="50"></a>&nbsp;
   <a href="http://167.205.66.247/cgi-bin/actuator.cgi?a=0&b=0&c=0" title="Matikan Lampu Merah">
<img src="images/off_03.png" alt="" width="50" height="50"></a>
   <br><a href="http://167.205.66.247/cgi-bin/actuator.cgi?a=0&b=1&c=0" title="Nyalakan Lampu Kuning">
<img src="images/ans-4_05.png" alt="" width="50" height="50"></a>&nbsp;
   <a href="http://167.205.66.247/cgi-bin/actuator.cgi?a=0&b=0&c=0" title="Matikan Lampu Kuning">
<img src="images/off_05.png" alt="" width="50" height="50"></a>
   <br><a href="http://167.205.66.247/cgi-bin/actuator.cgi?a=0&b=0&c=1" title="Nyalakan Lampu Hijau">
<img src="images/ans-4_07.png" alt="" width="50" height="50"></a>&nbsp;
   <a href="http://167.205.66.247/cgi-bin/actuator.cgi?a=0&b=0&c=0" title="Matikan Lampu Hijau"><img src="images/off_07.png" alt="" width="50" height="50"></a></p>


    <p>&nbsp;</p>
    <div  id="nav"><!-- navigation ends-->     
       </div>
                    
<!-- content-wrap starts --><!-- footer starts -->                  
       <div id="footer-wrap"><div id="footer">                      
                    
                     <p class="style1">&copy; Juni 2013 Tugas CGI- Ayu Novalina (49012043)</p>      
                    
  </div>
       </div>
       <!-- footer ends--> 
      
<!-- wrap ends here -->
</div>
</body>
</html>

dan yg terakhir buat file arduinonya.
 
int led1 = 13;
int led2 = 12;
int led3 = 11;
void setup(){
  pinMode(led1,OUTPUT);
  pinMode(led2,OUTPUT);
  pinMode(led3,OUTPUT);
  Serial.begin(9600);
}
void loop(){
  int data = Serial.read();
  if (data=='a'){
    digitalWrite(led1,HIGH);
  }else if (data=='s'){
    digitalWrite(led1,LOW);
  }else if (data=='d'){
    digitalWrite(led2,HIGH);
  }else if(data=='f'){
    digitalWrite(led2,LOW);
  }else if(data=='g'){
    digitalWrite(led3,HIGH);
  }else if (data=='h'){
    digitalWrite(led3,LOW);
  }
}

yak, dan "Lamp Controller" yang saya buat sudah jadi. Berikut video simulasinya.