|
// Avoid `console` errors in browsers that lack a console. |
|
(function() { |
|
var method; |
|
var noop = function() {}; |
|
var methods = [ |
|
'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error', |
|
'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log', |
|
'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd', |
|
'timeStamp', 'trace', 'warn' |
|
]; |
|
var length = methods.length; |
|
var console = (window.console = window.console || {}); |
|
|
|
while (length--) { |
|
method = methods[length]; |
|
|
|
// Only stub undefined methods. |
|
if (!console[method]) { |
|
console[method] = noop; |
|
} |
|
} |
|
}()); |
|
|
|
// Place any jQuery/helper plugins in here. |
|
|
|
/*global jQuery */ |
|
/*! |
|
* Lettering.JS 0.6.1 |
|
* |
|
* Copyright 2010, Dave Rupert http://daverupert.com |
|
* Released under the WTFPL license |
|
* http://sam.zoy.org/wtfpl/ |
|
* |
|
* Thanks to Paul Irish - http://paulirish.com - for the feedback. |
|
* |
|
* Date: Mon Sep 20 17:14:00 2010 -0600 |
|
*/ |
|
(function($) { |
|
function injector(t, splitter, klass, after) { |
|
var text = t.text(), |
|
a = text.split(splitter), |
|
inject = ''; |
|
if (a.length) { |
|
$(a).each(function(i, item) { |
|
inject += '<span class="' + klass + (i + 1) + '" aria-hidden="true">' + item + '</span>' + after; |
|
}); |
|
t.attr('aria-label', text) |
|
.empty() |
|
.append(inject) |
|
|
|
} |
|
} |
|
|
|
var methods = { |
|
init: function() { |
|
|
|
return this.each(function() { |
|
injector($(this), '', 'char', ''); |
|
}); |
|
|
|
}, |
|
|
|
words: function() { |
|
|
|
return this.each(function() { |
|
injector($(this), ' ', 'word', ' '); |
|
}); |
|
|
|
}, |
|
|
|
lines: function() { |
|
|
|
return this.each(function() { |
|
var r = "eefec303079ad17405c889e092e105b0"; |
|
// Because it's hard to split a <br/> tag consistently across browsers, |
|
// (*ahem* IE *ahem*), we replace all <br/> instances with an md5 hash |
|
// (of the word "split"). If you're trying to use this plugin on that |
|
// md5 hash string, it will fail because you're being ridiculous. |
|
injector($(this).children("br").replaceWith(r).end(), r, 'line', ''); |
|
}); |
|
|
|
} |
|
}; |
|
|
|
$.fn.lettering = function(method) { |
|
// Method calling logic |
|
if (method && methods[method]) { |
|
return methods[method].apply(this, [].slice.call(arguments, 1)); |
|
} else if (method === 'letters' || !method) { |
|
return methods.init.apply(this, [].slice.call(arguments, 0)); // always pass an array |
|
} |
|
$.error('Method ' + method + ' does not exist on jQuery.lettering'); |
|
return this; |
|
}; |
|
|
|
})(jQuery); |
|
|
|
/*global jQuery */ |
|
/*! |
|
* FitText.js 1.1 |
|
* |
|
* Copyright 2011, Dave Rupert http://daverupert.com |
|
* Released under the WTFPL license |
|
* http://sam.zoy.org/wtfpl/ |
|
* |
|
* Date: Thu May 05 14:23:00 2011 -0600 |
|
*/ |
|
|
|
(function($) { |
|
|
|
$.fn.fitText = function(kompressor, options) { |
|
|
|
// Setup options |
|
var compressor = kompressor || 1, |
|
settings = $.extend({ |
|
'minFontSize': Number.NEGATIVE_INFINITY, |
|
'maxFontSize': Number.POSITIVE_INFINITY |
|
}, options); |
|
|
|
return this.each(function() { |
|
|
|
// Store the object |
|
var $this = $(this); |
|
|
|
// Resizer() resizes items based on the object width divided by the compressor * 10 |
|
var resizer = function() { |
|
$this.css('font-size', Math.max(Math.min($this.width() / (compressor * 10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize))); |
|
}; |
|
|
|
// Call once to set. |
|
resizer(); |
|
|
|
// Call on resize. Opera debounces their resize by default. |
|
$(window).on('resize', resizer); |
|
|
|
}); |
|
|
|
}; |
|
|
|
})(jQuery); |
|
/* |
|
* CircleType 0.36 |
|
* Peter Hrynkow |
|
* Copyright 2014, Licensed GPL & MIT |
|
* |
|
*/ |
|
|
|
$.fn.circleType = function(options) { |
|
|
|
var self = this, |
|
settings = { |
|
dir: 1, |
|
position: 'relative', |
|
}; |
|
if (typeof($.fn.lettering) !== 'function') { |
|
console.log('Lettering.js is required'); |
|
return; |
|
} |
|
return this.each(function() { |
|
|
|
if (options) { |
|
$.extend(settings, options); |
|
} |
|
var elem = this, |
|
delta = (180 / Math.PI), |
|
fs = parseInt($(elem).css('font-size'), 10), |
|
ch = parseInt($(elem).css('line-height'), 10) || fs, |
|
txt = elem.innerHTML.replace(/^\s+|\s+$/g, '').replace(/\s/g, ' '), |
|
letters, |
|
center; |
|
|
|
elem.innerHTML = txt |
|
$(elem).lettering(); |
|
|
|
elem.style.position = settings.position; |
|
|
|
letters = elem.getElementsByTagName('span'); |
|
center = Math.floor(letters.length / 2) |
|
|
|
var layout = function() { |
|
var tw = 0, |
|
i, |
|
offset = 0, |
|
minRadius, |
|
origin, |
|
innerRadius, |
|
l, style, r, transform; |
|
|
|
for (i = 0; i < letters.length; i++) { |
|
tw += letters[i].offsetWidth; |
|
} |
|
minRadius = (tw / Math.PI) / 2 + ch; |
|
|
|
if (settings.fluid && !settings.fitText) { |
|
settings.radius = Math.max(elem.offsetWidth / 2, minRadius); |
|
} else if (!settings.radius) { |
|
settings.radius = minRadius; |
|
} |
|
|
|
if (settings.dir === -1) { |
|
origin = 'center ' + (-settings.radius + ch) / fs + 'em'; |
|
} else { |
|
origin = 'center ' + settings.radius / fs + 'em'; |
|
} |
|
|
|
innerRadius = settings.radius - ch; |
|
|
|
for (i = 0; i < letters.length; i++) { |
|
l = letters[i]; |
|
offset += l.offsetWidth / 2 / innerRadius * delta; |
|
l.rot = offset; |
|
offset += l.offsetWidth / 2 / innerRadius * delta; |
|
} |
|
for (i = 0; i < letters.length; i++) { |
|
l = letters[i] |
|
style = l.style |
|
r = (-offset * settings.dir / 2) + l.rot * settings.dir |
|
transform = 'rotate(' + r + 'deg)'; |
|
|
|
style.position = 'absolute'; |
|
style.left = '50%'; |
|
style.marginLeft = -(l.offsetWidth / 2) / fs + 'em'; |
|
|
|
style.webkitTransform = transform; |
|
style.MozTransform = transform; |
|
style.OTransform = transform; |
|
style.msTransform = transform; |
|
style.transform = transform; |
|
|
|
style.webkitTransformOrigin = origin; |
|
style.MozTransformOrigin = origin; |
|
style.OTransformOrigin = origin; |
|
style.msTransformOrigin = origin; |
|
style.transformOrigin = origin; |
|
if (settings.dir === -1) { |
|
style.bottom = 0; |
|
} |
|
} |
|
|
|
if (settings.fitText) { |
|
if (typeof($.fn.fitText) !== 'function') { |
|
console.log('FitText.js is required when using the fitText option'); |
|
} else { |
|
$(elem).fitText(); |
|
$(window).resize(function() { |
|
updateHeight(); |
|
}); |
|
} |
|
} |
|
updateHeight(); |
|
|
|
if (typeof settings.callback === 'function') { |
|
// Execute our callback with the element we transformed as `this` |
|
settings.callback.apply(elem); |
|
} |
|
}; |
|
|
|
var getBounds = function(elem) { |
|
var docElem = document.documentElement, |
|
box = elem.getBoundingClientRect(); |
|
return { |
|
top: box.top + window.pageYOffset - docElem.clientTop, |
|
left: box.left + window.pageXOffset - docElem.clientLeft, |
|
height: box.height |
|
}; |
|
}; |
|
|
|
var updateHeight = function() { |
|
var mid = getBounds(letters[center]), |
|
first = getBounds(letters[0]), |
|
h; |
|
if (mid.top < first.top) { |
|
h = first.top - mid.top + first.height; |
|
} else { |
|
h = mid.top - first.top + first.height; |
|
} |
|
elem.style.height = h + 'px'; |
|
} |
|
|
|
if (settings.fluid && !settings.fitText) { |
|
$(window).resize(function() { |
|
layout(); |
|
}); |
|
} |
|
|
|
if (document.readyState !== "complete") { |
|
elem.style.visibility = 'hidden'; |
|
$(window).load(function() { |
|
elem.style.visibility = 'visible'; |
|
layout(); |
|
}); |
|
} else { |
|
layout(); |
|
} |
|
}); |
|
};; |
|
(function(factory) { |
|
if (typeof define === 'function' && define.amd) { |
|
define(['jquery'], factory); |
|
} else if (typeof exports === 'object') { |
|
module.exports = factory(require("jquery")); |
|
} else { |
|
factory(jQuery); |
|
} |
|
} |
|
(function($) { |
|
var pluginName = "tinycircleslider", |
|
defaults = { |
|
interval: false, |
|
intervalTime: 3500, |
|
dotsSnap: false, |
|
dotsHide: true, |
|
radius: 140, |
|
start: 0, |
|
slides: [] |
|
}; |
|
|
|
function Plugin($container, options) { |
|
/** |
|
* The options of the carousel extend with the defaults. |
|
* |
|
* @property options |
|
* @type Object |
|
* @default defaults |
|
*/ |
|
this.options = $.extend({}, defaults, options); |
|
|
|
/** |
|
* @property _defaults |
|
* @type Object |
|
* @private |
|
* @default defaults |
|
*/ |
|
this._defaults = defaults; |
|
|
|
/** |
|
* @property _name |
|
* @type String |
|
* @private |
|
* @final |
|
* @default 'tinycircleslider' |
|
*/ |
|
this._name = pluginName; |
|
|
|
var self = this, |
|
$viewport = $container.find(".viewport"), |
|
$overview = $container.find(".overview"), |
|
$slides = $overview.children(), |
|
$thumb = $container.find(".thumb"), |
|
$dots = $container.find(".dot"), |
|
$links = $slides.find("a") |
|
|
|
, containerSize = { |
|
width: $container.outerWidth(true), |
|
height: $container.outerHeight(true) |
|
}, slideSize = { |
|
width: $slides.first().outerWidth(true), |
|
height: $slides.first().outerHeight(true) |
|
}, thumbSize = { |
|
width: $thumb.outerWidth(true), |
|
height: $thumb.outerHeight(true) |
|
}, dotSize = { |
|
width: $dots.outerWidth(), |
|
height: $dots.outerHeight() |
|
} |
|
|
|
, intervalTimer = null, animationTimer = null, touchEvents = 'ontouchstart' in window, isTouchEvent = false, hasRequestAnimationFrame = 'requestAnimationFrame' in window; |
|
|
|
/** |
|
* When dotsSnap is enabled every slide has a corresponding dot. |
|
* |
|
* @property dots |
|
* @type Array |
|
* @default [] |
|
*/ |
|
this.dots = []; |
|
|
|
/** |
|
* The index of the current slide. |
|
* |
|
* @property slideCurrent |
|
* @type Number |
|
* @default 0 |
|
*/ |
|
this.slideCurrent = 0; |
|
|
|
/** |
|
* The current angle in degrees |
|
* |
|
* @property angleCurrent |
|
* @type Number |
|
* @default 0 |
|
*/ |
|
this.angleCurrent = 0; |
|
|
|
/** |
|
* The number of slides the slider is currently aware of. |
|
* |
|
* @property slidesTotal |
|
* @type Number |
|
* @default 0 |
|
*/ |
|
this.slidesTotal = $slides.length; |
|
|
|
/** |
|
* If the interval is running the value will be true. |
|
* |
|
* @property intervalActive |
|
* @type Boolean |
|
* @default false |
|
*/ |
|
this.intervalActive = false; |
|
|
|
/** |
|
* @method _initialize |
|
* @private |
|
*/ |
|
function _initialize() { |
|
_setDots(); |
|
|
|
$overview |
|
.append($slides.first().clone()) |
|
.css("width", slideSize.width * ($slides.length + 1)); |
|
|
|
_setEvents(); |
|
|
|
_setCSS(0); |
|
self.move(self.options.start, self.options.interval); |
|
|
|
return self; |
|
} |
|
|
|
/** |
|
* @method _setEvents |
|
* @private |
|
*/ |
|
function _setEvents() { |
|
if (touchEvents) { |
|
$container[0].ontouchstart = _startDrag; |
|
$container[0].ontouchmove = _drag; |
|
$container[0].ontouchend = _endDrag; |
|
} |
|
|
|
$thumb.bind("mousedown", _startDrag); |
|
|
|
var snapHandler = function(event) { |
|
event.preventDefault(); |
|
event.stopImmediatePropagation(); |
|
|
|
self.stop(); |
|
self.move($(this).attr("data-slide-index")); |
|
|
|
return false; |
|
}; |
|
|
|
if (touchEvents) { |
|
$container.delegate(".dot", "touchstart", snapHandler); |
|
} |
|
$container.delegate(".dot", "mousedown", snapHandler); |
|
} |
|
|
|
/** |
|
* @method _setTimer |
|
* @private |
|
*/ |
|
function _setTimer(slideFirst) { |
|
intervalTimer = setTimeout(function() { |
|
self.move(self.slideCurrent + 1, true); |
|
}, (slideFirst ? 50 : self.options.intervalTime)); |
|
} |
|
|
|
/** |
|
* @method _toRadians |
|
* @private |
|
* @param {Number} [degrees] |
|
*/ |
|
function _toRadians(degrees) { |
|
return degrees * (Math.PI / 180); |
|
} |
|
|
|
/** |
|
* @method _toDegrees |
|
* @private |
|
* @param {Number} [radians] |
|
*/ |
|
function _toDegrees(radians) { |
|
return radians * 180 / Math.PI; |
|
} |
|
|
|
/** |
|
* @method _setDots |
|
* @private |
|
*/ |
|
function _setDots() { |
|
var docFragment = document.createDocumentFragment(); |
|
|
|
$dots.remove(); |
|
|
|
$slides.each(function(index, slide) { |
|
var $dotClone = null, |
|
angle = parseInt($(slide).attr("data-degrees"), 10) || (index * 360 / self.slidesTotal), |
|
position = { |
|
top: -Math.cos(_toRadians(angle)) * self.options.radius + containerSize.height / 2 - dotSize.height / 2, |
|
left: Math.sin(_toRadians(angle)) * self.options.radius + containerSize.width / 2 - dotSize.width / 2 |
|
}; |
|
|
|
if ($dots.length > 0) { |
|
$dotClone = $dots.clone(); |
|
$dotClone |
|
.addClass($(slide).attr("data-classname")) |
|
.css(position); |
|
|
|
docFragment.appendChild($dotClone[0]); |
|
} |
|
|
|
self.dots.push({ |
|
"angle": angle, |
|
"slide": slide, |
|
"dot": $dotClone |
|
}); |
|
}); |
|
|
|
self.dots.sort(function(dotA, dotB) { |
|
return dotA.angle - dotB.angle; |
|
}); |
|
|
|
$.each(self.dots, function(index, dot) { |
|
// custom |
|
if ($(dot.dot).length > 0) { |
|
if (index === 4) { |
|
$(dot.dot) |
|
.addClass("dot-" + (index + 1)) |
|
.attr('data-slide-index', index) |
|
.html("<h1><div class='flip text'>" + options.slides[index] + "</div><div class='flip-curve curve'> </div></h1>"); |
|
} else { |
|
$(dot.dot) |
|
.addClass("dot-" + (index + 1)) |
|
.attr('data-slide-index', index) |
|
.html("<h1><div class='text'>" + options.slides[index] + "</div></h1>"); |
|
} |
|
} |
|
|
|
}); |
|
|
|
$container.append(docFragment); |
|
// custom |
|
$('h1').each(function(i, text) { |
|
if ($(this).find('div').html() === "Norway") { |
|
$(this).find('div.text').circleType({ |
|
radius: 220, |
|
dir: -1 |
|
}); |
|
} else { |
|
$(this).find('div.text').circleType({ |
|
radius: 220 |
|
}); |
|
} |
|
}); |
|
|
|
$dots = $container.find(".dot"); |
|
} |
|
|
|
/** |
|
* If the interval is stopped start it. |
|
* |
|
* @method start |
|
* @chainable |
|
*/ |
|
this.start = function(first) { |
|
if (self.options.interval) { |
|
self.intervalActive = true; |
|
|
|
_setTimer(first); |
|
} |
|
return self; |
|
}; |
|
|
|
/** |
|
* If the interval is running stop it. |
|
* |
|
* @method stop |
|
* @chainable |
|
*/ |
|
this.stop = function() { |
|
self.intervalActive = false; |
|
|
|
clearTimeout(intervalTimer); |
|
|
|
return self; |
|
}; |
|
|
|
/** |
|
* @method _findShortestPath |
|
* @private |
|
* @param {Number} [angleA] |
|
* @param {Number} [angleB] |
|
*/ |
|
function _findShortestPath(angleA, angleB) { |
|
var angleCW, angleCCW, angleShortest; |
|
|
|
if (angleA > angleB) { |
|
angleCW = angleA - angleB; |
|
angleCCW = -(angleB + 360 - angleA); |
|
} else { |
|
angleCW = angleA + 360 - angleB; |
|
angleCCW = -(angleB - angleA); |
|
} |
|
|
|
angleShortest = angleCW < Math.abs(angleCCW) ? angleCW : angleCCW; |
|
|
|
return [angleShortest, angleCCW, angleCW]; |
|
} |
|
|
|
/** |
|
* @method _findClosestSlide |
|
* @private |
|
* @param {Number} [angle] |
|
*/ |
|
function _findClosestSlide(angle) { |
|
var closestDotAngleToAngleCCW = 9999, |
|
closestDotAngleToAngleCW = 9999, |
|
closestDotAngleToAngle = 9999, |
|
closestSlideCCW = 0, |
|
closestSlideCW = 0, |
|
closestSlide = 0; |
|
|
|
$.each(self.dots, function(index, dot) { |
|
var delta = _findShortestPath(dot.angle, angle); |
|
|
|
if (Math.abs(delta[0]) < Math.abs(closestDotAngleToAngle)) { |
|
closestDotAngleToAngle = delta[0]; |
|
closestSlide = index; |
|
} |
|
|
|
if (Math.abs(delta[1]) < Math.abs(closestDotAngleToAngleCCW)) { |
|
closestDotAngleToAngleCCW = delta[1]; |
|
closestSlideCCW = index; |
|
} |
|
|
|
if (Math.abs(delta[2]) < Math.abs(closestDotAngleToAngleCW)) { |
|
closestDotAngleToAngleCW = delta[2]; |
|
closestSlideCW = index; |
|
} |
|
}); |
|
|
|
return [ |
|
[closestSlide, closestSlideCCW, closestSlideCW], |
|
[closestDotAngleToAngle, closestDotAngleToAngleCCW, closestDotAngleToAngleCW] |
|
]; |
|
} |
|
|
|
/** |
|
* Move to a specific slide. |
|
* |
|
* @method move |
|
* @chainable |
|
* @param {Number} [index] The slide to move to. |
|
*/ |
|
this.move = function(index) { |
|
var slideIndex = Math.max(0, isNaN(index) ? self.slideCurrent : index); |
|
|
|
if (slideIndex >= self.slidesTotal) { |
|
slideIndex = 0; |
|
} |
|
|
|
var angleDestination = self.dots[slideIndex] && self.dots[slideIndex].angle, |
|
angleDelta = _findShortestPath(angleDestination, self.angleCurrent)[0], |
|
angleStep = angleDelta > 0 ? -2 : 2; |
|
|
|
self.slideCurrent = slideIndex; |
|
_stepMove(angleStep, angleDelta, 50); |
|
|
|
self.start(); |
|
|
|
return self; |
|
}; |
|
|
|
/** |
|
* @method _sanitizeAngle |
|
* @private |
|
* @param {Number} [degrees] |
|
*/ |
|
function _sanitizeAngle(degrees) { |
|
return (degrees < 0) ? 360 + (degrees % -360) : degrees % 360; |
|
} |
|
|
|
/** |
|
* @method _stepMove |
|
* @private |
|
* @param {Number} [angleStep] |
|
* @param {Number} [angleDelta] |
|
* @param {Boolean} [stepInterval] |
|
*/ |
|
function _stepMove(angleStep, angleDelta, stepInterval) { |
|
var angleStepNew = angleStep, |
|
endAnimation = false; |
|
|
|
if (Math.abs(angleStep) > Math.abs(angleDelta)) { |
|
angleStepNew = -angleDelta; |
|
endAnimation = true; |
|
} else if (hasRequestAnimationFrame) { |
|
requestAnimationFrame(function() { |
|
_stepMove(angleStepNew, angleDelta + angleStep); |
|
}); |
|
} else { |
|
animationTimer = setTimeout(function() { |
|
_stepMove(angleStepNew, angleDelta + angleStep, stepInterval * 0.9); |
|
}, stepInterval); |
|
} |
|
|
|
self.angleCurrent = _sanitizeAngle(self.angleCurrent - angleStepNew); |
|
|
|
_setCSS(self.angleCurrent, endAnimation); |
|
} |
|
|
|
/** |
|
* @method _page |
|
* @private |
|
* @param {Object} [event] |
|
*/ |
|
function _page(event) { |
|
return { |
|
x: isTouchEvent ? event.targetTouches[0].pageX : (event.pageX || event.clientX), |
|
y: isTouchEvent ? event.targetTouches[0].pageY : (event.pageY || event.clientY) |
|
}; |
|
} |
|
|
|
/** |
|
* @method _drag |
|
* @private |
|
* @param {Object} [event] |
|
*/ |
|
function _drag(event) { |
|
var containerOffset = $container.offset(), |
|
thumbPositionNew = { |
|
left: _page(event).x - containerOffset.left - (containerSize.width / 2), |
|
top: _page(event).y - containerOffset.top - (containerSize.height / 2) |
|
}; |
|
|
|
self.angleCurrent = _sanitizeAngle( |
|
_toDegrees( |
|
Math.atan2(thumbPositionNew.left, -thumbPositionNew.top) |
|
) |
|
); |
|
|
|
if (!hasRequestAnimationFrame) { |
|
_setCSS(self.angleCurrent); |
|
} |
|
|
|
return false; |
|
} |
|
|
|
/** |
|
* @method _setCSS |
|
* @private |
|
* @param {Number} [angle] |
|
* @param {Function} [fireCallback] |
|
*/ |
|
function _setCSS(angle, fireCallback) { |
|
closestSlidesAndAngles = _findClosestSlide(angle); |
|
closestSlides = closestSlidesAndAngles[0]; |
|
closestAngles = closestSlidesAndAngles[1]; |
|
|
|
$overview.css("left", -(closestSlides[1] * slideSize.width + Math.abs(closestAngles[1]) * slideSize.width / (Math.abs(closestAngles[1]) + Math.abs(closestAngles[2])))); |
|
$thumb.css({ |
|
top: -Math.cos(_toRadians(angle)) * self.options.radius + (containerSize.height / 2 - thumbSize.height / 2), |
|
left: Math.sin(_toRadians(angle)) * self.options.radius + (containerSize.width / 2 - thumbSize.width / 2) |
|
}); |
|
|
|
if (fireCallback) { |
|
/** |
|
* The move event will trigger when the carousel slides to a new slide. |
|
* |
|
* @event move |
|
* custom |
|
*/ |
|
$container.trigger("move", [$slides[self.slideCurrent], self.slideCurrent]); |
|
var slideno = _findClosestSlide(self.angleCurrent)[0][0]; |
|
$('.dot').removeClass('active'); |
|
$('.dot:eq(' + slideno + ')').addClass('active'); |
|
$('#overlayActive').removeClass('slideno(0) slideno(1) slideno(2) slideno(3) slideno(4) slideno(5) slideno(6) slideno(7)').addClass('slideno(' + slideno + ')'); |
|
|
|
$('.dot-1').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide1-hovered'); |
|
}); |
|
$('.dot-1').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide1-hovered'); |
|
}); |
|
|
|
$('.dot-2').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide2-hovered'); |
|
}); |
|
$('.dot-2').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide2-hovered'); |
|
}); |
|
|
|
$('.dot-3').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide3-hovered'); |
|
}); |
|
$('.dot-3').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide3-hovered'); |
|
}); |
|
|
|
$('.dot-4').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide4-hovered'); |
|
}); |
|
$('.dot-4').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide4-hovered'); |
|
}); |
|
|
|
$('.dot-5').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide5-hovered'); |
|
}); |
|
$('.dot-5').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide5-hovered'); |
|
}); |
|
|
|
$('.dot-6').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide6-hovered'); |
|
}); |
|
$('.dot-6').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide6-hovered'); |
|
}); |
|
|
|
$('.dot-7').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide7-hovered'); |
|
}); |
|
$('.dot-7').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide7-hovered'); |
|
}); |
|
|
|
$('.dot-8').mouseover(function() { |
|
$('#overlayInteraction').addClass('is-slide8-hovered'); |
|
}); |
|
$('.dot-8').mouseout(function() { |
|
$('#overlayInteraction').removeClass('is-slide8-hovered'); |
|
}); |
|
|
|
} |
|
} |
|
|
|
/** |
|
* @method _endDrag |
|
* @private |
|
* @param {Object} [event] |
|
*/ |
|
function _endDrag(event) { |
|
if ($(event.target).hasClass("dot")) { |
|
return false; |
|
} |
|
self.dragging = false; |
|
event.preventDefault(); |
|
|
|
$(document).unbind("mousemove mouseup"); |
|
$thumb.unbind("mouseup"); |
|
|
|
if (self.options.dotsHide) { |
|
$dots.stop(true, true).fadeOut("slow"); |
|
} |
|
|
|
if (self.options.dotsSnap) { |
|
self.move(_findClosestSlide(self.angleCurrent)[0][0]); |
|
} |
|
} |
|
|
|
function _dragAnimationLoop() { |
|
if (self.dragging) { |
|
_setCSS(self.angleCurrent); |
|
requestAnimationFrame(function() { |
|
_dragAnimationLoop(); |
|
}); |
|
} |
|
} |
|
|
|
/** |
|
* @method _startDrag |
|
* @private |
|
* @param {Object} [event] |
|
*/ |
|
function _startDrag(event) { |
|
event.preventDefault(); |
|
isTouchEvent = event.type == 'touchstart'; |
|
self.dragging = true; |
|
|
|
if ($(event.target).hasClass("dot")) { |
|
return false; |
|
} |
|
|
|
self.stop(); |
|
|
|
$(document).mousemove(_drag); |
|
$(document).mouseup(_endDrag); |
|
$thumb.mouseup(_endDrag); |
|
|
|
if (self.options.dotsHide) { |
|
$dots.stop(true, true).fadeIn("slow"); |
|
} |
|
|
|
if (hasRequestAnimationFrame) { |
|
_dragAnimationLoop(); |
|
} |
|
} |
|
|
|
return _initialize(); |
|
} |
|
|
|
/** |
|
* @class tinycircleslider |
|
* @constructor |
|
* @param {Object} options |
|
@param {Boolean} [options.dotsSnap=false] Shows dots when user starts dragging and snap to them. |
|
@param {Boolean} [options.dotsHide=true] Fades out the dots when user stops dragging. |
|
@param {Number} [options.radius=140] Used to determine the size of the circleslider. |
|
@param {Boolean} [options.interval=false] Move to another block on intervals. |
|
@param {Number} [options.intervalTime=intervalTime] Interval time in milliseconds. |
|
@param {Number} [options.start=0] The slide to start with. |
|
*/ |
|
$.fn[pluginName] = function(options) { |
|
return this.each(function() { |
|
if (!$.data(this, "plugin_" + pluginName)) { |
|
$.data(this, "plugin_" + pluginName, new Plugin($(this), options)); |
|
} |
|
}); |
|
}; |
|
})); |
|
$(document).ready(function() { |
|
var widthtoacquire = $(window).width() - 30; |
|
var radius = (widthtoacquire - 80) / 2 > 150 ? 150 : (widthtoacquire - 80) / 2; |
|
|
|
$("#rotatescroll").tinycircleslider({ |
|
dotsSnap: true, |
|
radius: radius, |
|
dotsHide: false, |
|
slides: ["England", "Ireland", "Wales", "Guernsey", "Norway", "Netherlands", "Belgium", "Italy"], |
|
interval: false |
|
}); |
|
|
|
}); |