You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
1.4 KiB
79 lines
1.4 KiB
semantic.shape = {};
|
|
|
|
// ready event
|
|
semantic.shape.ready = function() {
|
|
|
|
// selector cache
|
|
var
|
|
$demo = $('.demo'),
|
|
$directionButton = $('.direction .button'),
|
|
$shapeButton = $('.shape .button'),
|
|
// alias
|
|
handler
|
|
;
|
|
|
|
// event handlers
|
|
handler = {
|
|
rotate: function() {
|
|
var
|
|
direction = $(this).data('direction') || false,
|
|
animation = $(this).data('animation') || false
|
|
;
|
|
if(direction && animation) {
|
|
$('.active.side')
|
|
.next()
|
|
;
|
|
$demo
|
|
.shape(animation + '.' + direction)
|
|
;
|
|
}
|
|
},
|
|
|
|
removeShape: function(){
|
|
var
|
|
shape = $(this).data('shape') || false
|
|
;
|
|
if(shape) {
|
|
$demo
|
|
.removeClass(shape)
|
|
;
|
|
}
|
|
},
|
|
|
|
changeShape: function() {
|
|
var
|
|
$shape = $(this),
|
|
$otherShapes = $shape.siblings(),
|
|
shape = $shape.data('shape')
|
|
;
|
|
$shape
|
|
.addClass('active')
|
|
;
|
|
$otherShapes
|
|
.removeClass('active')
|
|
.each(handler.removeShape)
|
|
;
|
|
$demo
|
|
.addClass(shape)
|
|
;
|
|
}
|
|
};
|
|
|
|
// attach events
|
|
$demo
|
|
.shape()
|
|
;
|
|
$directionButton
|
|
.on('click', handler.rotate)
|
|
;
|
|
$shapeButton
|
|
.on('click', handler.changeShape)
|
|
;
|
|
|
|
};
|
|
|
|
|
|
// attach ready event
|
|
$(document)
|
|
.ready(semantic.shape.ready)
|
|
;
|