Learn To Program

Monday, April 4, 2011

CakePHP - Creating Layout

Layout is a part of presentation side of CakePHP. Just copy the default.ctp in cake/libs/view/layouts/default.ctp to app/views/layout/default.ctp
The customize it:
1. Loading title:

<?php echo $title_for_layout;?>

2. Loading content

<?php echo $content_for_layout;?>

3. Loading css file that lies on webroot/css/some.css

<?php echo $html->css('filname_without_extenstion');?>

4. Loading javascript file that lies on webroot/js/some.js
a. In controller file, add var $helpers = array('Javascript');
b. In the layout, add <?php echo $javascript->link('filename_without_ext');?>

Saturday, April 2, 2011

CakePHP - The Structure

When you are ready to build an application after simple setting of configuration, do this:
1. Create a table name like posts

    id int not null auto_increment key,

    title char(50),

    body text,

    created datetime,

    modified datetime

2. The insert some data to it
3. Make controller file in E:\xampp\htdocs\cakephp\app\controllers\posts_controller.php
<?php

class PostsController extends AppController{
    var $name = 'Posts';
    function index(){
        $this->set('posts',$this->Post->find('all'));
    }
    function view($id=null){
        $this->Post->id = $id;
        $this->set('post',$this->Post->read());
        $this->set('hello','This comes from bill');
    }
}

4. Make model file E:\xampp\htdocs\cakephp\app\models\post.php
<?php
class Post extends AppModel{
    var $name = 'Post';
}
5. Make the view file:
    a. index.ctp in E:\xampp\htdocs\cakephp\app\views\posts\index.ctp

<h1>Blog posts</h1>
<table>
<tr>
<th>Id</th>
<th>Title</th>
<th>Created</th>
</tr>

<?php foreach ($posts as $post): ?>
<tr>
<td><?php echo $post['Post']['id']; ?></td>
<td>
<?php echo $html->link($post['Post']['title'],
array('controller' => 'posts', 'action' => 'view', $post['Post']['id'])); ?>
</td>
<td><?php echo $post['Post']['created']; ?></td>
</tr>
<?php endforeach; ?>

</table>

    b. view.ctp E:\xampp\htdocs\cakephp\app\views\posts\view.ctp

<h1><?php echo $post['Post']['title']?></h1>
<p><small>Created: <?php echo $post['Post']['created']?></small></p>
<p><?php echo $post['Post']['body']?></p>

<?php print_r($post);?>
<?php print $hello;?>

Friday, April 1, 2011

PyQt - 2D Graphics

import sys
from PyQt4 import QtGui, QtCore

class Editor(QtGui.QWidget):

   def __init__(self):
       super(Editor, self).__init__()
       self.initUI()

   def initUI(self):

       self.setGeometry(200, 100, 400, 300)
       self.setWindowTitle('Editor App')
       self.setWindowIcon(QtGui.QIcon('e.png'))

   def paintEvent(self, e):
       qp = QtGui.QPainter()
       qp.begin(self)
       qp.drawRect(10,10,100,100)
       qp.end()

app = QtGui.QApplication(sys.argv)
file = Editor()
file.show()
sys.exit(app.exec_())

PyQt - Editor

import sys

from PyQt4 import QtGui, QtCore

class Editor(QtGui.QWidget):

    def __init__(self):

        super(Editor, self).__init__()

        self.initUI()

    def initUI(self):

        self.setGeometry(200, 100, 400, 300)

        self.setWindowTitle('Editor App')

        self.setWindowIcon(QtGui.QIcon('e.png'))

        self.editor = QtGui.QTextEdit(self)

        self.editor.setGeometry(10, 10, 380, 250)

        self.openFile = QtGui.QPushButton('Open', self)

        self.saveFile = QtGui.QPushButton('Save As Plain Text', self)

        self.saveHTML = QtGui.QPushButton('Save As HTML', self)

        self.pbExit = QtGui.QPushButton('Exit', self)

        self.openFile.setGeometry(10, 270, 70, 20)

        self.saveFile.setGeometry(85, 270, 120, 20)

        self.saveHTML.setGeometry(210, 270, 100, 20)

        self.pbExit.setGeometry(315, 270, 70, 20)

        self.connect( self.openFile, QtCore.SIGNAL('clicked()'), self.openPlease )

        self.connect( self.saveFile, QtCore.SIGNAL('clicked()'), self.savePlease )

        self.connect( self.saveHTML, QtCore.SIGNAL('clicked()'), self.saveHtmlPlease )

        self.connect( self.pbExit, QtCore.SIGNAL('clicked()'), QtGui.qApp, QtCore.SLOT('quit()'))

    def openPlease(self):

        filename = QtGui.QFileDialog.getOpenFileName(self, 'Open File', '.')

        fname = open(filename)

        data = fname.read()

        fname.close()

        self.editor.setText(data)

    def savePlease(self):

        filename = QtGui.QFileDialog.getSaveFileName(self, 'Save File', '.')

        fname = open(filename, 'w')

        fname.write(self.editor.toPlainText())

        fname.close()

    def saveHtmlPlease(self):

        filename = QtGui.QFileDialog.getSaveFileName(self, 'Save File', '.')

        fname = open(filename, 'w')

        fname.write(self.editor.toHtml())

        fname.close()

