[เขียนเมื่อ] วันเกิด MS Internet Explorer [ครบ 15 ปี]

พบว่าตัวเองเคยเขียนเล่าเรื่องราวต่างๆ ของ Internet Explorer เมื่อปี 2010 (4 ปีที่แล้ว) ใน facebook ซึ่งเป็นเรื่องราวที่ผมมีส่วนเกี่ยวข้อง มุมมองส่วนตัว เลยเอา copy มาไว้ใน Blog เผื่อเพื่อนๆ อยากอ่าน (สนุกๆ)

  ผมจำได้ว่า เขียนบทความเป็นเรื่องเป็นราวลงแมกกาซีนรายเดือน ครั้งล่าสุดประมาณปี 2002 ได้ เป็นหนังสือ Windows Magazine ในเครือ AR เป็นบทความที่เกี่ยวกับ Mobile devices ที่ห่างหายและเลิกไปก้เพราะ บก. บริหารที่ติดต่อให้ผมไปเขียนบทความย้ายค่าย ไปอยู่ค่ายอื่น เลยไม่ได้ติดต่อกัน อีกอย่างตอนเขียนบทความนั้นเป็นช่วงที่กำลังพัฒนา ปลาดาวออฟฟิศ ด้วยเวลามีไม่มากนัก ทำให้เวลาจะส่งบทความ จะเขียนบนกระดาษสีน้ำตาลใหม้ (เผากันเลยทีเดียว) เช่นส่งวันจันทร์ คืนวันอาทิตย์เที่ยงคืนก็จะเริ่มเขียน แหะๆ  

พอดีวันนี้เปิดเวป blognone.com เจอข่าวครบรอบวันเกิด 15 ปี ของ Internet Explorer ทำให้รำลึกถึงวันวานกับ IE ที่ไม่ได้เป็นเพียงแค่ผู้ใช้ แต่ได้มีโอกาสเป็นส่วนหนึ่งของทีมพัฒนาด้วย โดยได้มีโอกาสพัฒนาในส่วนการแสดงผลภาษาไทย ทำให้อยากเล่าอยากเขียนอะไรเกี่ยวกับ IE ทิ้งไว้เผื่อใครจะสนใจ หรือเก็บเอาไว้อ่านส่วนตัวต่อไป ก็ไม่เลวนัก และคิดว่าคงไม่เขียนเป็นบทความแบบสมัยเขียนลง Windows Magazine เพราะนั่นน่ะ เขาให้หน้าละ 300 บาท เดือนนึงต้องลากสักสามสี่หน้า จะได้เงินกินขนมสักพันบาท  

ตอนที่ได้รับมอบหมายให้ทำ Internet Explorer เป็นภาษาไทยนั้น เป็นช่วงที่ Microsoft ของ Windows 95 Thai Edition SR1 (Service Released 1) ถ้าจำชื่อไม่ผิด รายละเอียด SR1 ทุกอย่างเหมือนของ US Edition แต่เพิ่มเติมในส่วนที่เกี่ยวข้องกับภาษาไทยเข้าไป เท่าที่จำได้มีดังต่อไปนี้   ปัญหา Fonts ทั้งหลายของไทย ตอน Windows 3.x ออกนั้น เรามี Fonts UPC ใช้ แต่พอ Windows 95 Thai Edition ออกมานั้น Fonts UPC ชุดเดิมยังมีอยู่ แต่ปัญหาก็คือ ชื่อดันเปลี่ยนจาก UPC ไปเป็น New ทำให้เอกสารไม่ compatible ก็แก้ปัญหา font substitute ให้กับ SR1  

