Zend_Dojo: first steps

Zend_Dojo

Zend_Dojo tool imposed on us by the authors of the framework. So let's try, if so please...


Start with vile — tease the result of work done:

Zend_Dojo_Form

Look attractive. Play this creation is not so difficult, even if Your knowledge of Dojo/Dijit leave much to be desired — You will understand without much difficulty (though it is better still to gaze in the direction of manuals — "the Dojo for beginners" ;) ).

For a start — initialization — lead a slice of the file Bootstrap.php in which we connect helpers with Dojo:

<?php
class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
protected function _initView()
{
$view = new Implementation();
$view->addHelperPath('Zend/Dojo/View/Helper/', 'Zend_Dojo_View_Helper');
// or
Zend_Dojo::enableView($view);
return $view;
}
}


The second stage is to connect the Dojo library. These things happiness to be connected in the tag <head> of Your HTML document. It will be enough to slightly change "layout.a phtml (or index.phtml" if You don't use layout's):
<?php echo $this->doctype() ?>
<html>
<head>
<title>Dojo Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<?php
// My own stylesheet
echo $this->headLink()->setStylesheet('/css/my.css');
// Check if dojo library is needed
if ($this->dojo()->isEnabled()):
// Include the dojo library
$this->dojo()->setLocalPath('/js/dojo/dojo.js')
// Use dojo tundra theme
->addStyleSheetModule('dijit.themes.tundra');
// Echo out the dojo <script> tags
echo $this->dojo();
endif; ?>
</head>
<!-- Set body class to "tundra" (requeried) -->
<body class="tundra">
<?php echo $this->layout()->content ?>
</body>
</html>


Now our application is ready to use Dojo. Go to the view scripts — the first line in the file "index.phtml" is the inclusion of Dojo:

If you do not, Dojo is not connected in the layout file.phtml.

Everything is ready, you can start — create a TabContainer — it will use the appropriate ViewHelper:

echo $this->tabContainer($id, $content, $params, $attribs);


Like a normal helper, but we still need to call the methods captureStart() and captureEnd()to enter data:

<?php
$this->dojo()->enable();
// Container with tabs
$this->tabContainer()->captureStart('tab1', array(), array('style' => 'width:800px;height:500px;'));
// Our content
echo $this->tabContainer()->captureEnd('tab1');


Thus we add the content into the container. This way you add bookmarks to our container:

<?php
$this->dojo()->enable();

// Container with tabs
$this->tabContainer()->captureStart('tab1', array(), array('style' => 'width:800px;height:500px;'));

// Tab "Dates"
$this->the contentPane()->captureStart('pane1', array(), array('title' => 'Dates'));
echo $this->form1;
echo $this->the contentPane()->captureEnd('pane1');

// Tab "FAQ"
$this->the contentPane()->captureStart('pane2', array(), array('title' => 'FAQ'));
?>
<h1>FAQ</h1>
<dl><dt>Question 1?</dt><dd>This is my answer 1!</dd></dl>
<dl><dt>Question 2?</dt><dd>Good question, next one.</dd></dl>
<?php
echo $this->the contentPane()->captureEnd('pane2');

// Tab "Closable" (in the settings set closable = true)
$this->the contentPane()->captureStart('pane3', array(), array('title' => 'Closable', 'closable' => true));
echo 'You can close me!';
echo $this->the contentPane()->captureEnd('pane3');

// Tab "Splitted" with delimiter
$this->the contentPane()->captureStart('pane4', array(), array('title' => 'Splitted'));
$this->splitContainer()->captureStart('changes from split1', array(), array('style' => 'width:250px;height:250px;'));
$this->the contentPane()->captureStart('splitpane1', array(), array());
echo 'Hey, I am on the left side!';
echo $this->the contentPane()->captureEnd('splitpane1');
$this->the contentPane()->captureStart('splitpane2', array(), array());
echo 'Cool!';
echo $this->the contentPane()->captureEnd('splitpane2');
echo $this->splitContainer()->captureEnd('changes from split1');
echo $this->the contentPane()->captureEnd('pane4');
// Tab "Editor" with WYSIWYG editor
$this->the contentPane()->captureStart('pane5', array(), array('title' => 'Editor'));
echo $this->editor('foo');
echo $this->the contentPane()->captureEnd('pane5');
echo $this->tabContainer()->captureEnd('tab1');


