Folder reorganize 1
This commit is contained in:
Rucus
309
OLD/OLD Trends/script.responsive.js
Normal file
309
OLD/OLD Trends/script.responsive.js
Normal file
@@ -0,0 +1,309 @@
|
||||
/* Created by Artisteer v4.0.0.58475 */
|
||||
/*jshint forin:true, noarg:true, noempty:true, eqeqeq:true, bitwise:true, strict:true, undef:true, curly:false, browser:true, jquery:false */
|
||||
/*global jQuery */
|
||||
|
||||
var responsiveDesign = {
|
||||
isResponsive: false,
|
||||
isDesktop: false,
|
||||
isTablet: false,
|
||||
isPhone: false,
|
||||
windowWidth: 0,
|
||||
responsive: function () {
|
||||
'use strict';
|
||||
var html = jQuery("html");
|
||||
this.windowWidth = jQuery(window).width();
|
||||
var triggerEvent = false;
|
||||
|
||||
var isRespVisible = jQuery("#art-resp").is(":visible");
|
||||
if (isRespVisible && !this.isResponsive) {
|
||||
html.addClass("responsive").removeClass("desktop");
|
||||
this.isResponsive = true;
|
||||
this.isDesktop = false;
|
||||
triggerEvent = true;
|
||||
} else if (!isRespVisible && !this.isDesktop) {
|
||||
html.addClass("desktop").removeClass("responsive responsive-tablet responsive-phone");
|
||||
this.isResponsive = this.isTablet = this.isPhone = false;
|
||||
this.isDesktop = true;
|
||||
triggerEvent = true;
|
||||
}
|
||||
|
||||
if (this.isResponsive) {
|
||||
if (jQuery("#art-resp-t").is(":visible") && !this.isTablet) {
|
||||
html.addClass("responsive-tablet").removeClass("responsive-phone");
|
||||
this.isTablet = true;
|
||||
this.isPhone = false;
|
||||
triggerEvent = true;
|
||||
} else if (jQuery("#art-resp-m").is(":visible") && !this.isPhone) {
|
||||
html.addClass("responsive-phone").removeClass("responsive-tablet");
|
||||
this.isTablet = false;
|
||||
this.isPhone = true;
|
||||
triggerEvent = true;
|
||||
}
|
||||
}
|
||||
|
||||
if (triggerEvent) {
|
||||
jQuery(window).trigger("responsive", this);
|
||||
}
|
||||
|
||||
jQuery(window).trigger("responsiveResize", this);
|
||||
},
|
||||
initialize: function () {
|
||||
"use strict";
|
||||
jQuery("<div id=\"art-resp\"><div id=\"art-resp-m\"></div><div id=\"art-resp-t\"></div></div>").appendTo("body");
|
||||
jQuery(window).resize(function () {
|
||||
responsiveDesign.responsive();
|
||||
});
|
||||
jQuery(window).trigger("resize");
|
||||
}
|
||||
};
|
||||
|
||||
function responsiveAbsBg(responsiveDesign, el, bg) {
|
||||
"use strict";
|
||||
if (bg.length === 0)
|
||||
return;
|
||||
|
||||
var desktopBgTop = bg.attr("data-bg-top");
|
||||
var desktopBgHeight = bg.attr("data-bg-height");
|
||||
|
||||
if (responsiveDesign.isResponsive) {
|
||||
if (typeof desktopBgTop === "undefined" || desktopBgTop === false) {
|
||||
bg.attr("data-bg-top", bg.css("top"));
|
||||
bg.attr("data-bg-height", bg.css("height"));
|
||||
}
|
||||
|
||||
var elTop = el.offset().top;
|
||||
var elHeight = el.outerHeight();
|
||||
bg.css("top", elTop + "px");
|
||||
bg.css("height", elHeight + "px");
|
||||
} else if (typeof desktopBgTop !== "undefined" && desktopBgTop !== false) {
|
||||
bg.css("top", desktopBgTop);
|
||||
bg.css("height", desktopBgHeight);
|
||||
bg.removeAttr("data-bg-top");
|
||||
bg.removeAttr("data-bg-height");
|
||||
}
|
||||
}
|
||||
|
||||
jQuery(window).bind("responsive", function (event, responsiveDesign) {
|
||||
'use strict';
|
||||
responsiveCollages(responsiveDesign);
|
||||
responsiveImages(responsiveDesign);
|
||||
responsiveVideos(responsiveDesign);
|
||||
});
|
||||
|
||||
function responsiveImages(responsiveDesign) {
|
||||
'use strict';
|
||||
jQuery("img[width]").each(function () {
|
||||
var img = jQuery(this), newWidth = "", newMaxWidth = "", newHeight = "";
|
||||
if (responsiveDesign.isResponsive) {
|
||||
newWidth = "auto";
|
||||
newHeight = "auto";
|
||||
newMaxWidth = "100%";
|
||||
|
||||
var widthAttr = img.attr("width");
|
||||
if (widthAttr !== null && typeof(widthAttr) === "string" && widthAttr.indexOf("%") === -1) {
|
||||
newWidth = "100%";
|
||||
newMaxWidth = parseInt(jQuery.trim(widthAttr), 10) + "px";
|
||||
}
|
||||
}
|
||||
img.css("width", newWidth).css("max-width", newMaxWidth).css("height", newHeight);
|
||||
});
|
||||
}
|
||||
|
||||
function responsiveCollages(responsiveDesign) {
|
||||
'use strict';
|
||||
if (jQuery.browser.msie && jQuery.browser.version <= 8) return;
|
||||
jQuery(".art-collage").each(function () {
|
||||
var collage = jQuery(this);
|
||||
var sliderObject = collage.find(".art-slider").data("slider");
|
||||
var responsiveImage = jQuery("img#" + collage.attr("id"));
|
||||
|
||||
if (responsiveDesign.isResponsive) {
|
||||
if (responsiveImage.length) { return true; }
|
||||
if (jQuery.support.transition) {
|
||||
collage.find(".art-slider").trigger(jQuery.support.transition.event);
|
||||
}
|
||||
if (sliderObject) {
|
||||
sliderObject.stop();
|
||||
}
|
||||
var activeSlide = collage.find(".art-slide-item.active");
|
||||
if (!activeSlide.length) {
|
||||
var slides = collage.find(".art-slide-item");
|
||||
if (slides.length) {
|
||||
activeSlide = jQuery(slides.get(0));
|
||||
}
|
||||
}
|
||||
activeSlide.css("background-image", "");
|
||||
var bg = activeSlide.css("background-image").replace(/url\(['"]?(.+?)['"]?\)/i, "$1");
|
||||
jQuery("<img>").attr({
|
||||
"src": bg,
|
||||
"id": collage.attr("id")
|
||||
}).insertBefore(collage);
|
||||
} else if (responsiveImage.length) {
|
||||
responsiveImage.remove();
|
||||
if (sliderObject) {
|
||||
if (sliderObject.settings.animation !== "fade") {
|
||||
collage.find(".art-slide-item").css("background-image", "none");
|
||||
}
|
||||
sliderObject.start();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function responsiveVideos(responsiveDesign) {
|
||||
"use strict";
|
||||
jQuery("iframe,object,embed").each(function () {
|
||||
var obj = jQuery(this);
|
||||
var container = obj.parent(".art-responsive-embed");
|
||||
if (responsiveDesign.isResponsive) {
|
||||
if (container.length !== 0)
|
||||
return;
|
||||
container = jQuery("<div class=\"art-responsive-embed\">").insertBefore(obj);
|
||||
obj.appendTo(container);
|
||||
} else if (container.length > 0) {
|
||||
obj.insertBefore(container);
|
||||
container.remove();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
jQuery(window).bind("responsiveResize", function (event, responsiveDesign) {
|
||||
"use strict";
|
||||
responsiveAbsBg(responsiveDesign, jQuery(".art-header"), jQuery("#art-header-bg"));
|
||||
});
|
||||
jQuery(window).bind("responsive", function (event, responsiveDesign) {
|
||||
"use strict";
|
||||
if (jQuery.browser.msie && jQuery.browser.version <= 8) return;
|
||||
responsiveHeader(responsiveDesign);
|
||||
});
|
||||
|
||||
function responsiveHeader(responsiveDesign) {
|
||||
"use strict";
|
||||
var header = jQuery("header.art-header");
|
||||
var headerShapes = header.find(".art-shapes");
|
||||
var headerSlider = header.find(".art-slider");
|
||||
|
||||
if (headerSlider.length) {
|
||||
var sliderObject = headerSlider.data("slider");
|
||||
|
||||
var activeSlide = headerSlider.find(".art-slide-item.active");
|
||||
if (!activeSlide.length) {
|
||||
var slides = headerSlider.find(".art-slide-item");
|
||||
if (slides.length) {
|
||||
activeSlide = jQuery(slides.get(0));
|
||||
}
|
||||
}
|
||||
|
||||
var textblock = headerSlider.find(".art-textblock").eq(0);
|
||||
|
||||
if (responsiveDesign.isResponsive) {
|
||||
if (header.attr("data-responsive")) return true;
|
||||
activeSlide.css("background-image", "");
|
||||
header.attr("data-responsive", "true");
|
||||
headerSlider.fadeOut(0);
|
||||
if (jQuery.support.transition) {
|
||||
headerSlider.trigger(jQuery.support.transition.event);
|
||||
}
|
||||
if (sliderObject) {
|
||||
sliderObject.stop();
|
||||
}
|
||||
if (header.find(".art-slogan, .art-headline").length === 0) {
|
||||
var tb = textblock.clone();
|
||||
tb.css("display", "block");
|
||||
tb.children("div").css("display", "block");
|
||||
tb.appendTo(headerShapes);
|
||||
}
|
||||
// activeslide background
|
||||
var bg = activeSlide.css("background-image").split(/\s*,\s*/);
|
||||
header.css("background-image", bg[bg.length - 1]);
|
||||
} else if (header.attr("data-responsive")) {
|
||||
header.removeAttr("data-responsive");
|
||||
header.css("background-image", "");
|
||||
if (sliderObject) {
|
||||
if (sliderObject.settings.animation !== "fade") {
|
||||
headerSlider.find(".art-slide-item").css("background-image", "none");
|
||||
}
|
||||
headerShapes.find(".art-textblock").remove();
|
||||
headerSlider.fadeIn(0);
|
||||
sliderObject.start();
|
||||
}
|
||||
}
|
||||
} else if (header.find(".art-slogan, .art-headline").length === 0) {
|
||||
header.find(".art-textblock").each(function () {
|
||||
jQuery(this).add(jQuery(this).children("div")).css("display", responsiveDesign.isResponsive ? "inline-block" : "");
|
||||
return false; // break
|
||||
});
|
||||
jQuery(window).trigger("resize");
|
||||
}
|
||||
}
|
||||
|
||||
jQuery(window).bind("responsiveResize", function (event, responsiveDesign) {
|
||||
"use strict";
|
||||
responsiveAbsBg(responsiveDesign, jQuery("nav.art-nav"), jQuery("#art-hmenu-bg"));
|
||||
responsiveNavFit(responsiveDesign);
|
||||
});
|
||||
|
||||
function responsiveNavFit(responsiveDesign) {
|
||||
'use strict';
|
||||
var nav = jQuery("nav.art-nav");
|
||||
var isDesktopNav = true;
|
||||
var isResponsiveNav = false;
|
||||
if (responsiveDesign.isResponsive) {
|
||||
if (!nav.hasClass("responsive-nav")) {
|
||||
var itemsWidth = 0;
|
||||
var menu = nav.find(".art-hmenu");
|
||||
menu.children("li").each(function() {
|
||||
itemsWidth += jQuery(this).outerWidth(true);
|
||||
});
|
||||
|
||||
if (menu.width() < itemsWidth || responsiveDesign.isPhone) {
|
||||
nav.attr("data-restore-width", responsiveDesign.windowWidth).addClass("responsive-nav").removeClass("desktop-nav");
|
||||
isResponsiveNav = true;
|
||||
isDesktopNav = false;
|
||||
}
|
||||
} else {
|
||||
var desktopRestoreWidth = parseInt(nav.attr("data-restore-width"), 10) || 0;
|
||||
if (desktopRestoreWidth !== 0 && responsiveDesign.windowWidth <= desktopRestoreWidth) {
|
||||
isResponsiveNav = true;
|
||||
isDesktopNav = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (isDesktopNav) {
|
||||
nav.removeClass("responsive-nav").addClass("desktop-nav").removeAttr("data-restore-width");
|
||||
}
|
||||
|
||||
jQuery(window).trigger("responsiveNav", {isDesktopNav: isDesktopNav, isResponsiveNav: isResponsiveNav});
|
||||
}
|
||||
|
||||
|
||||
|
||||
jQuery(window).bind("responsive", function (event, responsiveDesign) {
|
||||
"use strict";
|
||||
responsiveLayoutCell(responsiveDesign);
|
||||
});
|
||||
|
||||
function responsiveLayoutCell(responsiveDesign) {
|
||||
"use strict";
|
||||
jQuery(".art-content .art-content-layout-row,.art-footer .art-content-layout-row").each(function () {
|
||||
var row = jQuery(this);
|
||||
var rowChildren = row.children(".art-layout-cell");
|
||||
if (rowChildren.length > 1) {
|
||||
if (responsiveDesign.isTablet) {
|
||||
rowChildren.addClass("responsive-tablet-layout-cell").each(function (i) {
|
||||
if ((i + 1) % 2 === 0) {
|
||||
jQuery(this).after("<div class=\"cleared responsive-cleared\">");
|
||||
}
|
||||
});
|
||||
} else {
|
||||
rowChildren.removeClass("responsive-tablet-layout-cell");
|
||||
row.children(".responsive-cleared").remove();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
jQuery(responsiveDesign.initialize);
|
||||
Reference in New Issue
Block a user