repsheet_visualizer 0.2.3 → 1.0.0

data/lib/repsheet_visualizer/application/public/js/Login.js

@@ -0,0 +1,17 @@
+var Login = function () {
+    "use strict";
+
+    return { init: init };
+
+    function init () {
+        $.support.placeholder = false;
+        var test = document.createElement('input');
+        if('placeholder' in test) $.support.placeholder = true;
+
+        if (!$.support.placeholder) {
+            $('#login-form').find ('label').show ();
+        }
+    }
+} ();
+
+$(function () { Login.init (); });

data/lib/repsheet_visualizer/application/public/js/demos/buttons.js

@@ -0,0 +1,7 @@
+$('#loading-ex-1').click (function () {
+	var btn = $(this)
+	btn.button('loading')
+	setTimeout(function () {
+		btn.button('reset')
+	}, 3000)
+})

data/lib/repsheet_visualizer/application/public/js/demos/calendar.js

@@ -0,0 +1,142 @@
+$(function () {
+	
+	var date = new Date();
+		var d = date.getDate();
+		var m = date.getMonth();
+		var y = date.getFullYear();
+		
+		$('#full-calendar').fullCalendar({
+			header: {
+				left: 'prev,next',
+				center: 'title',
+				right: 'month,agendaWeek,agendaDay'
+			},
+			editable: true,
+			droppable: true,
+			drop: function(date, allDay) { // this function is called when something is dropped
+			
+				// retrieve the dropped element's stored Event Object
+				var originalEventObject = $(this).data('eventObject');
+				
+				// we need to copy it, so that multiple events don't have a reference to the same object
+				var copiedEventObject = $.extend({}, originalEventObject);
+				
+				// assign it the date that was reported
+				copiedEventObject.start = date;
+				copiedEventObject.allDay = allDay;
+				copiedEventObject.className = $(this).attr("data-category");
+				
+				// render the event on the calendar
+				// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
+				$('#full-calendar').fullCalendar('renderEvent', copiedEventObject, true);
+				
+				// is the "remove after drop" checkbox checked?
+				//if ($('#drop-remove').is(':checked')) {
+					// if so, remove the element from the "Draggable Events" list
+					$(this).remove();
+				//}
+				
+			},
+
+			events: [
+				{
+					title: 'All Day Event',
+					start: new Date(y, m, 1),
+					end: new Date (y, m, 2),
+					className: 'fc-red'
+				},
+				{
+					title: 'Long Event',
+					start: new Date(y, m, d-5),
+					end: new Date(y, m, d-2),
+					className: 'fc-yellow'
+				},
+				{
+					id: 999,
+					title: 'Repeating Event',
+					start: new Date(y, m, d-3, 16, 0),
+					allDay: false,
+					className: 'fc-grey'
+				},
+				{
+					id: 999,
+					title: 'Repeating Event',
+					start: new Date(y, m, d+1, 14, 0),
+					end: new Date(y, m, d+3, 14, 0),
+					allDay: false,
+					className: 'fc-charcoal'
+				},
+				{
+					title: 'Meeting',
+					start: new Date(y, m, d-13, 10, 30),
+					end: new Date (y,m,d-11, 10,30),
+					allDay: false,
+					className: 'fc-grey'
+				},
+				{
+					title: 'Lunch',
+					start: new Date(y, m, d, 12, 0),
+					end: new Date(y, m, d, 14, 0),
+					allDay: false,
+					className: 'fc-red'
+				}
+			]
+		});
+
+
+
+
+	$('#external-events div.external-event').each(function() {
+		
+			// create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
+			// it doesn't need to have a start or end
+			var eventObject = {
+				title: $.trim($(this).text()) // use the element's text as the event title
+			};
+			
+			// store the Event Object in the DOM element so we can get to it later
+			$(this).data('eventObject', eventObject);
+			
+			// make the event draggable using jQuery UI
+			$(this).draggable({
+				zIndex: 999,
+				revert: true,      // will cause the event to go back to its
+				revertDuration: 0  //  original position after the drag
+			});
+			
+		});
+
+
+	var addEvent = function (title, category) {
+        title = title.length == 0 ? "Untitled Event" : title;
+        category = category.length == 0 ? 'fc-secondary' : category;
+        var html = $('<div data-category="' + category + '" class="external-event ui-draggable label ' + category + '">' + title + '</div>');
+        jQuery('#event_box').append(html);
+        initDrag(html);
+    }
+
+    $('#event-form').unbind('submit').submit(function (e) {
+		e.preventDefault ();
+		var title = $('#event_title');
+		var category = $('#event_category');
+		addEvent(title.val(), category.val ());
+		title.val ('');
+	});
+
+    var initDrag = function (el) {
+        // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
+        // it doesn't need to have a start or end
+        var eventObject = {
+            title: $.trim(el.text()) // use the element's text as the event title
+        };
+        // store the Event Object in the DOM element so we can get to it later
+        el.data('eventObject', eventObject);
+        // make the event draggable using jQuery UI
+        el.draggable({
+            zIndex: 999,
+            revert: true, // will cause the event to go back to its
+            revertDuration: 0 //  original position after the drag
+        });
+    }
+
+});

