A Message Board Homework

標題：留言板作業
PHP (index.php)：

<?php
/**************************************************
 File：index.php
 Name：首頁
 Explain：首頁功能
****************************************By QQBoxy*/
require('session.php');
require('database.php');
require('common.php');
$output = "";
$p = !empty($_GET['p']) ? $_GET['p'] : 'signin';
$main = new main();
$output .= $main->htmlHeader();
switch($p) {
    case 'install': //安裝，第一次可以把註解拿掉用來安裝，之後請把註解補回去。
        //$output .= $main->install();
        break;
    case 'signin': //登入
        $output .= $main->signin();
        break;
    case 'signin_jump': //登入跳轉
        $output .= $main->signin_jump();
        break;
    case 'signup': //註冊
        $output .= $main->signup();
        break;
    case 'signup_jump': //註冊跳轉
        $output .= $main->signup_jump();
        break;
    case 'logout': //登出跳轉
        $output .= $main->logout_jump();
        break;
    case 'chatroom': //聊天室
        $output .= $main->chatroom();
        break;
    case 'profile': //聊天室
        $output .= $main->profile();
        break;
    default:
        $output .= $main->signin();
        break;
}
$output .= $main->htmlFooter();
echo $output;
?>

Dynamic Post with Iframe

標題：在JavaScript使用虛擬form送出post並以iframe讀取text
JavaScript (index.html)：

<button id="test">test</button>
<div id="show">show</div>
<script type="text/javascript">
function $(id) {
    switch(id.substr(0,1)) {
        case '#':
            return document.getElementById(id.substr(1));
        case '.':
            var elems = document.body.getElementsByTagName('*');
            var target = id.substr(1);
            var result=[];
            for(i=0;j=elems[i];i++) {
                if((j.className).indexOf(target)!=-1) result.push(j);
            }
            return result;
        default:
            return document.getElementsByTagName(id);
    }
}
var loadpost = {
    current : null,
    queue : [],
    request : function(q) {
        //Create iframe
        try { //IE
            var iframe = document.createElement('<iframe name="loadboxy">');
        } catch (e) {
            var iframe = document.createElement('iframe');
        }
        iframe.style.display = 'none';
        iframe.name = 'loadboxy';
        iframe.id = 'loadboxy';
        if(iframe.attachEvent) {
            iframe.attachEvent("onload", function(){
                loadpost.load();
            });
        } else {
            iframe.onload = function(){
                loadpost.load();
            };
        }
        //Create form
        var form = document.createElement('form');
        form.target = 'loadboxy';
        form.action = q.url;
        form.method = 'post';
        form.style.display = 'none';
        for(var key in q.param) {
            if(q.param[key].constructor == Array) {
                for(var i=0;i<q.param[key].length;i++) {
                    var input = document.createElement('input');
                    input.type = 'hidden';
                    input.name = key;
                    input.value = q.param[key][i];
                    form.appendChild(input);
                }
            } else {
                var input = document.createElement('input');
                input.type = 'hidden';
                input.name = key;
                input.value = q.param[key];
                form.appendChild(input);
            }
        }
        //Queue
        this.queue.push({
            form : form,
            iframe : iframe,
            flag : 0,
            load : q.load
        });
        if (!this.current) this.action();
    },
    task : function() {
        var iFrame = this.current.iframe;
        var iFrameBody;
        if (iFrame.contentDocument) //FF
            iFrameBody = iFrame.contentDocument.getElementsByTagName('body')[0];
        else if (iFrame.contentWindow) //IE
            iFrameBody = iFrame.contentWindow.document.getElementsByTagName('body')[0];
        this.current.load(iFrameBody.innerHTML);
    },
    load : function() {
        if(this.current.flag == 1) {
            this.task();
            $('body')[0].removeChild(this.current.iframe);
            $('body')[0].removeChild(this.current.form);
            this.action();
        } else {
            this.current.flag = 1;
            this.send();
        }
    },
    action : function() {
        this.current = null;
        if(this.queue.length) {
            this.current = this.queue.shift();
            $('body')[0].appendChild(this.current.iframe);
        }
    },
    send : function() {
        $('body')[0].appendChild(this.current.form);
        this.current.form.submit();
    }
};
$('#test').onclick = function() {
    loadpost.request({
        url : "action.php",
        param : {
            'num1' : 10,
            'num2' : 20,
            'num[]' : new Array(30, 40)
        },
        load : function(data) {
            $('#show').innerHTML = data;
        }
    });
};
</script>