As you can see, each tab in our container is new ContentPane. the ContentPane can be used in any container (except AccordionContainer). More information can be found in documentation on ZF.

In the first tab displaying a form that is an object of type Zend_Dojo_Form (see listing IndexController/IndexAction):

public function indexAction()
{
$form1 = new Zend_Dojo_Form();
$form1->setMethod('post')->setAction("/");
$form1->addElement('DateTextBox', 'date1', array(
'label' => 'Choose a date:',
'datePattern' => 'yyyy-MM-dd',
'validators' => array('Date'),
'required' => true
))
->addElement('TimeTextBox', 'time1', array(
'label' => 'Choose a time',
'timePattern' => 'HH:mm:ss',
))
->addElement('NumberSpinner', 'number1', array(
'label' => 'Choose a number:',
'value' => 0,
'smallDelta' => 1,
'min' => 0,
'max' => 30,
'defaultTimeout' => 100,
'timeoutChangeRate' => 100,
->addElement('HorizontalSlider', 'slide1', array(
'label' => 'Let\'s slide:',
'minimum' => 0,
'max' => 25,
'discreteValues' => 10,
'style' => 'width: 450px;',
'topDecorationDijit' => 'HorizontalRuleLabels',
'topDecorationLabels' => array('0%', '50%', '100%'),
'topDecorationParams' => array('style' => 'padding-bottom: 20px;'),
))
->addElement('SubmitButton', 'submit', array(
'label' => 'Submit!'
));

$this->view->form1 = $form1;
}


So easy using Dojo'vskih widgets (Dijits) you can create forms. The process is almost identical to working with Zend_Form, you can see only a small difference in the naming of elements (e.g. "SubmitButton" and "submit"), and options to customize a little more.

This is only the first step in learning Zend_Dojo if you want to know more — stay tuned ;)

This article is only a loose translation of "My Very First Steps with Zend_Dojo"
Article based on information from habrahabr.ru

Комментарии

Отправить комментарий

Популярные сообщения из этого блога

Monitoring PostgreSQL + php-fpm + nginx + disk using Zabbix

Изображение
a Lot of information in the network according to Zabbix, and a lot of bespoke templates, I want to introduce to the audience his modification. Zabbix is a very convenient and flexible monitoring tool. Want a hundred monitor, I want a thousand stations, and do not want to — watch a single server, take the cream in all sections. I would not mind to give to github, if anyone collects similar. It so happened that we decided to put on the hosting database wrapper php-fpm+nginx. As the database is postgres. Thoughts to collect data on the machine was before the purchase of hosting is needed, this is useful! Magic kick up the backside to the implementation of the system gave the brakes a hard drive on our VDS stations at the beginning of the script every minute, put the time and measured by the speed in the file, and then build graphs in Excel to compare to as it was/became, take quantitative statistics. And this is just one option! And suddenly the fault is not VDS, and our a
Далее...

Templates ESKD and GOST 7.32 for Lyx 1.6.x

Изображение
for more than six months I use a word processor Lyx. Built-in templates is more than enough to write lecture notes, prepare for seminars and to do simple reports for laboratory work. But last semester I had to make two course of the project in accordance with the requirements ESKD. I have begun work in Lyx, but without special templates of documents, my reports in the editor looked like this: A little work, a little reading of the document "Customizing LyX: Features for the Advanced User" and it turned out where the beam: You can use immediately. If you have experience of working in Lyx, problems will not arise. Just in case the attached sample documents. Description of how to make such templates are not yet doing. Someone will ask — will tell. ESKD Screenshot menu select unit type: Group "sections and subsections" appeared due to the fact that the document can be sections with sections without subsections — for their handling of para
Далее...

Customize your Google

Изображение
After writing this post, I was interested in the search parameters which you can use for convenient operation. Given this issue, in Runet I'm more or less full information is not found. But! It turns out Google for a long time and for all shown . Let's start simple — www.google.com/search?q=Запрос this is the simplest query, in which all options are disabled or parameters are used which are stored in your cookies. Next I will talk about the most interesting and used parameters. If you want to know more, you here . Even though it is called the search parameter, I will use the word token. So any of the marks are for the test, insert the end of the line (if your line is of the same kind as just above). Marker search by country &cr=countryRU Putting this token, we get the results from the specified country. List of acronyms used. Example Asus Finland UPDATE (thanks to Soutlan noticed the error) Token language results &lr
Далее...