CCUBoxy: 2014

2014年8月31日星期日

Advanced JS Chapter 2

網路連線集線器、交換器、路由器、存取點關係圖
(圖片來源：http://windows.microsoft.com/zh-tw/windows/hubs-switches-routers-access-points-differ#1TC=windows-7)

JavaScript (index.html)：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Example</title>
<script type="text/javascript">
window.onload=function() {
    var a = function(b) {
        return b + 10;
    };
    console.log( a(5) );
    
    var b = function() {
        return 3;
    };
    console.log( a( b() ) );
    
    var json = {
        "name" : "QQBoxy",
        "number" : 10,
        "action" : function() {
            console.log("Hello");
        }
    };
    json.action();
    
    document.getElementById("poo").onclick = function() {
        document.getElementById("foo").innerHTML = "Hello<br />World";
    };
    document.getElementById("boo").onclick = function() {
        location.href = "http://www.google.com/";
    };
};
</script>
</head>
<body>
Text: <button id="poo">Click me</button><br />
Link: <button id="boo">Click me</button><br />
<div id="foo"></div>
</body>
</html>

加快網頁下載速度，使用壓縮器：
http://closure-compiler.appspot.com/home

保護原始碼的方法，使用混淆器：
http://utf-8.jp/public/aaencode.html

2014年8月28日星期四

Advanced JS Chapter 1

HTML網頁的應用：
http://qqboxy.blogspot.com/p/bijint.html
http://qqboxy.blogspot.com/p/lol.html
http://foodboxy.blogspot.tw/2011/09/nfu.html
http://youtuberepeat.blogspot.com/

JavaScript的應用：
http://threejs.org/
http://qqboxy.blogspot.com/p/tetris.html
http://qqboxy.blogspot.com/p/sudoku.html

EmEditor記事本編輯器：
http://qqboxy.blogspot.com/2010/06/emeditor-6004.html
http://notepad-plus-plus.org/

Node.js官方網站：
http://nodejs.org/

Node.js架設教學：
http://qqboxy.blogspot.com/2013/07/portable-nodejsnpmexpress-windows.html

Express官方網站：
http://expressjs.com/

w3school教學網站：
http://www.w3schools.com/

HTML標準架構 (index.html)：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>賣火柴的小女孩</title>
</head>
<body>
我是賣火柴的小女孩這樣，<br />
我是妳爸，去賣火柴。
</body>
</html>

建立基礎靜態網站 (index.js)：

var express = require("./node_modules/express"),
    url = require("url");
var app = express();
var port = 1337;

app.listen(port);

app.use('/', express.static(__dirname + '/'));

app.get("/", function(req, res) {
    res.send("Hello World!!");
});

console.log("Start express server");

分組作業：
每個人都建立一個屬於自己的個人介紹網站，
需要包含超連結、圖片、特效、清單、表格等語法，
最後請你同學進去你的網站晃晃認識一下你自己。

2014年8月22日星期五

實驗室大小事

問題紀錄：

問題：交接時間太晚，口試完畢到離校期間太短，學弟們難以快速吸收交接內容。
解決：提早訂定交接對象，學弟也會在開會時專心聽學長報告，必須在提審完畢後，就先交接部分程式。
問題：實驗室論文多久公開?
解決：為保護實驗室財產，過去是設定5年，通常設定為最高年限。

2014年8月19日星期二

建構Apache2.4.10+PHP5.5.15網際環境 (x64)

相關檔案來源：
httpd-2.4.10-win64-VC11.zip (Apache 2.4.10 Win64)
php-5.5.15-Win32-VC11-x64.zip (VC11 x64 Thread Safe (2014-Jul-24 01:03:51))
vcredist_x64.exe (Visual C++ Redistributable for Visual Studio 2012 Update 4)

相關語法如下

Apache設定檔(httpd.conf)：

PHPIniDir "C:/PHP/"
LoadModule php5_module "C:/PHP/php5apache2_4.dll"
AddType application/x-httpd-php .php
DirectoryIndex index.html index.htm index.php

批次啟動檔(Start.bat)：

@echo off
bin\httpd.exe -k install -n "Apache2.4"
bin\httpd.exe -k start
start bin\ApacheMonitor.exe

批次停止檔(Stop.bat)：

@echo off
bin\httpd.exe -k stop
bin\httpd.exe -k uninstall -n "Apache2.4"
TASKKILL /F /IM ApacheMonitor.exe

PHPInfo程式(phpinfo.php)：

<?php phpinfo() ?>

註解：

2014年7月14日星期一

Advanced VC++ Chapter 3

課程內容：

Example 11 - 拖曳方式讀取檔案
http://codeboxy.blogspot.com/2013/07/drag-to-read-file.html

Example 12 - 函式預設引數
http://codeboxy.blogspot.com/2014/07/default-argument.html

Example 13 - 遞迴函式二分法找最佳化
http://codeboxy.blogspot.com/2014/07/bisection-method-using-recursion.html

誤差函式
1. x-2^-x, 0≦x≦1
2. x⁴-2x³-4x²+4x+4, -2≦x≦-1

最低誤差
10^-5

最大迭代次數
1000

Example 14 - 文字檔案讀取與寫入
http://codeboxy.blogspot.com/2013/07/two-ways-to-read-and-write-files.html

Example 15 - 使用正規表示法驗證IP
http://codeboxy.blogspot.com/2014/07/regular-expression-to-match-ip-address.html

Example 16 - 使用迭代器匹配字串
http://codeboxy.blogspot.com/2014/07/regular-expression-iterator.html

分組作業：
首先輸入一個放大倍率，以遞迴方式讀取一個STL檔案，以圓心為基礎放大座標資訊，並輸出新的STL檔案。

測試資料：
四角錐 2x2x2 (TriangleASCII.STL)

solid TriangleASCII
   facet normal -8.944272e-001 4.472136e-001 0.000000e+000
      outer loop
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 6.505213e-016 1.000000e+000 -4.336809e-016
      endloop
   endfacet
   facet normal 8.944272e-001 4.472136e-001 0.000000e+000
      outer loop
         vertex 8.407273e-017 1.000000e+000 0.000000e+000
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 1.084202e-016 -1.000000e+000 0.000000e+000
      outer loop
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 1.084202e-016 -1.000000e+000 0.000000e+000
      outer loop
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 0.000000e+000 4.472136e-001 -8.944272e-001
      outer loop
         vertex 6.505213e-016 1.000000e+000 2.168404e-016
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 0.000000e+000 4.472136e-001 8.944272e-001
      outer loop
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 6.505213e-016 1.000000e+000 -2.710505e-018
      endloop
   endfacet
endsolid

立方體 2x2x2 (CubeASCII.STL)

solid CubeASCII
   facet normal -1.000000e+000 1.084202e-016 0.000000e+000
      outer loop
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex -1.000000e+000 1.000000e+000 1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal -1.000000e+000 1.084202e-016 0.000000e+000
      outer loop
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 1.000000e+000 1.000000e+000
         vertex -1.000000e+000 1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal -2.168404e-016 -1.000000e+000 0.000000e+000
      outer loop
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal -2.168404e-016 -1.000000e+000 0.000000e+000
      outer loop
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 1.000000e+000 0.000000e+000 0.000000e+000
      outer loop
         vertex 1.000000e+000 1.000000e+000 1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 1.000000e+000 0.000000e+000 0.000000e+000
      outer loop
         vertex 1.000000e+000 1.000000e+000 -1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal -1.084202e-016 1.000000e+000 0.000000e+000
      outer loop
         vertex -1.000000e+000 1.000000e+000 1.000000e+000
         vertex 1.000000e+000 1.000000e+000 1.000000e+000
         vertex -1.000000e+000 1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal -1.084202e-016 1.000000e+000 0.000000e+000
      outer loop
         vertex -1.000000e+000 1.000000e+000 -1.000000e+000
         vertex 1.000000e+000 1.000000e+000 1.000000e+000
         vertex 1.000000e+000 1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 0.000000e+000 0.000000e+000 1.000000e+000
      outer loop
         vertex 1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 1.000000e+000 1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
      endloop
   endfacet
   facet normal 0.000000e+000 0.000000e+000 1.000000e+000
      outer loop
         vertex -1.000000e+000 -1.000000e+000 1.000000e+000
         vertex 1.000000e+000 1.000000e+000 1.000000e+000
         vertex -1.000000e+000 1.000000e+000 1.000000e+000
      endloop
   endfacet
   facet normal 0.000000e+000 0.000000e+000 -1.000000e+000
      outer loop
         vertex 1.000000e+000 1.000000e+000 -1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 1.000000e+000 -1.000000e+000
      endloop
   endfacet
   facet normal 0.000000e+000 0.000000e+000 -1.000000e+000
      outer loop
         vertex -1.000000e+000 1.000000e+000 -1.000000e+000
         vertex 1.000000e+000 -1.000000e+000 -1.000000e+000
         vertex -1.000000e+000 -1.000000e+000 -1.000000e+000
      endloop
   endfacet
endsolid

測試檔案：
球 (FileName: SphereASCII.STL, Facet Normal: 2352, Vertex: 7056, Diameter: 1mm)
https://sites.google.com/site/ccuboxy/home/SphereASCII.STL?attredirects=0&d=1

小齒輪 (FileName: GearASCII.STL, Facet Normal: 792, Vertex: 2376, Diameter: 10mm)
https://sites.google.com/site/ccuboxy/home/GearASCII.STL?attredirects=0&d=1

大齒輪 (FileName: LargeGearASCII.STL, Facet Normal: 792, Vertex: 2376, Diameter: 100mm)
https://sites.google.com/site/ccuboxy/home/LargeGearASCII.STL?attredirects=0&d=1

風扇 (FileName: FanASCII.STL, Facet Normal: 2928, Vertex: 8784, Diameter: 80mm)
https://sites.google.com/site/ccuboxy/home/FanASCII.STL?attredirects=0&d=1

2014年7月10日星期四

Advanced VC++ Chapter 2

課程內容：

Example 7 - 使用一維陣列傳入函式的方式進行一維陣列的處理
http://codeboxy.blogspot.com/2013/07/passing-array-to-function.html

Example 8 - 函式使用指標的方式傳值進行運算處理
http://codeboxy.blogspot.com/2013/07/passing-two-dimensional-array-to.html

Example 9 - 矩陣相乘範例
http://codeboxy.blogspot.com/2013/07/passing-two-dimensional-array-to_10.html

Example 10 - 計算反矩陣範例
http://codeboxy.blogspot.com/2013/07/solving-matrix-inverse-using-pointer.html

分組作業：

撰寫一程式，能讀取4x4矩陣資料並存入二維陣列中，請使用指標的方式計算並印出矩陣降階後的4個3x3矩陣及係數。

2014年7月1日星期二

Advanced VC++ Chapter 1

課程內容：

VC++建立基本專案動態教學：Open

Example 1 - cout範例
http://codeboxy.blogspot.com/2014/07/cout-example.html

Example 2 - datatype範例
http://codeboxy.blogspot.com/2014/07/variable-type-and-size.html

Example 3 - Cin and cout command範例
http://codeboxy.blogspot.com/2014/07/cin-and-cout-command.html

Example 4 - if...else...Statements範例
http://codeboxy.blogspot.com/2014/07/if-else-statements.html

Example 5 - for Statements範例
http://codeboxy.blogspot.com/2014/07/for-statement.html

Example 6 - Regular expression範例
http://codeboxy.blogspot.com/2014/07/simple-regular-expression.html

分組作業：
請使用判斷式及迴圈自行設計屬於自己的數字加密工具，1人建立加密器，1人建立解密器。

1.加密器部分
可任意輸入限制條件為8~20位數字，將數字透過自行設計的複雜運算，輸出長度為50位的數字。

2.解密器部分
輸入條件限制為50位的數字，請將數字透過已知加密器的複雜運算條件，反算回原始8~20位數字。

Hint:
可使用string函式庫的substr取得切割後的字串。

備註：
VC++專案檔的檔名(*.sln)：

去年的Chapter 1：
http://ccuboxy.blogspot.com/2013/07/advanced-vc-chapter-1.html

C++學習筆記：
http://openhome.cc/Gossip/CppGossip/

課程規劃網址：
http://goo.gl/fshw0h

2014年3月20日星期四

VC++ cURL POST程式範例

官方網站：http://curl.haxx.se/
官方下載頁：http://curl.haxx.se/download.html (libcurl-7.19.3-win32-ssl-msvc.zip)

將include/curl放到VC的include目錄下
將lib、dll放到程式目錄下

cURL C++ 用法：

#include "stdafx.h"
#include <curl\curl.h>
#pragma comment(lib, "curllib.lib")

size_t write_header(void *ptr, size_t size, size_t count, void *stream)
{
    printf("Value: %s\n", ptr);
    return count*size;
}

void login(char *email, char *password) {
    CURL *curl;
    CURLcode res;

    //email=test@gmail.com&password=abcd1234
    char str[150] = "email=";
    strcat(str, email);
    strcat(str, "&password=");
    strcat(str, password);

    curl = curl_easy_init();
    if(curl) {
        curl_easy_setopt(curl, CURLOPT_URL, "http://127.0.0.1:1337/login"); //登入API的URL
        curl_easy_setopt(curl, CURLOPT_POSTFIELDS, str);
        curl_easy_setopt(curl, CURLOPT_WRITEFUNCTION, &write_header);
 
        res = curl_easy_perform(curl);
        if(res != CURLE_OK)
            fprintf(stderr, "curl_easy_perform() failed: %s\n", curl_easy_strerror(res));
        curl_easy_cleanup(curl);
    }
    curl_global_cleanup();
    return;
}

int main(int argc, char* argv[])
{
    login("test@gmail.com", "abcd1234");
    system("pause");
    return 0;
}

另有C#使用WebRequest版本：
http://codeboxy.blogspot.com/2014/03/c-post-using-webrequest.html

2014年3月3日星期一

印表機共用Client端安裝設定

由於安裝印表機是每一屆學弟都會遇到的問題，
所以簡單寫個安裝方法。

目前研究室印表機前情提要:

目前由研究室FTPServer統一開放區網印表機共用。
FTPServer電腦名稱為『CAD-29』。
於FTPServer可下載到各印表機驅動程式。

1. 進入控制台 > 網路和網際網路 > 檢視網路電腦及裝置

2. 找到電腦名稱為『CAD-29』之電腦，若找到請跳到第4步驟，若找不到請跳到第3步驟。

3. 若找不到『CAD-29』這台電腦，可直接在路徑列打上『\\cad-29』即可進入，若無法進入請檢查FTPServer是否能正常開機並登入系統。

4. 請記得勾選『記住我的認證』並登入帳號密碼。

5. 對需要使用的網路印表機按下『右鍵』選擇『連線』。

6. 若您的電腦在安裝驅動時跳出『您信任此印表機嗎?』，請點選安裝驅動程式，若跳出找不到驅動程式要求選擇驅動程式時，請先自行安裝正確的驅動程式後再重複第5個步驟。

教學結束。

2014年2月24日星期一

Advanced JS Chapter 9

安裝MongoDB:
http://qqboxy.blogspot.com/2013/08/mongodb-nosql-server-on-windows.html

Node.js安裝Mongoose Addon:

Mongoose手冊:
http://mongoosejs.com/docs/guide.html

學習步驟：
1. 學習SQL、NoSQL的基礎概念。
2. 學習建立MongoDB資料庫。
3. 學習使用Mongoose建立一筆資料。

作業：
1. 使用Mongoose建立CRUD(Create、Read、Update、Delete)的動作。

2014年2月19日星期三

Advanced JS Chapter 8

THREE.js:
http://threejs.org/

dat-gui:
https://code.google.com/p/dat-gui/

學習步驟：
1. 學習使用THREE.js。

作業：
1. 將THREE.js應用於Webapp。

2014年2月17日星期一

Advanced JS Chapter 7

流暢介面寫法：
http://codeboxy.blogspot.com/2013/10/fluent-interface-with-prototype.html

學習步驟：
1. 學習使用流暢介面寫法撰寫程式碼。

作業：
1. 建立網站登入系統及APP操作介面採用流暢介面寫法撰寫。

2014年2月13日星期四

Advanced JS Chapter 6

Express資料夾權限控制:
http://codeboxy.blogspot.com/2013/10/folder-access-restrictions-in-nodejs.html

學習步驟：
1. 學習使用Session建立網頁權限控制。

作業：
1. 建立網站登入系統及APP操作介面。

2014年2月12日星期三

Advanced JS Chapter 5

使用JavaScript在目標前後插入或包覆標籤：
http://codeboxy.blogspot.com/2011/10/javascript-insertbefore-insertafter.html

學習步驟：
1. 學習虛擬物件的概念。
2. 虛擬物件的應用。

作業：
1. 使用虛擬物件完善網站。

Advanced JS Chapter 4

Mimetype Table
Node.js (extTypes.js)：

module.exports = {
    "3gp"     : "video/3gpp",
    "a"       : "application/octet-stream",
    "ai"      : "application/postscript",
    "aif"     : "audio/x-aiff",
    "aiff"    : "audio/x-aiff",
    "asc"     : "application/pgp-signature",
    "asf"     : "video/x-ms-asf",
    "asm"     : "text/x-asm",
    "asx"     : "video/x-ms-asf",
    "atom"    : "application/atom+xml",
    "au"      : "audio/basic",
    "avi"     : "video/x-msvideo",
    "bat"     : "application/x-msdownload",
    "bin"     : "application/octet-stream",
    "bmp"     : "image/bmp",
    "bz2"     : "application/x-bzip2",
    "c"       : "text/x-c",
    "cab"     : "application/vnd.ms-cab-compressed",
    "cc"      : "text/x-c",
    "chm"     : "application/vnd.ms-htmlhelp",
    "class"   : "application/octet-stream",
    "com"     : "application/x-msdownload",
    "conf"    : "text/plain",
    "cpp"     : "text/x-c",
    "crt"     : "application/x-x509-ca-cert",
    "css"     : "text/css",
    "csv"     : "text/csv",
    "cxx"     : "text/x-c",
    "deb"     : "application/x-debian-package",
    "der"     : "application/x-x509-ca-cert",
    "diff"    : "text/x-diff",
    "djv"     : "image/vnd.djvu",
    "djvu"    : "image/vnd.djvu",
    "dll"     : "application/x-msdownload",
    "dmg"     : "application/octet-stream",
    "doc"     : "application/msword",
    "dot"     : "application/msword",
    "dtd"     : "application/xml-dtd",
    "dvi"     : "application/x-dvi",
    "ear"     : "application/java-archive",
    "eml"     : "message/rfc822",
    "eps"     : "application/postscript",
    "exe"     : "application/x-msdownload",
    "f"       : "text/x-fortran",
    "f77"     : "text/x-fortran",
    "f90"     : "text/x-fortran",
    "flv"     : "video/x-flv",
    "for"     : "text/x-fortran",
    "gem"     : "application/octet-stream",
    "gemspec" : "text/x-script.ruby",
    "gif"     : "image/gif",
    "gz"      : "application/x-gzip",
    "h"       : "text/x-c",
    "hh"      : "text/x-c",
    "htm"     : "text/html",
    "html"    : "text/html",
    "ico"     : "image/vnd.microsoft.icon",
    "ics"     : "text/calendar",
    "ifb"     : "text/calendar",
    "iso"     : "application/octet-stream",
    "jar"     : "application/java-archive",
    "java"    : "text/x-java-source",
    "jnlp"    : "application/x-java-jnlp-file",
    "jpeg"    : "image/jpeg",
    "jpg"     : "image/jpeg",
    "js"      : "application/javascript",
    "json"    : "application/json",
    "log"     : "text/plain",
    "m3u"     : "audio/x-mpegurl",
    "m4v"     : "video/mp4",
    "man"     : "text/troff",
    "mathml"  : "application/mathml+xml",
    "mbox"    : "application/mbox",
    "mdoc"    : "text/troff",
    "me"      : "text/troff",
    "mid"     : "audio/midi",
    "midi"    : "audio/midi",
    "mime"    : "message/rfc822",
    "mml"     : "application/mathml+xml",
    "mng"     : "video/x-mng",
    "mov"     : "video/quicktime",
    "mp3"     : "audio/mpeg",
    "mp4"     : "video/mp4",
    "mp4v"    : "video/mp4",
    "mpeg"    : "video/mpeg",
    "mpg"     : "video/mpeg",
    "ms"      : "text/troff",
    "msi"     : "application/x-msdownload",
    "odp"     : "application/vnd.oasis.opendocument.presentation",
    "ods"     : "application/vnd.oasis.opendocument.spreadsheet",
    "odt"     : "application/vnd.oasis.opendocument.text",
    "ogg"     : "application/ogg",
    "p"       : "text/x-pascal",
    "pas"     : "text/x-pascal",
    "pbm"     : "image/x-portable-bitmap",
    "pdf"     : "application/pdf",
    "pem"     : "application/x-x509-ca-cert",
    "pgm"     : "image/x-portable-graymap",
    "pgp"     : "application/pgp-encrypted",
    "pkg"     : "application/octet-stream",
    "pl"      : "text/x-script.perl",
    "pm"      : "text/x-script.perl-module",
    "png"     : "image/png",
    "pnm"     : "image/x-portable-anymap",
    "ppm"     : "image/x-portable-pixmap",
    "pps"     : "application/vnd.ms-powerpoint",
    "ppt"     : "application/vnd.ms-powerpoint",
    "ps"      : "application/postscript",
    "psd"     : "image/vnd.adobe.photoshop",
    "py"      : "text/x-script.python",
    "qt"      : "video/quicktime",
    "ra"      : "audio/x-pn-realaudio",
    "rake"    : "text/x-script.ruby",
    "ram"     : "audio/x-pn-realaudio",
    "rar"     : "application/x-rar-compressed",
    "rb"      : "text/x-script.ruby",
    "rdf"     : "application/rdf+xml",
    "roff"    : "text/troff",
    "rpm"     : "application/x-redhat-package-manager",
    "rss"     : "application/rss+xml",
    "rtf"     : "application/rtf",
    "ru"      : "text/x-script.ruby",
    "s"       : "text/x-asm",
    "sgm"     : "text/sgml",
    "sgml"    : "text/sgml",
    "sh"      : "application/x-sh",
    "sig"     : "application/pgp-signature",
    "snd"     : "audio/basic",
    "so"      : "application/octet-stream",
    "svg"     : "image/svg+xml",
    "svgz"    : "image/svg+xml",
    "swf"     : "application/x-shockwave-flash",
    "t"       : "text/troff",
    "tar"     : "application/x-tar",
    "tbz"     : "application/x-bzip-compressed-tar",
    "tcl"     : "application/x-tcl",
    "tex"     : "application/x-tex",
    "texi"    : "application/x-texinfo",
    "texinfo" : "application/x-texinfo",
    "text"    : "text/plain",
    "tif"     : "image/tiff",
    "tiff"    : "image/tiff",
    "torrent" : "application/x-bittorrent",
    "tr"      : "text/troff",
    "txt"     : "text/plain",
    "vcf"     : "text/x-vcard",
    "vcs"     : "text/x-vcalendar",
    "vrml"    : "model/vrml",
    "war"     : "application/java-archive",
    "wav"     : "audio/x-wav",
    "wma"     : "audio/x-ms-wma",
    "wmv"     : "video/x-ms-wmv",
    "wmx"     : "video/x-ms-wmx",
    "wrl"     : "model/vrml",
    "wsdl"    : "application/wsdl+xml",
    "xbm"     : "image/x-xbitmap",
    "xhtml"   : "application/xhtml+xml",
    "xls"     : "application/vnd.ms-excel",
    "xml"     : "application/xml",
    "xpm"     : "image/x-xpixmap",
    "xsl"     : "application/xml",
    "xslt"    : "application/xslt+xml",
    "yaml"    : "text/yaml",
    "yml"     : "text/yaml",
    "zip"     : "application/zip"
};

轉址下載用法
Node.js (main.js)：

var express = require("./node_modules/express"),
    fs = require("fs"),
    extTypes = require("./extTypes.js");

var app = express();
var port = 1337;
app.listen(port);

app.use('/', express.static(__dirname + '/html/'));

app.get("/download", function(req, res) {
    var file = "./upload/20140210/ahg056fg01sa40df8sd9";
    var filename = "firefox.png";
    var mimetype = extTypes["png"];
    
    res.setHeader('Content-disposition', 'attachment; filename=' + filename);
    res.setHeader('Content-type', mimetype);
    
    var filestream = fs.createReadStream(file);
    filestream.pipe(res);
});

console.log("Start express server");

學習步驟：
1. 檔案網路安全概念。
2. 學習如何將現有下載功能改成轉址方式。

作業：
1. 採用更安全的方式，利用讀檔寫檔設計一個可編輯公告內容的網站。

2014年1月24日星期五

Advanced JS Chapter 3

JavaScript撰寫模式：
http://shichuan.github.io/javascript-patterns/

fs函式官方文件：
http://nodejs.org/api/fs.html

main.js (高亮為讀檔部分)

var fs = require("fs");

var multiplication_table = function() {
    var i = 0, j = 0, output = "";
    for(i=1;i<=9;i++) {
        for(j=1;j<=9;j++) {
            output += j + "*" + i + "=" + j*i + ((j==9)?"":"\t");
        }
        output += ((i==9)?"":"\r\n");
    }
    return output;
};

var data = multiplication_table();

//Method A
fs.writeFile("tableA.txt", data, function (err) {
    if(err) throw err;
    console.log("A Write done.");
    
    fs.readFile("tableA.txt", "utf8", function (err, utf8Read) {
        if(err) throw err;
        console.log(utf8Read);
        console.log("A Read done.");
    });
});

//Method B
fs.open("tableB.txt", "w", 0644, function(err, fd) {
    if(err) throw err;
    fs.write(fd, data, 0, "utf8", function(err) {
        if(err) throw err;
        fs.closeSync(fd);
        console.log("B Write done.");
        
        fs.stat("tableB.txt", function(err, stats) {
            fs.open("tableB.txt", "r", function(error, fd) {
                var buffer = new Buffer(stats.size);
                fs.read(fd, buffer, 0, buffer.length, null, function(error, bytesRead, buffer) {
                    var utf8Read = buffer.toString("utf8", 0, buffer.length);
                    console.log(utf8Read);
                    fs.close(fd);
                    console.log("B Read done.");
                });
            });
        });
    });
});

輸出結果：

B Write done.
A Write done.
1*1=1   2*1=2   3*1=3   4*1=4   5*1=5   6*1=6   7*1=7   8*1=8   9*1=9
1*2=2   2*2=4   3*2=6   4*2=8   5*2=10  6*2=12  7*2=14  8*2=16  9*2=18
1*3=3   2*3=6   3*3=9   4*3=12  5*3=15  6*3=18  7*3=21  8*3=24  9*3=27
1*4=4   2*4=8   3*4=12  4*4=16  5*4=20  6*4=24  7*4=28  8*4=32  9*4=36
1*5=5   2*5=10  3*5=15  4*5=20  5*5=25  6*5=30  7*5=35  8*5=40  9*5=45
1*6=6   2*6=12  3*6=18  4*6=24  5*6=30  6*6=36  7*6=42  8*6=48  9*6=54
1*7=7   2*7=14  3*7=21  4*7=28  5*7=35  6*7=42  7*7=49  8*7=56  9*7=63
1*8=8   2*8=16  3*8=24  4*8=32  5*8=40  6*8=48  7*8=56  8*8=64  9*8=72
1*9=9   2*9=18  3*9=27  4*9=36  5*9=45  6*9=54  7*9=63  8*9=72  9*9=81
B Read done.
1*1=1   2*1=2   3*1=3   4*1=4   5*1=5   6*1=6   7*1=7   8*1=8   9*1=9
1*2=2   2*2=4   3*2=6   4*2=8   5*2=10  6*2=12  7*2=14  8*2=16  9*2=18
1*3=3   2*3=6   3*3=9   4*3=12  5*3=15  6*3=18  7*3=21  8*3=24  9*3=27
1*4=4   2*4=8   3*4=12  4*4=16  5*4=20  6*4=24  7*4=28  8*4=32  9*4=36
1*5=5   2*5=10  3*5=15  4*5=20  5*5=25  6*5=30  7*5=35  8*5=40  9*5=45
1*6=6   2*6=12  3*6=18  4*6=24  5*6=30  6*6=36  7*6=42  8*6=48  9*6=54
1*7=7   2*7=14  3*7=21  4*7=28  5*7=35  6*7=42  7*7=49  8*7=56  9*7=63
1*8=8   2*8=16  3*8=24  4*8=32  5*8=40  6*8=48  7*8=56  8*8=64  9*8=72
1*9=9   2*9=18  3*9=27  4*9=36  5*9=45  6*9=54  7*9=63  8*9=72  9*9=81
A Read done.

Hint：由於JS為事件導向，可能因Method B處理速度較快而造成Method A的結果較晚輸出。

學習步驟：
1. 學習如何使用fs寫檔及讀檔。
2. 學習JSON結構及應用。

作業3：
1. 利用讀檔寫檔設計一個可編輯公告內容的網站。

2014年1月20日星期一

Advanced JS Chapter 2

Form的種類：
http://codeboxy.blogspot.com/2011/07/html-form.html

開放源Node.js中文電子書：
https://github.com/nodejs-tw/nodejs-wiki-book

動態GET、POST函式：
http://codeboxy.blogspot.com/2014/01/dynamic-post-with-iframe.html

main.js:

var express = require("./node_modules/express"),
    url = require("url");
var app = express();
var port = 1337;

app.listen(port);

app.use('/', express.static(__dirname + '/'));

app.get("/", function(req, res) {
    res.send("Hello World!!");
});

app.post("/getdata", function(req, res) {
    var urlData = url.parse(req.url, true);
    console.log(urlData.query.t1);
    res.send("你的名字是: " +urlData.query.t1);
});

console.log("Start express server");

學習步驟：
1. 首先學習如何統一網頁的樣式表。
2. 了解JavaScript事件導向概念。
3. 了解網頁具有讀取順序的概念，若物件不存在則JavaScript無法取得物件。
4. 看Node.js中文電子書。

作業2：
1. 延伸自我介紹的網站，設計一個表單，可以提供客戶輸入資料，並傳回發送成功的訊息。

2014年1月17日星期五

Advanced JS Chapter 1

記事本編輯器：
http://qqboxy.blogspot.com/2010/06/emeditor-6004.html

Node.js官方網站：
http://nodejs.org/

Node.js架設教學：
http://qqboxy.blogspot.com/2013/07/portable-nodejsnpmexpress-windows.html

Express官方網站：
http://expressjs.com/

w3school教學網站：
http://www.w3schools.com/

main.js:

var express = require("./node_modules/express");
var app = express();
var port = 1337;
app.listen(port);

app.use('/', express.static(__dirname + '/'));

app.get('/', function(req, res) {
    res.send("Hello World!!");
});

console.log("Start express server");

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>Title</title>
</head>
<body>
<script type="text/javascript"></script>
<h1>My First Page.</h1>
</body>
</html>

學習步驟：
1. 首先了解如何配置一個Node.js伺服器。
2. 在伺服器執行一個js腳本。
3. 學習簡單的html架構。
4. 了解如何在伺服器上連結html檔案。
5. 看w3school網站HTML語法教學。

作業1：
1. 設計一個自我介紹的網站，具備多個分頁標籤，能夠超連結進入各個頁面。

訂閱：文章 (Atom)

2014年8月31日 星期日

2014年8月28日 星期四

2014年8月22日 星期五

2014年8月19日 星期二

2014年7月14日 星期一

2014年7月10日 星期四

2014年7月1日 星期二

2014年3月20日 星期四

2014年3月3日 星期一

2014年2月24日 星期一

2014年2月19日 星期三

2014年2月17日 星期一

2014年2月13日 星期四

2014年2月12日 星期三

2014年1月24日 星期五

2014年1月20日 星期一

2014年1月17日 星期五

關於我自己

搜尋此網誌

開始在英特崴工作(2019/01/21)

網誌存檔

標籤