PHP (index.php)：

<?php
$num1 = !empty($_POST['num1']) ? $_POST['num1'] : null;
$num2 = !empty($_POST['num2']) ? $_POST['num2'] : null;
$num3 = rand(0,10);
$num = !empty($_POST['num']) ? $_POST['num'] : null;
$sum = 0;
foreach($num as $value) {
    $sum += $value;
}
$total = $num1 + $num2 + $num3 + $sum;
echo $num1."+".$num2."+".$num3."+".$sum."=".$total;
?>

說明：
使用純JavaScript動態在Head產生Iframe及在Body產生Form送出Post後，呼叫函式取得Text資料。

PHP echo HTML using EOT

標題：使用EOT自定義分界符印出HTML
PHP (index.php)：

<?php
echo <<< EOT
<p style="color: green">test</p>
EOT;
?>

說明：
使用三個小於符號，在EOT後面、EOT;前面不可以有任何字符，EOT可以為任意字串。

Form iframe virtual load post

標題：虛擬表單送出
JavaScript (inidex.html)：

<button id="test">test</button>
<div id="show">show</div>
<script type="text/javascript">
function $(id) {
    switch(id.substr(0,1)) {
        case '#':
            return document.getElementById(id.substr(1));
        case '.':
            var elems = document.body.getElementsByTagName('*');
            var target = id.substr(1);
            var result=[];
            for(i=0;j=elems[i];i++) {
                if((j.className).indexOf(target)!=-1) result.push(j);
            }
            return result;
        default:
            return document.getElementsByTagName(id);
    }
}
var loadpost = {
    current : null,
    queue : [],
    request : function(q) {
        //Create iframe
        try { //IE
            var iframe = document.createElement('<iframe name="loadboxy">');
        } catch (e) {
            var iframe = document.createElement('iframe');
        }
        iframe.style.display = 'none';
        iframe.name = 'loadboxy';
        iframe.id = 'loadboxy';
        if(iframe.attachEvent) {
            iframe.attachEvent("onload", function(){
                loadpost.load();
            });
        } else {
            iframe.onload = function(){
                loadpost.load();
            };
        }
        //Create form
        var form = document.createElement('form');
        form.target = 'loadboxy';
        form.action = q.url;
        form.method = 'post';
        form.style.display = 'none';
        for(var key in q.param) {
            if(q.param[key].constructor == Array) {
                for(var i=0;i<q.param[key].length;i++) {
                    var input = document.createElement('input');
                    input.type = 'hidden';
                    input.name = key;
                    input.value = q.param[key][i];
                    form.appendChild(input);
                }
            } else {
                var input = document.createElement('input');
                input.type = 'hidden';
                input.name = key;
                input.value = q.param[key];
                form.appendChild(input);
            }
        }
        //Queue
        this.queue.push({
            form : form,
            iframe : iframe,
            flag : 0,
            load : q.load
        });
        if (!this.current) this.action();
    },
    task : function() {
        var iFrame = this.current.iframe;
        var iFrameBody;
        if (iFrame.contentDocument) //FF
            iFrameBody = iFrame.contentDocument.getElementsByTagName('body')[0];
        else if (iFrame.contentWindow) //IE
            iFrameBody = iFrame.contentWindow.document.getElementsByTagName('body')[0];
        this.current.load(iFrameBody.innerHTML);
    },
    load : function() {
        if(this.current.flag == 1) {
            this.task();
            $('body')[0].removeChild(this.current.iframe);
            $('body')[0].removeChild(this.current.form);
            this.action();
        } else {
            this.current.flag = 1;
            this.send();
        }
    },
    action : function() {
        this.current = null;
        if(this.queue.length) {
            this.current = this.queue.shift();
            $('body')[0].appendChild(this.current.iframe);
        }
    },
    send : function() {
        $('body')[0].appendChild(this.current.form);
        this.current.form.submit();
    }
};
$('#test').onclick = function() {
    loadpost.request({
        url : "action.php",
        param : {
            'num1' : 10,
            'num2' : 20,
            'num[]' : new Array(30, 40)
        },
        load : function(data) {
            $('#show').innerHTML = data;
        }
    });
};
</script>

