Posts tagged with 'javascript'

Zend Framework bindings for Frontal

Having thought further about Frontal, Carl's JS library, I wrote a quick View Helper to make it easier to use it in Zend Framework projects.

It's available to download on Dropbox, it's available under the MIT licence. I'll bung it up on somewhere like GitHub once I work out how Git works.

Basic usage

Before you do anything you'll need to register the helpers in your application.ini:

Frontal - a new approach to triggering Javascript behaviour

My friend Carl has just released a really interesting Javascript library called Frontal. I've had a night to sleep on it and thought I'd share my thoughts.

The key problem Frontal addresses is 'some Javascript needs to be run only on some pages'. There are a few different approaches to this:

Per-page scripts

The first approach is to have lots of Javascripts that only apply for the current page, and insert them in the HEAD of the document:

Clarifying Javascript-PHP communication using JSON-RPC


( ! ) Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: htmlParseStartTag: invalid element name in Entity, line: 1 in /var/www/ciaranmcnulty.com/application/models/Post.php on line 25
Call Stack
#TimeMemoryFunctionLocation
10.000366704{main}( )../index.php:0
20.03902985264Zend_Controller_Front->dispatch( )../index.php:47
30.04533466864Zend_Controller_Dispatcher_Standard->dispatch( )../Front.php:946
40.33888156584Zend_Controller_Action->dispatch( )../Standard.php:293
50.33898156720BlogController->tagAction( )../Action.php:502
60.35048168136Zend_Controller_Action->render( )../BlogController.php:204
70.35058168136Zend_Controller_Action_Helper_ViewRenderer->render( )../Action.php:207
80.35118168136Zend_Controller_Action_Helper_ViewRenderer->renderScript( )../ViewRenderer.php:942
90.35118168136Zend_View_Abstract->render( )../ViewRenderer.php:921
100.35128209404Zend_View->_run( )../Abstract.php:787
110.35148225568include( '/var/www/ciaranmcnulty.com/application/views/scripts/blog/list.phtml' )../View.php:107
120.36728250732Post->getSummary( )../list.phtml:13
130.36728250732DOMDocument->loadHTML( )../Post.php:25

( ! ) Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: Unexpected end tag : pre in Entity, line: 58 in /var/www/ciaranmcnulty.com/application/models/Post.php on line 25
Call Stack
#TimeMemoryFunctionLocation
10.000366704{main}( )../index.php:0
20.03902985264Zend_Controller_Front->dispatch( )../index.php:47
30.04533466864Zend_Controller_Dispatcher_Standard->dispatch( )../Front.php:946
40.33888156584Zend_Controller_Action->dispatch( )../Standard.php:293
50.33898156720BlogController->tagAction( )../Action.php:502
60.35048168136Zend_Controller_Action->render( )../BlogController.php:204
70.35058168136Zend_Controller_Action_Helper_ViewRenderer->render( )../Action.php:207
80.35118168136Zend_Controller_Action_Helper_ViewRenderer->renderScript( )../ViewRenderer.php:942
90.35118168136Zend_View_Abstract->render( )../ViewRenderer.php:921
100.35128209404Zend_View->_run( )../Abstract.php:787
110.35148225568include( '/var/www/ciaranmcnulty.com/application/views/scripts/blog/list.phtml' )../View.php:107
120.36728250732Post->getSummary( )../list.phtml:13
130.36728250732DOMDocument->loadHTML( )../Post.php:25

( ! ) Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: htmlParseStartTag: invalid element name in Entity, line: 86 in /var/www/ciaranmcnulty.com/application/models/Post.php on line 25
Call Stack
#TimeMemoryFunctionLocation
10.000366704{main}( )../index.php:0
20.03902985264Zend_Controller_Front->dispatch( )../index.php:47
30.04533466864Zend_Controller_Dispatcher_Standard->dispatch( )../Front.php:946
40.33888156584Zend_Controller_Action->dispatch( )../Standard.php:293
50.33898156720BlogController->tagAction( )../Action.php:502
60.35048168136Zend_Controller_Action->render( )../BlogController.php:204
70.35058168136Zend_Controller_Action_Helper_ViewRenderer->render( )../Action.php:207
80.35118168136Zend_Controller_Action_Helper_ViewRenderer->renderScript( )../ViewRenderer.php:942
90.35118168136Zend_View_Abstract->render( )../ViewRenderer.php:921
100.35128209404Zend_View->_run( )../Abstract.php:787
110.35148225568include( '/var/www/ciaranmcnulty.com/application/views/scripts/blog/list.phtml' )../View.php:107
120.36728250732Post->getSummary( )../list.phtml:13
130.36728250732DOMDocument->loadHTML( )../Post.php:25

I think of myself first and foremost as a PHP developer but serious sites are getting more and more JS-heavy as time goes on so it gets harder (and less pragmatic) to try and avoid dealing with JSPHP communication of some sort.

I'm a big advocate of RESTful design so tend to end up attempting to write scripts that do lots of GETs and POSTs (as appropriate) and parsing out whatever custom response format I've decided JSON requests will return. It feels good - like I'm sticking to my principles and 'doing it right' but it's a long painful slog that can feel like self-flagellation at times.

It's also slow and hard to prototype - it's hard to argue in favour of some abstract design idea when it's making you take forever to generate simple tasks . Sometimes when I feel lazy what I really want is a way of calling my PHP objects directly from the JS and not worrying about what's happening in the underlying HTTP, and that's what JSON-RPC provides.

In this blog I'll be showing some simple examples of JSON-RPC in action but first let's look at the pros and cons.

Keeping your Javascript clean

I've been doing a bit more Javascript recently, specifically using Prototype AJAX stuff with Google Maps ,and I've come up with a few guiding principles that have helped me keep stuff neat and tidy. I thought I'd share them with you, my handful of readers.

SCRIPT tags should live inside HEAD

There are very few reasons for having SCRIPT tags inside the document body. The main one, use of document.write() nearly always leads to ugly code. It's also not actually allowed in XHTML, despite most browsers accepting it as long as the page is delivered as text/html.

Furthermore, SCRIPT in the document body is in my opinion always the result of a perceived problem that's actually the result of poor architectural choices.