RubyGems - rearview - Versions diffs - 1.0.0.rc1-jruby → 1.0.0.rc2-jruby - Mend

rearview 1.0.0.rc1-jruby → 1.0.0.rc2-jruby

Files changed (1814) hide show

data/public/rearview/vendor/highcharts/examples/dynamic-update/index.htm ADDED Viewed

@@ -0,0 +1,96 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<title>Highcharts Example</title>
+		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+		<script type="text/javascript">
+$(function () {
+    $(document).ready(function() {
+        Highcharts.setOptions({
+            global: {
+                useUTC: false
+            }
+        });
+        var chart;
+        chart = new Highcharts.Chart({
+            chart: {
+                renderTo: 'container',
+                type: 'spline',
+                marginRight: 10,
+                events: {
+                    load: function() {
+                        // set up the updating of the chart each second
+                        var series = this.series[0];
+                        setInterval(function() {
+                            var x = (new Date()).getTime(), // current time
+                                y = Math.random();
+                            series.addPoint([x, y], true, true);
+                        }, 1000);
+                    }
+                }
+            },
+            title: {
+                text: 'Live random data'
+            },
+            xAxis: {
+                type: 'datetime',
+                tickPixelInterval: 150
+            },
+            yAxis: {
+                title: {
+                    text: 'Value'
+                },
+                plotLines: [{
+                    value: 0,
+                    width: 1,
+                    color: '#808080'
+                }]
+            },
+            tooltip: {
+                formatter: function() {
+                        return '<b>'+ this.series.name +'</b><br/>'+
+                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+
+                        Highcharts.numberFormat(this.y, 2);
+                }
+            },
+            legend: {
+                enabled: false
+            },
+            exporting: {
+                enabled: false
+            },
+            series: [{
+                name: 'Random data',
+                data: (function() {
+                    // generate an array of random data
+                    var data = [],
+                        time = (new Date()).getTime(),
+                        i;
+                    for (i = -19; i <= 0; i++) {
+                        data.push({
+                            x: time + i * 1000,
+                            y: Math.random()
+                        });
+                    }
+                    return data;
+                })()
+            }]
+        });
+    });
+});
+		</script>
+	</head>
+	<body>
+<script src="../../js/highcharts.js"></script>
+<script src="../../js/modules/exporting.js"></script>
+<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
+	</body>
+</html>

data/public/rearview/vendor/highcharts/examples/gauge-clock/index.htm ADDED Viewed

