Added module scoping for all components, and stored lookups in event handlers instead
of querying live. Delays would erroniously cause values to persist.
This commit is contained in:
Danny Garcia
2014-07-22 13:33:58 -04:00
parent 56d619b218
commit 69fca5d1ed
2 changed files with 184 additions and 63 deletions
+10 -63
View File
@@ -43,6 +43,15 @@
<!-- global header javascripts -->
<script src="//code.jquery.com/jquery-latest.js"></script>
<script src="{{ asset('assets/js/jquery.dataTables.js') }}"></script>
<script>
window.snipeit = {
settings: {
"per_page": {{{ Setting::getSettings()->per_page }}}
}
};
</script>
<!-- open sans font -->
<link href='//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
@@ -343,70 +352,8 @@
<script src="{{ asset('assets/js/jquery.uniform.min.js') }}"></script>
<script src="{{ asset('assets/js/bootstrap.datepicker.js') }}"></script>
<script src="{{ asset('assets/js/theme.js') }}"></script>
<script src="{{ asset('assets/js/snipeit.js') }}"></script>
<script type="text/javascript">
$(function () {
$('#example').dataTable({
"sPaginationType": "full_numbers",
"iDisplayLength": {{{ Setting::getSettings()->per_page }}},
"aLengthMenu": [[{{{ Setting::getSettings()->per_page }}}, -1], [{{{ Setting::getSettings()->per_page }}}, "All"]],
"aoColumnDefs": [{ 'bSortable': false, 'aTargets': [ 'actions' ] }]
});
$('#nosorting').dataTable({
"sPaginationType": "full_numbers",
"fnSort": [1,'asc'],
"aoColumns": [
{ "bSortable": false },
{ "bSortable": false },
{ "bSortable": false },
{ "bSortable": false }
],
"iDisplayLength": {{{ Setting::getSettings()->per_page }}},
"aLengthMenu": [[{{{ Setting::getSettings()->per_page }}}, -1], [{{{ Setting::getSettings()->per_page }}}, "All"]]
});
// add uniform plugin styles to html elements
$("input:checkbox, input:radio").uniform();
// datepicker plugin
$('.datepicker').datepicker().on('changeDate', function (ev) {
$(this).datepicker('hide');
});
// select2 plugin for select elements
$(".select2").select2({
placeholder: "Select"
});
// jQuery Knobs
$(".knob").knob();
$("#example").popover();
// confirm delete modal
$('.delete-asset').click(function (evnt) {
var href = $(this).attr('href');
var message = $(this).attr('data-content');
var title = $(this).attr('data-title');
$('#myModalLabel').text(title);
$('#dataConfirmModal .modal-body').text(message);
$('#dataConfirmOK').attr('href', href);
$('#dataConfirmModal').modal({show:true});
return false;
});
});
</script>
</body>
</html>
+174
View File
@@ -0,0 +1,174 @@
/**
* Module containing core application logic.
* @param {jQuery} $ Insulated jQuery object
* @param {JSON} settings Insulated `window.snipeit.settings` object.
* @return {IIFE} Immediately invoked. Returns self.
*/
(function($, settings) {
var Components = {};
Components.modals = {};
Components.example = function() {
var paginationType = 'full_numbers';
var $el = $('#example');
var render = function() {
$el.dataTable({
"sPaginationType": paginationType,
"iDisplayLength": settings.per_page,
"aLengthMenu": [
[settings.per_page, -1],
[settings.per_page, "All"]
],
"aoColumnDefs": [{
'bSortable': false,
'aTargets': ['actions']
}]
});
$el.popover();
};
return {
render: render
};
};
Components.nosorting = function() {
var paginationType = 'full_numbers';
var $el = $('#nosorting');
var render = function() {
$el.dataTable({
"sPaginationType": paginationType,
"fnSort": [1, 'asc'],
"aoColumns": [{
"bSortable": false
}, {
"bSortable": false
}, {
"bSortable": false
}, {
"bSortable": false
}],
"iDisplayLength": settings.per_page,
"aLengthMenu": [
[settings.per_page, -1],
[settings.per_page, "All"]
]
});
};
return {
render: render
};
};
// add uniform plugin styles to html elements
Components.pluginStyles = function() {
var $el = $("input:checkbox, input:radio");
var render = function() {
$el.uniform();
};
return {
render: render
};
};
// datepicker plugin
Components.datepicker = function() {
$el = $('.datepicker');
var events = {
'changeDate': function(ev) {
$(this).datepicker('hide');
}
};
var render = function() {
$el.datepicker();
$el.on('changeDate', events['changeDate']);
};
return {
render: render
};
};
// select2 plugin for select elements
Components.select2 = function() {
var text = "Select";
var $el = $('.select2');
var render = function() {
$el.select2({
placeholder: text
});
};
return {
render: render
};
};
// jQuery Knobs
Components.knob = function() {
$el = $('.knob');
var render = function() {
$el.knob();
};
return {
render: render
};
};
// confirm delete modal
Components.modals.confirmDelete = function() {
var $el = $('.delete-asset');
var events = {
'click': function(evnt) {
var $context = $(this);
var $dataConfirmModal = $('#dataConfirmModal');
var href = $context.attr('href');
var message = $context.attr('data-content');
var title = $context.attr('data-title');
$('#myModalLabel').text(title);
$dataConfirmModal.find('.modal-body').text(message);
$('#dataConfirmOK').attr('href', href);
$dataConfirmModal.modal({
show: true
});
}
};
var render = function() {
$el.on('click', events['click']);
};
return {
render: render
};
};
/**
* Application start point
* Component definition stays out of load event, execution only happens.
*/
$(function() {
new Components.example().render();
new Components.nosorting().render();
new Components.pluginStyles().render();
new Components.datepicker().render();
new Components.select2().render();
new Components.knob().render();
new Components.modals.confirmDelete().render();
});
}(jQuery, window.snipeit.settings));