Fragov Blog » programming http://fragov.com/blog About my life, programming, freelancing Wed, 14 Dec 2011 20:36:32 +0000 en hourly 1 http://wordpress.org/?v=3.3 Replace standart Joomla MooTools with yours on front-end http://fragov.com/blog/2009/10/21/replace-standart-joomla-mootools-with-yours-on-front-end/ http://fragov.com/blog/2009/10/21/replace-standart-joomla-mootools-with-yours-on-front-end/#comments Wed, 21 Oct 2009 14:34:30 +0000 fragov http://fragov.com/blog/?p=64 To keep upwards compatibility for your Joomla Core the following example shows a solution, by clearing the Header Buffer from the scripts Joomla is adding by itself. This is a template based modification, which does work with extensions loading their own Scripts or Stylesheets into the Header Buffer. And by that also transparent and not affected by any version upgrade to your Joomla Core:

<!-- Load MooTools by the template, and at the top before any other scripts -->
<?php
/* --- This removes any Joomla default Scripts from the Header Buffer --- */
$header = $this->getHeadData();                   // Get the current HEAD buffer
$header['scripts'] = array();                     // Clear all current 'scripts' entries
$this->setHeadData($header);                      // Update the HEAD buffer
/* --- We add the MooTools Framework manually, see below --- */
?>

<head>
<!-- Load MooTools at first -->
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/mootools/mootools-1.2.1-core.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/mootools/mootools-1.2-more.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/mootools/mootools-1.2-compat.js"></script>

<!-- Now all other scripts from extensions -->
<jdoc:include type="head" />

</head>
]]> http://fragov.com/blog/2009/10/21/replace-standart-joomla-mootools-with-yours-on-front-end/feed/ 2 Using Joomla’s modal box in any template http://fragov.com/blog/2009/05/14/using-joomla%e2%80%99s-modal-box-in-any-template/ http://fragov.com/blog/2009/05/14/using-joomla%e2%80%99s-modal-box-in-any-template/#comments Wed, 13 May 2009 23:35:11 +0000 fragov http://fragov.com/blog/?p=41 You see Joomla’s modal box used in the admin quite a bit. This code is already included in Joomla, so why not use it on the front end as well? It is actually pretty easy to achiev.

First Call the necessary CSS & Javascript in your head tag.
(add this to your template’s index.php)

<script type="text/javascript" src="<?php echo $this->baseurl;?>/media/system/js/modal.js"></script>
<link rel="stylesheet" href="<?php echo $this->baseurl;?>/media/system/css/modal.css" type="text/css"/>
<script type="text/javascript">
window.addEvent('domready', function() {
SqueezeBox.initialize({});
$$('a.modal-button').each(function(el) {
el.addEvent('click', function(e) {
new Event(e).stop();
SqueezeBox.fromElement(el);
});
});
});
function jInsertEditorText( text, editor ) {
eval(editor+'_id.insertCode(text);');
} window.addEvent('domready', function() {
SqueezeBox.initialize({});
$$('a.modal').each(function(el) {
el.addEvent('click', function(e) {
new Event(e).stop();
SqueezeBox.fromElement(el);
});
});
});
</script>

Just add the above to your template and in your URL, call the modal box using the class=”modal” and rel=”{handler: ‘iframe’, size: {x: 570, y: 200}}” then in your href add “&tmpl=component” like this:

]]> http://fragov.com/blog/2009/05/14/using-joomla%e2%80%99s-modal-box-in-any-template/feed/ 0 Joomla 1.5 standart pop-ups (mootools + modal script) http://fragov.com/blog/2009/05/12/joomla-15-standart-pop-ups-mootools-modal-script/ http://fragov.com/blog/2009/05/12/joomla-15-standart-pop-ups-mootools-modal-script/#comments Wed, 13 May 2009 03:15:20 +0000 fragov http://fragov.com/?p=3 You may see this pop-ups in Joomla back-end, when changing settings etc.

Add to head:

<?php
JHtml::_('behavior.modal', 'a.class_name');
?>
<script type="text/javascript">
window.addEvent('domready', function() {
    // Decorate the login windows to use a modal.

	$ES('a.class_name').each(function(a){
        a.setProperty('rel', '{size: {x: 900, y: 500}, ajaxOptions: {method: "get"}}');
        if (a.getProperty('href').contains('?')) {
            a.setProperty('href', a.getProperty('href')+'&tmpl=component');
        } else {
            a.setProperty('href', a.getProperty('href')+'?tmpl=component');
        }
    });
});
</script>

Then just add class attribute:

<a href="..." class="class_name">link text</a>

CSS-file located at:
/media/system/css/modal.css

JS-file located at:
/media/system/js/modal.js

]]> http://fragov.com/blog/2009/05/12/joomla-15-standart-pop-ups-mootools-modal-script/feed/ 3