mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-12-07 06:14:24 +00:00
d185e8cc05
- Removed datepicker folder from functional demo folder
205 lines
5.3 KiB
JavaScript
205 lines
5.3 KiB
JavaScript
$(document).ready(function() {
|
|
|
|
// link demos
|
|
|
|
$(".demoflow div.wrapper").click(function() {
|
|
|
|
var demo = $(this).children('img').attr('_demo');
|
|
|
|
if (demo) {
|
|
location.href = '/repository/real-world/' + demo;
|
|
}else {
|
|
//alert('Under construction!');
|
|
}
|
|
|
|
});
|
|
|
|
if ($("div.demoflow").size()) {
|
|
|
|
var inst = new $.ui.carousel($("div.demoflow")[0], { height: 200, width: 310 });
|
|
|
|
$("div.demoflow-button-left, div.demoflow-button-right").bind("mousedown", function() {
|
|
var right = this.className.indexOf("right") == -1;
|
|
if(inst.autoRotator) window.clearInterval(inst.autoRotator);
|
|
inst.timer = window.setInterval(function() { inst.rotate(right ? "right" : null); }, 13);
|
|
})
|
|
.bind("mouseup", function() {
|
|
window.clearInterval(inst.timer);
|
|
});
|
|
|
|
$('.demoflow div.shadow').hover(function() {
|
|
this._lastopacity = $(this).css('opacity');
|
|
$(this).stop().animate({opacity: 0 }, 300);
|
|
}, function() {
|
|
$(this).stop().animate({opacity: this._lastopacity }, 300);
|
|
});
|
|
|
|
|
|
window.setTimeout(function() {
|
|
inst.element.animate({ opacity: 1 },2000); inst.rotate(0,2000,0.45);
|
|
window.setTimeout(function() {
|
|
inst.autoRotator = window.setInterval(function() { inst.rotate(0,2000,0.45); },5000);
|
|
},3000);
|
|
},0);
|
|
|
|
}
|
|
|
|
$('a').click(function(){
|
|
this.blur();
|
|
});
|
|
|
|
// smooth hover effects by DragonInteractive
|
|
var hover = hoverEffects();
|
|
hover.init();
|
|
|
|
});
|
|
|
|
$.ui.carousel = function(element, options) {
|
|
|
|
this.element = $(element);
|
|
this.options = $.extend({}, options);
|
|
var self = this;
|
|
|
|
$.extend(this, {
|
|
start: Math.PI/2,
|
|
step: 2*Math.PI/$("> *", this.element).length,
|
|
radiusX: 400,
|
|
radiusY: -45,
|
|
paddingX: this.element.outerWidth() / 2,
|
|
paddingY: this.element.outerHeight() / 2
|
|
});
|
|
|
|
$("> *", this.element).css({ position: "absolute", top: 0, left: 0, zIndex: 1 });
|
|
this.rotate();
|
|
this.rotate("right");
|
|
|
|
this.element.parent().bind("mousewheel", function(e,delta) {
|
|
if(self.autoRotator) window.clearInterval(self.autoRotator);
|
|
self.rotate(delta < 0 ? "right" : "left");
|
|
return false;
|
|
});
|
|
|
|
};
|
|
|
|
$.ui.carousel.prototype.rotate = function(d,ani,speed) {
|
|
|
|
this.start = this.start + (d == "right" ? -(speed || 0.03) : (speed || 0.03));
|
|
var o = this.options;
|
|
var self = this;
|
|
|
|
setTimeout(function(){
|
|
$("> *", self.element).each(function(i) {
|
|
var angle = self.start + i * self.step;
|
|
var x = self.radiusX * Math.cos(angle);
|
|
var y = self.radiusY * Math.sin(angle);
|
|
var _self = this;
|
|
|
|
var width = o.width * ((self.radiusY+y) / (2 * self.radiusY));
|
|
width = (width * width * width) / (o.width * o.width); //This makes the pieces smaller
|
|
var height = parseInt(width * o.height / o.width);
|
|
|
|
//This is highly custom - it will hide the elements at the back
|
|
$(_self).css({ visibility: height < 30 ? "hidden" : "visible" });
|
|
if(height < 30 && !ani) return; //This imrpoves the speed, but cannot be used with animation
|
|
|
|
|
|
if(ani) {
|
|
$(_self).animate({
|
|
top: Math.round(self.paddingY + y - height/2) + "px",
|
|
left: Math.round(self.paddingX + x - width/2) + "px",
|
|
width: Math.round(width) + "px",
|
|
height: Math.round(height) + "px"
|
|
},{ duration: ani, easing: "easeOutQuad" });
|
|
$(_self).css({ zIndex: Math.round(parseInt(100 * (self.radiusY+y) / (2 * self.radiusY))) });
|
|
} else {
|
|
$(_self).css({
|
|
top: self.paddingY + y - height/2 + "px",
|
|
left: self.paddingX + x - width/2 + "px",
|
|
width: width + "px",
|
|
height: height + "px",
|
|
zIndex: parseInt(100 * (self.radiusY+y) / (2 * self.radiusY))
|
|
});
|
|
}
|
|
|
|
$("div.shadow",_self).css({ opacity: 1 - (width / o.width) });
|
|
|
|
});
|
|
}, 0);
|
|
}
|
|
|
|
|
|
/**
|
|
* All credit here goes to DragonInteractive and Yuri Vishnevsky
|
|
*/
|
|
var hoverEffects = function() {
|
|
var me = this;
|
|
var args = arguments;
|
|
var self = {
|
|
c: {
|
|
navItems: '.download .click-to-download, #launch-pad .launch-pad-button, div.demoflow-button-left, div.demoflow-button-right',
|
|
navSpeed: ($.browser.safari ? 600: 350),
|
|
snOpeningSpeed: ($.browser.safari ? 400: 250),
|
|
snOpeningTimeout: 150,
|
|
snClosingSpeed: function() {
|
|
if (self.subnavHovered()) return 123450;
|
|
return 150
|
|
},
|
|
snClosingTimeout: 700
|
|
},
|
|
init: function() {
|
|
//$('.bg', this.c.navItems).css({
|
|
// 'opacity': 0
|
|
//});
|
|
this.initHoverFades()
|
|
},
|
|
subnavHovered: function() {
|
|
var hovered = false;
|
|
$(self.c.navItems).each(function() {
|
|
if (this.hovered) hovered = true
|
|
});
|
|
return hovered
|
|
},
|
|
initHoverFades: function() {
|
|
//$('#navigation .bg').css('opacity', 0);
|
|
$(self.c.navItems).hover(function() {
|
|
self.fadeNavIn.apply(this)
|
|
},
|
|
function() {
|
|
var el = this;
|
|
setTimeout(function() {
|
|
if (!el.open) self.fadeNavOut.apply(el)
|
|
},
|
|
10)
|
|
})
|
|
},
|
|
fadeNavIn: function() {
|
|
$('.bg', this).stop().animate({
|
|
'opacity': 1
|
|
},
|
|
self.c.navSpeed)
|
|
},
|
|
fadeNavOut: function() {
|
|
$('.bg', this).stop().animate({
|
|
'opacity': 0
|
|
},
|
|
self.c.navSpeed)
|
|
},
|
|
initSubmenus: function() {
|
|
$(this.c.navItems).hover(function() {
|
|
$(self.c.navItems).not(this).each(function() {
|
|
self.fadeNavOut.apply(this);
|
|
});
|
|
this.hovered = true;
|
|
var el = this;
|
|
self.fadeNavIn.apply(el);
|
|
},
|
|
function() {
|
|
this.hovered = false;
|
|
var el = this;
|
|
if (!el.open) self.fadeNavOut.apply(el);
|
|
})
|
|
}
|
|
};
|
|
|
|
return self;
|
|
}; |