Commit 268d2656 authored by jonnybradley's avatar jonnybradley

[MOD] Rewrite of {popup} Smarty function to use jQuery ClueTips properly.

Now initialises on first mouseover (or onclick) which should make page rendering lighter.
Most other references to overlib replaced in tpls.
Tested in filegals, calendars
parent 21b12281
......@@ -2372,6 +2372,7 @@ lib/smarty_tiki/function.memusage.php -text
lib/smarty_tiki/function.menu.php -text
lib/smarty_tiki/function.phplayers.php -text
lib/smarty_tiki/function.poll.php -text
lib/smarty_tiki/function.popup.php -text
lib/smarty_tiki/function.popup_init.php -text
lib/smarty_tiki/function.preference.php -text
lib/smarty_tiki/function.query.php -text
......
......@@ -101,35 +101,50 @@ $jq(document).ready( function() { // JQuery's DOM is ready event - before onload
// tooltip functions and setup
if (jqueryTiki.tooltips) { // apply "cluetips" to all .tips class anchors
$jq('.tips').cluetip({splitTitle: '|', showTitle: false, width: '150px', cluezIndex: 400, fx: {open: 'fadeIn', openSpeed: 'fast'}});
$jq('.titletips').cluetip({splitTitle: '|', cluezIndex: 400});
$jq('.tikihelp').cluetip({splitTitle: ':', width: '150px', cluezIndex: 400, fx: {open: 'fadeIn', openSpeed: 'fast'}});
$jq('.stickytips').cluetip({ showTitle: false, width: 'auto', cluezIndex: 400, sticky: false, local: true, hideLocal: true, activation: 'click', cluetipClass: 'fullhtml', fx: {open: 'fadeIn', openSpeed: 'fast'}});
// override overlib - TODO optimise JQuery calls
convertOverlib = function (element, tip, options) { // process overlib event fn to cluetip
// override overlib
convertOverlib = function (element, tip, params) { // process modified overlib event fn to cluetip from {popup} smarty func
tip = tip.replace(/return overlib\((.*)\).*/gi, '$1'); // remove function wrapper
var prefix = "";
var strStart = 0;
var strEnd = tip.length;
if (element.processed) { return; }
if (tip.substring(0,1) == "'") { // overlib is called with a string, then a few "constant" params
strStart = 1; // this bit extracts the first string (couldn't get a regexp to work reliably)
strEnd = tip.lastIndexOf("'");
} else if (tip.substring(0,1) == '"') {
strStart = 1;
strEnd = tip.lastIndexOf('"');
var options = new Object();
for (param in params) {
var val = "";
if (params[param].indexOf("=") > -1) {
var arr = param.split("=");
pam = arr[0].toLowerCase();
val = arr[1];
} else {
pam = params[param].toLowerCase();
}
switch (pam) {
case "sticky":
options.sticky = true;
break;
case "fullhtml":
options.cluetipClass = 'fullhtml';
break;
case "onclick":
options.activation = 'click';
break;
case "width":
options.width = val;
break;
case "height":
options.height = val;
break;
default:
break;
}
}
// process parameters
params = tip.substring(strEnd-1, tip.length).toLowerCase(); // possibly: sticky,autostatus,autostatuscap,fullhtml,hauto,vauto,closeclick,wrap,followmouse,mouseoff,compatmode
if (params.indexOf('sticky') > -1) { options.sticky = true; } else { options.sticky = false; }
//if (params.indexOf('mouseoff') > -1) {} // TODO?
if (params.indexOf('fullhtml') > -1) { options.cluetipClass = 'fullhtml'; } else { options.cluetipClass = 'default'; }
options.splitTitle = '|';
options.showTitle = false;
options.width = 'auto'; // this don't work :(
options.cluezIndex = 400;
options.dropShadow = true;
options.fx = {open: 'fadeIn', openSpeed: 'fast'};
......@@ -138,45 +153,45 @@ $jq(document).ready( function() { // JQuery's DOM is ready event - before onload
options.mouseOutClose = true;
// attach new tip
tip = tip.substring(strStart, strEnd); // trim quotes
//tip = tip.substring(strStart, strEnd); // trim quotes
tip = tip.replace(/\\n/g, ''); // remove newlines
tip = tip.replace(/\\/g, ''); // remove backslashes
// hack to calculate div width
var el = document.createElement('DIV');
$jq(el).css('position', 'absolute').css('visibility', 'hidden');
document.body.appendChild(el);
if (tip.length > 1500) {
tip = tip.substring(0, 1500); // setting html to anything bigger seems to blow jquery away :(
}
$jq(el).html(tip);
if ($jq(el).width() > $jq(window).width()) {
$jq(el).width($jq(window).width() * 0.8);
if (element.tipWidth) {
options.width = element.tipWidth;
} else if (!options.width) {
// hack to calculate div width
var el = document.createElement('DIV');
$jq(el).css('position', 'absolute').css('visibility', 'hidden');
document.body.appendChild(el);
if (tip.length > 2000) {
tip = tip.substring(0, 2000); // setting html to anything bigger seems to blow jquery away :(
}
$jq(el).html(tip);
if ($jq(el).width() > $jq(window).width()) {
$jq(el).width($jq(window).width() * 0.8);
}
options.width = $jq(el).width();
document.body.removeChild(el);
element.tipWidth = options.width;
}
options.width = $jq(el).width();
document.body.removeChild(el);
prefix = "|";
$jq(element).attr('title', prefix + tip);
element.processed = true;
// options.sticky = true; useful for css work
$jq(element).cluetip(options);
if (options.activation == "click") {
$jq(element).trigger('click');
} else {
$jq(element).trigger('mouseover');
}
}
$jq("a[onmouseover*='overlib('], input[onmouseover*='overlib(']").each(function() {
tip = $jq(this)[0].getAttribute('onmouseover'); // use the html call to get the text, not the fn
convertOverlib(this, tip, {});
});
$jq("a[onclick*='overlib('], input[onclick*='overlib(']").each(function() { // TODO refactor!!!!
tip = $jq(this)[0].getAttribute('onclick'); // use the html call to get the text, not the fn
convertOverlib(this, tip, {activation: 'click'});
});
// nobble overlib funcs
overlib = function() {};
nd = function() {};
}
} // end cluetip setup
// superfish setup (CSS menu effects)
if (jqueryTiki.superfish) {
......
<?php
/**
* $Id: $
* Smarty plugin for Tiki using jQuery ClueTip instead of OverLib
*/
/**
* Smarty {popup} function plugin
*
* Type: function<br>
* Name: popup<br>
* Purpose: make text pop up in windows via ClueTip
* @link not very relevant anymore http://smarty.php.net/manual/en/language.function.popup.php {popup}
* (Smarty online manual)
* @author Jonny Bradley, replacing Smarty original (by Monte Ohrt <monte at ohrt dot com>)
* @param array
* @param Smarty
* @return string now formatted to use convertOverlib() in tiki-jquery.js
*
* params still relevant:
*
* text Required: the text/html to display in the popup window
* trigger 'onMouseOver' or 'onClick' (onMouseOver default)
* sticky false/true
* width in pixels?
* fullhtml
*/
function smarty_function_popup($params, &$smarty)
{
$append = '';
foreach ($params as $_key=>$_value) {
switch ($_key) {
case 'text':
case 'trigger':
case 'function':
case 'inarray':
$$_key = (string)$_value;
if ($_key == 'function' || $_key == 'inarray')
$append .= ',\'' . strtoupper($_key) . "'='$_value'";
break;
case 'caption':
case 'closetext':
case 'status':
$append .= ',\'' . strtoupper($_key) . "'=" . str_replace("'","\'",$_value) . "'";
break;
case 'fgcolor':
case 'bgcolor':
case 'textcolor':
case 'capcolor':
case 'closecolor':
case 'textfont':
case 'captionfont':
case 'closefont':
case 'fgbackground':
case 'bgbackground':
case 'caparray':
case 'capicon':
case 'background':
case 'frame':
$append .= ',\'' . strtoupper($_key) . "'='$_value'";
break;
case 'textsize':
case 'captionsize':
case 'closesize':
case 'width':
case 'height':
case 'border':
case 'offsetx':
case 'offsety':
case 'snapx':
case 'snapy':
case 'fixx':
case 'fixy':
case 'padx':
case 'pady':
case 'timeout':
case 'delay':
$append .= ',\'' . strtoupper($_key) . "'='$_value'";
break;
case 'sticky':
case 'left':
case 'right':
case 'center':
case 'above':
case 'below':
case 'noclose':
case 'autostatus':
case 'autostatuscap':
case 'fullhtml':
case 'hauto':
case 'vauto':
case 'mouseoff':
case 'followmouse':
case 'closeclick':
if ($_value) $append .= ',\'' . strtoupper($_key) . '\'';
break;
default:
$smarty->trigger_error("[popup] unknown parameter $_key", E_USER_WARNING);
}
}
if (empty($text) && !isset($inarray) && empty($function)) {
$smarty->trigger_error("overlib: attribute 'text' or 'inarray' or 'function' required");
return false;
}
if (empty($trigger)) {
$trigger = "onmouseover";
} else {
$append .= ',\'' . $trigger . '\'';
}
$retval = $trigger . '="return convertOverlib(this,\''.preg_replace(array("!'!","![\r\n]!"),array("\'",'\r'),$text).'\'';
$append = trim($append, ',');
$retval .= ',[' . $append . ']);"';
// if ($trigger == 'onmouseover')
// $retval .= ' onmouseout="nd();"';
return $retval;
}
/* vim: set expandtab: */
?>
......@@ -1295,6 +1295,7 @@ opaque .box-title,
.opaque .iconmenu {
display: block;
white-space: nowrap;
}
/***** Trackers (etc.) *****/
......
......@@ -31,7 +31,7 @@
{else}
{if $prefs.javascript_enabled eq 'y'}
{if $menu_text eq 'y' or $menu_icon eq 'y'}
{* This form tag is needed when placed in a popup box through overlib.
{* This form tag is needed when placed in a popup box through the popup function.
If placed in a column, there is already a form tag around the whole table *}
<form class="upform" name="form{$files[changes].fileId}" method="post" action="{$smarty.server.PHP_SELF}?galleryId={$gal_info.galleryId}{if $filegals_manager neq ''}&amp;filegals_manager={$filegals_manager|escape}{/if}{if $prefs.fgal_asynchronous_indexing eq 'y'}&amp;fast{/if}" enctype="multipart/form-data">
......
......@@ -58,8 +58,8 @@
{/strip}{/capture}
{* Show user message in style according to 'tooltip' module parameter *}
{assign var=cdate value=$smarty.capture.date}
{if 0 and $tooltip == 1}{* TODO: Improve $userlink modifier one day to handle other attibutes better? *}
<b>{strip}{$userlink|replace:" class=":" onmouseover='return overlib(\"$cdate\");' onmouseout='nd();' class="}{/strip}</b>:
{if $tooltip == 1}{* TODO: Improve $userlink modifier one day to handle other attibutes better? *}
<b>{strip}{$userlink|replace:"\" href=":"<br /><em>{tr}Shout date:{/tr} `$cdate`</em>\" href="}{/strip}</b>:
{else}
<b>{strip}{$userlink}{/strip}</b>, {$cdate}:
{/if}
......
......@@ -30,9 +30,9 @@
{if isset($pos)}<input type="hidden" name="pos" value="{$pos}" />{/if}
{if isset($cell)}<input type="hidden" name="cell" value="{$cell}" />{/if}
{if isset($hdr)}<input type="hidden" name="hdr" value="{$hdr}" />{/if}
<input type="submit" onmouseover="return overlib('{tr}Preview your changes.{/tr}');" onmouseout="nd();" class="wikiaction" name="preview" value="{tr}Preview{/tr}" />&nbsp;&nbsp;
<input type="submit" onmouseover="return overlib('{tr}Save the page.{/tr}');" onmouseout="nd();" class="wikiaction" name="save" value="{tr}Save{/tr}" />&nbsp;&nbsp;
<input type="submit" onmouseover="return overlib('{tr}Cancel the edit, you will lose your changes.{/tr}');" onmouseout="nd();" class="wikiaction" name="cancel_edit" value="{tr}Cancel Edit{/tr}" />
<input type="submit" title="{tr}Preview your changes.{/tr}" class="wikiaction tips" name="preview" value="{tr}Preview{/tr}" />&nbsp;&nbsp;
<input type="submit" title="{tr}Save the page.{/tr}" class="wikiaction tips" name="save" value="{tr}Save{/tr}" />&nbsp;&nbsp;
<input type="submit" title="{tr}Cancel the edit, you will lose your changes.{/tr}" class="wikiaction tips" name="cancel_edit" value="{tr}Cancel Edit{/tr}" />
</td></tr>
</table>
</form>
......@@ -150,7 +150,7 @@ window.onload = timeIt;
<option value="inlinediff">text</option>
{/if}
</select>
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Change the style used to display differences to be translated.{/tr}');" onmouseout="nd();" name="preview" value="{tr}Change diff styles{/tr}" onclick="needToConfirm=false;" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Change the style used to display differences to be translated.{/tr}" name="preview" value="{tr}Change diff styles{/tr}" onclick="needToConfirm=false;" />
{/if}
<input type="hidden" name="clock" value="{$edittimeout}" />
......@@ -175,9 +175,9 @@ window.onload = timeIt;
{if $prefs.feature_wysiwyg eq 'y' and $prefs.wysiwyg_optional eq 'y' and !isset($hdr)}
{if $wysiwyg ne 'y'}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Switch to WYSIWYG editor.{/tr}');" onmouseout="nd();" name="mode_wysiwyg" value="{tr}Use wysiwyg editor{/tr}" onclick="needToConfirm=false;" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Switch to WYSIWYG editor.{/tr}" name="mode_wysiwyg" value="{tr}Use wysiwyg editor{/tr}" onclick="needToConfirm=false;" />
{else}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Switch to normal (wiki) editor.{/tr}');" onmouseout="nd();" name="mode_normal" value="{tr}Use normal editor{/tr}" onclick="needToConfirm=false;" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Switch to normal (wiki) editor.{/tr}" name="mode_normal" value="{tr}Use normal editor{/tr}" onclick="needToConfirm=false;" />
{/if}
{/if}
......
......@@ -107,7 +107,7 @@
{foreach item=permgroup from=$quickperms}
<th>{$permgroup.name}</th>
{/foreach}
<th onmouseover="return overlib('A couple of userdefined permissions are currently assigned (See tab Assign Permissions)');" onmouseout="nd();">Advanced</th>
<th class="tips" title="{tr}A couple of userdefined permissions are currently assigned (See tab Assign Permissions){/tr}">Advanced</th>
</tr>
{cycle print=false values="even,odd"}
{section name=grp loop=$groups}
......
{* $Id: tiki-editpage.tpl 20027 2009-07-09 19:31:46Z sylvieg $ *}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Preview your changes.{/tr}');" onmouseout="nd();" name="preview" value="{tr}Preview{/tr}" onclick="needToConfirm=false;" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Preview your changes.{/tr}" name="preview" value="{tr}Preview{/tr}" onclick="needToConfirm=false;" />
{if $page|lower neq 'sandbox' or $tiki_p_admin eq 'y'}
{if $translation_mode eq 'y'}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Save the page as a partial translation.{/tr}');" onmouseout="nd();" name="partial_save" value="{tr}Partial Translation{/tr}" onclick="needToConfirm=false"/>
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Save the page as a completed translation.{/tr}');" onmouseout="nd();" name="save" value="{tr}Complete Translation{/tr}" onclick="needToConfirm=false"/>
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Save the page as a partial translation.{/tr}" name="partial_save" value="{tr}Partial Translation{/tr}" onclick="needToConfirm=false"/>
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Save the page as a completed translation.{/tr}" name="save" value="{tr}Complete Translation{/tr}" onclick="needToConfirm=false"/>
{else}
{if $tiki_p_minor eq 'y' and $page|lower ne 'sandbox' and $prefs.wiki_edit_minor neq 'n'}
<input type="submit" class="wikiaction" name="minor" onmouseover="return overlib('{tr}Save the page, but do not send notifications and do not count it as new content to be translated.{/tr}');" onmouseout="nd();" value="{tr}Save Minor Edit{/tr}" onclick="needToConfirm=false;" />
<input type="submit" class="wikiaction tips" name="minor" title="{tr}Edit wiki page{/tr}|{tr}Save the page, but do not send notifications and do not count it as new content to be translated.{/tr}" value="{tr}Save Minor Edit{/tr}" onclick="needToConfirm=false;" />
{/if}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Save the page.{/tr}');" onmouseout="nd();" name="save" value="{tr}Save{/tr}" onclick="needToConfirm=false;" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Save the page.{/tr}" name="save" value="{tr}Save{/tr}" onclick="needToConfirm=false;" />
{if $prefs.feature_ajax eq 'y' && $prefs.feature_wiki_save_draft eq 'y'}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Save the page as a draft.{/tr}');" onmouseout="nd();" value="{tr}Save Draft{/tr}" onclick="save_draft()" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Save the page as a draft.{/tr}" value="{tr}Save Draft{/tr}" onclick="save_draft()" />
{/if}
{/if}
{if $page|lower ne 'sandbox'}
<input type="submit" class="wikiaction" onmouseover="return overlib('{tr}Cancel the edit, you will lose your changes.{/tr}');" onmouseout="nd();" name="cancel_edit" value="{tr}Cancel Edit{/tr}" onclick="needToConfirm = false;" />
<input type="submit" class="wikiaction tips" title="{tr}Edit wiki page{/tr}|{tr}Cancel the edit, you will lose your changes.{/tr}" name="cancel_edit" value="{tr}Cancel Edit{/tr}" onclick="needToConfirm = false;" />
{/if}
{/if}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment