a52c2a8462
Add the legacy frontend themes, scripts, and plugin assets required by the main SPOTA interfaces.
204 lines
10 KiB
JavaScript
204 lines
10 KiB
JavaScript
var UIElements = function () {
|
|
//function to initiate bootstrap-paginator
|
|
var runPaginator = function () {
|
|
$('#paginator-example-1').bootstrapPaginator({
|
|
bootstrapMajorVersion: 3,
|
|
currentPage: 3,
|
|
totalPages: 10,
|
|
onPageClicked: function (e, originalEvent, type, page) {
|
|
$('#paginator-content-1').text("Page item clicked, type: " + type + " page: " + page);
|
|
}
|
|
});
|
|
$('#paginator-example-2').bootstrapPaginator({
|
|
bootstrapMajorVersion: 3,
|
|
currentPage: 3,
|
|
totalPages: 10,
|
|
onPageChanged: function (e, oldPage, newPage) {
|
|
$('#paginator-content-2').text("Current page changed, old: " + oldPage + " new: " + newPage);
|
|
}
|
|
});
|
|
$('#paginator-changed-select').change(function () {
|
|
var page = $(this).val();
|
|
$('#paginator-example-2').bootstrapPaginator("show", page);
|
|
});
|
|
};
|
|
//function to initiate jQuery.pulsate
|
|
var runPulsate = function () {
|
|
$('#pulsate-regular').pulsate({
|
|
color: '#C43C35', // set the color of the pulse
|
|
reach: 20, // how far the pulse goes in px
|
|
speed: 1000, // how long one pulse takes in ms
|
|
pause: 0, // how long the pause between pulses is in ms
|
|
glow: true, // if the glow should be shown too
|
|
repeat: true, // will repeat forever if true, if given a number will repeat for that many times
|
|
onHover: false // if true only pulsate if user hovers over the element
|
|
});
|
|
};
|
|
//function to initiate jquery.gritter
|
|
var runGritterNotification = function () {
|
|
$.extend($.gritter.options, {
|
|
class_name: 'gritter-light', // for light notifications (can be added directly to $.gritter.add too)
|
|
position: 'top-right', // possibilities: bottom-left, bottom-right, top-left, top-right
|
|
fade_in_speed: 100, // how fast notifications fade in (string or int)
|
|
fade_out_speed: 100, // how fast the notices fade out
|
|
time: 3000 // hang on the screen for...
|
|
});
|
|
$('#add-sticky').click(function () {
|
|
var unique_id = $.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a sticky notice!',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eget tincidunt velit. Cum sociis natoque penatibus et <a href="#" style="color:#ccc">magnis dis parturient</a> montes, nascetur ridiculus mus.',
|
|
// (string | optional) the image to display on the left
|
|
image: 'assets/images/avatar-1.jpg',
|
|
// (bool | optional) if you want it to fade out on its own or just sit there
|
|
sticky: true,
|
|
// (int | optional) the time you want it to be alive for before fading out
|
|
time: '',
|
|
// (string | optional) the class name you want to apply to that specific message
|
|
class_name: 'my-sticky-class'
|
|
});
|
|
// You can have it return a unique id, this can be used to manually remove it later using
|
|
/*
|
|
setTimeout(function(){
|
|
$.gritter.remove(unique_id, {
|
|
fade: true,
|
|
speed: 'slow'
|
|
});
|
|
}, 6000)
|
|
*/
|
|
return false;
|
|
});
|
|
$('#add-regular').click(function () {
|
|
$.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a regular notice!',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'This will fade out after a certain amount of time. Vivamus eget tincidunt velit. Cum sociis natoque penatibus et <a href="#" style="color:#ccc">magnis dis parturient</a> montes, nascetur ridiculus mus.',
|
|
// (string | optional) the image to display on the left
|
|
image: 'assets/images/avatar-2.jpg',
|
|
// (bool | optional) if you want it to fade out on its own or just sit there
|
|
sticky: false,
|
|
// (int | optional) the time you want it to be alive for before fading out
|
|
time: ''
|
|
});
|
|
return false;
|
|
});
|
|
$('#add-max').click(function () {
|
|
$.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a notice with a max of 3 on screen at one time!',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'This will fade out after a certain amount of time. Vivamus eget tincidunt velit. Cum sociis natoque penatibus et <a href="#" style="color:#ccc">magnis dis parturient</a> montes, nascetur ridiculus mus.',
|
|
// (string | optional) the image to display on the left
|
|
image: 'http://a0.twimg.com/profile_images/59268975/jquery_avatar_bigger.png',
|
|
// (bool | optional) if you want it to fade out on its own or just sit there
|
|
sticky: false,
|
|
// (function) before the gritter notice is opened
|
|
before_open: function () {
|
|
if ($('.gritter-item-wrapper').length == 3) {
|
|
// Returning false prevents a new gritter from opening
|
|
return false;
|
|
}
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
$('#add-without-image').click(function () {
|
|
$.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a notice without an image!',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'This will fade out after a certain amount of time. Vivamus eget tincidunt velit. Cum sociis natoque penatibus et <a href="#" style="color:#ccc">magnis dis parturient</a> montes, nascetur ridiculus mus.'
|
|
});
|
|
return false;
|
|
});
|
|
$('#add-gritter-light').click(function () {
|
|
$.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a light notification',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'Just add a "gritter-light" class_name to your $.gritter.add or globally to $.gritter.options.class_name',
|
|
class_name: 'gritter-light'
|
|
});
|
|
return false;
|
|
});
|
|
$('#add-with-callbacks').click(function () {
|
|
$.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a notice with callbacks!',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'The callback is...',
|
|
// (function | optional) function called before it opens
|
|
before_open: function () {
|
|
alert('I am called before it opens');
|
|
},
|
|
// (function | optional) function called after it opens
|
|
after_open: function (e) {
|
|
alert("I am called after it opens: \nI am passed the jQuery object for the created Gritter element...\n" + e);
|
|
},
|
|
// (function | optional) function called before it closes
|
|
before_close: function (e, manual_close) {
|
|
var manually = (manual_close) ? 'The "X" was clicked to close me!' : '';
|
|
alert("I am called before it closes: I am passed the jQuery object for the Gritter element... \n" + manually);
|
|
},
|
|
// (function | optional) function called after it closes
|
|
after_close: function (e, manual_close) {
|
|
var manually = (manual_close) ? 'The "X" was clicked to close me!' : '';
|
|
alert('I am called after it closes. ' + manually);
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
$('#add-sticky-with-callbacks').click(function () {
|
|
$.gritter.add({
|
|
// (string | mandatory) the heading of the notification
|
|
title: 'This is a sticky notice with callbacks!',
|
|
// (string | mandatory) the text inside the notification
|
|
text: 'Sticky sticky notice.. sticky sticky notice...',
|
|
// Stickeh!
|
|
sticky: true,
|
|
// (function | optional) function called before it opens
|
|
before_open: function () {
|
|
alert('I am a sticky called before it opens');
|
|
},
|
|
// (function | optional) function called after it opens
|
|
after_open: function (e) {
|
|
alert("I am a sticky called after it opens: \nI am passed the jQuery object for the created Gritter element...\n" + e);
|
|
},
|
|
// (function | optional) function called before it closes
|
|
before_close: function (e) {
|
|
alert("I am a sticky called before it closes: I am passed the jQuery object for the Gritter element... \n" + e);
|
|
},
|
|
// (function | optional) function called after it closes
|
|
after_close: function () {
|
|
alert('I am a sticky called after it closes');
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
$("#remove-all").click(function () {
|
|
$.gritter.removeAll();
|
|
return false;
|
|
});
|
|
$("#remove-all-with-callbacks").click(function () {
|
|
$.gritter.removeAll({
|
|
before_close: function (e) {
|
|
alert("I am called before all notifications are closed. I am passed the jQuery object containing all of Gritter notifications.\n" + e);
|
|
},
|
|
after_close: function () {
|
|
alert('I am called after everything has been closed.');
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
};
|
|
return {
|
|
//main function to initiate template pages
|
|
init: function () {
|
|
runPaginator();
|
|
runPulsate();
|
|
runGritterNotification();
|
|
}
|
|
};
|
|
}(); |