วิธีใช้ class Template ตอนที่ 3 block (ขั้นสูง)


ตอนนี้ได้อะไรบ้าง

  • นำข้อมูลใน block จากคนละ template มาใช้งาน
  • เปลี่ยนข้อความกำหนด block แทนคำว่า SiXhEaD
  • sub block

sub block คืออะไร
sub block เป็นส่วนย่อยภายใน block เหมาะสำหรับ layout ที่แตกต่างกัน เช่นบาง sub block มี 1 รูป บาง sub block มี 2 รูป หรือมี background คนละสี

หมายเหตุ
– ในการใช้งานจริงการรวมหรือแยก template ควรคำนึงถึงความเหมาะสมด้วย ไม่ควรแยกมากจนเกินไป ยิ่งเยอะจะกลายเป็นการ open file เกินความจำเป็น
– อยากใช้ข้อความกำหนด block แทนคำว่า SiXhEaD ก็ยังได้ ให้สังเกตุ parameter ที่ 2
$tp_item = new Template(‘_tp_item.html’, ‘Thailand’);

ผลการทำงาน 1 ($member == 1)
ผลการทำงาน 2 ($member == 0)

_tp_item.html

<!--Thailand:message-member-0-->
<div class="alert alert-danger">$ip ไม่สามารถใช้งานได้</div>
<!--/Thailand:message-member-0-->

<!--Thailand:message-member-1-->
<div class="alert alert-info">ยินดีต้อนรับ $username</div>
<!--/Thailand:message-member-1-->

<!--Thailand:items1-->
$item1_title
<ul class="list-group">
    <!--Thailand:item1-->
    <li class="list-group-item">$no</li>
    <!--/Thailand:item1-->
</ul>
<!--/Thailand:items1-->

<!--Thailand:item2-->
<div class="alert alert-$css">$css_uc</div>
<!--/Thailand:item2-->

<!--Thailand:items3-->
$item3_title
<div class="row">
<!--Thailand:item3-->
<!--sub:1--><div class="col-md-4"><div class="alert alert-success">$no</div></div>
<!--/sub:1-->
<!--sub:2--><div class="col-md-4"><div class="alert alert-warning">$no</div></div>
<!--/sub:2-->
<!--sub:3--><div class="col-md-4"><div class="alert alert-danger">$no</div></div>
<!--/sub:3-->
<!--/Thailand:item3-->
</div>
<!--/Thailand:items3-->

_tp_block-advance.html

<!DOCTYPE html>
<html>
<head>
<title>$title</title>
<link rel="stylesheet" href="module/bootstrap/bootstrap.min.css">
</head>
<body>

<div class="container">
    <h3>$title</h3>
    $raw
    $message
    $item1
    $item2_title
    $item2
    $item3
    $item4_title
    <div class="row">
    <!--SiXhEaD:item4-->
    <!--sub:1--><div class="col-md-4"><div class="alert alert-success">$no</div></div>
    <!--/sub:1-->
    <!--sub:2--><div class="col-md-4"><div class="alert alert-warning">$no</div></div>
    <!--/sub:2-->
    <!--sub:3--><div class="col-md-4"><div class="alert alert-danger">$no</div></div>
    <!--/sub:3-->
    <!--/SiXhEaD:item4-->
    </div>
</div>

<script src="module/jquery/jquery.min.js"></script>
<script src="module/bootstrap/bootstrap.min.js"></script>
</body>
</html>

block-advance.php

<?php
require 'module/SiXhEaD.Template.php';

$member = (int) $_GET['member'];

$tp = new Template('_tp_block-advance.html');
$tp_item = new Template('_tp_item.html', 'Thailand');

$title = 'วิธีใช้งาน block (ขั้นสูง)';

if ($member == 1) {
    $username = 'admin';
    $raw = $tp_item->blockHtml('message-member-1');
    $message = $tp_item->applyBlock('message-member-1');

    // loop วิธีที่ 1
    $item1_title = 'หัวข้อ 1';
    $tp_item->block('item1');
    for ($no = 1; $no < 4; $no++) {
        $tp_item->apply();
    }
    $item1 = $tp_item->generate();
    $tp_item->clear('item1'); // จำเป็นหากเรียกจาก template อื่น

    // loop วิธีที่ 2
    $item2_title = 'หัวข้อ 2';
    $styles = ['success', 'info', 'warning', 'danger'];
    foreach ($styles as $key => $css) {
        $css_uc = ucfirst($css);
        $item2 .= $tp_item->applyBlock('item2');
    }
} else {
    $ip = $_SERVER['REMOTE_ADDR'];
    $raw = $tp_item->blockHtml('message-member-0');
    $message = $tp_item->applyBlock('message-member-0');
}

$item3_title = 'หัวข้อ 3';
$tp_item->block('item3');
$tp_item->sub(3);
for ($no = 1; $no < 9; $no++) {
    $tp_item->apply();
}
$item3 = $tp_item->generate();
$tp_item->clear('item3'); // จำเป็นหากเรียกจาก template อื่น

$item4_title = 'หัวข้อ 4';
$tp->block('item4');
$tp->sub(3);
for ($no = 1; $no < 9; $no++) {
    $tp->apply();
}

$tp->display();
exit;