ส่วนอื่นๆ ก็เป็นการ enable features ที่แนบมากับ SR1 ซึ่งก็คือ Internet Explorer 2.0 จริงๆ การมี IE ในตอนนั้น BillG (Bill Gates : aka billg@microsoft.com NOTE: ตอนอยู่ Microsoft Bill เคยส่งอีเมล์มาหา 2 ครั้ง (ตื่นเต้นๆ) "แต่" เป็นอีเมล์ที่ส่งมาขอบริจากเงินทำบุญ แล้วก็ส่งให้กับทุกคนใน Campus -_-' ) ไม่เคยเห็นด้วยเลย โดย Bill ให้เหตุผลว่า "Internet น่ะไม่มีทางประสบความสำเร็จหรอก แล้วที่มีนักวิเคราะห์ออกมาบอกว่า ในอนาคตโฆษณาตามหน้าแมกกาซีนจะมี Web Site URL ติดที่ทุกๆ หน้าโฆษณาน่ะเหลวไหล อนาคตมันต้อง MSN สิ" (ตอนนั้น Microsoft เปิดบริการ Online ของตัวเองชื่อ Microsoft Network เป็น Private Network โดยหมุน Modem เข้า service ของ Mcirosoft เอง เหมือนๆ กับ บริการ Compuserve ที่มี server อยู่ที่ Ohio) เราคงไม่ต้องบอกว่า Bill เป็นนักพยากรณ์ที่มีความสามารถขนาดไหน (เนอะ)  

พอ SR1 ออก ความจำเป็นของ IE ต่อการเป็นอยู่ของ Windows OS เริ่มมีมากขึ้น แน่นอนว่าตอนนั้น การแสดงผลภาษาไทยบน Web Browser ยังทำไม่ได้สมบูรณ์เลยนักตัวเดียว (ตอนนั้นใช้ Mozilla บน Windows 95)   มีนักพัฒนาไทยบางคนพยายามที่จะ hack ให้ Web Browser สามารถตัดคำภาษาไทย ด้วยวิธีการ Hook API ของ Windows Socket โดย API ใหม่ที่เขียนขึ้นจะเข้าไป replace API หลัก เท่าที่จำได้คือ function recv (TPC) แล้ว Monitor data stream ตัดคำแล้วแทรก <WBR> ระหว่างคำไทย ให้   ก็ว่ากันไป ในระดับหนึ่ง แต่ในเวลานั้น วิธีการนี้ถือว่า Advances ที่สุดแล้ว แต่ก็เป็นการ Work around ปัญหาเท่านั้น ให้ดียังไง ก็สู้การพัฒนาที่ตัวโปรแกรมตรงๆ ไม่ได้

IE 2.0 ไทย จำได้ว่า code name ของ IE 2.0 คือ "Ohare"  

Ohare เป็นชื่อสนามบินนานาชาติที่ Chicago และถ้ายังจำกันได้ Chicago เป็น code name ของ Windows 95 นอกจากนั้น ยังมี code name ของ project ย่อยๆ อีกหลาย projects ที่ใช้ code name ล้อกับ Chicago เช่น Rich Edit ซึ่งเป็น Windows extended native control ก็มี code name ว่า Caponeซึ่งเป็นชื่อของเจ้าพ่อ ขาใหญ่ Al Capone แห่ง Chicago นั่นเอง

   ตัว source code จำไม่ได้ ก็กว่าสิบปีแล้วที่ทำ ตอนนั้นทำกับ นนท์ (Weerapan Wilairat) ตอนนี้นนท์อยู่ทีม Windows Mobile น่าจะเป็นคนทำ UI Phone 7 กับทำ Kin (มั๊ง... ไม่ยอมบอกเล๊ย)ส่วนตัว IE มีอะไรบ้าง เดี๋ยวเล่าให้ฟัง เอาที่จำได้นะครับ พอดีเหมือสามสี่ปีที่แล้วเก็บบ้าน เจอ source code เก่าๆ (Hard copy print out) เก็บๆ ไว้บ้าง แต่ใช้อะไรไม่ได้แล้ว เพราะเป็นแค่บางส่วน เท่านั้น (น่าจะ 1 ใน 100 ของทั้งหมด)

ส่วน comment บนหัว source code นั้นส่วนมากจะ comment ตามนี้

/*Enhanced NCSA Mosaic from Spyglass

   "Guitar"

   Copyright 1994 Spyglass, Inc.All Rights Reserved

   Author(s):

   ชื่อนักพัฒนาที่รับผิดชอบ source file นั้นๆ โดยมี address (at)spyglass . com กันทุกคน

*/

   ใช่แล้ว Microsoft ซื้อ source code มาจกา Spyglass ไม่แน่ใจว่า Take Over Spyglass มาเลยรึเปล่า ช่วงนั้น MS นิยม Take Over มากเพราะมันสามารถพัมนาผลิตภัณฑ์แบบก้าวกระโดดได้ เช่น FrontPage Microsoft ก็ซื้อมา รู้สึกจะซื้อมาทั้งบริษัท แต่ปัญหาของ FontPage ช่วงแรกๆ คือ เวลา Edit HTML file แล้วชอบเพิ่มสิ่งที่พึงปรารถนาเช่น Tag แปลกๆ และที่สำคัญที่สุดคือเมื่อ save แล้ว HTML pattern เก่าที่ถูกเขียนไว้จะถูก FrontPage แก้มั่วไปหมด คนทำเวปจะหงุดหงิดกับ FrontPage มาก ถ้า HTML ไฟล์นั้นถูกพัฒนาด้วยมือมาก่อน แล้วนำมาแก้ด้วย FontPage  

   ช่วงนั้น HTML Editor ที่เป็นแบบ Visual ที่ได้รับความนิยมที่สุดคือ DreamWeaver ของ MacroMedia (ตอนนั้น ตอนนี้กลายเป็น Adobe ไปแล้ว) ด้วยเหตุผลง่ายๆ คือทำสิ่งตรงกันข้ามกับ FrontPage ที่กล่าวไว้ข้างต้น นั่นเอง   

   ตอนทำ IE 2.0 Thai Edition ใช้เวลาในการพัฒนาทั้งสิ้น 1 เดือน ทดสอบอีกกว่า 2 เดือน ทีมทดสอบคือทีมการตลาด และ PSS ของ Microsoft Thailand

สุดท้ายHappy Birthday MS-IE

Banner ยอดนิยม ใช้ promote IE ในช่วงแรกๆ

Flying windows ใน source เดี๋ยวนี้พัฒนาไปเยอะมาก ตอน 3.0 ทำเป็น e หมุนเป็นรูปโลก สวยมากๆ

หน้าตา Mosaic โดย Spyglass

Upgrade LUA skill ด้วยการเขียน C module

มา upgrade LUA skill กัน ด้วยการเขียน LUA ไปเรียก module ที่เขียนด้วย C

ส่วนจะควรจะเรียกใช้ หรือเขียนอะไรด้วย LUA เขียนอะลัวด้วยไร ค่อยไปหาคำตอบกันเอง เช่น มีเพื่อนผมกลุ่มนึง เขียน Socket library เป็น Core module แล้ว Binding เขากับ LUA จากนั้นก็ใช้ LUA เขียน Server ทั้งตัว ก็มี

จาก Document พบว่า LUA ใช้ lua_State ในการส่งผ่าน parameters จาก LUA script ไปยัง C module ("Shared Object", file.so)  โดยมีรูปแบบมาตรฐานเริ่มต้นดังนี้

#include <lua.h> 

#include <lauxlib.h>

#include <lualib.h> 

int luaopen_cprime(lua_State *L){

   return 0;

}

ผมตั้งชื่อ library ตัวนี้ว่า cprime โดยวางแผนว่า ในนั้นจะมี function ง่ายๆ ในการตรวจสอบว่า ตัวเลขที่ส่งเข้ามาเป็น Prime Number หรือไม่ 

จากนั้นก็เพิ่ม function isprime สำหรับการตรวจสอบ Prime Number เข้าไป

static int isprime(lua_State *L) {

   int number = lua_tointeger(L, -1);

   for (int i = 2; i < number; i++) {

      if (number % i == 0 && i != number) {

         lua_pushnumber(L, 0);

         return 1;

      }

  }

  lua_pushnumber(L, 1);

  return 1;

}

อย่างที่ได้บอกไปแล้วว่า LUA ใช้ lua_State เป็น structure ในการส่งผ่าน parameters ระหว่าง LUA และ external module รวมถึงภายใน external module เอง 

ถ้าดูจาก function isprime ด้านบน lua_State จะเป็นทำหน้าที่ส่งผ่าน parameters ของ function isprime ทั้งหมด กรณีนี้ ผมส่ง integer เข้ามาตัวเดียว ซึ่งเราจะทำการดึง integer ที่ส่งผ่านเข้ามาใน isprime ด้วย lua_tointeger(L, -1);

lua_Integer lua_tointeger (lua_State *L, int index);

จากนั้นก็ตรวจสอบดูว่า ค่าที่ส่งเข้ามานั้นเป็น Prime Number หรือไม่ ถ้าใช่ เราก็ทำการ push 1 เข้าไปใน lua_State ด้วย lua_pushnumber(L, 0);

void lua_pushnumber (lua_State *L, lua_Number n);

ถ้าไม่ใช่ก็ push 0 เข้าไปแทน

แต่ก่อนจะใช้ isprime ได้ต้องทำการ register method isprime ให้ LUA รู้จักก่อนโดยการเรียก  (เราอาจเปลี่ยนชื่อ isprime เป็นอย่างอื่นก็ได้ ด้วยการแก้ที่ paraemters ที่สอง เช่น "fprime" เป็นต้น)

lua_register(L,"isprime",isprime); 

ใน luaopen_cprime(...); ซึ่งหน้าตาของ cprime.c จะเป็นแบบนี้

#include <lua.h>

#include <lauxlib.h>

#include <lualib.h>

static int isprime(lua_State *L) {

  int number = lua_tointeger(L, -1);

  for (int i = 2; i < number; i++) {

    if (number % i == 0 && i != number) {

      lua_pushnumber(L, 0);

      return 1;

    }

  }

  lua_pushnumber(L, 1);

  return 1;

}

int luaopen_cprime(lua_State *L){

  lua_register(L,"isprime", isprime);

  return 0;

}

จากนั้น compile 

$ gcc -Wall -shared -fPIC -o cprime.so -I/usr/include/lua5.1 -llua5.1 cprime.c

(อย่าลืมติดตั้ง Lua5.1 ก่อนนะจ๊ะ)

แล้วเราก็มาสร้าง prime.lua file เพื่อเรียกใช้ isprime ของเรา หน้าตาจะเป็นแบบนี้ครับ

#!/usr/bin/lua

require("cprime")

print(isprime(13))

print(isprime(12))

แล้วเรียก

$ lua prime.lua

1

0

ประมาณนี้...ครับ :-)

