Submodal window helper March 20, 2006
Posted by rossoft in CakePHP.trackback
A helper for making submodal windows with this
1. Download this
2. Copy the *.js to /app/webroot/js/submodal/
3. Copy the *.css to /app/webroot/css/submodal/
4. Copy the close.gif to /app/webroot/img/submodal/
5. Put this on /app/views/helpers/submodal.php
<?php
/**
* Submodal Helper
* @author RosSoft
* @license MIT
* @version 0.10
*
* @link http://www.subimage.com/sublog/subModal
*
*/
class SubmodalHelper extends Helper
{
var $helpers=array(’Html’,'Javascript’);
var $css=’submodal/subModal’;
var $jsdir=’submodal/’;
var $img_close=’submodal/close.gif’;
var $loading=’/pruebas/loading’;
/**
* Inits the submodal. Put on <body>
*
*/
function init()
{
ob_start();
if (!defined(’MODAL_HELPER_REFS’))
{
define(’MODAL_HELPER_REFS’,1);
echo $this->Html->css($this->css);
echo $this->Javascript->link($this->jsdir . ‘common’);
echo $this->Javascript->link($this->jsdir . ’subModal’);
?>
<div id=”popupMask”> </div>
<div id=”popupContainer”>
<div id=”popupInner”>
<div id=”popupTitleBar”>
<div id=”popupTitle”></div>
<div id=”popupControls”>
<?=$this->Html->image($this->img_close,array(’onclick’=>’hidePopWin(true)’))?>
</div>
</div>
<iframe src=”<?=$this->Html->url($this->loading)?>” style=”width:100%;height:100%;background-color:transparent;” scrolling=”auto” frameborder=”0″ allowtransparency=”true” id=”popupFrame” name=”popupFrame” width=”100%” height=”100%”></iframe>
</div>
</div>
<?php
$loading=$this->Html->url($this->loading);
echo $this->Javascript->codeBlock(”gLoadingUrl=’$loading’; initPopUp(); hidePopWin(false);”);
return ob_get_clean();
}
return ”;
}
/**
* Change modal window url
* @param string $url Url in form /controller/action/…
* @param integer $width Width of the box
* @param integer $height Height of the box
* @param string $callback Will be called when window is closed
* @return string Javascript code block enclosed in <script> tag
*/
function url($url,$width,$height,$callback=”)
{
return $this->Javascript->codeBlock($this->jsurl($url,$width,$height,$callback));
}
/**
* Change modal window url
* @param string $url Url in form /controller/action/…
* @param integer $width Width of the box
* @param integer $height Height of the box
* @param string $callback Will be called when window is closed
* @return string Javascript code block NOT enclosed in <script> tag
*/
function jsurl($url,$width,$height,$callback=null)
{
$url=$this->Html->url($url);
if ($callback===null) $callback=’null’;
return “showPopWin(’$url’, $width, $height, $callback);window.setTimeout(’setPopTitle();’, 2000);”;
}
}
/*
Example of usage:
<?=$submodal->init()?>
<a href=”javascript: void(0)” onclick=”<?=$submodal->jsurl(’/pruebas/test_submodal_result’,400,300,’windowclosed’)?>” >click here</a>
<br/>
<a href=”javascript: void(0)” onclick=”<?=$submodal->jsurl(’/pruebas/test_submodal_result’,300,400)?>” >click here. Without callback</a>
<script type=”text/javascript”>
function windowclosed(code)
{
alert(”You have closed the window. Return code=” + code);
}
</script>
*/
?>
6. Include the helper in your controller var $helpers=array(’xxx’,'Submodal’);
7. View code example:
<?=$submodal->init()?>
<a href=”javascript: void(0)” onclick=”<?=$submodal->jsurl(’/pruebas/test_submodal_result’,400,300,’windowclosed’)?>” >click here</a>
<br/>
<a href=”javascript: void(0)” onclick=”<?=$submodal->jsurl(’/pruebas/test_submodal_result’,300,400)?>” >click here. Without callback</a>
<script type=”text/javascript”>
function windowclosed(code)
{
alert(”You have closed the window. Return code=” + code);
}
</script>
You have to put $submodal->init() anywhere in your .
$submodal->jsurl() takes the parameters, url of the new window, width, height and a callback function that will be called after close. It returns a javascript call, you have to enclose it in a tag or anchor tag.
You have to edit the helper for set the loading page that will be shown.
cool!