data/lib/repsheet_visualizer/application/public/js/demos/charts/flot/area.js

@@ -0,0 +1,73 @@
+$(function () {
+
+    var d1, data, chartOptions;
+
+    d1 = [
+        [1262304000000, 5], [1264982400000, 200], [1267401600000, 1605], [1270080000000, 1129],
+        [1272672000000, 1163], [1275350400000, 1905], [1277942400000, 2002], [1280620800000, 2917],
+        [1283299200000, 2700], [1285891200000, 2700], [1288569600000, 2100], [1291161600000, 1700]
+    ];
+
+    d2 = [
+        [1262304000000, 434], [1264982400000, 232], [1267401600000, 475], [1270080000000, 553],
+        [1272672000000, 675], [1275350400000, 679], [1277942400000, 789], [1280620800000, 1026],
+        [1283299200000, 1640], [1285891200000, 1892], [1288569600000, 2147], [1291161600000, 2256]
+    ];
+
+    data = [{
+        label: "Total visitors",
+        data: d2
+    }, {
+        label: "Total sales",
+        data: d1
+    }];
+
+    chartOptions = {
+        xaxis: {
+            min: (new Date(2009, 12, 1)).getTime(),
+            max: (new Date(2010, 11, 2)).getTime(),
+            mode: "time",
+            tickSize: [1, "month"],
+            monthNames: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+            tickLength: 0
+        },
+        yaxis: {
+
+        },
+        series: {
+            lines: {
+                show: true,
+                fill: true,
+                lineWidth: 3
+            },
+            points: {
+                show: true,
+                radius: 4.5,
+                fill: true,
+                fillColor: "#ffffff",
+                lineWidth: 2.75
+            }
+        },
+        grid: {
+            hoverable: true,
+            clickable: false,
+            borderWidth: 0
+        },
+        legend: {
+            show: true
+        },
+
+        tooltip: true,
+        tooltipOpts: {
+            content: '%s: %y'
+        },
+        colors: App.chartColors
+    };
+
+    var holder = $('#area-chart');
+
+    if (holder.length) {
+        $.plot(holder, data, chartOptions);
+    }
+
+});

data/lib/repsheet_visualizer/application/public/js/demos/charts/flot/chart1.js

@@ -0,0 +1,77 @@
+$(function () {
+    
+    var d1, d2, data, chartOptions;
+
+    d1 = [
+        [1262304000000, 5], [1264982400000, 200], [1267401600000, 1605], [1270080000000, 1129], 
+        [1272672000000, 1163], [1275350400000, 1905], [1277942400000, 2002], [1280620800000, 2917], 
+        [1283299200000, 2700], [1285891200000, 2700], [1288569600000, 2100], [1291161600000, 1700]
+    ];
+ 
+    d2 = [
+        [1262304000000, 434], [1264982400000, 232], [1267401600000, 475], [1270080000000, 553],
+        [1272672000000, 675], [1275350400000, 679], [1277942400000, 789], [1280620800000, 1026], 
+        [1283299200000, 1640], [1285891200000, 1892], [1288569600000, 2147], [1291161600000, 2256]
+    ];
+
+    data = [{ 
+        label: "Total visitors", 
+        data: d1, 
+        color: '#e5412d'
+    }, {
+        label: "Total Sales",
+        data: d2,
+        color: '#f0ad4e'
+    }];
+ 
+    chartOptions = {
+        xaxis: {
+            min: (new Date(2009, 12, 1)).getTime(),
+            max: (new Date(2010, 11, 2)).getTime(),
+            mode: "time",
+            tickSize: [1, "month"],
+            monthNames: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+            tickLength: 0
+        },
+        yaxis: {
+
+        },
+        series: {
+            lines: {
+                show: true, 
+                fill: false,
+                lineWidth: 2.5
+            },
+            points: {
+                show: true,
+                radius: 4.5,
+                fill: true,
+                fillColor: "#ffffff",
+                lineWidth: 2.5
+            }
+        },
+       grid: { 
+            hoverable: true, 
+            clickable: false, 
+            borderWidth: 0 
+        },
+        legend: {
+            show: false
+        },
+        
+        tooltip: true,
+        tooltipOpts: {
+            content: '%s: %y'
+        }
+    };
+
+    
+
+    var holder = $('#chart1');
+
+    if (holder.length) {
+        $.plot(holder, data, chartOptions );
+    }
+
+
+});

