';
},
background: {
opacity: .75,
color: '#000000'
}
}
}
}
}
);
};
// Init all charts
initChartsChartJS();
initChartsSparkline();
initChartsFlot();
// Randomize Easy Pie values functionality
initRandomEasyPieChart();
}
]);
// Components Calendar Controller
App.controller('CompCalendarCtrl', ['$scope', '$localStorage', '$window',
function ($scope, $localStorage, $window) {
// Add new event in the event list
var addEvent = function() {
var eventInput = jQuery('.js-add-event');
var eventInputVal = '';
// When the add event form is submitted
jQuery('.js-form-add-event').on('submit', function(){
eventInputVal = eventInput.prop('value'); // Get input value
// Check if the user entered something
if ( eventInputVal ) {
// Add it to the events list
jQuery('.js-events')
.prepend('
' +
jQuery('').text(eventInputVal).html() +
'
');
// Clear input field
eventInput.prop('value', '');
// Re-Init Events
initEvents();
}
return false;
});
};
// Init drag and drop event functionality
var initEvents = function() {
jQuery('.js-events')
.find('li')
.each(function() {
var event = jQuery(this);
// create an Event Object
var eventObject = {
title: jQuery.trim(event.text()),
color: event.css('background-color') };
// store the Event Object in the DOM element so we can get to it later
jQuery(this).data('eventObject', eventObject);
// make the event draggable using jQuery UI
jQuery(this).draggable({
zIndex: 999,
revert: true,
revertDuration: 0
});
});
};
// Init FullCalendar
var initCalendar = function(){
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
jQuery('.js-calendar').fullCalendar({
firstDay: 1,
editable: true,
droppable: true,
header: {
left: 'title',
right: 'prev,next month,agendaWeek,agendaDay'
},
drop: function(date, allDay) { // this function is called when something is dropped
// retrieve the dropped element's stored Event Object
var originalEventObject = jQuery(this).data('eventObject');
// we need to copy it, so that multiple events don't have a reference to the same object
var copiedEventObject = jQuery.extend({}, originalEventObject);
// assign it the date that was reported
copiedEventObject.start = date;
// render the event on the calendar
// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
jQuery('.js-calendar').fullCalendar('renderEvent', copiedEventObject, true);
// remove the element from the "Draggable Events" list
jQuery(this).remove();
},
events: [
{
title: 'Free day',
start: new Date(y, m, 1),
allDay: true,
color: '#faeab9'
},
{
title: 'Skype Meeting',
start: new Date(y, m, 2)
},
{
title: 'Secret Project',
start: new Date(y, m, 5),
end: new Date(y, m, 8),
allDay: true,
color: '#fac5a5'
},
{
title: 'Work',
start: new Date(y, m, 9),
end: new Date(y, m, 11),
allDay: true,
color: '#fac5a5'
},
{
id: 999,
title: 'Biking (repeated)',
start: new Date(y, m, d - 3, 15, 0)
},
{
id: 999,
title: 'Biking (repeated)',
start: new Date(y, m, d + 2, 15, 0)
},
{
title: 'Landing Template',
start: new Date(y, m, d - 1),
end: new Date(y, m, d - 1),
allDay: true,
color: '#faeab9'
},
{
title: 'Lunch Meeting',
start: new Date(y, m, d + 5, 14, 00),
color: '#fac5a5'
},
{
title: 'Admin Template',
start: new Date(y, m, d, 9, 0),
end: new Date(y, m, d, 12, 0),
allDay: true,
color: '#faeab9'
},
{
title: 'Party',
start: new Date(y, m, 15),
end: new Date(y, m, 16),
allDay: true,
color: '#faeab9'
},
{
title: 'Reading',
start: new Date(y, m, d + 8, 21, 0),
end: new Date(y, m, d + 8, 23, 30),
allDay: true
},
{
title: 'Follow me on Twitter',
start: new Date(y, m, 23),
end: new Date(y, m, 25),
allDay: true,
url: 'http://twitter.com/pixelcave',
color: '#32ccfe'
}
]
});
};
// Add Event functionality
addEvent();
// FullCalendar, for more examples you can check out http://fullcalendar.io/
initEvents();
initCalendar();
}
]);
// Components Syntax Highlighting Controller
App.controller('CompSyntaxHighlightingCtrl', ['$scope', '$localStorage', '$window',
function ($scope, $localStorage, $window) {
// Init HighlightJS
hljs.initHighlighting();
}
]);
// Components Rating Controller
App.controller('CompRatingCtrl', ['$scope', '$localStorage', '$window',
function ($scope, $localStorage, $window) {
// jQuery Raty, for more examples you can check out https://github.com/wbotelhos/raty
// Init Rating
var initRating = function(){
// Set Default options
jQuery.fn.raty.defaults.starType = 'i';
jQuery.fn.raty.defaults.hints = ['Bad', 'Poor', 'Regular', 'Good', 'Gorgeous'];
// Init Raty on .js-rating class
jQuery('.js-rating').each(function(){
var ratingEl = jQuery(this);
ratingEl.raty({
score: ratingEl.data('score') ? ratingEl.data('score') : 0,
number: ratingEl.data('number') ? ratingEl.data('number') : 5,
cancel: ratingEl.data('cancel') ? ratingEl.data('cancel') : false,
target: ratingEl.data('target') ? ratingEl.data('target') : false,
targetScore: ratingEl.data('target-score') ? ratingEl.data('target-score') : false,
precision: ratingEl.data('precision') ? ratingEl.data('precision') : false,
cancelOff: ratingEl.data('cancel-off') ? ratingEl.data('cancel-off') : 'fa fa-fw fa-times text-danger',
cancelOn: ratingEl.data('cancel-on') ? ratingEl.data('cancel-on') : 'fa fa-fw fa-times',
starHalf: ratingEl.data('star-half') ? ratingEl.data('star-half') : 'fa fa-fw fa-star-half-o text-warning',
starOff: ratingEl.data('star-off') ? ratingEl.data('star-off') : 'fa fa-fw fa-star text-gray',
starOn: ratingEl.data('star-on') ? ratingEl.data('star-on') : 'fa fa-fw fa-star text-warning',
click: function(score, evt) {
// Here you could add your logic on rating click
// console.log('ID: ' + this.id + "\nscore: " + score + "\nevent: " + evt);
}
});
});
};
// Init all Ratings
initRating();
}
]);
// Components Treeview Controller
App.controller('CompTreeviewCtrl', ['$scope', '$localStorage', '$window',
function ($scope, $localStorage, $window) {
// Bootstrap Tree View, for more examples you can check out https://github.com/jonmiles/bootstrap-treeview
// Init Tree Views
var initTreeViews = function(){
// Set default example tree data for all Tree Views
var treeData = [
{
text: 'Bootstrap',
href: '#parent1',
tags: ['4'],
nodes: [
{
text: 'eLearning',
href: '#child1',
tags: ['2'],
nodes: [
{
text: 'Code',
href: '#grandchild1'
},
{
text: 'Tutorials',
href: '#grandchild2'
}
]
},
{
text: 'Templates',
href: '#child2'
},
{
text: 'CSS',
href: '#child3',
tags: ['2'],
nodes: [
{
text: 'Less',
href: '#grandchild3'
},
{
text: 'SaSS',
href: '#grandchild4'
}
]
}
]
},
{
text: 'Design',
href: '#parent3'
},
{
text: 'Coding',
href: '#parent4'
},
{
text: 'Marketing',
href: '#parent5'
}
];
// Init Simple Tree
jQuery('.js-tree-simple').treeview({
data: treeData,
color: '#555',
expandIcon: 'fa fa-plus',
collapseIcon: 'fa fa-minus',
onhoverColor: '#f9f9f9',
selectedColor: '#555',
selectedBackColor: '#f1f1f1',
showBorder: false,
levels: 3
});
// Init Icons Tree
jQuery('.js-tree-icons').treeview({
data: treeData,
color: '#555',
expandIcon: 'fa fa-plus',
collapseIcon: 'fa fa-minus',
nodeIcon: 'fa fa-folder text-primary',
onhoverColor: '#f9f9f9',
selectedColor: '#555',
selectedBackColor: '#f1f1f1',
showBorder: false,
levels: 3
});
// Init Alternative Icons Tree
jQuery('.js-tree-icons-alt').treeview({
data: treeData,
color: '#555',
expandIcon: 'fa fa-angle-down',
collapseIcon: 'fa fa-angle-up',
nodeIcon: 'fa fa-file-o text-city',
onhoverColor: '#f9f9f9',
selectedColor: '#555',
selectedBackColor: '#f1f1f1',
showBorder: false,
levels: 3
});
// Init Badges Tree
jQuery('.js-tree-badges').treeview({
data: treeData,
color: '#555',
expandIcon: 'fa fa-plus',
collapseIcon: 'fa fa-minus',
nodeIcon: 'fa fa-folder text-primary',
onhoverColor: '#f9f9f9',
selectedColor: '#555',
selectedBackColor: '#f1f1f1',
showTags: true,
levels: 3
});
// Init Collapsed Tree
jQuery('.js-tree-collapsed').treeview({
data: treeData,
color: '#555',
expandIcon: 'fa fa-plus',
collapseIcon: 'fa fa-minus',
nodeIcon: 'fa fa-folder text-primary-light',
onhoverColor: '#f9f9f9',
selectedColor: '#555',
selectedBackColor: '#f1f1f1',
showTags: true,
levels: 1
});
// Set example JSON data for JSON Tree View
var treeDataJson = '[' +
'{' +
'"text": "Bootstrap",' +
'"nodes": [' +
'{' +
'"text": "eLearning",' +
'"nodes": [' +
'{' +
'"text": "Code"' +
'},' +
'{' +
'"text": "Tutorials"' +
'}' +
']' +
'},' +
'{' +
'"text": "Templates"' +
'},' +
'{' +
'"text": "CSS",' +
'"nodes": [' +
'{' +
'"text": "Less"' +
'},' +
'{' +
'"text": "SaSS"' +
'}' +
']' +
'}' +
']' +
'},' +
'{' +
'"text": "Design"' +
'},' +
'{' +
'"text": "Coding"' +
'},' +
'{' +
'"text": "Marketing"' +
'}' +
']';
// Init Json Tree
jQuery('.js-tree-json').treeview({
data: treeDataJson,
color: '#555',
expandIcon: 'fa fa-arrow-down',
collapseIcon: 'fa fa-arrow-up',
nodeIcon: 'fa fa-file-code-o text-flat',
onhoverColor: '#f9f9f9',
selectedColor: '#555',
selectedBackColor: '#f1f1f1',
showTags: true,
levels: 3
});
};
// Init all Tree Views
initTreeViews();
}
]);
// Components Maps Google Controller
App.controller('CompMapsGoogleCtrl', ['$scope', '$localStorage', '$window',
function ($scope, $localStorage, $window) {
// Gmaps.js, for more examples you can check out https://hpneo.github.io/gmaps/
// Init Search Map
var initMapSearch = function(){
// Init Map
var mapSearch = new GMaps({
div: '#js-map-search',
lat: 20,
lng: 0,
zoom: 2,
scrollwheel: false
});
// When the search form is submitted
jQuery('.js-form-search').on('submit', function(){
GMaps.geocode({
address: jQuery('.js-search-address').val().trim(),
callback: function (results, status) {
if ((status === 'OK') && results) {
var latlng = results[0].geometry.location;
mapSearch.removeMarkers();
mapSearch.addMarker({ lat: latlng.lat(), lng: latlng.lng() });
mapSearch.fitBounds(results[0].geometry.viewport);
} else {
alert('Address not found!');
}
}
});
return false;
});
};
// Init Satellite Map
var initMapSat = function(){
new GMaps({
div: '#js-map-sat',
lat: 0,
lng: 0,
zoom: 1,
scrollwheel: false
}).setMapTypeId(google.maps.MapTypeId.SATELLITE);
};
// Init Terrain Map
var initMapTer = function(){
new GMaps({
div: '#js-map-ter',
lat: 0,
lng: 0,
zoom: 1,
scrollwheel: false
}).setMapTypeId(google.maps.MapTypeId.TERRAIN);
};
// Init Overlay Map
var initMapOverlay = function(){
new GMaps({
div: '#js-map-overlay',
lat: 37.7577,
lng: -122.4376,
zoom: 11,
scrollwheel: false
}).drawOverlay({
lat: 37.7577,
lng: -122.4376,
content: '