GMgKe586q6suSQnyqZLlGCooeWM

Pages

Search

Monday, January 31, 2011

Starting jQuery

To start using jQuery, link the 3 files:

<link rel="stylesheet" href="jqueryui/css/redmond/
                             jquery-ui-1.8.9.custom.css"/>
<script src="jqueryui/js/jquery-1.4.4.min.js"></script>
<script src="jqueryui/js/jquery-ui-1.8.9.custom.min.js"></script>









Then try to write code in html file:
<button>Register</button>
<script>
$('button').button();
</script>
Share/Bookmark

Sunday, January 30, 2011

Box Shadow

To implement box shadow, add on your css style:
-moz-box-shadow: 0 0 1em gold; 
-webkit-box-shadow: 0 0 1em gold; 
box-shadow: 0 0 1em gold; 


Share/Bookmark

Rounded Corner

It's simple to make rounded corner with pure CSS style. This is just a different implementation between browser.
In firefox, it's like this one:

<style>
h1 {
    border: 1px solid blue;
    -moz-border-radius-topleft: 4px;    /* top left corner */
}
</style>

Do like the above with these code:
-moz-border-radius: 4px    /* all corner */
-moz-border-radius-bottomleft: 4px    /* bottom left */

For Safari and Chrome:
-webkit-border-radius: 4px    /* all corner */
-webkit-border-radius-bottomleft: 4px    /* bottom left */

No specified browser:
border-radius: 4px    /* all corner */
border-radius-bottomleft: 4px    /* bottom left */

 
Share/Bookmark

Javascript Closure

<script>

