[ตอนที่ 3] เวิร์คช้อปการสร้างเว็บไซต์อย่างง่ายด้วยคชสาร

1. อันดับแรก เราจะต้องสร้างไฟล์ HTML ลงใน Template ก่อน โดยสร้างไฟล์ skin/default/home.html สำหรับหน้า Home และ skin/default/about.html เสร็จแล้วใส่เนื่อหาที่ต้องการลงในนั้น (ดูโค้ดได้ที่ไฟล์ตัวอย่างที่ดาวน์โหลดนะครับ)
2. เสร็จแล้วเราจะทำการสร้าง View เพื่อแสดงหน้าที่สร้างไว้
   

   namespace Index\Home;
   	
   	class View extends \Kotchasan\View
   	{
   	
   	  public function render()
   	  {
   	    // โหลด template หน้า home.html มาส่งให้ Controller (ไม่ต้องระบุ .html)
   	    return \Kotchasan\Template::load('', '', 'home');
   	  }
   	
   	  // คืนค่าข้อความบนไตเติลบาร์เมื่อแสดงหน้านี้ ไปยัง Controller
   	  public function title()
   	  {
   	    return 'Home Page';
   	  }
   	}

   
   ผมยกตัวอย่างหน้า home (Index\Home\View) เพียงหน้าเดียวนะครับ ซึ่งหน้านี้จะทำหน้าที่หลักในการโหลด home.html มาเท่านั้น (หน้า about ดูในไฟล์ตัวอย่าง)
   
   แถมให้อีกอันผมได้สร้าง Index\Pagenotfound\View ไว้ด้วย ซึ่งหน้านี้ผมจะใช้แสดงเมื่อมีการระบุค่า module มาไม่ถูกต้องหรือไม่มีอยู่จริง
   

   namespace Index\Pagenotfound;
   	
   	class View extends \Kotchasan\View
   	{
   	
   	  public function render()
   	  {
   	    return '<div class=error>ขออภัย ไม่พบหน้าที่เรียก</div>';
   	  }
   	
   	  public function title()
   	  {
   	    return '404 Page not found!';
   	  }
   	}

   
   สังเกตุนะครับว่าไฟล์นี้ไม่ได้โหลดจาก template แต่ใช้วิธีส่งออก HTML เลย
    
3. ขั้นตอนต่อไปเราจะทำการแก้ไข Index\Index\Controller ตามนี้
   

   namespace Index\Index;
   	
   	use \Kotchasan\Http\Request;
   	use \Kotchasan\Template;
   	
   	class Controller extends \Kotchasan\Controller
   	{
   	
   	  public function index(Request $request)
   	  {
   	    // รับค่าจาก $_GET['module'] ถ้าไม่มีการส่งค่ามาจะคืนค่า home โดยคืนค่าเป็น string ที่ตัวแปร module
   	    // method filter() กำหนดให้รับค่าเฉพาะตัวอักษรที่กำหนดเท่านั้น
   	    $module = $request->get('module', 'home')->filter('a-z');
   	    // กำหนดค่า template ที่ใช้งานอยู่
   	    Template::init('skin/'.self::$cfg->skin);
   	    // ตรวจสอบว่ามี View ของหน้าที่เรียกหรือไม่
   	    // เช่น Index\Home\View สำหรับหน้า home
   	    // ถ้าไม่พบหน้าที่เรียกจะคืนค่า Index\Pagenotfound\View
   	    $class = 'Index\'.ucfirst($module).'\View';
   	    if (method_exists($class, 'render')) {
   	      // โหลดหน้าที่เรียก
   	      $content = createClass($class);
   	    } else {
   	      // โหลดหน้า Pagenotfound เมื่อไม่พบหน้าที่เรียก
   	      $content = createClass('Index\Pagenotfound\View');
   	    }
   	    // เริ่มต้นใช้งาน View
   	    $view = new \Kotchasan\View;
   	    // ใส่เนื้อหาลงใน View ตามที่กำหนดใน Template
   	    // ตาม method ของ View
   	    $view->setContents(array(
   	      // ข้อความจาก View แสดงบน title bar
   	      '/{TITLE}/' => $content->title(),
   	      // เนื้อหาหน้า View ที่เรียกใช้งาน
   	      '/{CONTENT}/' => $content->render(),
   	    ));
   	    // โหลด GCSS ลงใน template
   	    $view->addCSS(WEB_URL.'skin/gcss.css');
   	    // โหลด template หลัก (index.html)
   	    $template = Template::load('', '', 'index');
   	    // ส่งออก HTML
   	    echo $view->renderHTML($template);
   	  }
   	}

   
   คำอธิบายอยู่ในโค้ดเลยครับ นอกจากนี้ตัวอย่างนี้ยังมีการเรียกใช้ GCSS ซึ่งเป็น CSS Framework หลักของคชสารอีกด้วย

$view->addCSS(WEB_URL.'skin/gcss.css');

• ไฟล์ GCSS อยู่ที่ skin/gcss.css
• WEB_URL เป็นตัวแปร Global ของคชสารเก็บค่า URL รวม path ของเว็บไซต์