PHP (action.php)：

<?php
$num1 = !empty($_POST['num1']) ? $_POST['num1'] : null;
$num2 = !empty($_POST['num2']) ? $_POST['num2'] : null;
$total = $num1 + $num2;
echo $num1."+".$num2."=".$total;
?>

說明：
純JavaScript產生虛擬form、iframe並發送POST訊息取得php傳回之內容。

PHP Fluent Interface

標題：Fluent Interface 連串執行 function
PHP (index.php)：

<?php
class codeboxy {
    protected $str;
    protected $num = 0;
    public function a() {
        $this->str .= 'a';
        $this->num += 1;
        return $this;
    }
    public function b() {
        $this->str .= 'b';
        $this->num += 2;
        return $this;
    }
    public function display() {
        return $this->str . $this->num;
    }
}
$test = new codeboxy();
$test->a()->b()->a()->b(); // "a  b  a  b" . (1 + 2 + 1 + 2)
echo $test->display(); // abab6
?>

結果：
abab6 說明：
使用PHP連貫的執行Function並Return回物件。

Google Plus jsonp dump

標題：使用dump顯示Google Plus的個人資料
HTML (index.html)：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-TW" xml:lang="zh-TW">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jsonp dynamic</title>
<script type="text/javascript">
function googleplus(json) {
    document.getElementById("gplus").innerHTML = dump(json);
}
function getGplus() {
    var removeScript = document.getElementById('jsonScript');
    if(removeScript)
        removeScript.parentNode.removeChild(removeScript);
    var uid = document.getElementById('uid').value;
    var key = "Your key"; //Get your Google Plus API KEY
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.id = 'jsonScript';
    script.src = "https://www.googleapis.com/plus/v1/people/"+uid+"?key="+key+"&callback=googleplus";
    //script.src = "https://www.googleapis.com/plus/v1/people/"+uid+"/activities/public?key="+key+"&callback=googleplus";
    document.getElementsByTagName('head')[0].appendChild(script);
}
function dump(arr,level) {
    var dumped_text = "";
    if(!level) level = 0;
    var level_padding = "";
    for(var j=0;j<level+1;j++) level_padding += "    ";
    if(typeof(arr) == 'object') {
        for(var item in arr) {
            var value = arr[item];
            if(typeof(value) == 'object') {
                dumped_text += level_padding + "'" + item + "' ...\n";
                dumped_text += dump(value,level+1);
            } else {
                dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
            }
        }
    } else {
        dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
    }
    return dumped_text;
}
</script>
</head>
<body>
<input type="text" id="uid" value="109023257393424023484" />
<input type="button" onClick="getGplus()" value="Get" />
<pre id="gplus"></pre>
</body>
</html>

範例：
'kind' => "plus#person" 'id' => "109023257393424023484" 'displayName' => "QQBoxy Taiwan" 'tagline' => "QQBoxy" 'gender' => "male" 'aboutMe' => "I'm QQBoxy" 'url' => "https://plus.google.com/109023257393424023484" 'image' ... 'url' => "https://lh4.googleusercontent.com/-iT0CCYC2C1g/AAAAAAAAAAI/AAAAAAAADPM/GCp3tL39A5M/photo.jpg" 'urls' ... '0' ... 'value' => "http://qqboxy.blogspot.com/p/chat.html" '1' ... 'value' => "http://qqboxy.blogspot.com/" '2' ... 'value' => "http://toolboxy.blogspot.com/" '3' ... 'value' => "http://codeboxy.blogspot.com/" '4' ... 'value' => "http://www.plurk.com/QQBoxy" '5' ... 'value' => "http://picasaweb.google.com/gs1458" '6' ... 'value' => "https://plus.google.com/109023257393424023484" 'type' => "profile" '7' ... 'value' => "https://www.googleapis.com/plus/v1/people/109023257393424023484" 'type' => "json" 'placesLived' ... '0' ... 'value' => "台灣新北市"