foreach ใน C++

เพื่อนๆ ผมมักบอกว่า C++ โบราณแล้ว... ภาษามันเก่าแล้วพี่... C# เหอะพี่ (แหม่ อันหลังนี่...)

ถามกลับไปว่า เพราะอะไร ตัวอย่างที่มักจะยกกันขึ้นมา ก็คือ C++ มันไม่มี foreach นะพี่ (ผม) เฮ๊ย... มีนะ

ตอน C++11 ยังไม่ประกาศมาตรฐาน Qt ก็เคยทำ foreach มาให้ใช้

  QList<int> list;
 
  list << 1 << 2 << 3 << 4 << 5;
 
  foreach (int i, list)
  {
    qDebug() << i;
  }

พอ C++11 ประกาศใช้เราก็สามารถทำแบบนี้ได้

int arrayint[] = {1, 2, 3, 4, 5};

for (int i : arrayint) {

   ...

}

ทำแบบกำหนด boundary ของ container (cont) แบบนี้ก็ได้

for (auto it = cont.begin(); it != cont.end(); ++it)

หรือ จะแบบ reverse order ก็แบบนี้

for (auto it = cont.rbegin(); it != cont.end(); ++it)

เห็นแมะ C++11 โบราณตรงไหน :-)

เริ่มต้นกับ Openresty

เรื่องของเรื่องคือ มีเพื่อนผมคนนึงเขียน Openresty มาเป็นปี เคยเขียน MVC ให้ Openresty ด้วย แต่กลับมาบ่นๆ ว่า "พี่ๆ Openresty นี่ create project แยกกันยังไง คือผมอยากทำหลาย project บนเครื่องเดียวกัน"

อ้าว...สะงั้น เอางี้ผมบันทึกให้ แต่แชร์เพื่อนๆ ที่สนใจด้วยเลยละกัน...

หมายเหตุ : ผมใช้ OSX Maverick

ผมเริ่มจากเอา pcre verison ล่าสุด (ที่ผมใช้มัน 8.33 ไม่ล่าสุดหรอก) มา build ง่ายๆ ด้วย
$ ./configure
$ make
$ sudo make install

จากนั้น download source openresty มาจาก openresty.org untar แล้ว build
$ ./configure --with-luajit --with-cc-opt="-I/usr/local/include" --with-ld-opt="-L/usr/local/lib"
$ make
$ sudo make install

พอเวลาจะสร้าง application ก็เริ่มจาก สร้าง project folder

$ mkdir myproject
$ cd myproject
$ mkdir logs
$ mkdir conf

สร้าง nginx.conf ใน folder conf โดยเริ่มจาก default config แบบนี้ครับ

worker_processes  1;
error_log logs/error.log;
events {
    worker_connections 1024;
}
http {
    server {
        listen 8080;
        location / {
            default_type text/html;
            content_by_lua '
                ngx.say("<p>hello, world</p>")
            ';
        }
    }
}

จากนั้น set path 

$ export PATH=/usr/local/openresty/nginx/sbin:$PATH

แล้ว start project 

$ nginx -p `pwd`/ -c conf/nginx.conf

แล้วใช้ browser เรียก http://127.0.0.1:8080

จะได้

หากต้องการสร้าง Project อื่นๆ อีก ก็สามารถทำแบบเดียวกันได้เลย โดยเริ่มจากการสร้าง Project folder

หากแก้ไข script conf หรือเพิ่ม lua ไฟล์ ต้องทำการ reload nginx ด้วย

$ nginx -s reload -p `pwd`/ -c conf/nginx.conf 

บันทึก : ปลาดาวออฟฟิศ

เคยคิดที่จะบันทึกเรื่องราวความทรงจำเกี่ยวกับ ปลาดาวออฟฟิศ ที่ผ่านมาในชีวิตไว้เมื่อนานมาแล้ว แต่ตอนนั้นไม่รู้ว่าจะเขียนไว้ที่ไหน ตอนนี้มี Blog แล้วเอาลงไว้ตรงนี้ละกัน

เรื่องราวที่จะเขียนต่อไปนี้เป็นเรื่องราวที่เกิดขึ้นเมื่อสิบห้าปีกว่าๆ ที่แล้ว

ครั้งแรกกับ StarOffice
1998 ตอนนั้น...หลังจากตัดสินใจไม่ย้ายถิ่นฐานไปอยู่ Redmond ตามคำเชิญของเพื่อนร่วมงาน (Program Manager) ที่สนิทกัน (วันนี้ตอนนี้ก็ยังสนิทกันอยู่ใน facebook) ก็ตัดสินใจทำอะไรเองที่ กทม. หลายอย่าง เช่น สอบ MCP ไปสิบสองใบ เพื่อสมัคร MS Solution Provider เอามาขาย MS-Office

จริงๆ เขาให้สองแค่สองสามใบเองแหละ แต่สอบแล้ว ติดลม สนุกดีเลยสอบไปเรื่อยๆ

ตอนปลายปี 1998 ได้งานมางานหนึ่ง เป็นงานทำ Telephony gateway เพื่อประมูลโครงการ TOT ใช้การ์ด Dialogic ต่อ E1 (ตอนนั้นลาก RG58 ระหว่างสองเครื่องกันเอง) โดยเพื่อนสองคน คนนึงคือ จุ๊บ (เสียชีวิตแล้ว) อีกคนคือ วีรธร สุดท้ายโครงการนี้ก็ยุติลงเนื่องจากค่าเงินบาทตอนนั้นทำให้ต้นทุนสูงมาก ผู้ยื่นประมูลเลยรวมตัวกันขอยกเลิกโครงการ (มีแบบนี้ด้วย) แต่การ์ด Dialogic ผมยังซื้อไว้การ์ดนึงนะ จำได้ว่า ราคาสองแสนบาท

วีรธร เป็นหนึ่งในคนออกแบบการ์ดภาษาไทย Monochrome iRC หนึ่งในทีมพัฒนา MS-DOS Thai edition ปัจจุบัน ยังทำงานด้วยกันกับผมอยู่

ระหว่างที่เราพัฒนาโครงการ TOT ผมได้ข่าวที่ทำให้หงุดหงิดใจ (ช่วงนั้นของแรง อารมณ์ร้อน) ว่า SUN Microsystem ได้เข้าซื้อกิจการ StarOffice แล้วทำมาปั๊มแผ่น CD แจกในไทย ที่หงุดหงิดไม่ใช่เรื่องแจก StarOffice แต่หงุดหงิดเพราะ มันใช้ภาษาไทยไม่ได้ จะแจกทำไม? หลังจากได้ติดตั้งและทดลองใช้

วีรธร ที่มีเพื่อน (ลาดกระบัง) อยู่ที่ SUN ตอนนั้น ก็บอกว่า เดี๋ยวผมลองคุยกับเพื่อนดูเผื่อสนใจทำภาษาไทย จะได้มาจ้างคุณป้อทำ ผมตอบไปว่า อ๊ะๆๆ ไม่ได้อยากทำนะ... แค่บ่นเฉยๆ

นั่นคือฉากแรกที่ได้รู้จักชื่อ StarOffice

เริ่มเปิดบริษัท Algorithms
เป็นการเปิดบริษัทด้วยความบังเอิญ เพราะต้องวางบิลเก็บเงินค่าพัฒนาโปรแกรมระบบขายตั๋วหนังกับ EGV พอเปิดแล้วโครงการมันทำคนเดียวไม่ไหว ต้องหาคนมาช่วย พอมีคนช่วยพื้นที่ทำงานมันก็น้อยลง เลยต้องย้ายไปอยู่ที่อื่น แล้วก็มาจบที่ Software Park ตอนปลายๆ ปี 1999

ตอนนั้น เบื่อหน่ายอะไรหลายอย่าง พยายามต่อสู้ให้บริษัทอยู่ให้ได้ รับงานทุกอย่างเป็นต้นว่า

• ทำเกมภาษาไทย ไม่ได้แปลภาษาอังกฤษเป็นไทยนะครับ เขาแปลมาแล้ว แต่เขาจะเอา source code มาพัฒนาการแสดงผลให้เป็นภาษาไทย เกมแรกที่ทำคือ Pharaoh ตามมาจนครบ Series เลยคือ Cleopatra, Zues และ Prosidon จากนั้นก็มี Title อื่นๆ อีก สิบกว่า Title ได้มาก Title ละแสน ทำกัน Title ละสองเดือนบ้าง ยากหน่อยก็สามเดือน ต้องรอส่วนแบ่งจากยอดขาย ถ้าขายเกิน 5,000 กล่อง จะได้ส่วนแบ่งกล่องละ 30 บาท (มั๊งจำไม่ได้) และก็ไม่เคยได้ เพราะได้รับแจ้งตลอดว่า ขายไม่ถึง 5,000 กล่อง (จบข่าว)
• ทำภาษาไทย PocketPC ปัญหาเยอะ เยอะมากๆ ก็ไม่เอาดีกว่า ชีวิตสั้น หนีเลย ใครชวนทำอะไรเกี่ยวกับไอ้นี่ ไม่เอาแล้ว มีคนมาขอซื้อ source code ก็ไม่ขาย แพงเท่าไรก็ไม่ขาย ลบทิ้งไปเลย เกลียดแม่ง...
• แต่ตอนหลังใจอ่อน ตอน ปีเตอร์กวง (ควงมือถือ) ชวนทำภาษาไทยบน Motorola Q8 (ตอนนั้นคุณกวงอยู่ Motorola) ใจอ่อนเพราะทำกับทีมที่ Chicago และทำลงใน ROM Q8 จากโรงงานเลย แถมทำในระดับ Platform ด้วย คือทำ ภาษาไทย localization แบบเต็มรูปแบบ แน่นอนรวมถึง Keyboard hardware ภาษาไทย (Q8 มี keyboard แบบ Blackberry)

