Javscript dependencies in composite view

Not for 'how-to' coding questions but PHP theory instead, this forum is here for those of us who wish to learn about design aspects of programming with PHP.

Moderator: General Moderators

Post Reply
User avatar
inghamn
Forum Contributor
Posts: 174
Joined: Mon Apr 16, 2007 10:33 am
Location: Bloomington, IN, USA

Javscript dependencies in composite view

Post by inghamn »

How do you ya'll deal with Javascript and CSS dependencies in composite views?

I've recently started incorporating Yahoo's YUI library into my applications. (I really like their library, BTW, it fits very well with my style of applications.) Now I'm starting to try to figure out how best to deal with all the dependencies their various components require.

Various YUI components usually require a few other javascript files and a few CSS files. Have ya'll run into wanting your view partials to add styles and javascript to the surrounding template?

For my part, my problem stems from using composition to assemble the view partials inside a Template. A typical controller for me looks like:

Code: Select all

 
$template = new Template();
$template->title = 'Dashboard';
 
$pastDue = new TaskList(array('status'=>'Past Due'));
$template->blocks[] = new Block('tasks/taskTable.inc',array('taskList'=>$pastDue,'title'=>'Past Due'));
 
$range = array('start'=>time(),'end'=>strtotime('+30 day'));
$thisMonth = new TaskList(array('dueDate'=>$range));
$template->blocks[] = new Block('tasks/taskTable.inc',array('taskList'=>$thisMonth,'title'=>'Next 30 Days'));
 
echo $template->render();
 
The taskTable block looks like:

Code: Select all

 
<div class="interfaceBox">
    <?php echo $title; ?>
    <table>
    <tr>
        <th>Task</th>
        <th>Status</th>
        <th>Due</th>
    </tr>
    <?php
        foreach($this->taskList as $task)
        {
            $name = View::escape($task->getName());
            echo "
            <tr>
                <td><a href=\"{$task->getURL()}\">$name</a></td>
                <td>{$task->getStatus()}</td>
                <td>{$task->getDueDate('n/j/Y')}</td>
            </tr>
            ";
        }
    ?>
    </table>
</div>
 
Where I'm reusing the same Block (view partial), but with different data. In order to inject any extra, required javascript into the template it looks like I either have to:
* Do it in the controller
* or somehow find some way to allow the Blocks to reference the template

I'm not crazy about doing stuff like

Code: Select all

 
$template = new Template();
$template->appendScript('/js/yui/build/utilities/utilities.js');
$pastDue = new TaskList(array('status'=>'Past Due'));
$template->blocks[] = new Block('tasks/taskTable.inc',array('taskList'=>$pastDue,'title'=>'Past Due'));
echo $template->render();
 
That seems like the controller would need to know about any JavaScript requirements of the view ahead of time. Not very fun for adding fancy AJAX stuff to the view down the road. But I can't seem to wrap my head around a way to reference the Template object from inside a Block.
alex.barylski
DevNet Evangelist
Posts: 6267
Joined: Tue Dec 21, 2004 5:00 pm
Location: Winnipeg

Re: Javscript dependencies in composite view

Post by alex.barylski »

Two solutions:

1. Include the dependecies inline with your HTML code -- I don't think <link> is valid XHTML so if that is important to you won't work
2. Include the JS dependencies and using inline JS immediately after update the DOM and include the CSS that way

Of course there are other techniques but those are really dependent upon your architecture...
User avatar
Christopher
Site Administrator
Posts: 13596
Joined: Wed Aug 25, 2004 7:54 pm
Location: New York, NY, US

Re: Javscript dependencies in composite view

Post by Christopher »

I like to use a Response object. That way I can set headers or add scripts/styles as needed in any View. I put layout code and then the final response to the browser outside the Controllers and after they have run. That way the Views/partials can provide information to the layout and Response -- they sort everything out at the end.
(#10850)
User avatar
inghamn
Forum Contributor
Posts: 174
Joined: Mon Apr 16, 2007 10:33 am
Location: Bloomington, IN, USA

Re: Javscript dependencies in composite view

Post by inghamn »

Much obliged.

I guess it's finally time to try and split my Template class into seperate Layout and Resonse classes. Whee!
Post Reply