@@ -0,0 +1,174 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<title>Highcharts Example</title>
+		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+		<script type="text/javascript">
+$(function () {
+	/**
+	 * Get the current time
+	 */
+	function getNow () {
+	    var now = new Date();
+	    return {
+	        hours: now.getHours() + now.getMinutes() / 60,
+	        minutes: now.getMinutes() * 12 / 60 + now.getSeconds() * 12 / 3600,
+	        seconds: now.getSeconds() * 12 / 60
+	    };
+	};
+	var now = getNow();
+	// Create the chart
+	var chart = new Highcharts.Chart({
+	    chart: {
+	        renderTo: 'container',
+	        type: 'gauge',
+	        plotBackgroundColor: null,
+	        plotBackgroundImage: null,
+	        plotBorderWidth: 0,
+	        plotShadow: false,
+	        height: 200
+	    },
+	    credits: {
+	        enabled: false
+	    },
+	    title: {
+	    	text: 'The Highcharts clock'
+	    },
+	    pane: {
+	    	background: [{
+	    		// default background
+	    	}, {
+	    		// reflex for supported browsers
+	    		backgroundColor: Highcharts.svg ? {
+		    		radialGradient: {
+		    			cx: 0.5,
+		    			cy: -0.4,
+		    			r: 1.9
+		    		},
+		    		stops: [
+		    			[0.5, 'rgba(255, 255, 255, 0.2)'],
+		    			[0.5, 'rgba(200, 200, 200, 0.2)']
+		    		]
+		    	} : null
+	    	}]
+	    },
+	    yAxis: {
+	        labels: {
+	            distance: -20
+	        },
+	        min: 0,
+	        max: 12,
+	        lineWidth: 0,
+	        showFirstLabel: false,
+	        minorTickInterval: 'auto',
+	        minorTickWidth: 1,
+	        minorTickLength: 5,
+	        minorTickPosition: 'inside',
+	        minorGridLineWidth: 0,
+	        minorTickColor: '#666',
+	        tickInterval: 1,
+	        tickWidth: 2,
+	        tickPosition: 'inside',
+	        tickLength: 10,
+	        tickColor: '#666',
+	        title: {
+	            text: 'Powered by<br/>Highcharts',
+	            style: {
+	                color: '#BBB',
+	                fontWeight: 'normal',
+	                fontSize: '8px',
+	                lineHeight: '10px'
+	            },
+	            y: 10
+	        }
+	    },
+	    series: [{
+	        data: [{
+	            id: 'hour',
+	            y: now.hours,
+	            dial: {
+	                radius: '60%',
+	                baseWidth: 4,
+	                baseLength: '95%',
+	                rearLength: 0
+	            }
+	        }, {
+	            id: 'minute',
+	            y: now.minutes,
+	            dial: {
+	                baseLength: '95%',
+	                rearLength: 0
+	            }
+	        }, {
+	            id: 'second',
+	            y: now.seconds,
+	            dial: {
+	                radius: '100%',
+	                baseWidth: 1,
+	                rearLength: '20%'
+	            }
+	        }],
+	        animation: false,
+	        dataLabels: {
+	            enabled: false
+	        }
+	    }]
+	},
+	// Move
+	function (chart) {
+	    setInterval(function () {
+	        var hour = chart.get('hour'),
+	            minute = chart.get('minute'),
+	            second = chart.get('second'),
+	            now = getNow(),
+	            // run animation unless we're wrapping around from 59 to 0
+	            animation = now.seconds == 0 ?
+	                false :
+	                {
+	                    easing: 'easeOutElastic'
+	                };
+	        hour.update(now.hours, true, animation);
+	        minute.update(now.minutes, true, animation);
+	        second.update(now.seconds, true, animation);
+	    }, 1000);
+	});
+});
+// Extend jQuery with some easing (copied from jQuery UI)
+$.extend($.easing, {
+	easeOutElastic: function (x, t, b, c, d) {
+		var s=1.70158;var p=0;var a=c;
+		if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
+		if (a < Math.abs(c)) { a=c; var s=p/4; }
+		else var s = p/(2*Math.PI) * Math.asin (c/a);
+		return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
+	}
+});
+		</script>
+	</head>
+	<body>
+<script src="../../js/highcharts.js"></script>
+<script src="../../js/highcharts-more.js"></script>
+<div id="container" style="width: 300px; height: 300px; margin: 0 auto"></div>
+	</body>
+</html>

data/public/rearview/vendor/highcharts/examples/gauge-dual/index.htm ADDED Viewed

@@ -0,0 +1,122 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<title>Highcharts Example</title>
+		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+		<script type="text/javascript">
+$(function () {
+	var chart = new Highcharts.Chart({
+	    chart: {
+	        renderTo: 'container',
+	        type: 'gauge',
+	        alignTicks: false,
+	        plotBackgroundColor: null,
+	        plotBackgroundImage: null,
+	        plotBorderWidth: 0,
+	        plotShadow: false
+	    },
+	    title: {
+	        text: 'Speedometer with dual axes'
+	    },
+	    pane: {
+	        startAngle: -150,
+	        endAngle: 150
+	    },
+	    yAxis: [{
+	        min: 0,
+	        max: 200,
+	        lineColor: '#339',
+	        tickColor: '#339',
+	        minorTickColor: '#339',
+	        offset: -25,
+	        lineWidth: 2,
+	        labels: {
+	            distance: -20,
+	            rotation: 'auto'
+	        },
+	        tickLength: 5,
+	        minorTickLength: 5,
+	        endOnTick: false
+	    }, {
+	        min: 0,
+	        max: 124,
+	        tickPosition: 'outside',
+	        lineColor: '#933',
+	        lineWidth: 2,
+	        minorTickPosition: 'outside',
+	        tickColor: '#933',
+	        minorTickColor: '#933',
+	        tickLength: 5,
+	        minorTickLength: 5,
+	        labels: {
+	            distance: 12,
+	            rotation: 'auto'
+	        },
+	        offset: -20,
+	        endOnTick: false
+	    }],
+	    series: [{
+	        name: 'Speed',
+	        data: [80],
+	        dataLabels: {
+	            formatter: function () {
+	                var kmh = this.y,
+	                    mph = Math.round(kmh * 0.621);
+	                return '<span style="color:#339">'+ kmh + ' km/h</span><br/>' +
+	                    '<span style="color:#933">' + mph + ' mph</span>';
+	            },
+	            backgroundColor: {
+	                linearGradient: {
+	                    x1: 0,
+	                    y1: 0,
+	                    x2: 0,
+	                    y2: 1
+	                },
+	                stops: [
+	                    [0, '#DDD'],
+	                    [1, '#FFF']
+	                ]
+	            }
+	        },
+	        tooltip: {
+	            valueSuffix: ' km/h'
+	        }
+	    }]
+	},
+	// Add some life
+	function(chart) {
+	    setInterval(function() {
+	        var point = chart.series[0].points[0],
+	            newVal, inc = Math.round((Math.random() - 0.5) * 20);
+	        newVal = point.y + inc;
+	        if (newVal < 0 || newVal > 200) {
+	            newVal = point.y - inc;
+	        }
+	        point.update(newVal);
+	    }, 3000);
+	});
+});
+		</script>
+	</head>
+	<body>
+<script src="../../js/highcharts.js"></script>
+<script src="../../js/highcharts-more.js"></script>
+<script src="../../js/modules/exporting.js"></script>
+<div id="container" style="width: 400px; height: 300px; margin: 0 auto"></div>
+	</body>
+</html>