說明：
請先取得Google Plus API Key並填入Your key，
使用dump讓JavaScript也有PHP print_r的功能，並使用jsonp取得Google Plus的個人資料。

參考：
http://www.openjs.com/scripts/others/dump_function_php_print_r.php

Hello PHP

標題：Hello PHP

<?php
echo "Hello PHP"; //印出Hello PHP文字
phpinfo(); //顯示伺服器資訊
?>

說明：
基礎的PHP架構，以及展示伺服器環境的phpinfo語法。

HTML Form

標題：HTML Form to PHP常用語法範例

HTML (index.html)：

<form action="test.php" name="test" id="test" enctype="multipart/form-data" method="post">
<fieldset>
<legend>Hello CodeBoxy</legend>
    Text : <input type="text" name="t1" id="t1" value="TEXT" /><br />
    Password : <input type="password" name="p1" id="p1" value="password" /><br />
    Hidden : <input type="hidden" name="h1" id="h1" value="hidden" /><br />
    Button :
    <input type="button" name="b1" id="b1" value="Enable" />
    <input type="button" name="b2" id="b2" value="Disabled" disabled="disabled" /><br />
    File : <input type="file" name="f1" id="f1" /><br />
    Checkbox :
    <input type="checkbox" name="c1" id="c1" checked="checked" />QQBoxy
    <input type="checkbox" name="c2" id="c2" />CodeBoxy<br />
    Radio :
    <input name="r1" id="r1" type="radio" checked="checked" />QQBoxy
    <input name="r1" id="r2" type="radio" />CodeBoxy<br />
    Select :
    <select name="s1" id="s1">
        <optgroup label="QQBoxy">
        <option value="1-1">1-1</option>
        </optgroup>
        <optgroup label="CodeBoxy">
            <option value="2-1" selected="selected">2-1</option>
            <option value="2-2">2-2</option>
        </optgroup>
    </select><br />
    Textarea :<br />
    <textarea name="a1" id="a1" cols="40" rows="2">Hello&#13;&#10;CodeBoxy</textarea><br />
    <input type="image" src="qqboxy.gif" /><input type="submit" /><input type="reset" />
</fieldset>
</form>

補充：PHP GET POST

$test = !empty($_GET['test']) ? $_GET['test'] : null;

$test = !empty($_POST['test']) ? $_POST['test'] : null;

範例：

Hello CodeBoxy

Text :
Password :
Hidden :
Button :
File :
Checkbox : QQBoxyCodeBoxy
Radio : QQBoxyCodeBoxy
Select : 1-12-12-2
Textarea :
Hello CodeBoxy

說明：
簡單展示常用HTML Form語法，補充PHP為GET與POST接收語法。

jQuery Load POST

標題：jQuery Load傳值即時顯示

HTML (index.html)：

<script src="jquery-1.6.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("#myCount").click(function(){
        $("#myText").load("addaction.php", {"num1":$("#number1").val(), "num2":$("#number2").val()});
    });
});
</script>
<textarea id="number1" cols="20" rows="3">1</textarea><br />
<input type="text" id="number2" value="2" /><br />
<input type="button" id="myCount" value="Send" />
<div id="myText"></div>

PHP (addaction.php)：

<?php
$num1 = !empty($_POST['num1']) ? $_POST['num1'] : null;
$num2 = !empty($_POST['num2']) ? $_POST['num2'] : null;
$total = $num1 + $num2;
echo $num1."+".$num2."=".$total;
?>

說明：
採input text以及texterea進行範例演示，
使用jQuery Load傳遞POST給PHP進行運算並即時顯示結果。

PDO SQLite Class

標題：採Class寫法之PDO連接SQLite

PHP (index.php)：

