T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
  1. Jon Buckner
  2. General Discussion
  3. Monday, 14 July 2014
  4.  Subscribe via email
T3-Framework: 2.3.0
Template: T3 Bs3 Blank 2.1.5

Off-Canvas toggle still has issue, to remind people of the solution:

Here is the info:
https://github.com/t3framework/t3/issues/321

Here is the location for the files:
/plugins/system/t3/base-bs3/js/

The complete code for each file is below:

Amended jquery.tap.min.js file ( to replace the existing file)
!function(a,b){"use strict";var c,d,e,f="._tap",g="._tapActive",h="tap",i="clientX clientY screenX screenY pageX pageY".split(" "),j={count:0,event:0},k=function(a,c){var d=c.originalEvent,e=b.Event(d);e.type=a;for(var f=0,g=i.length;g>f;f++)e[i[f]]=c[i[f]];return e},l=function(a){if(a.isTrigger)return!1;var c=j.event,d=Math.abs(a.pageX-c.pageX),e=Math.abs(a.pageY-c.pageY),f=Math.max(d,e);return a.timeStamp-c.timeStamp<b.tap.TIME_DELTA&&f<b.tap.POSITION_DELTA&&(!c.touches||1===j.count)&&o.isTracking},m=function(a){if(!e)return!1;var c=Math.abs(a.pageX-e.pageX),d=Math.abs(a.pageY-e.pageY),f=Math.max(c,d);return Math.abs(a.timeStamp-e.timeStamp)<750&&f<b.tap.POSITION_DELTA},n=function(a){if(0===a.type.indexOf("touch")){a.touches=a.originalEvent.changedTouches;for(var b=a.touches[0],c=0,d=i.length;d>c;c++)a[i[c]]=b[i[c]]}a.timeStamp=Date.now?Date.now():+new Date},o={isEnabled:!1,isTracking:!1,enable:function(){o.isEnabled||(o.isEnabled=!0,c=b(a.body).on("touchstart"+f,o.onStart).on("mousedown"+f,o.onStart).on("click"+f,o.onClick))},disable:function(){o.isEnabled&&(o.isEnabled=!1,c.off(f))},onStart:function(a){a.isTrigger||(n(a),(!b.tap.LEFT_BUTTON_ONLY||a.touches||1===a.which)&&(a.touches&&(j.count=a.touches.length),o.isTracking||(a.touches||!m(a))&&(o.isTracking=!0,j.event=a,a.touches?(e=a,c.on("touchend"+f+g,o.onEnd).on("touchcancel"+f+g,o.onCancel)):c.on("mouseup"+f+g,o.onEnd))))},onEnd:function(a){var c;a.isTrigger||(n(a),l(a)&&(c=k(h,a),d=c,b(j.event.target).trigger(c)),o.onCancel(a))},onCancel:function(a){a&&"touchcancel"===a.type&&a.preventDefault(),o.isTracking=!1,c.off(g)},onClick:function(a){return!a.isTrigger&&d&&d.isDefaultPrevented()&&d.target===a.target&&d.pageX===a.pageX&&d.pageY===a.pageY&&a.timeStamp-d.timeStamp<750?(d=null,!1):void 0}};b(a).ready(o.enable),b.tap={POSITION_DELTA:10,TIME_DELTA:400,LEFT_BUTTON_ONLY:!0}}(document,jQuery);


Amended off-canvas.js file (to replace existing file)
/**
*------------------------------------------------------------------------------
* @package T3 Framework for Joomla!
*------------------------------------------------------------------------------
* @copyright Copyright (C) 2004-2013 JoomlArt.com. All Rights Reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
* @authors JoomlArt, JoomlaBamboo, (contribute to this project at github
* & Google group to become co-author)
* @Google group: https://groups.google.com/forum/#!forum/t3fw
* @Link: http://t3-framework.org
*------------------------------------------------------------------------------
*/

jQuery (document).ready(function($){
// fix for old ie
if (/MSIE\s([\d.]+)/.test(navigator.userAgent) ? new Number(RegExp.$1) < 10 : false) {
$('html').addClass ('old-ie');
} else if(/constructor/i.test(window.HTMLElement)){
$('html').addClass('safari');
}

var $wrapper = $('body'),
$inner = $('.t3-wrapper'),
$toggles = $('.off-canvas-toggle'),
$offcanvas = $('.t3-off-canvas'),
$close = $('.t3-off-canvas .close'),
$btn=null,
$nav=null,
direction = 'left',
$fixed = null;
// no wrapper, just exit
if (!$wrapper.length) return ;

// add effect class for nav
$toggles.each (function () {
var $this = $(this),
$nav = $($this.data('nav')),
effect = $this.data('effect'),
direction = ($('html').attr('dir') == 'rtl' && $this.data('pos')!='right') || ($('html').attr('dir') != 'rtl' && $this.data('pos')=='right') ? 'right':'left';
$nav.addClass (effect).addClass ('off-canvas-'+direction);

// move to outside wrapper-content
var inside_effect = ['off-canvas-effect-3','off-canvas-effect-16','off-canvas-effect-7','off-canvas-effect-8','off-canvas-effect-14'];
if ($.inArray(effect, inside_effect) == -1) {
$inner.before($nav);
} else {
$inner.prepend($nav);
}
});

$toggles.on('tap', function(e){
// detect direction

stopBubble (e);

if ($wrapper.hasClass ('off-canvas-open')) {
oc_hide (e);
return false;
}

$btn = $(this);
$nav = $($btn.data('nav'));
$fixed = $inner.find('*').filter (function() {return $(this).css("position";) === 'fixed';});

$nav.addClass ('off-canvas-current');

direction = ($('html').attr('dir') == 'rtl' && $btn.data('pos')!='right') || ($('html').attr('dir') != 'rtl' && $btn.data('pos')=='right') ? 'right':'left';

// add direction class to body
// $('html').removeClass ('off-canvas-left off-canvas-right').addClass ('off-canvas-' + direction);

$offcanvas.height($(window).height());

// disable scroll event
var events = $(window).data('events');
if (events && events.scroll && events.scroll.length) {
// store current handler for scroll
var handlers = [];
for (var i=0; i<events.scroll.length; i++){
handlers[i] = events.scroll[i].handler;
}
$(window).data('scroll-events', handlers);
$(window).off ('scroll');
}
// disable scroll on page
var scrollTop = ($('html').scrollTop()) ? $('html').scrollTop() : $('body').scrollTop(); // Works for Chrome, Firefox, IE...
$('html').addClass('noscroll').css('top',-scrollTop).data('top', scrollTop);
$('.t3-off-canvas').css('top',scrollTop);

// make the fixed element become absolute
$fixed.each (function () {
var $this = $(this),
$parent = $this.parent(),
mtop = 0;
// find none static parent
while (!$parent.is($inner) && $parent.css("position";) === 'static') $parent = $parent.parent();
mtop = -$parent.offset().top;
$this.css ({'position': 'absolute', 'margin-top': mtop});
});

$wrapper.scrollTop (scrollTop);
// update effect class
$wrapper[0].className = $wrapper[0].className.replace (/\s*off\-canvas\-effect\-\d+\s*/g, ' ').trim() +
' ' + $btn.data('effect') + ' ' + 'off-canvas-' + direction;

setTimeout(oc_show, 50);

return false;
});
var oc_show = function () {
$wrapper.addClass ('off-canvas-open');
$inner.on ('click', oc_hide);
$close.on ('click', oc_hide);
$offcanvas.on ('click', stopBubble);

// fix for old ie
if ($.browser.msie && $.browser.version < 10) {
var p1 = {}, p2 = {};
p1['padding-'+direction] = $('.t3-off-canvas').width();
p2[direction] = 0;
$inner.animate (p1);
$nav.animate (p2);
}
};

var oc_hide = function () {

//remove events
$inner.off ('click', oc_hide);
$close.off ('click', oc_hide);
$offcanvas.off ('click', stopBubble);

//delay for click action
setTimeout(function(){
$wrapper.removeClass ('off-canvas-open');
}, 100);

setTimeout (function (){
$wrapper.removeClass ($btn.data('effect')).removeClass ('off-canvas-'+direction);
$wrapper.scrollTop (0);
// enable scroll
$('html').removeClass ('noscroll').css('top', '');
$('html,body').scrollTop ($('html').data('top'));
$nav.removeClass ('off-canvas-current');
// restore fixed elements
$fixed.css ({'position': '', 'margin-top': ''});
// re-enable scroll
if ($(window).data('scroll-events')) {
var handlers = $(window).data('scroll-events');
for (var i=0; i<handlers.length; i++) {
$(window).on ('scroll', handlers[i]);
}
$(window).data('scroll-events', null);
}
}, 550);

// fix for old ie
if ($('html').hasClass ('old-ie')) {
var p1 = {}, p2 = {};
p1['padding-'+direction] = 0;
p2[direction] = -$('.t3-off-canvas').width();
$inner.animate (p1);
$nav.animate (p2);
}
};

var stopBubble = function (e) {
e.stopPropagation();
return true;
}
})

Jon
Comment
There are no comments made yet.
Accepted Answer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi, please check the commit: https://github.com/t3framework/t3/commit/901049bcea910e155a334d6cfe76f56d43b9e1cc
Hope it's what you expect.

Gardner.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # Permalink
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Jon,

It's absolutely great, I will have discussion with dev team about this.

Gardner.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.