Floating tooltips conflict with template

G

Guzman

Member
Hi.
I'm having conflict with the mootools script in my template, the result of the conflict is this:

menudropdown.js
agoraTooltipProblem.png
I have traced the script thet is in conflict, is this:
Code: 
/* OT Document JAVASCRIPT for MENU DROPDOWN */
if (typeof(MooTools) != 'undefined') {
    var subnav = new Array();
    
    Element.implement(
    {
        hide: function(timeout)
        {
            this.status = 'hide';
            clearTimeout(this.timeout);
            if (timeout) {
                this.timeout = setTimeout(this.anim.bind(this), timeout);
            } else {
                this.anim();
            }
        },
        
        show: function(timeout)
        {
            this.status = 'show';
            clearTimeout(this.timeout);
            if (timeout) {
                this.timeout = setTimeout(this.anim.bind(this), timeout);
            } else {
                this.anim();
            }
        },
        
        set_Active: function()
        {
            this.className += ' sfhover';
        },
        
        setDeactive: function() {
            this.className = this.className.replace(new RegExp(' sfhover\\b'), '');
        },
        
        anim: function()
        {
            if ((this.status == 'hide' && this.style.left != 'auto') || (this.status == 'show' && this.style.left == 'auto' && !this.hidding)) return;
            this.setStyle('overflow', 'hidden');
            if (this.status == 'show') {
                this.hidding = 0;
                this.hideAll();
            }
            
            if (this.status == 'hide') {
                this.hidding = 1;
                this.myFx2.cancel();
                if (this.parent._id) {
                    this.myFx2.start('width', this.offsetWidth, 0);
                } else {
                    this.myFx2.start('height', this.offsetHeight, 0);
                }
            } else {
                this.setStyle('left', 'auto');
                this.myFx2.cancel();
                if (this.parent._id) this.myFx2.start('width', 0, '205px');
                    else this.myFx2.start('height', 0, this.mh);
            }
        },
        init: function()
        {
            this.mw = this.clientWidth;
               this.mh = this.clientHeight;
            if (this.parent._id) {
                this.myFx2 = new Fx.Tween(this, {
                    duration: 400,
                    link: 'cancel'
                });
                this.myFx2.set('width',0);
            } else {
                this.myFx2 = new Fx.Tween(this, {
                    duration: 400,
                    link: 'cancel'
                });
                this.myFx2.set('height',0);
            }
            
            this.setStyle('left', '-999em');
            
            animComp = function()
            {
                if (this.status == 'hide') {
                    this.setStyle('left', '-999em');
                    this.hidding = 0;
                }
                
                this.setStyle('overflow', '');
            }
            this.myFx2.addEvent('onComplete', animComp.bind(this));
        },
        
        hideAll: function()
        {
            for (var i = 0; i < subnav.length; i++) {
                if (!this.isChild(subnav[i])) {
                    subnav[i].hide(0);
                }
            }
        },
        
        isChild: function(_obj)
        {
            obj = this;
            while (obj.parent) {
                if (obj._id == _obj._id) {
                    return true;
                }
                obj = obj.parent;
            }
            return false;
        }
    });
    
    var DropdownMenu = new Class({
        
        initialize: function(element)
        {
            if(element.className == 'menu_round')
            {
                $A($(element).childNodes).each(function(el){
                    if(el.className == 'menu_mid'){
                        $A($(el).childNodes).each(function(el_1){
                            if(el_1.nodeName.toLowerCase() == 'ul'){
                                elm = $(el_1);
                            }
                        });
                    }
                });
            }
            else
            {
                elm = $(element);
            }
            $A($(elm).childNodes).each(function(el_2){
                if (el_2.nodeName.toLowerCase() == 'li') {
                    $A($(el_2).childNodes).each(function(el_3) {
                        if (el_3.className == 'menu_round') {
                            $(el_3)._id = subnav.length + 1;
                            $(el_3).parent = $(element);
                            subnav.push($(el_3));
                            el_3.init();
                            
                            el_2.addEvent('mouseenter', function() {
                                el_2.set_Active();
                                el_3.show(0);
                                return false;
                                
                            });
                            
                            el_2.addEvent('mouseleave', function() {
                                el_2.setDeactive();
                                el_3.hide(20);
                            });
                            
                            new DropdownMenu(el_3);
                            el_2.hasSub = 1;
                        }
                    });
                    if (!el_2.hasSub) {
                        el_2.addEvent('mouseenter', function() {
                            el_2.set_Active();
                            return false;
                        });
                        
                        el_2.addEvent('mouseleave', function() {
                            el_2.setDeactive();
                        });
                    }
                }
            });
            return this;
        }
    });
        window.addEvent('domready', function() {
            new DropdownMenu(document.getElement('#ot-mainmenu ul.level0'));
        });
} else {
    sfHover = function()
    {
        var sfEls = document.getElementById("ot-mainmenu").getElementsByTagName("li");
        for (var i = 0; i<sfEls.length; ++i) {
            sfEls[i].onmouseover = function() {
                this.className += " sfhover";
            }
            sfEls[i].onmouseout = function() {
                this.className = this.className.replace(new RegExp(" sfhover\\b"), "");
            }
        }
    }
    if (window.attachEvent) window.attachEvent("onload", sfHover);
}
/* +++++++++++++++ End +++++++++++++++++++ */