<?php
$test = new sql;
echo $test->connectsql();
class sql {
    public $dsn = "sqlite:hello.sqlite3";
    public $user = null;
    public $password = null;
    //建立資料庫
    function connectsql() {
        try {
            //連結資料庫
            $dbq = new PDO($this->dsn, $this->user, $this->password);
            echo "PDO Connection ok<br />";
            //建立資料表db_math
            //新增INTEGER屬性PRIMARY KEY特性的id欄位
            //新增INT屬性的project欄位
            //新增TEXT屬性的function欄位
            $dbq->exec("CREATE TABLE db_math(id INTEGER PRIMARY KEY, project INT, function TEXT)");
            echo "Create Table ok<br />";
            //建立索引db_math_id並指定為資料表db_math的id欄位
            $dbq->exec("CREATE INDEX db_math_id ON db_math(id)");
            echo "Create Index ok<br />";
            //寫入資料3筆
            $dbq->exec("INSERT INTO db_math(project,function) VALUES (1,'2+3')");
            $dbq->exec("INSERT INTO db_math(project,function) VALUES (1,'4+5')");
            $dbq->exec("INSERT INTO db_math(project,function) VALUES (2,'6+7')");
            echo "Insert Data ok<br />";
            //檢查若未成功則還原
            $dbq->beginTransaction();
            //搜尋全部資料
            $stq = $dbq->prepare('SELECT *FROM db_math');
            $stq->execute();
            $result = $stq->fetchAll();
            //印出資料內容
            foreach($result as $arr) {
                print_r($arr);
                echo "<br />";
            }
            //搜尋project欄位值為1的資料
            $stq = $dbq->prepare("SELECT * FROM db_math WHERE project = '1'");
            $stq->execute();
            $result = $stq->fetchAll();
            //印出資料內容
            foreach($result as $arr)
                echo $arr['id'].", ".$arr['project'].", ".$arr['function']."<br />";
            
            $this->dsn = null;
        } catch (PDOException $e) {
            //印出錯誤訊息
            echo "Connection failed: ".$e->getMessage()."<br />";
            $this->dsn = null;
        }
    }
}
?>

輸出結果：
PDO Connection ok Create Table ok Create Index ok Insert Data ok Array ( [id] => 1 [0] => 1 [project] => 1 [1] => 1 [function] => 2+3 [2] => 2+3 ) Array ( [id] => 2 [0] => 2 [project] => 1 [1] => 1 [function] => 4+5 [2] => 4+5 ) Array ( [id] => 3 [0] => 3 [project] => 2 [1] => 2 [function] => 6+7 [2] => 6+7 ) 1, 1, 2+3 2, 1, 4+5
說明：
採類別的寫法撰寫基本PDO連結資料庫，以及建立SQLite3資料表並進行Select搜尋之範例，
使用PDO請記得將相關之PHP extension打開。

PHP exec C

標題：PHP與C相互傳遞與接收
程式：
PHP (index.php)：

<?php
//傳遞變數給exe執行檔
$text = exec("chello\\chello.exe Hello PHPBoxy", $arr);
 
//印出陣列大小
echo count($arr)."<br /><br />";
 
//印出陣列結果
foreach($arr as $value)
    echo $value."<br />";
 
//僅印出最後一行
echo "<br />".$text;
?>

C (chello\chello.exe):

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

int main(int argc, char** argv) {
    char str1[1024], str2[1024], str3[1024];
    if(argc > 1) {
        strncpy(str1,argv[0],sizeof(str1)-1);
        strncpy(str2,argv[1],sizeof(str2)-1);
        strncpy(str3,argv[2],sizeof(str3)-1);
        printf("%s\n%s\n%s", str1, str2, str3);
    } else {
        printf("%d\n", argc);
    }
    return (EXIT_SUCCESS);
}

輸出結果：
3 cHello\chello.exe Hello PHPBoxy PHPBoxy

說明：
利用PHP傳遞『Hello』與『PHPBoxy』兩個字串給執行檔接收，
再經由C/CPP程式printf回傳給PHP三行字串內容，
注意當argv需要做字串的處理時必須要重新複製一份來進行修改，
若直接使用argv來做修改可能會導致資料錯誤的發生。