app = QtGui.QApplication(sys.argv)

file = Editor()

file.show()

sys.exit(app.exec_())

PyQt - File Dialog

To get a filename using open file dialog, use: 

filename = QtGui.QFileDialog.getOpenFileName(self, 'Open File', '.')

fname = open(filename)

data = fname.read()

self.textEdit.setText(data)
fname.close()

While to save data to file, from example from textEdit:

filename = QtGui.QFileDialog.getSaveFileName(self, 'Save File', '.')
fname = open(filename, 'w')
fname.write(textEdit.toPlainText())
fname.close()

PyQt - Message Box

QtGui.QMessageBox.information(self, 'Message Title', 'The Bosy Text', QtGui.MessageBox.No | QtGui.MessageBox.Yes || QtGui.MessageBox.Cancel)

The type of message:
1. information
2. question
3. warning
4. critical

The type of the button:
1. Yes
2. No
3. Save
4. Cancel
5. Discard
6. Ok
7. Open

JS - Simulation Of Gerak Peluru

<h1>Gerak Parabola</h1>

<p id="info" style="font: 12px sans-serif;">x: <span id="x"></span> | y: <span id="y"></span> | v: <span id="v"></span></p>

<canvas id="canvas" style="border: 1px solid blue;">Not Supported</canvas>

<div id="right" style="float: right; ">

 <table>

  <tr><td>Degree</td><td>:</td><td><input type="text" id="degree"/></td></tr>

  <tr><td>Initial Velocity</td><td>:</td><td><input type="text" id="velocity"/></td></tr>

  <tr><td>&nbsp;</td><td>&nbsp;</td><td><input type="button" value="Run" onclick="run()"/></td></tr>

 </table>

</div>

<script>

var Lucia = Lucia || {};

Lucia.GerakParabola = function(){

// screen dimension

this.screenWidth = 500;

this.screenHeight = 200;

// getting the elements

this.canvas = document.getElementById('canvas');

this.xInfo = document.getElementById('x');

this.yInfo = document.getElementById('y');

this.vInfo = document.getElementById('v');

// setting the initial condition

this.ctx = canvas.getContext('2d');

this.canvas.height = this.screenHeight; 

this.canvas.width = this.screenWidth; 

this.ctx.fillStyle = '#88f';

// box properties

this.width = 10;

this.height = 10;

this.vBefore = 60;

this.vHozAfter = 0;

this.vVerAfter = 0;

this.degree = 60; 

this.g = 10;

this.xBefore = 0;

this.xAfter = 0;

this.yBefore = 0;

this.yAfter = 0;

this.dt = 0.1;

 }

Lucia.GerakParabola.prototype.move = function(){

// getting the velocity component

this.vHozAfter = this.vBefore*Math.cos(this.toRadian(this.degree));

this.vVerAfter = this.vBefore*Math.sin(this.toRadian(this.degree)) - this.g*this.dt;

// getting the position of horizontal and vertical

this.xAfter = this.vBefore*this.dt*Math.cos(this.toRadian(this.degree));

this.yAfter = this.vBefore*this.dt*Math.sin(this.toRadian(this.degree)) - 0.5*this.g*this.dt*this.dt;

// summing the time

this.dt = this.dt+1;

// update the box;

this.ctx.clearRect(0, 0, 500, 200)

this.ctx.fillRect(this.xAfter, this.screenHeight - this.yAfter - this.height, this.width, this.height);

// display info

this.xInfo.innerHTML = Math.round(this.xAfter);

this.yInfo.innerHTML = Math.round(this.yAfter);

this.vInfo.innerHTML = Math.round(this.vHozAfter); 

// setting the timer

var lol = this;

setTimeout(function(){lol.move();},1000);          

}

// convert degree to radian

Lucia.GerakParabola.prototype.toRadian = function(degree){

 return (degree/57);

}

Lucia.GerakParabola.prototype.setDegree = function(d){

 this.degree = this.toRadian(d);

}

Lucia.GerakParabola.prototype.setInitVelocity = function(v){ 

 this.vBefore = v;

}

function run(){

 var degree = document.getElementById('degree');

 var velocity = document.getElementById('velocity');

 var gp = new Lucia.GerakParabola();

// gp.setDegree(eval(degree.value));

// gp.setInitVelocity(eval(velocity.value));

 gp.move(); 

}

</script>

http://mediabelajaronline.blogspot.com/2010/10/gerak-peluruparabola.html