Processing一直都是設計師用來制作互動作品的平台之一，過往都是搭配Arduino來與實體感測器結合，設計的初衷就是小而簡單，並且搭配了穩定的2D/3D功能，讓設計師也可以製作出絢麗的動畫效果，現在Processing的功能可以搬移到網頁上了，搭配Processing.js，就可以使用Processing提供的API來製作出以往Processing平台上可以達成的效果，不過是HTML5限定喔。
以下是示範程式碼：
<!DOCTYPEhtml>
<html>
<head>
- May 16 Thu 2013 11:27
-
Processing.js：製作動畫不再是Flash的專利
- May 10 Fri 2013 13:40
-
JavaScript GUID產生器
寫程式的時候常常會需要用到GUID，JavaScript有一種很簡易的產生方式：
Math.guid = function(){
return 'xxxxxxxx-xxxx-0xxx-yxyx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c){
var string = Math.random()*16|0, v = c === 'x' ? string : (string &0x3|0x8);
return string.toString(16);
- May 09 Thu 2013 11:55
-
使用PHP搭配GD進行縮圖，並對不合乎尺寸的圖片進行背景補色
今天改寫了之前寫得縮圖程式，之前寫的縮圖程式會將小於特定寬度的圖片重新取樣成特定尺寸，這樣的做法會導致小圖片的失真，所以我改寫了這個過程，將小於特定尺寸的圖片透過補色，變成一張符合特定尺寸的圖：
public function resizeImg($img, $width = 300, $height = 300, $newFilename = '', $maxImgWidth = 800, $maxImgHeight=800, $bgColor=null) {
$bgColor = $bgColor === null || !is_array($bgColor) ? array('r'=>255, 'g'=>255, 'b'=>255) : $bgColor;
switch (strtolower($img['type'])) {
case 'image/jpg':
- Apr 22 Mon 2013 16:39
-
使用JavaScript模擬一般物件導向語言：繼承
JavaScript的繼承是透過原型鏈（prototype chain）的方式達成，所有的物件都是繼承自Object，包括代表函式的Function也是。當取用特定物件的屬性時，會先從物件的範圍開始搜尋，如果沒有，則會搜尋prototype，若沒有繼承任何類別，則prototype會指向Object，再從Object的範圍裡搜尋。以下程式定義了Person做為父類別，而Man與Woman都是Person的子類別：
var Person = function(){
this.name = 'Person';
this.gender = 'Unknown';
};
- Apr 18 Thu 2013 17:26
-
使用JavaScript模擬一般物件導向語言：如何為類別加上方法
物件導向語言旨意在於模擬現實世界中人類的思考模式（雖然很多人不以為然），每個物件都會有方法與屬性，藉此賦予一個物件的職責，操縱物件工作，可說是傳達一個message給物件，物件收到訊息後便可進行對應的動作，再視情況把訊息傳回給呼叫者（caller/invoker）。
JavaScript中，如果要將類別定義方法，可以寫成：
var Class = function () {
var klass = function () {
//In constructor, any referernce to the instance method, must prefix with "this."
- Apr 17 Wed 2013 18:36
-
使用JavaScript模擬一般物件導向語言：模擬class的機制
JavaScript不同於一般的物件導向語言，語法本身採用的是原型繼承（prototype）的方式在實踐物件導向機制的，如果要模仿一般物件導向語言，可以這樣做：
var Class = function () {
var klass = function () {
//this this refers to any caller invokes for instanclize, in this case, man
this.init.apply(this, arguments);
var klass = function () {
//this this refers to any caller invokes for instanclize, in this case, man
this.init.apply(this, arguments);
1