(function(){
    var name = 'Lady Gaga';
    alert(name);    // executed
}();

alert(name);    // doesn't reach this outer calling

</script>

What the benefit of the closure? The benefit is that the code is not accessible from the outer scope. The scope is executed normally once. But you cannot call it from the outer closure.

Share/Bookmark

A Kind Of Inheritance

<script>

function Holla() {}
Holla.greeting = Holla.prototype.greeting(msg){
    alert(msg);
};

var me = new Holla();
me.greeting('Good Morning!');

</script>

Share/Bookmark

Returning jQuery Object

<script src="jquery.js"></script>
<div id="satu">Holla From jQuery</div>

<script>

(function($){

    $.fn.heading = function(h){
        this.html('<'+h+'>'+this.html()+'</'+h+'>');
        return this;
    };

    $.fn.color = function(c){
        this.css('color',c);
        return this;
    };

})(jQuery);

$('#satu').heading('h1').color('green');

</script>

Output:
Holla From jQuery

Share/Bookmark

Extending jQuery With Parameter

It's simple to extends jQuery:

<script src="jquery.js"></script>
<div id="satu">Before Extended</div>

<script>

(function($){
    $.fn.myPlugin = function(c){
        this.html('<h1>After Extended</h1>');
        this.css('color',c);
    };
});

$('#satu').myPlugin('red');

</script>

Output:
After Extended
  
Share/Bookmark

Extending jQuery

It's simple to extends jQuery:

<script src="jquery.js"></script>
<div id="satu">Before Extended</div>

<script>

(function($){
    $.fn.myPlugin = function(){
        this.html('<h1>After Extended</h1>');
        this.css('color','blue');
    };
});

$('#satu').myPlugin();

</script>

Output:
After Extended
   
Share/Bookmark

Thursday, January 27, 2011

Confusing Syntax

<h1>Execute Directly</h1>
<div id="satu"></div>

<script>

var po = (function(){
    var satu = document.getElementById('satu');
    satu.innerHTML = 'Hello, Indonesia';
})(po);                  // or without 'po', it will be also run normally

</script>
Share/Bookmark

Constructor Inherit

<h1>Inheritance of Constructor</h1>
<div id="satu"></div>

<script>

function Lol(){};
    var Lola = Lol.prototype = function(){
    var satu = document.getElementById('satu');
    satu.innerHTML = 'Hello, Indonesia';
}

var a = new Lola();   // printing 'Hello, Indonesia';

</script>

Share/Bookmark

Tuesday, January 25, 2011

String and Array Of String In C

To make a string in C, use pointer: char *name
To make array of string in C, use double pointer: char **names

#include <stdio.h>

int main()
{
    char *name = "Bill Clinton";
    printf("Name: %s", name);

    char **names = {"Lady Gaga", "Luna Maya", "Hillary Clinton"};
    int i;
    for( i=0; i<3; i++)
        printf("%d. %s", i, names[i]);

    return 0;
}
         
Share/Bookmark

Command Line Argument In C

#include <stdio.h>

/**
 * @param argc int how many words type in command line including
 * app file. start from one.
 * @param argv array of string how many words in the command line.
 * start from app file as zero index.
 *
 * try by typing: lol.exe welcome to Americas
 * the result would be:
 *   0. lol.exe
 *   1. welcome
 *   2. to
 *   3. Americas
 */

int main( int argc, char *argv[])
{
    int i;

    for( i=0; i<argc; i++)
        printf("%d. %s\n", i, argv[i]);

    return 0;
}

Share/Bookmark

Saturday, January 22, 2011

ASP As Server Side

Using xampp, you can also build your web application using ASP:
Just create an index.asp in htdocs directory then fill it with:
<%
$Response->Write("Hello World From ASP")
%>

Then direct your browser to http://localhost/index.asp
       
Share/Bookmark

Perl As Server Side Scripting

Create file index.pl in htdocs directory then fill it with:

print "Content-Type: text/html"
print "Holla From Perl"

Then direct your browser to http://localhost/index.pl
Share/Bookmark

Creating CGI File

It's simple to create a CGI file. Just create hello.cgi file in htdocs directory then fill it with:
#!"C:\xampp\perl\bin\perl.exe"
print "Content-Type: text/html"

print "Holla World From CGI"

Then direct your browser to http://localhost/hello.cgi
           
Share/Bookmark

Friday, January 21, 2011

The First App Using Zend

You need some steps:

1. Create folder structure
    - hello
      - application
        - controllers
        - models
        - views
          - filters
          - helpers
          - scripts
            - index
      - library
        - Zend
      - web_root
        - css
        - img
        - js  




2. Create .htaccess file in the web_root directory
RewriteEngine On
RewriteRule .* index.php


3. Create index.php file in the web_root directory
<?php

$root_dir = dirname( dirname(__FILE__) );
set_include_path( $root_dir . '/library' . PATH_SEPARATOR
    . get_include_path() );

require_once 'Zend/Controller/Front.php';
Zend_Controller_Front::run('../application/controllers');

?>

4. Create IndexController.php file inside hello/application/controllers directory:
<?php

require_once 'Zend/Controller/Action.php';

class IndexController extends Zend_Controller_Action
{
    public function indexAction()
    {
        $this->view->assign('title', 
                            'Hello from Zend framework');
    }
}

?>


5. Create index.phtml inside hello/application/views/scripts/index directory
<h1>Holla For You</h1>

<h1><?php echo $this->escape( $this->title); ?></h1>


6. Direct your browser to http://localhost/hello/web_root
Share/Bookmark

Zend Folder Structure

This is a folder if you want to make a web project:

  - hello
    - application
      - controllers
      - models
      - views
        - filters
        - helpers
        - scripts
    - library
      - Zend
    - test
    - web_root
      - css
      - img
      - js
          
Share/Bookmark

Wednesday, January 12, 2011

Presenting XML Document Using PHP

It's simple to present an xml document to browser using php:

<?php 
    header("Content-type: text/xml");
    $dom = new DOMDocument();
    $dom->load("index.xml");

    echo $dom->saveXML();
?>

The result can be manipulated using ajax as a responseXML property.
Share/Bookmark

Monday, January 10, 2011

Parsing XML Using Javascript

Here's an xml in Javascript code.

var data = "PythonC++"+
           "Java";
var parser = new DOMParser();
var xmlDoc = parser.parseFromString(data,'text/xml');

alert(xmlDoc.getElementsByTagName('lang')[0].
      childNodes[0].nodeValue;);              // Python
alert(xmlDoc.getElementsByTagName('lang')[1].
      childNodes[0].nodeValue;);              // C++
alert(xmlDoc.getElementsByTagName('lang')[2].
      childNodes[0].nodeValue;);              // Java


Share/Bookmark

Debugging Javascript Code

The usual technique is using alert to check variable, function return or a line broken.
But there's a more advance technique for do debug error - use try catch block.
try{
    varq;
}catch(err){
    alert(err);
}
ouput: ReferenceError: varq is not defined

type for other output are:
alert();
output:
    [Exception... "Not enough arguments 
    [nsIDOMWindowInternal.alert]"  nsresult: "0x80570001
    (NS_ERROR_XPC_NOT_ENOUGH_ARGS)"  location: "JS frame ::
    http://htmledit.squarefree.com/ :: 
    :: line 5"  data: no]

output:
    TypeError: Doc.getElementsByTagName("lang")[i] is undefined
          
                

Share/Bookmark

Monday, January 3, 2011

setTimeout In OOP Style

<h1>setTimeout In OOP</h1>
<h1 id="satu"></h1>

<script>
function Lol(id){
    this.i = 0;
    this.id = document.getElementById(id);
}
Lol.prototype.run = function(){
    this.i = this.i+1;
    this.id.innerHTML = this.i;
    var lol = this;               // use this
    setTimeout(function(){lol.run();},500);
};

var lola = new Lol('satu');
lola.run();

</script>
         

Share/Bookmark

Sunday, January 2, 2011

PHP String Function

To get the length of the string, type:
$lol = "lady gaga";
echo strlen($lol);
output>> 9

To get part of the string,
echo substr("Holla World",6);    // substr(text, start)
output>> World
echo substr("Holla World",6,2);    // substr(text, start, length)
output>> Wo

To get the position of the specified string in a text, type:
echo strpos("Holla World","Wo"); // strpos(text,searched,[start])
output>> 6
echo strpos("Holla World","o",1);
output>> 2
        
To break a string into array, type:
print_r(explode(" ","Holla World"));    // explode(separator, 
                                        // string);
output>> Array ( [0] => Holla [1] => World ) 
               

Share/Bookmark

Date In PHP

To display a date, use date() function:
echo date("l, F d, Y");    // day - month - date - year
ouput>> Sunday, January 02, 2011

echo date("h:i:s");    // hours:minutes:seconds
output>> 11:36:07
          

Share/Bookmark

FileSystem In PHP

To get all content from a file, and then give it to a variable, use:
$contents = file_get_contents("lola.txt");
echo $contents;

To insert a string to a file, use:
$text = "hello world\n This is lady gaga\n This is luna maya";
file_put_contents("lola.txt",$text);    // return char of text
                                        // inserted

To know file size, use:
echo filesize("lola.txt");
       
Share/Bookmark

Reading A File In PHP

To open a file, type:
    $file = fopen("lola.txt","r") or exit("Cannot open the
            file");

To read one line, use:
    echo fgets($file);    // this pointer will advance one 
                          // per line

To check wheter reach end of file, type:
    feof($file);

To read a whole of file line by line, use:
    while(!feof($file)){
        echo fgets($file)."<br/>";
    }

To read a whole of file char by char, use:
    while(!feof($file)){
        echo fgetc($file)."<br/>";
    }
              
Share/Bookmark

Session In PHP

To use session, type
session_register("username");    // username is variable 
                                 // $username="lady gaga"
The you check it by using:
session_start();    // this must the first you type in the file.
$name = $_SESSION['username'];
echo $name;

For complete example, look
checklogin.php
<?php

    $username = $_POST['username'];
    $password = $_POST['password'];

    mysql_connect("localhost","root","");
    mysql_select_db("satu");
    $query = "SELECT * FROM login WHERE username='$username'
              AND password='$password'";
    $result = mysql_query($query);
    $count = mysql_num_rows($result);

    if($count==1){
        session_register('username');
        session_register('password');
        header("Location: hello.php");
    }else{
        header("Location: index.php");
    }
?>


Type this in hello.php
<?php 
    session_start();
    if(!session_is_registered('username')){
        header("location: index.php");
    }
  
    echo "<h1>Hello, $_SESSION['username']<h1>";
?>


To make a logout app, type:
<?php
    session_start();
    session_destroy();
?>

           
Share/Bookmark

Login Application In PHP

In this stage, first you need to create  a table in database to save the records:

Use this command in MySql interactive:
mysql>> CREATE DATABASE data
Query OK, 1 row affected (0.00 sec)
mysql>> CREATE TABLE login
     >> (id INT NOT NULL AUTO_INCREMENT KEY,
     >> username CHAR(20),
     >> password CHAR(20));
Query OK, 0 rows affected (0.06 sec)
mysql>> INSERT INTO login
     >> VALUES
     >> (null, 'lady gaga', 'gaga');
Query OK, 1 row affected (0.02 sec)


After finishing above, try to create php file:
index.php
<form action="checklogin.php" method="post">
    Username:
<input type="text" name="username"/><br/>
    Password:
<input type="password" name="password"/><br/>
   
<input type="submit" value="Log In"/>
</form>




checklogin.php
<?php

    $username = $_POST['username'];
    $password = $_POST['password'];

    mysql_connect("localhost","root","");
    mysql_select_db("satu");
    $query = "SELECT * FROM login WHERE username='$username'
             AND password='$password'";
    $result = mysql_query($query);
    $count = mysql_num_rows($result);

    if($count==1){
        header("Location: hello.php");
    }else{
        header("Location: index.php");
    }
?> 


hello.php
<?php
    echo "<h1>Hello You are in login state<h1>";
?>
Share/Bookmark

Extending Array Object

Below is a sample on how to extends an array object.

Array.prototype.getMinValue = function(){
    var minIndex = 0;
    for(i=1;i<this.length;i++){
        if(this[i]<this[minIndex]){
            minIndex = i;
        }
    }
    return this[minIndex]
}

You can call the above method by:
var data = [5,4,8,3,1,6];
alert(data.getMinValue());
output>> 1
       

Share/Bookmark