W tym warsztacie zajmiemy się stworzeniem prostych komponentów opartych o IPB. W ostatniej lekcji dowiedzieliśmy się jak wyświetlić awatar użytkownika oraz jak pobrać tablicę z danymi o użytkowniku. Wykorzystamy te dane do stworzenia prostego "bloku" użytkownika.
Żeby nasz warsztatowy kod ładnie wyglądał wypada użyć jakiegoś prostego ładnego szablonu. Może to być już jeden z wcześniej przerabianych lub też jakiś nowy, ja wybrałem szablon "TimeToRest" do pobrania
stąd
Szablon dodałem do CI jako widok (poprawki ścieżek do CSS i grafik) i moja strona zaczęła wyglądać tak:

Usunąłem przykładowy tekst z szablonu/widoku index.php i dodałem wyświetlanie zmiennej
$content:
<!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>Artykuły z IPB</title>
<link rel="stylesheet" href="<?PHP echo base_url(); ?>system/application/views/style.css" type="text/css" />
</head>
<body>
<div id="wrap">
<div id="header"><img src="<?PHP echo base_url(); ?>system/application/views/images/header.jpg" width="768" height="120" alt="Time To Rest" /></div>
<div id="navigation">
<ul>
<li><a href="<?PHP echo base_url(); ?>">Strona Główna</a></li>
</ul>
</div>
<div id="content">
<?PHP echo $content; ?>
</div>
<div id="footer">| <a href="<?PHP echo base_url(); ?>">Strona Główna</a> | Designed by <a href="http://www.four-closure.com/">Donny Burnside</a> |</div>
</div>
</body>
</html>
A widok
main przerobiłem na:
error_reporting(E_ALL ^ E_NOTICE);
class Main extends Controller
{
function Main()
{
parent::Controller();
$this->response = array();
$this->load->script('ipbsdk_class.inc');
$this->sdk = new IPBSDK();
}
function index()
{
$this->response['content'] = $this->sdk->get_avatar();
$this->load->view('index', $this->response);
}
}
Co dało efekt:

Awatar pokaże się jeżeli mamy takowy ustawiony. Jeżeli nie to nic nie zostanie wyświetlone. Teraz wypada dodać dodatkowe dane za pomocą metody
get_advinfo (
) - dającej więcej danych niż get_info :) Tworzymy widok
profil.php:
<div style="float: right; width:300px; border: 1px dashed gray; padding:5px; margin-left:8px; font-size:11px;">
<b>Witaj <?PHP echo $name; ?></b>
<center><?PHP echo $avatar; ?></center>
<B>Postów</B>: <?PHP echo $posts; ?><BR>
<B>Data Dołączenia:</B>: <?PHP echo date("Y-m-d", $joined); ?><BR>
<B>Ostatni Post:</B>: <?PHP echo date("Y-m-d", $last_post); ?>
</div>
A widok zmieniamy do postaci:
error_reporting(E_ALL ^ E_NOTICE);
class Main extends Controller
{
function Main()
{
parent::Controller();
$this->response = array();
$this->load->script('ipbsdk_class.inc');
$this->sdk = new IPBSDK();
}
function index()
{
$user = $this->sdk->get_advinfo();
$user['avatar'] = $this->sdk->get_avatar();
$this->response['content'] = $this->load->view('profil', $user, True);
$this->response['content'] .= '<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>';
$this->load->view('index', $this->response);
}
}
Tablicę zwróconą przez
get_advinfo przypisujemy do zmiennej
$user a następnie dodajemy dane awatara. Tablicę
$user przekazujemy do widoku
profil a wynik do szablonu głównego. Wynik:

Małe wyjaśnienie odnośnie stylu zawartego w DIVie widoku
profil. Mamy tam:
float: right co oznacza iż zawartość DIVa ma być ustawiona po prawej stronie i "omywana" przez zewnętrzny tekst.
Teraz trzeba zapełnić treścią resztę strony. Wyobraź sobie moduł artykułów - Treść tematu (pierwszego jego posta) to treść artykułu a kolejne posty to jego komentarze. Przeglądając dokumentację SDK znajdziemy pod
Topics dwie ciekawe dla nas metody:
get_topic_info - zwraca tablicę z danymi o określonym poprzez numer ID temacie,
list_topic_posts - listuje posty tematu... Dodatkowo pod zakładką
Forum znajdziemy
list_forum_topics - listujące tematy z forum. Szczegóły po kolei.
Tworzymy widok
art_loop.php
<?PHP
foreach($arts as $val)
{
echo '<a href="'.site_url('main/show/'.$val['tid']).'"><B>'.$val['title'].'</B></a> - '.$val['description'].' <B>Autor</B>: '.$val['starter_name'].'<BR>';
}
?><BR><BR><BR><BR>
A kontroler modyfikujemy:
error_reporting(E_ALL ^ E_NOTICE);
class Main extends Controller
{
function Main()
{
parent::Controller();
$this->response = array();
$this->load->script('ipbsdk_class.inc');
$this->sdk = new IPBSDK();
}
function index()
{
$user = $this->sdk->get_advinfo();
$user['avatar'] = $this->sdk->get_avatar();
$this->response['content'] = $this->load->view('profil', $user, True);
$arts = $this->sdk->list_forum_topics(2);
$this->response['content'] .= $this->load->view('art_loop', array('arts' => $arts), True);
$this->load->view('index', $this->response);
}
}
W kodzie pojawia się:
$arts = $this->sdk->list_forum_topics(2);
Metoda
list_forum_topics pobiera tablicę złożoną z tablic zawierającą informacje o tematach z forum o podanym numerze ID. Tablicę tą przekazujemy do widoku i tam wyświetlamy.
'.site_url('main/show/'.$val['tid']).'
Załóżmy że main/show/ID będzie linkiem pokazujący dany artykuł. Stąd ten link w widoku. Wynik naszej pracy wygląda mniejwięcej tak:

Notka: w ustawieniach forum ustawia się kodowanie. Należy wybrać utf-8 lub jeżeli mamy problemy - iso-8859-2 (wtedy wypada zmienić kodowanie w naszym głównym widoku na iso).
Tworzymy w kontrolerze
Main metodę
show odpowiedzialną za pokazanie "artykułu":
function show()
{
$id = $this->uri->segment(3);
IF(isset($id) and is_numeric($id))
{
$ar = $this->sdk->get_topic_info($id);
$this->response['content'] = $this->load->view('art', $ar, True);
$this->load->view('index', $this->response);
}
}
get_topic_info zwraca tablicę z danymi o temacie określonym numerem ID. U nas ten numer pochodzi z linka. Tablicę z danymi przekazujemy do widoku
art:
<?PHP echo $title; ?>
<b><?PHP echo $description; ?></b><BR><BR>
<?PHP echo $post; ?>
<HR>
<B>Komentarzy</B>: <?PHP echo $posts; ?> | <B>Odsłon</B>: <?PHP echo $views; ?>
Temat na forum:

I na naszej stronie:

I w taki oto prosty sposób zrobiliśmy prostą stronę korzystającą z elementów IPB. W kolejnym warsztacie zajmiemy się komentarzami, dodamy kilka "usprawnień" do bloku użytkownika oraz obmyślimy koncepcje innych komponentów opartych o IPB SDK.