The php file that calls the js is this:

OtModulesRenderer.php
Code: 
<?php
/**
 # ot_Appoz -     OT Appoz  Template for Joomla 1.7!
 # author             OmegaTheme.com
 # copyright         Copyright(C) 2011 - OmegaTheme.com. All Rights Reserved.
 # @license         http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
 # Website:         http://omegatheme.com
 # Technical         support: Forum - http://omegatheme.com/forum/
 **/
 /**------------------------------------------------------------------------
 * file: tpl.function.php 1.7.0 00001, December 2011 12:00:00Z OmegaTheme $
 * package:    OT Appoz Template
 *------------------------------------------------------------------------*/
 
//No direct access!
defined( '_JEXEC' ) or die( 'Restricted access' );

include_once(JPATH_ROOT . "/templates/" . $this->template . '/lib/OtModulesRenderer.php');    

    //Check IE Version for Fix Layout
    function browser()
    {
        $browser = array();
        // what ie browser version?
        if (array_key_exists('HTTP_USER_AGENT', $_SERVER) && preg_match('/(MSIE\\s?([\\d\\.]+))/', $_SERVER['HTTP_USER_AGENT'], $matches))
        {
            $browser['ie9'] = intval($matches[2]) == 9;
            $browser['ie8'] = intval($matches[2]) == 8;
            $browser['ie7'] = intval($matches[2]) == 7;
        }
        return $browser;
    }
    
    function isIe($version)
    {
        $browser = browser();
        if (array_key_exists('ie'.$version, $browser)) {
            return $browser['ie'.$version];
        }
        return false;
    }
    
    //Check Menu default is Home
    function isHome()
    {
        $mnu =& JSite::getMenu();
        return ($mnu->getActive() == $mnu->getDefault());
    }
    
    //Check Frontpage view
    function isFrontpage(){
        return (JRequest::getCmd( 'view' ) == 'frontpage') ;
    }
    
    //$layoutView = &JRequest::getVar( 'layoutview' ) == $this->params->get('layoutType');
    
    /*+++++++++++++++++++Layout++++++++++++++++++++*/
    
    $template_url = $this->baseurl.'/templates/'.$this->template;
    
    //Include Main CSS
    $this->addStyleSheet($this->baseurl.'/templates/system/css/system.css');
    $this->addStyleSheet($this->baseurl.'/templates/system/css/general.css');
    $this->addStyleSheet($this->baseurl.'/templates/'.$this->template.'/css/template.css');
    
    //+++++++++++++++++++Configuration Width Template +++++++++++++++++++++++
    $presetCss = '';
    
    if($this->params->get('CustomWidthTemplate') == 1){
        if(trim($this->params->get('width_template')) != ''){
            $presetCss .= 'div.template-width {width: '.trim($this->params->get('width_template')).';}';
        }
        if($this->countModules('left')){
            $presetCss .= 'div.ot-leftcolumn {width: '.trim($this->params->get('width_left')).';}';
        }
        if($this->countModules('right')){
            $presetCss .= 'div.ot-rightcolumn {width: '.trim($this->params->get('width_right')).';}';
        }
    }
    
    //+++++++++++++++++++Extend Modules +++++++++++++++++++++++
    if($this->countModules('bottom-2') == 0){
        $presetCss .= 'div.ot-footer div.ot-bottom-1 {width: 100%}';
    }
    if($this->countModules('bottom-1') == 0){
        $presetCss .= 'div.ot-footer div.ot-bottom-2 {width: 100%}';
    }
    
    //+++++++++++++++++++Configuration Width of Boxes +++++++++++++++++++++++
    $topboxs_unitWidth = trim($this->params->get('unitWidth'));
        
    $width_topboxs = explode(",", str_replace(array(" ",";", "(", ")"), array("", ",", "", ""), $this->params->get('width_topboxes')));
        
    $topboxes_additional_class = '';
    foreach (@$width_topboxs as $index => $width_topbox) 
    {
        $width_topboxs[$index] = trim($width_topbox);
    }
    $width_topboxs = array_unique($width_topboxs);
    foreach ($width_topboxs as $width_topbox) 
    {
        if (trim($width_topbox ) != "" )
        {
            $topboxes_additional_class .= '
            .'.'width'.$width_topbox. '{ width: '.$width_topbox.$topboxs_unitWidth.'; } 
             ';
        }
    }
    
    //+++++++++++++++++++Configuration Layout +++++++++++++++++++++++
    //$layoutStyle = $this->params->get('layoutStyle');
    //$this->addStyleSheet($template_url.'/css/layout/'.$layoutStyle.'.css');
    
    if($this->params->get('customBackground') == 1){
        if(trim($this->params->get('header_bgcolor')) != ''){
            $presetCss .= 'div.ot-header {background-color: '.$this->params->get('header_bgcolor').';}';
        }
        if(trim($this->params->get('banner_bgcolor')) != ''){
            $presetCss .= 'div.ot-banner {background-color: '.$this->params->get('banner_bgcolor').';}';
        }
        if(trim($this->params->get('topboxes_bgcolor')) != ''){
            $presetCss .= 'div.ot-topboxes {background-color: '.$this->params->get('topboxes_bgcolor').';}';
        }
        if(trim($this->params->get('mainbody_bgcolor')) != ''){
            $presetCss .= 'div.ot-mainbody {background-color: '.$this->params->get('mainbody_bgcolor').';}';
        }
        if(trim($this->params->get('footer_bgcolor')) != ''){
            $presetCss .= 'div.ot-footer {background-color: '.$this->params->get('footer_bgcolor').';}';
        }
    }
    
    //+++++++++++++++++++Configuration Body +++++++++++++++++++++++
    if($this->params->get('CustomBodyFont') == 1){
        if(trim($this->params->get('font_family')) != 'none'){
            $font_family = explode(':', trim($this->params->get('font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $font_family[0]));
            $presetCss .= 'body#ot-body {font-family: "'.$font_family[0].'";}';
        }
        if(trim($this->params->get('color_text')) != ''){
            $presetCss .= 'body#ot-body {color: '.$this->params->get('color_text').';}';
        }
        if(trim($this->params->get('color_links')) != ''){
            $presetCss .= 'a {color: '.$this->params->get('color_links').';}';
        }
        if(trim($this->params->get('fontSize')) != ''){
            $presetCss .= 'body#ot-body {font-size: '.$this->params->get('fontSize').';}';
        }
    }
    
    //+++++++++++++++++++Configuration Heading Tags++++++++++++++++++++
    if($this->params->get('CustomHeadingFont') == 1){
        // Custom style h1
        if(trim($this->params->get('h1font_family')) != 'none'){
            $h1font_family = explode(':', trim($this->params->get('h1font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $h1font_family[0]));
            $presetCss .= 'h1 {font-family: "'.$h1font_family[0].'";}';
        }
        if(trim($this->params->get('h1_color')) != ''){
            $presetCss .= 'h1 {color: '.$this->params->get('h1_color').';}';
        }
        if(trim($this->params->get('h1font_size')) != ''){
            $presetCss .= 'h1 {font-size: '.$this->params->get('h1font_size').';}';
        }

        // Custom style h2
        if(trim($this->params->get('h2font_family')) != 'none'){
            $h2font_family = explode(':', trim($this->params->get('h2font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $h2font_family[0]));
            $presetCss .= 'h2 {font-family: "'.$h2font_family[0].'";}';
        }
        if(trim($this->params->get('h2_color')) != ''){
            $presetCss .= 'h2 {color: '.$this->params->get('h2_color').';}';
        }
        if(trim($this->params->get('h2font_size')) != ''){
            $presetCss .= 'h2 {font-size: '.$this->params->get('h2font_size').';}';
        }    
        
        // Custom style h3
        if(trim($this->params->get('h3font_family')) != 'none'){
            $h3font_family = explode(':', trim($this->params->get('h3font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $h3font_family[0]));
            $presetCss .= 'h3 {font-family: "'.$h3font_family[0].'";}';
        }
        if(trim($this->params->get('h3_color')) != ''){
            $presetCss .= 'h3 {color: '.$this->params->get('h3_color').';}';
        }
        if(trim($this->params->get('h3font_size')) != ''){
            $presetCss .= 'h3 {font-size: '.$this->params->get('h3font_size').';}';
        }
        
        // Custom style h4
        if(trim($this->params->get('h4font_family')) != 'none'){
            $h4font_family = explode(':', trim($this->params->get('h4font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $h4font_family[0]));
            $presetCss .= 'h4 {font-family: "'.$h4font_family[0].'";}';
        }
        if(trim($this->params->get('h4_color')) != ''){
            $presetCss .= 'h4 {color: '.$this->params->get('h4_color').';}';
        }
        if(trim($this->params->get('h4font_size')) != ''){
            $presetCss .= 'h4 {font-size: '.$this->params->get('h4font_size').';}';
        }
        
        // Custom style h5
        if(trim($this->params->get('h5font_family')) != 'none'){
            $h5font_family = explode(':', trim($this->params->get('h5font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $h5font_family[0]));
            $presetCss .= 'h5 {font-family: "'.$h5font_family[0].'";}';
        }
        if(trim($this->params->get('h5_color')) != ''){
            $presetCss .= 'h5 {color: '.$this->params->get('h5_color').';}';
        }
        if(trim($this->params->get('h5font_size')) != ''){
            $presetCss .= 'h5 {font-size: '.$this->params->get('h5font_size').';}';
        }
        
        // Custom style h6
        if(trim($this->params->get('h6font_family')) != 'none'){
            $h6font_family = explode(':', trim($this->params->get('h6font_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $h6font_family[0]));
            $presetCss .= 'h6 {font-family: "'.$h6font_family[0].'";}';
        }
        if(trim($this->params->get('h6_color')) != ''){
            $presetCss .= 'h6 {color: '.$this->params->get('h6_color').';}';
        }
        if(trim($this->params->get('h6font_size')) != ''){
            $presetCss .= 'h6 {font-size: '.$this->params->get('h6font_size').';}';
        }
    }
    
    //+++++++++++++++++++Configuration MainMenu++++++++++++++++++++
    if($this->params->get('CustomMainMenu') == 1){
        if(trim($this->params->get('mainnavfont_family')) != 'none'){
            $mainnavfont_family = explode(':', trim($this->params->get('mainnavfont_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $mainnavfont_family[0]));
            $presetCss .= '#ot-mainmenu ul.menu li a {font-family: "'.$mainnavfont_family[0].'";}';
        }
        if(trim($this->params->get('mainnav_color')) != ''){
            $presetCss .= '#ot-mainmenu ul.menu li a {color: '.$this->params->get('mainnav_color').';}';
        }
        if(trim($this->params->get('mainnavfont_size')) != ''){
            $presetCss .= '#ot-mainmenu ul.menu li a {font-size: '.$this->params->get('mainnavfont_size').';}';
        }
    }
    
    //+++++++++++++++++++Configuration Blcokquote++++++++++++++++++++
    if($this->params->get('CustomBlockquote') == 1){
        if(trim($this->params->get('blockquotefont_family')) != 'none'){
            $blockquotefont_family = explode(':', trim($this->params->get('blockquotefont_family')));
            $this->addStyleSheet('http://fonts.googleapis.com/css?family=' . str_replace( ' ', '+', $blockquotefont_family[0]));
            $presetCss .= 'blockquote {font-family: "'.$blockquotefont_family[0].'";}';
        }
        if(trim($this->params->get('blockquote_color')) != ''){
            $presetCss .= 'blockquote {color: '.$this->params->get('blockquote_color').';}';
        }
        if(trim($this->params->get('blockquotefont_size')) != ''){
            $presetCss .= 'blockquote {font-size: '.$this->params->get('blockquotefont_size').';}';
        }
    }
    
    //Include CSS of Configuration Params
    $this->addStyleDeclaration($presetCss);
    $this->addStyleDeclaration($topboxes_additional_class);
    
    // Load mootools
    JHTML::_('behavior.mootools');
    
    //Load Mootools MenuDropdown
    $this->addScript($template_url.'/scripts/menudropdown.js');
    
    // load others js
    //$this->addScript($template_url.'/scripts/otscript.js');
    
    // ie9 fix
    if (isIe(9))
    {
        $css = '<link rel="stylesheet" href="%s" type="text/css" />';
        $ie9[] = sprintf($css, $template_url.'/css/ie9.css');
        $this->addCustomTag('<!--[if IE 9]>'.implode("\n", $ie9).'<![endif]-->');
    }
    
    // ie8 fix
    if (isIe(8))
    {
        $css = '<link rel="stylesheet" href="%s" type="text/css" />';
        $ie8[] = sprintf($css, $template_url.'/css/ie8.css');
        $this->addCustomTag('<!--[if IE 8]>'.implode("\n", $ie8).'<![endif]-->');
    }
    
    // ie7 fix
    if (isIe(7))
    {
        $css = '<link rel="stylesheet" href="%s" type="text/css" />';
        $ie7[] = sprintf($css, $template_url.'/css/ie7.css');
        $this->addCustomTag('<!--[if IE 7]>'.implode("\n", $ie7).'<![endif]-->');
    }
?>

I would like to continue using this template, is there any way to modify the script to solve the conflict?

Thanks in advance
Diego

J2.5.4 F3.0.5.2 Github 4 June 2012
 
Opened the thread again, as someone was asking in the chatbox how this was solved.

@pseo, if Guzman doesn't respond, I'll need to see your page to debug.

-- hugh
 
Thanks cheesegrits!!!
I will wait for a solution from Guzman... than I will post my page!
 
cheesegrits said:
Opened the thread again, as someone was asking in the chatbox how this was solved.

@pseo, if Guzman doesn't respond, I'll need to see your page to debug.

-- hugh
Click to expand...

So, i show the problem! Can you help me with 3 problems?
This is my site:
http://www.studiolamburghini.it/2013-02-04-16-24-03/elenco-fornitori
http://www.studiolamburghini.it/2013-02-04-16-24-03/elenco-fabbricati

1) How can i solve the template error?
2) When i open the develop tool in chrome, i read an error in Console:
GET http://www.studiolamburghini.it//co...mplate_css.php?c=3_com_fabrik_3&buttoncount=1 500 (Internal Server Error) elenco-fabbricati:13
Click to expand...
3) In table "fabbricati", with the element "elettricista" i use the DATABASEJOIN (this read the value inside "fornitori"), but when i create a new line with a value of "elettricista", I view two value of the same FABBRICATO with both value of ELETTRICISTA, why? I read the mysql table and i have only one record for that FABBRICATO.
where is the error???
Joins where and/or order by statement (SQL)
WHERE {tabella_fornitori___attivita}='5'
Click to expand...

Thank you very much!!!

EDIT: Joomla 2.5.9
Fabrik 3.0.6 (pkg_fabrik_3.0.6.3 no GitHub update)
Template OmegaTheme OT Appoz
 
You must log in or register to reply here.

Useful links

  • Create a Fabrik Account (Downloads)
  • Create a Forum Account
  • Fabrik Wiki
  • Fabrik 4 Changelog /Install /Upgrade
    • We are in need of some funding.
    More details.

    Thank you.

    Members online

    Total: 82 (members: 4, guests: 78)
    Back
    Top