ส่วน EGV เลิกโครงการไป

ปี 2000 มีข่าวว่า SUN จะเปิดเผย source code StarOffice

ผมมีโอกาสพูดเปรยๆ กับ อาจารย์ รอม ตอนนั้นมี อาจารย์ สมนึก คีรีโต รวมวงสนทนาด้วย อาจารย์รอม สนใจอยากให้ทำแล้วแจกในวันเปิด Software Park อย่างเป็นทางการ 

ตอนนั้น SUN มีแต่ข่าวจะเปิดเผย source code เวป openoffice.org ยังไม่มีนะครับ 

มันต้องใช้เงินทุนพัฒนานะครับ อาจารย์รอมเลยอาสาเอาโครงการนี้ไปเผยแพร่กับองกรค์หรือใครที่สนใจ สนับสนุน สุดท้ายมาจบที่ SUN Microsystem Thailand แจ้งความจำนงว่าจะเป็นเจ้าภาพเอง

ผมจำได้ว่า เข้าไปที่ SUN ตอนนั้นอยู่ที่ตึก อับดุลราฮิม สามครั้ง ไปฟังรายละเอียดความต้องการ ไปส่งเอกสารที่ทำ และ ไปฟังการตัดสิน

ตอนนั้น SUN มี พี่สุธรรม พี่ศิริวัฒน์ และ อาร์ต (Bact' นั่นแหละ) เป็น contact point ได้แจ้งว่า มีบริษัทให้ความสนใจทำโครงการนี้ทั้งหมด 12 บริษัท (จ๊ากกกก นี่มันโครงการที่เราเสนออยากทำนะ) วิธีการตัดสินว่าใครจะได้ทำคือ ให้แต่ละบริษัทเขียนมาว่า ถ้าได้ทำจะทำอะไรกับ StarOffice บ้าง

ใครเขียนอะไร ผมไม่รู้ (จะรู้ได้ไง เขาไม่บอก) แต่ผมเอา Specification ของ Microsoft Office 97 Thai Edition มายำใส่จนครบเลย ก็ผมร่วมเขียน Spec Office 97 Thai Edition ในตอนนั้น มันเลยจำได้....หมด... ตอนนี้ก็ยังจำได้นะเฟ้ย...

แล้วผมก็ได้ทำ วันที่รู้ว่าได้ทำ ก็รู้ที่ตึก อับดุลราฮิมนั่นแหละ 

Multiple Platform

อีกเรื่องที่เร้าใจมากตอนนั้นคือ ผมและทีมต้องพัฒนา StarOffice บน 3 Platform คือ Solaris, Linux และ Windows 

ทีมพัฒนา

ต้องยอมรับอย่างหนึ่งว่า การหาทีมที่สามารถเขียน C++ โครงการขนาดใหญ่ ไม่ใช่เรื่องง่าย และสุดท้าย Code C++ ทั้งหมด ผมก็เป็นคนรับผิดชอบ ทีมที่เหลือช่วย Build, Setup, test, localization จัดการ font, graphics เป็นต้น

เครื่องที่ใช้

เรามีเครื่องจำกัด ผมใช้เครื่องคนเดียวทั้งหมด 4 เครื่อง มี Linux 1, Windows x2 และ Solaris (Sparc) ตอนนั้นห้องทำงาน ถ้าไม่เปิดแอร์ นี่เหงื่อหยด และก็เหงือหยดทุกวันเพราะหลัง 6 โมง Software park จะปิดแอร์!!!

เรามี Server อีกสามเครื่อง ซึ่งเป็นเครื่องเช่าทั้งสิ้น ไม่มีปัญญาซื้อ ไม่มีเงินเหลือพอที่จะซื้อ (เครื่อง Solaris ตอนนั้น SUN ให้ยืมมา)

เสนอค่าใช้จ่ายในการพัฒนา

ผมเป็นโปรแกรมเมอร์ (+นักดนตรี) ที่เผลอลืมตัวไปเป็นผู้ประกอบการ คิดราคาค่าใช้จ่ายในการพัฒนา ก็คิดว่า มันคือ OpenSource ตอนนั้นยังไม่ชัดเจนตัวเองเท่าไรว่า Opensource คืออะไร ก็ใช้วิธีคิดว่า มันคือ Contribution ก็น่าจะคิดค่าพัฒนาพอดีๆ กับใช้จ่าย เลยเอาค่าใช้จ่ายคูณเดือน แล้วแจ้ง SUN ไป (น่ารักแมะล่ะ)

รายได้จึงพอดีกับค่าใช้จ่าย ผมเลยมักจะพูดติดตลก (ปนน้ำตา) สมัยนั้นว่า ผมทำน่ะไม่ได้อะไรนะ คนที่ได้อะไรคือคนที่ทำ หนังสือขายต่างหาก ผมไปร้านหนังสือ เห็นหนังสือ ปลาดาว เต็มแผง บอกตรงๆ ไม่เคยมีใครส่งมาให้ผมเก็บเป็นที่ระลึกเลย (หลังๆ มีส่งมาให้ สามสี่ Title :) )

ก่อนเริ่มงาน
พี่สุธรรม โทรมาบอกว่า มีนัดคุยกับ NECTEC เพื่อแจ้งให้ทราบว่าเราจะพัฒนา Office Thai เพราะตอนนั้น NECTEC มี Linux TLE เราไปคุยกันที่ตึกยิปซั่ม ได้เจออั้น กะเทพ ครั้งแรกที่นั่น

เริ่มพัฒนา 

ตอนได้ Code มา เป็นอาทิตย์แรกที่ OpenOffice.org เปิดตัว Code Build ไม่ผ่านเลยครับ ผมเลยกลายเป็นกลุ่มคนกลุ่มแรกๆ ที่ร่วมกันพยายาม Build เข้าใจว่า จริงๆ มัน build ผ่านแหละ แต่ Dev Team ที่ Humburg German commit ลง CVS ไม่สมบูรณ์ (อ้อ ตอนนั้นใช้ CVS ครับ)

ผมพยายาม Build อยู่เป็นเดือน พอ Windows ได้ Linux ก็ไม่รอด พอเอา Linux รอด โหดสุดก็ Solaris เพราะเครื่องที่ผมได้มาใช้เวลา Build 30++ ชั่วโมง ไม่นับถ้า Build failed นะครับ  (ผ่านมาได้ยังไง ยังนึกไม่ออกเลย)

พอ Build ออกมาได้ ก็พบว่า version ที่เราได้ code มาเป็น version ที่ OO.o ยังไม่ release คือ Bugs ตรีม นั่นแหละ 

ไม่ว่ากัน ผมทำหน้าที่ของผม จับยัด features ไทย อย่างเดียว มี code ใหม่ ก็จับ merge จำได้ละ มี Engineer ในทีมผมคนนึง คอยทำหน้าที่ merge อย่างเดียวเลย เรา merge มือนะครับ ผมจะ list ว่าผม touch file ไหน module ไหน แล้ว เข้าจะ fine merge จุดนั้นๆ ที่เหลือก็ replace ไป

ข้อดีของ OO.o คือมันเป็น Share library ผมทำ features ไทยที่เดียว มันจะใช้ได้ทุก application ย่อย อย่าง ตัดคำ ทำที่เดียว ใช้ได้ทุก app อันนี้ก็สะดวกไปอย่าง...

Release แรก

ตอนเรา Release แรก เรา Release ก่อนหรือหลัง OpenOffice.org วันนึงนี่แหละ ผมจำไม่ได้ แต่การ Release ใกล้กับ OO.o ตอนนั้น ไม่ใช่เรื่องดีเพราะ Code มันคนละ Code

คือ Code ของผมไม่ใช่ Code ล่าสุด เพราะผมต้อง build จาก code ที่อุดมไปด้วย Bug แล้วนำไป production คือปั๊ม CD นู่นนี่นั่นอย่างน้อยก็อาทิตย์สองอาทิตย์ ทำให้ version แรกของเรา Bug เต็มไปหมด

คาใจเรื่อง Opensource

ผมตั้งคำถามถามตัวเองตลอดในช่วงนั้น เครียดไปหมด และน่าจะเป็นเหตุผลหนึ่งที่ผมไม่อยากทำต่อคือ

โครงการนี้เป็นของ SUN ซึ่ง OpenOffice.org เป็น Dual-license ที่ SUN กำหนด เพราะเป็นของ SUN, SUN ซื้อ StarOffice มา หมายความว่า SUN จะทำอะไรกับมันก็ได้ จะ Close source จะ Open หรือจะลบทิ้ง แบบที่ผมลบ source code ทิ้งไปตลอดกาล หลาย projects ก็ได้ 

ปลาดาว ไม่ต่างอะไรกับ OpenOffice.org

แต่มักมีกระแสว่า Pladao ไม่ OpenSource 

ทัศนะคติผมกับวงการ Software ไทย ตอนนั้นเปลี่ยนไปเยอะครับ ผมว่าผมเป็นคนคุยไม่รู้เรื่องแล้วนะ ....แหม่...

ผมมักจะโดนด่าตาม Board ต่างๆ จนผมตั้งคำถามกับตัวเองตลอดเวลาช่วงนั้นว่า นี่ตกลงผมทำผิดพลาดมากใช่ไม๊ ที่ลุกขึ้นมาทำ Office Thai ตัวหนึ่ง จนโดนด่าขนาดนี้ ทำแล้วก็ไม่ได้ร่ำรวยเป็นเศษฐี ยังต้องหา Project อื่นทำต่อไป ต่อสู้ดิ้นรนต่อไป วันดีคืนดีไปเปรียบเทียบกับคนอื่นใกล้กัน เขาสบายกว่าเราอีก ยิ่งทุกข์

จนต้องหันหลังให้ เพราะมันทุกข์เกินไป... บนความไม่เข้าใจ จนป่วย ทั้งกายและใจ ถึงทุกวันนี้ 

1st OpenOffice.org Developer Conference

ผมไปรวมงาน OO.o DevConf  ครั้งที่หนึ่ง ที่ University of Humburg ในฐานะ Speaker ของ Session Thai Localisation เพื่อบอกให้ developer ของ SUN ที่ Humburg ทราบว่าเราพัฒนาภาษาไทย ยังไงตรงไหน code อยู่ไหน กรุณานำไปใส่ หรือประยุกต์ใช้ใน OpenOffice.org ด้วย 

ผลที่ได้ ผมไม่ได้ดูละเอียด แต่อย่างเรื่อง Sequence checking ภาษาไทยนี่มีสามอย่างให้เลือกเหมือนที่ผมเขียนไว้ใน Spec เลยคือแบบ 

• เตือนเมื่อพิมพ์ Sequence ซ้ำ เช่น มี วรรณยุกต์แล้วพิมพ์วรรณยุกต์อีกตัว จะมีเสียงเตือน และไม่ทำอะไรต่อ
• แทนที่ เช่นมีไม้เอกแล้ว พิมพ์ไม้โท ไม้โทจะแทนที่ไม้เอก, มีสระอุ แล้วพิมพ์สระอิ สระอุจะหายไป สระอิจะแทนที่
• แบบไม่สนใจตรวจสอบ Sequence

พัฒนาต่อ

SUN ให้ทำ version 2 และ version 3 ของ ปลาดาวต่อ โดยในระหว่าง version 2 และ version 3 ผมได้มีโอกาสทำ SUN's Mad hatter ภาษาไทยด้วย
** Mad hatter เป็น Linux ของ SUN distro หนึ่ง
** Mad hatter เป็น code name ของ SUN's Java Desktop System

หันหลังให้ OpenOffice.org