data/public/rearview/vendor/highcharts/examples/gauge-speedometer/index.htm ADDED Viewed

@@ -0,0 +1,133 @@
+<!DOCTYPE HTML>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+		<title>Highcharts Example</title>
+		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+		<script type="text/javascript">
+$(function () {
+    var chart = new Highcharts.Chart({
+	    chart: {
+	        renderTo: 'container',
+	        type: 'gauge',
+	        plotBackgroundColor: null,
+	        plotBackgroundImage: null,
+	        plotBorderWidth: 0,
+	        plotShadow: false
+	    },
+	    title: {
+	        text: 'Speedometer'
+	    },
+	    pane: {
+	        startAngle: -150,
+	        endAngle: 150,
+	        background: [{
+	            backgroundColor: {
+	                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
+	                stops: [
+	                    [0, '#FFF'],
+	                    [1, '#333']
+	                ]
+	            },
+	            borderWidth: 0,
+	            outerRadius: '109%'
+	        }, {
+	            backgroundColor: {
+	                linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
+	                stops: [
+	                    [0, '#333'],
+	                    [1, '#FFF']
+	                ]
+	            },
+	            borderWidth: 1,
+	            outerRadius: '107%'
+	        }, {
+	            // default background
+	        }, {
+	            backgroundColor: '#DDD',
+	            borderWidth: 0,
+	            outerRadius: '105%',
+	            innerRadius: '103%'
+	        }]
+	    },
+	    // the value axis
+	    yAxis: {
+	        min: 0,
+	        max: 200,
+	        minorTickInterval: 'auto',
+	        minorTickWidth: 1,
+	        minorTickLength: 10,
+	        minorTickPosition: 'inside',
+	        minorTickColor: '#666',
+	        tickPixelInterval: 30,
+	        tickWidth: 2,
+	        tickPosition: 'inside',
+	        tickLength: 10,
+	        tickColor: '#666',
+	        labels: {
+	            step: 2,
+	            rotation: 'auto'
+	        },
+	        title: {
+	            text: 'km/h'
+	        },
+	        plotBands: [{
+	            from: 0,
+	            to: 120,
+	            color: '#55BF3B' // green
+	        }, {
+	            from: 120,
+	            to: 160,
+	            color: '#DDDF0D' // yellow
+	        }, {
+	            from: 160,
+	            to: 200,
+	            color: '#DF5353' // red
+	        }]
+	    },
+	    series: [{
+	        name: 'Speed',
+	        data: [80],
+	        tooltip: {
+	            valueSuffix: ' km/h'
+	        }
+	    }]
+	},
+	// Add some life
+	function (chart) {
+	    setInterval(function () {
+	        var point = chart.series[0].points[0],
+	            newVal,
+	            inc = Math.round((Math.random() - 0.5) * 20);
+	        newVal = point.y + inc;
+	        if (newVal < 0 || newVal > 200) {
+	            newVal = point.y - inc;
+	        }
+	        point.update(newVal);
+	    }, 3000);
+	});
+});
+		</script>
+	</head>
+	<body>
+<script src="../../js/highcharts.js"></script>
+<script src="../../js/highcharts-more.js"></script>
+<script src="../../js/modules/exporting.js"></script>
+<div id="container" style="width: 400px; height: 300px; margin: 0 auto"></div>
+	</body>
+</html>