[ZF 1.7.2] Dojo not hooking itself when using captureStart()/captureEnd()

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

[ZF 1.7.2] Dojo not hooking itself when using captureStart()/captureEnd()

Aspra Flavius Adrian
Hi. It seems that dojo does not hook itself via the addOnLoad function
when used in a view script such as:

$this->borderContainer()->captureStart('masterLayout',
                                       array('design' => 'headline'),
                                       array('style' => 'border: 1px
solid black'));

echo $this->contentPane(
    'menuPane',
    'This is the menu pane',
    array('region' => 'top'),
    array('style' => 'background-color: darkblue;')
);

echo $this->contentPane(
    'navPane',
    'This is the navigation pane',
    array('region' => 'left'),
    array('style' => 'width: 200px; background-color: lightblue;')
);
echo $this->contentPane(
    'mainPane',
    'This is the main content pane area',
    array('region' => 'center'),
    array('style' => 'background-color: white;')
);
echo $this->contentPane(
    'statusPane',
    'Status area',
    array('region' => 'bottom'),
    array('style' => 'background-color: lightgray;')
);

echo $this->borderContainer()->captureEnd('masterLayout');
 - code from the official manual

However, it does if I add an editor widget for example, or if I don't
use captureStart/captureEnd at all, and only create an editor widget.
What may I be missing?
Dojo is set up in a FC plugin's routeStartup() like this:
public function initView($doLayout = TRUE) {
                $view = new Zend_View;
                //TODO: add helper path
                Zend_Dojo::enableView($view);
                Zend_Dojo_View_Helper_Dojo::setUseDeclarative();
                //Zend_Dojo_View_Helper_Dojo::setUseProgrammatic(TRUE);
               
                $view->baseUrl = rtrim($this->getRequest()->getBaseUrl(),'/');
                $view->doctype($this->config->docType);
                $view->headTitle()->setSeparator($this->config->titleSeparator)
                        ->append($this->config->siteName);
                $view->headMeta()->appendHttpEquiv('Content-Type','text/html; charset=utf-8');
               
                $view->dojo()->setDjConfigOption('isDebug',TRUE) //TODO: load from config
                        ->setLocalPath('/~flav/js/dojo/dojo.js')//TODO: load from config
                        ->addStylesheetModule('dijit.themes.tundra')
                        ->setDjConfigOption('parseOnLoad',TRUE)
                        ->enable();

                Zend_Registry::set('view',$view);
               
                if($doLayout) {
                        $viewRenderer =
Zend_Controller_Action_HelperBroker::getStaticHelper('ViewRenderer');
                        $viewRenderer->setView($view);
                        $layout = Zend_Layout::startMvc(array(
                                'layoutPath' => $this->config->layoutPath
                                ));
                }
                return $this;
        }

and layout.phtml is:
<?php
if(Zend_Controller_Front::getInstance()->getRequest()->getParam('nojs',FALSE)) {
        $this->dojo()->disable();
        //TODO convert links
}
?>
<?php echo $this->doctype(); ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php
$this->headLink()->appendStylesheet('/~flav/css/global.css');

echo $this->headTitle();
echo $this->headMeta();
echo $this->dojo();
echo $this->headStyle();
echo $this->headLink();
echo $this->headScript();
?>
</head>
<body class="tundra">
<?php echo $this->layout()->content; ?>
<?php echo $this->inlineScript(); ?>
</body>
</html>

And the generated html something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>My First ZF site</title><meta http-equiv="Content-Type"
content="text/html; charset=utf-8" /><link
href="/~flav/css/global.css" media="screen" rel="stylesheet"
type="text/css" /><style type="text/css">
<!--
    @import "/~flav/js/dijit/themes/tundra/tundra.css";
-->
</style>
<script type="text/javascript">
//<![CDATA[
    var djConfig = {"isDebug":true,"parseOnLoad":true};
//]]>
</script>
<script type="text/javascript" src="/~flav/js/dojo/dojo.js"></script>

<script type="text/javascript">
//<![CDATA[
dojo.require("dijit.layout.ContentPane");
    dojo.require("dijit.layout.BorderContainer");
//]]>

</script></head>
<body class="tundra">
<div style="border: 1px solid black" id="masterLayout"
design="headline" dojoType="dijit.layout.BorderContainer"><div
style="background-color: darkblue;" id="menuPane" region="top"
dojoType="dijit.layout.ContentPane">This is the menu pane</div>
<div style="width: 200px; background-color: lightblue;" id="navPane"
region="left" dojoType="dijit.layout.ContentPane">This is the
navigation pane</div>

<div style="background-color: white;" id="mainPane" region="center"
dojoType="dijit.layout.ContentPane">This is the main content pane
area</div>
<div style="background-color: lightgray;" id="statusPane"
region="bottom" dojoType="dijit.layout.ContentPane">Status area</div>
</div>
</body>
</html>

But the page is white, with no visible widgets.

Does anyone have any idea how to solve this?

--Flavius
Reply | Threaded
Open this post in threaded view
|

Re: [ZF 1.7.2] Dojo not hooking itself when using captureStart()/captureEnd()

Michael Crumm
When using a border container, I believe issues arise based on DocType and also the height properties on some html elements.
If i recall correctly, you need to make sure that you have something akin to

html,body {
 height: 100%;
}

defined in CSS.  I also want to say that setting the DocType plays a part as well, but I cannot recall if it works better in Strict or Transitional.  I've also heard of some omitting the doctype when using a border container, so you could try removing it for testing.

Hope this helps,

Mike

On Sat, Jan 31, 2009 at 11:26 AM, Aspra Flavius Adrian <[hidden email]> wrote:
Hi. It seems that dojo does not hook itself via the addOnLoad function
when used in a view script such as:

$this->borderContainer()->captureStart('masterLayout',
                                      array('design' => 'headline'),
                                      array('style' => 'border: 1px
solid black'));

echo $this->contentPane(
   'menuPane',
   'This is the menu pane',
   array('region' => 'top'),
   array('style' => 'background-color: darkblue;')
);

echo $this->contentPane(
   'navPane',
   'This is the navigation pane',
   array('region' => 'left'),
   array('style' => 'width: 200px; background-color: lightblue;')
);
echo $this->contentPane(
   'mainPane',
   'This is the main content pane area',
   array('region' => 'center'),
   array('style' => 'background-color: white;')
);
echo $this->contentPane(
   'statusPane',
   'Status area',
   array('region' => 'bottom'),
   array('style' => 'background-color: lightgray;')
);

echo $this->borderContainer()->captureEnd('masterLayout');
 - code from the official manual

However, it does if I add an editor widget for example, or if I don't
use captureStart/captureEnd at all, and only create an editor widget.
What may I be missing?
Dojo is set up in a FC plugin's routeStartup() like this:
public function initView($doLayout = TRUE) {
               $view = new Zend_View;
               //TODO: add helper path
               Zend_Dojo::enableView($view);
               Zend_Dojo_View_Helper_Dojo::setUseDeclarative();
               //Zend_Dojo_View_Helper_Dojo::setUseProgrammatic(TRUE);

               $view->baseUrl = rtrim($this->getRequest()->getBaseUrl(),'/');
               $view->doctype($this->config->docType);
               $view->headTitle()->setSeparator($this->config->titleSeparator)
                       ->append($this->config->siteName);
               $view->headMeta()->appendHttpEquiv('Content-Type','text/html; charset=utf-8');

               $view->dojo()->setDjConfigOption('isDebug',TRUE) //TODO: load from config
                       ->setLocalPath('/~flav/js/dojo/dojo.js')//TODO: load from config
                       ->addStylesheetModule('dijit.themes.tundra')
                       ->setDjConfigOption('parseOnLoad',TRUE)
                       ->enable();

               Zend_Registry::set('view',$view);

               if($doLayout) {
                       $viewRenderer =
Zend_Controller_Action_HelperBroker::getStaticHelper('ViewRenderer');
                       $viewRenderer->setView($view);
                       $layout = Zend_Layout::startMvc(array(
                               'layoutPath' => $this->config->layoutPath
                               ));
               }
               return $this;
       }

and layout.phtml is:
<?php
if(Zend_Controller_Front::getInstance()->getRequest()->getParam('nojs',FALSE)) {
       $this->dojo()->disable();
       //TODO convert links
}
?>
<?php echo $this->doctype(); ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php
$this->headLink()->appendStylesheet('/~flav/css/global.css');

echo $this->headTitle();
echo $this->headMeta();
echo $this->dojo();
echo $this->headStyle();
echo $this->headLink();
echo $this->headScript();
?>
</head>
<body class="tundra">
<?php echo $this->layout()->content; ?>
<?php echo $this->inlineScript(); ?>
</body>
</html>

And the generated html something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>My First ZF site</title><meta http-equiv="Content-Type"
content="text/html; charset=utf-8" /><link
href="/~flav/css/global.css" media="screen" rel="stylesheet"
type="text/css" /><style type="text/css">
<!--
   @import "/~flav/js/dijit/themes/tundra/tundra.css";
-->
</style>
<script type="text/javascript">
//<![CDATA[
   var djConfig = {"isDebug":true,"parseOnLoad":true};
//]]>
</script>
<script type="text/javascript" src="/~flav/js/dojo/dojo.js"></script>

<script type="text/javascript">
//<![CDATA[
dojo.require("dijit.layout.ContentPane");
   dojo.require("dijit.layout.BorderContainer");
//]]>

</script></head>
<body class="tundra">
<div style="border: 1px solid black" id="masterLayout"
design="headline" dojoType="dijit.layout.BorderContainer"><div
style="background-color: darkblue;" id="menuPane" region="top"
dojoType="dijit.layout.ContentPane">This is the menu pane</div>
<div style="width: 200px; background-color: lightblue;" id="navPane"
region="left" dojoType="dijit.layout.ContentPane">This is the
navigation pane</div>

<div style="background-color: white;" id="mainPane" region="center"
dojoType="dijit.layout.ContentPane">This is the main content pane
area</div>
<div style="background-color: lightgray;" id="statusPane"
region="bottom" dojoType="dijit.layout.ContentPane">Status area</div>
</div>
</body>
</html>

But the page is white, with no visible widgets.

Does anyone have any idea how to solve this?

--Flavius



--
Michael Crumm
[hidden email]
Reply | Threaded
Open this post in threaded view
|

Re: [ZF 1.7.2] Dojo not hooking itself when using captureStart()/captureEnd()

Aspra Flavius Adrian
> Hope this helps,
>
> Mike

Indeed, that worked. The problem was not about dojo not parsing the
markup, but about making the elements visible. Thanks.