ผมคิดเสนอว่า Software มันก็เหมือนเราวาดภาพลงบนผืนผ้าใบ มันต้องแน่วแน่ มันต้องมีจินตนาการ ต้องมีความเป็นเอกลักษณ์ และงดงาม 

ไม่ใช่สงคราม ไม่ใช่การต่อสู้ระหว่างใครกับใคร ถ้าจะต่อสู้ก็เป็นการต่อสู้กับตัวเอง 

ถ้ามันเป็นทุกข์ ผมจะเดินหนี 

ไม่มีเหตุผลอะไรที่จะทำให้ชีวิตเป็นทุกข์ 

แล้วมีเหตุผลอะไรที่ไปทำให้ชีวิตคนอื่นเป็นทุกข์

มีอะไรตั้งเยอะแยะที่ยังทำได้ และเป็นสุข บนโลก Software

ตกหล่นอะไร ค่อยเพิ่มเติมต่อนะครับ 

หมายเหตุ : ชื่อ ปลาดาว ออฟฟิศ อาร์ต (Bact') เป็นคนตั้ง มาจาก Star + ofFice (Fice ออกเสียง Fish) เลยเป็นปลาดาว :)

AngularJS + JSONP + Golang

เนื่องจากผมไม่ใช่คนเขียนเวปโดยธรรมชาติ ความรู้เรื่องเวปจึงน้อยมาก แต่ช่วงที่ผ่านมา เจองานที่ต้องใช้เวปในการนำเสนอข้อมูล จริงๆ คือทำ รายงานนั่นแหละ คือใช้ Crystal report ก็ได้แหละ แต่ปัญหาคือ ยิ่ง Crystal Report ยิ่งตายหยั๋งเขียด...

สุดท้ายบากหน้ามาหยุดที่ทำเวปให้ Query ข้อมูลแทน เนื่องจากโครงการที่ทำไว้นั้น server เป็น Golang RESTFul อยู่แล้ว (อ่านใน blog ก่อนหน้านี้นะครับ) เลยต่อยอดเลย

ผมเปิด port ใหม่
ไม่ใช่เรื่องอยากอะไรสำหรับ Golang ก็แค่ Go routine แต่ผมใช้  Sync ตามนี้

wg := &sync.WaitGroup{}
wg.Add(2)
go func() {
   server.StartREST()
   wg.Done()
}()
go func() {
   server.StartReport()
   wg.Done()
}()
wg.Wait()

ด้วย code ด้านบน ใน function StartREST() ก็จะไป ListenAndServe port 8080 ส่วน StartReport จะไป ListenAndServer port 8088 สำหรับ FileServer เลย

แค่นี้เราก็จะได้ server 2 ports มาใช้

ผมเลือก AngularJS มาทำ FrontEnd (ซ่า...ไม่เข้าเรื่อง) คือมันง่ายดีครับ เคยใช้ครั้งนึงตอนคิดจะทำ DropBox Clone (ตอนนั้นใช้ชื่อว่า DropBag แหะๆ เป็นงานทดลอง OpenResty + MongoDB's GridFS นะครับ) ผมเริ่ม code AngrulaJS ง่ายๆ เพื่อทดลองเรียก REST API ให้ส่ง JSON กลับมา Render พบว่า เกิดปัญหา Cross Domain Policy ขึ้น เนื่องจาก API ที่่เรียกอยู่อีก port ส่วนตัว Front-end ที่ใช้ Angular อยู่อีก port เพียงเท่านี้ก็ Cross Domain แล้วครับ ไม่ต้องถึงกับ คนละ IP

ประเด็นที่ทำให้ Blog นี้ขึ้นมา
ผมพยายามหาทางออกอยู่นาน ตอนแรกก็ย้าย Front end ไปไว้ที่ port เดียวกับ REST API ก็พบปัญหาเนื่องจาก ใช้ go-json-rest ของ Antoine แล้วต้องแก้ หลายอย่าง อีกทั้งยั้งมีพวก css, js ที่ต้องถูกเรียก load จาก browser อีกหลายไฟล์ ต้องแยกแบบเดิม แล้วใช้ JSONP

 รู้ว่า JSONP ใช้สำหรับแก้ปัญาเรื่อง CrossDomain หลายคนบอกไว้เช่นนั้น แต่ปัญหาคือ ผมไม่เคลียร์ ผมเริ่มหาข้อมูลว่า AngularJS  ใช้ JSONP ยังไง เรียก server แบบไหนยังไง สุดท้าย พบว่า มันต้อง Wrap JSON result ของเราด้วยชื่อ callback function ที่ front end ส่งไป แล้วส่งกลับมาในรูปแบบของ Javascript เช่น

http://192.168.1.1:8080/api/report.json?callback=jsonp_callback

ข้อมูลที่ส่งกลับจะต้องอยู่ในรูปแบบ

jsonp_callback([{"sequence":1,"data":"abc"},{"sequence":2,"data":"abc"}]);

ก่อนหน้านั้น REST API ของผมจะส่งข้อมูลกลับมาเป็น

[{"sequence":1,"data":"abc"},{"sequence":2,"data":"abc"}]

ทำไมต้องเป็นแบบนี้
มันคือการหลอก browser policy ว่ามันคือ javascript นะเว๊ย ไม่ใช่ data ไม่ผิด policy แล้วตัว framework ก็จะเรียกใช้ function jsonp_callback ซึ่งก็จะได้ข้อมูลที่ส่งจาก server มา

ได้ความเช่นนั้น ก็ลองค้นหาว่าพวกเรามีใครเคยเขียนๆ ไว้รึเปล่า พบว่ามี... คนถาม โดยคำตอบทั้งหมดคือ ไม่ต้องคำถาม ส่วนมากจะตอบว่าคือ JSON ซึ่งไม่ใช่

Implementation
เริ่มจาก server, Golang ใน function ที่ส่งค่า JSON กลับไปให้ Front-end ก่อนหน้าผมใช้ go-json-rest ด้วย

w.WriteJSON(&results) 

โดย results คือ array ของ struct

type result struct {
  Sequence int
  data string
}

w คือ *rest.Response

ผมเริ่มจาก Marshal results มาเป็น byte array (encoding) จากนั้น Query callback value จาก FormValue ที่ front end ส่งมา ซึ่งก็คือ callback value นั่นล่ะครับ แล้วเอามาต่อๆ กัน (concatenate) โดยทดลองแบบง่ายๆ ตามนี้

baJson, _ := json.Marshal(results)
strJson := r.Request.FormValue("callback")
strJson +=  "("
strJson += string(baJson)  // baJson เป็น byteArray
strJson += ");"
w.Header().Set("Content-Type", "application/json; charset=utf-8")
w.Write([]byte(strJson)) 

ผมลัพท์ที่ได้ จะมี callback wrap data ของเรามาในรูปแบบ javascript function

ส่วน front-end ผมหน้าตาแบบนี้ครับ เป็น AngularJS แบบง่ายๆ

index.html
<html ng-app="MyReport">
  <head>
    <script src="http://code.angularjs.org/1.2.9/angular.min.js" ng:autobind></script>
    <script src="/assets/js/myreport.js"></script>
  </head>
  <body>
    <div ng:controller="MyCtrl" id="Ctrl">
      <button ng:click="calldata()">call data</button><br/>
      <h2 ng-show="data">Data from callback</h2>
      <pre>{{data}}</pre>    
    </div>
  </body>
</html>

myreport.js
angular.module('MyReport', []);

function MyCtrl($scope, $http) {
  var url = "http://192.168.1.1:8080?callback=jsonp_callback";

  $scope.calldata= function() {
    $http.jsonp(url).then(
      function(s) { $scope.success = JSON.stringify(s); }, 
        function(e) { $scope.error = JSON.stringify(e); } 
      );
  }
}

function jsonp_callback(data) {
    var el = document.getElementById('Ctrl');
    var scope = angular.element(el).scope();
    scope.$apply(function() {
        scope.data = JSON.stringify(data);
    });
}

อธิบายได้ว่า พอ user click ที่ปุ่ม call data จะไปเรียก function $scope.calldata (อยู่ใน AngularJS controller scope MyCtrl) ก็จะไปเรียก $http.jsonp ที่เป็น method ของ AngularJS ใน url ที่เราส่งไปจะมี formvalue callback กำหนดให้ server wrap data มาในชื่อ function ที่เรากำหนด กรณีนี้ใช้ชื่อว่า jsonp_callback

เมื่อ result ถูกส่งกลับมาที่ front-end, javascript จะทำการ execute callback function jsonp_callback ซึ่งจะต้องอยู่นอก Angular's controller scope คือต้องเป็น execute global scope นั่นเอง

ปัญหาเลยเกิดต่อมาว่า แล้วจะจับ  data ส่งกับไปที่ controller scope ของ Angular ยังไง ก็เลยต้องกำหนด ID ของ ng:controller ขึ้นมา ("Ctrl") แล้ว getElementById จากนั้นก็ query scope จาก method ที่ Angular มีให้จะได้ scope แล้วทำการ $apply data เข้าไปที่ scope element ของ Angular อีกครั้ง (ดู function jsonp_callback นะครับ)

นี่คือ JSONP ซึ่งมันคนละเรื่องกับ JSON นะครับ

Web server in 3 lines with Golang

ผมเริ่มเขียน Golang ด้วยโจทย์ที่ต้องเขียน RESTFul Service สำหรับ  Enterprise mobile application เชื่อมกับ MSSQL ที่มีอยู่แล้ว บน Windows เลยเลือก Golang เพราะสะดวกในการ deploy สุด

คำถามที่ทำให้ตัดสินใจในการเลือกใช้ Golang ตอนนั้นก็คือ ใช้อะไรก็ได้ ที่พอ build แล้วส่งไปให้ support copy ไปวางบน server เรียกโปรแกรมแล้วใช้ได้เลย

Golang นี่แหละครับ ทำมาแล้ว...

พอเขียน Rest service จบ ก็เริ่มมี Requirement เพิ่มมาว่า อยากได้ report ก็วางแผนว่าจะทำเป็น Web page นี่แหละ ให้เลือกตัวเลือกที่จะทำรายงาน แล้วส่งไป query ผ่าน REST API ที่มีอยู่แล้ว ออกมาแสดงผล

ปัญหาคือจะเอาอะไรมาทำ file server?

ถ้าเลือก NGINX หรือ Apache เราคงต้องเป็นคนไปติดตั้งให้แน่ๆ Support เอาไม่อยู่

Martini
Golang web application framework ที่พึ่งเกิดและได้รับความนิยมอย่างรวดเร็จ น่าสนใจตรง Martini บอกว่า สามารถ support static file out of the box เลย คือเพิ่มไฟล์ใหม่เข้าไปปุ๊ป ก็เรียกผ่าน http ได้เลย --- น่าสนใจ ---

แต่งานที่ทำอยู่ใช้  go-rest-json ของ Antonie กับ default SQL framework ของ Go เอง แค่นี้ก็ทำงานได้ดีอยู่แล้ว และด้วยความฝักไฝ่ใน Benchmark, Go pure นี่ทิ้ง Revel ขาดเลยนะครับ แล้ว Martini ทำความเร็วสู้ Gorlilla ไม่ได้ด้วย เลยสองจิตสองใจที่จะใช้ Martini

ตัดสินใจเขียนเอง
ต้องยอมรับว่า เอาเข้าจริงๆ ที่ผ่านมาผม focus ที่ project มากจนไม่ได้ดู net/http ว่าทำอะไรได้ขนาดไหน วันนี้เลยไล่ดูหน่อยพบว่า

จริงๆ แล้ว net/http นี่มันสมบูรณ์แบบนะครับ ที่ว่ากันว่า ไม่ต้องใช้ external framework นี่เรื่องจริง

เลยลองเขียน static file server ออกมาดูได้ตามนี้

package main
import "net/http"
func main()  { http.ListenAndServe(":8080", http.FileServer(http.Dir("/Users/McDuck/Home"))) }