data/lib/repsheet_visualizer/application/public/js/demos/charts/flot/chart2.js

@@ -0,0 +1,70 @@
+$(function () {
+
+    var d1, data, chartOptions;
+
+    d1 = [
+        [1262304000000, 5], [1264982400000, 200], [1267401600000, 1605], [1270080000000, 1129], 
+        [1272672000000, 1163], [1275350400000, 1905], [1277942400000, 2002], [1280620800000, 2917], 
+        [1283299200000, 2700], [1285891200000, 2700], [1288569600000, 2100], [1291161600000, 1700]
+    ];
+ 
+    data = [{ 
+        label: "Total visitors", 
+        data: d1, 
+        color: '#222' 
+    }];
+ 
+    chartOptions = {
+        xaxis: {
+            min: (new Date(2009, 12, 1)).getTime(),
+            max: (new Date(2010, 11, 2)).getTime(),
+            mode: "time",
+            tickSize: [2, "month"],
+            monthNames: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+            tickLength: 0
+        },
+        yaxis: {
+
+        },
+        series: {
+            lines: {
+                show: true, 
+                fill: true,
+                fillColor: { colors: [ { opacity: 0.5 }, { opacity: 0.2 } ] },
+                lineWidth: 1.5
+            },
+            points: {
+                show: true,
+                radius: 2.5,
+                fill: true,
+                fillColor: "#ffffff",
+                lineWidth: 1.1
+            }
+        },
+       grid: { 
+            hoverable: true, 
+            clickable: false, 
+            borderWidth: 0 
+        },
+        legend: {
+            show: false
+        },
+        
+        tooltip: true,
+
+        tooltipOpts: {
+            content: '%s: %y'
+        }
+    };
+
+    
+
+    var holder = $('#chart2');
+
+    if (holder.length) {
+        $.plot(holder, data, chartOptions );
+    }
+
+
+
+});

data/lib/repsheet_visualizer/application/public/js/demos/charts/flot/chart3.js

@@ -0,0 +1,71 @@
+$(function () {
+
+    var d1, data, chartOptions;
+
+    d1 = [
+        [1262304000000, 6], [1264982400000, 2057], [1267401600000, 2043], [1270080000000, 2198], 
+        [1272672000000, 2660], [1275350400000, 1826], [1277942400000, 1302], [1280620800000, 2237], 
+        [1283299200000, 2004], [1285891200000, 2144], [1288569600000, 1577], [1291161600000, 1295]
+    ];
+ 
+   data = [{ 
+        label: "Total clicks", 
+        data: d1, 
+        color: '#f0ad4e' 
+    }]; 
+
+    chartOptions = {
+        xaxis: {
+            min: (new Date(2009, 12, 1)).getTime(),
+            max: (new Date(2010, 11, 2)).getTime(),
+            mode: "time",
+            tickSize: [2, "month"],
+            monthNames: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+            tickLength: 0
+        },
+        yaxis: {
+
+        },
+        series: {
+            lines: {
+                show: true, 
+                fill: true,
+                fillColor: { colors: [ { opacity: 0.5 }, { opacity: 0.2 } ] },
+                lineWidth: 1.5
+            },
+            points: {
+                show: true,
+                radius: 2.5,
+                fill: true,
+                fillColor: "#ffffff",
+                lineWidth: 1.1
+            }
+        },
+       grid: { 
+            hoverable: true, 
+            clickable: false, 
+            borderWidth: 0 
+        },
+        legend: {
+            show: false
+        },
+        
+        tooltip: true,
+
+        tooltipOpts: {
+            content: '%s: %y'
+        }
+    };
+
+
+    
+
+    var holder = $('#chart3');
+
+    if (holder.length) {
+        $.plot(holder, data, chartOptions );
+    }
+
+
+
+});