Created
March 18, 2014 15:26
-
-
Save IOZ/9622295 to your computer and use it in GitHub Desktop.
Selectik
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function(){ | |
var eventMatchers = { | |
'HTMLEvents': /^(?:load|unload|abort|error|select|change|submit|reset|focus|blur|resize|scroll)$/, | |
'MouseEvents': /^(?:click|mouse(?:down|up|over|move|out))$/ | |
} | |
var defaultOptions = { | |
pointerX: 0, | |
pointerY: 0, | |
button: 0, | |
ctrlKey: false, | |
altKey: false, | |
shiftKey: false, | |
metaKey: false, | |
bubbles: true, | |
cancelable: true | |
} | |
Event.simulate = function(element, eventName) { | |
var options = Object.extend(defaultOptions, arguments[2] || { }); | |
var oEvent, eventType = null; | |
element = $(element); | |
for (var name in eventMatchers) { | |
if (eventMatchers[name].test(eventName)) { eventType = name; break; } | |
} | |
if (!eventType) | |
throw new SyntaxError('Only HTMLEvents and MouseEvents interfaces are supported'); | |
if (document.createEvent) { | |
oEvent = document.createEvent(eventType); | |
if (eventType == 'HTMLEvents') { | |
oEvent.initEvent(eventName, options.bubbles, options.cancelable); | |
} | |
else { | |
oEvent.initMouseEvent(eventName, options.bubbles, options.cancelable, document.defaultView, | |
options.button, options.pointerX, options.pointerY, options.pointerX, options.pointerY, | |
options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, element); | |
} | |
element.dispatchEvent(oEvent); | |
} | |
else { | |
options.clientX = options.pointerX; | |
options.clientY = options.pointerY; | |
oEvent = Object.extend(document.createEventObject(), options); | |
element.fireEvent('on' + eventName, oEvent); | |
} | |
return element; | |
} | |
Element.addMethods({ simulate: Event.simulate }); | |
})(); | |
// No conflict mode | |
jQuery.noConflict(); | |
var APP; | |
APP = {}; | |
APP.Form = (function(app, $){ | |
return { | |
init: function(){ | |
this.initChackAndRadio(); | |
this.initSelect(); | |
}, | |
selectBaseOptons: { | |
maxItems: 5, | |
customScroll: 1, | |
speedAnimation: 100, | |
smartPosition: false | |
}, | |
selectCustomMethods: { | |
hideCSContainer: function(){ | |
this.$container.hide(); | |
}, | |
showCSContainer: function(){ | |
this.$container.show(); | |
} | |
}, | |
initSelect: function(){ | |
var t = this; | |
var select = $("select"); | |
select.each(function(){ | |
// select | |
var sel = $(this); | |
// extend options | |
if(sel.attr('multiple')){ | |
// init multiple select | |
//sel.multipleSelect(t.selectMultipleOpt); | |
} else { | |
// init custom select | |
sel.selectik( t.selectBaseOptons, t.selectCustomMethods ); | |
// trigger events | |
sel.on({ | |
'showCS': function() { | |
console.log('show'); | |
}, | |
'hideCS': function() { | |
console.log('hide'); | |
}, | |
'changeCS': function() { | |
console.log('changed'); | |
} | |
}); | |
} | |
}); | |
}, | |
initChackAndRadio: function(){ | |
$('input').iCheck({ | |
checkboxClass: 'icheckbox_square', | |
radioClass: 'iradio_square' | |
}); | |
$('input').on({ | |
'ifChecked': function(){ | |
this.simulate('click'); | |
}, | |
'ifUnchecked': function(){ | |
this.simulate('click'); | |
} | |
}); | |
}, | |
/** | |
* Country State View | |
* @param countryId - country select | |
* @param regionSelectId - region select | |
* @param regionInputId - region input | |
*/ | |
countryStateView: function(countryId, regionSelectId, regionInputId){ | |
var billingCountry = $(countryId), | |
billingStateSelect = $(regionSelectId), | |
billingStateInput = $(regionInputId); | |
// private methods | |
function checkState(num){ | |
// check option length | |
if(num <= 1){ | |
billingStateSelect.data('selectik').hideCSContainer(); | |
billingStateSelect.data('selectik').refreshCS(); | |
billingStateInput.show(); | |
} else { | |
billingStateSelect.data('selectik').refreshCS(); | |
billingStateSelect.data('selectik').showCSContainer(); | |
} | |
} | |
// custom events | |
billingCountry.on({ | |
'changeCS': function(){ | |
var billingStateSelectOptLen = billingStateSelect.children().length; | |
checkState(billingStateSelectOptLen); | |
} | |
}); | |
} | |
} | |
})(APP || {}, jQuery); | |
/** | |
* Module: Checkout | |
*/ | |
APP.Checkout = (function(app, $){ | |
return { | |
init: function(){ | |
app.Form.countryStateView('#billing\\:country_id', '#billing\\:region_id', '#billing\\:region'); | |
app.Form.countryStateView('#shipping\\:country_id', '#shipping\\:region_id', '#shipping\\:region'); | |
}, | |
enabledPaymentInfoSelect: function(){ | |
var select = jQuery('#checkout-step-payment select'); | |
select.each(function(){ | |
var sel = $(this); | |
if(sel.data('selectik')){ | |
sel.data('selectik').enableCS(); | |
} | |
}); | |
} | |
} | |
})(APP || {}, jQuery); | |
/** | |
* Module: Account | |
*/ | |
APP.Account = (function(app, $){ | |
return { | |
init: function(){ | |
app.Form.countryStateView('select#country', 'select#region_id', 'input#region'); | |
} | |
} | |
})(APP || {}, jQuery); | |
/** | |
* Module: PDP | |
*/ | |
APP.Product = (function(app, $){ | |
return { | |
init: function(){ | |
$('select.super-attribute-select').on({ | |
'hideCS': function(){ | |
this.simulate('change'); | |
$(this).data('selectik').refreshCS(); | |
} | |
}); | |
} | |
} | |
})(APP || {}, jQuery); | |
// use $ in local space | |
(function($){ | |
// DOM ready | |
$(function(){ | |
APP.Form.init(); | |
APP.Checkout.init(); | |
APP.Account.init(); | |
APP.Product.init(); | |
}); | |
})(jQuery); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment