alchemy 1.0.2 → 1.0.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (61) hide show
  1. data/app/assets/stylesheets/alchemy/components/_chosen.scss +1 -1
  2. data/app/assets/stylesheets/alchemy/components/_normalize.scss +262 -314
  3. data/app/assets/stylesheets/alchemy/components/buttons/_buttons.scss +49 -12
  4. data/app/assets/stylesheets/alchemy/components/buttons/_buttons_vars.scss +2 -1
  5. data/app/assets/stylesheets/alchemy/components/forms/_forms.scss +35 -19
  6. data/app/assets/stylesheets/alchemy/components/forms/_forms_responsive.scss +11 -5
  7. data/app/assets/stylesheets/alchemy/components/header/_header.scss +2 -0
  8. data/app/assets/stylesheets/alchemy/components/login/_login.scss +5 -1
  9. data/app/assets/stylesheets/alchemy/partials/_colors.scss +6 -6
  10. data/app/assets/stylesheets/alchemy/partials/_vars.scss +1 -1
  11. data/app/helpers/alchemy/layout_helper.rb +16 -0
  12. data/lib/alchemy.rb +1 -5
  13. data/lib/alchemy/engine.rb +8 -0
  14. data/lib/alchemy/version.rb +1 -1
  15. data/vendor/assets/javascripts/alchemy/handlebars.js +2201 -0
  16. metadata +5 -48
  17. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/API.txt +0 -1201
  18. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/FAQ.txt +0 -76
  19. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/LICENSE.txt +0 -22
  20. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/Makefile +0 -9
  21. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/NEWS.txt +0 -508
  22. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/PLUGINS.txt +0 -137
  23. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/README.txt +0 -90
  24. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/ajax.html +0 -143
  25. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/annotating.html +0 -75
  26. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/arrow-down.gif +0 -0
  27. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/arrow-left.gif +0 -0
  28. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/arrow-right.gif +0 -0
  29. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/arrow-up.gif +0 -0
  30. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/basic.html +0 -38
  31. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-eu-gdp-growth-1.json +0 -4
  32. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-eu-gdp-growth-2.json +0 -4
  33. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-eu-gdp-growth-3.json +0 -4
  34. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-eu-gdp-growth-4.json +0 -4
  35. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-eu-gdp-growth-5.json +0 -4
  36. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-eu-gdp-growth.json +0 -4
  37. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-japan-gdp-growth.json +0 -4
  38. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/data-usa-gdp-growth.json +0 -4
  39. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/graph-types.html +0 -75
  40. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/hs-2004-27-a-large_web.jpg +0 -0
  41. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/image.html +0 -45
  42. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/index.html +0 -44
  43. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/interacting-axes.html +0 -97
  44. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/interacting.html +0 -93
  45. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/layout.css +0 -6
  46. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/multiple-axes.html +0 -60
  47. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/navigate.html +0 -118
  48. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/percentiles.html +0 -57
  49. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/pie.html +0 -756
  50. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/realtime.html +0 -83
  51. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/resize.html +0 -61
  52. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/selection.html +0 -114
  53. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/setting-options.html +0 -61
  54. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/stacking.html +0 -77
  55. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/symbols.html +0 -49
  56. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/thresholding.html +0 -54
  57. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/time.html +0 -71
  58. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/tracking.html +0 -95
  59. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/turning-series.html +0 -98
  60. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/visitors.html +0 -90
  61. data/vendor/assets/javascripts/alchemy/jquery/plugins/flot-0.7/examples/zooming.html +0 -98
@@ -1,137 +0,0 @@
1
- Writing plugins
2
- ---------------
3
-
4
- All you need to do to make a new plugin is creating an init function
5
- and a set of options (if needed), stuffing it into an object and
6
- putting it in the $.plot.plugins array. For example:
7
-
8
- function myCoolPluginInit(plot) {
9
- plot.coolstring = "Hello!";
10
- };
11
-
12
- $.plot.plugins.push({ init: myCoolPluginInit, options: { ... } });
13
-
14
- // if $.plot is called, it will return a plot object with the
15
- // attribute "coolstring"
16
-
17
- Now, given that the plugin might run in many different places, it's
18
- a good idea to avoid leaking names. The usual trick here is wrap the
19
- above lines in an anonymous function which is called immediately, like
20
- this: (function () { inner code ... })(). To make it even more robust
21
- in case $ is not bound to jQuery but some other Javascript library, we
22
- can write it as
23
-
24
- (function ($) {
25
- // plugin definition
26
- // ...
27
- })(jQuery);
28
-
29
- There's a complete example below, but you should also check out the
30
- plugins bundled with Flot.
31
-
32
-
33
- Complete example
34
- ----------------
35
-
36
- Here is a simple debug plugin which alerts each of the series in the
37
- plot. It has a single option that control whether it is enabled and
38
- how much info to output:
39
-
40
- (function ($) {
41
- function init(plot) {
42
- var debugLevel = 1;
43
-
44
- function checkDebugEnabled(plot, options) {
45
- if (options.debug) {
46
- debugLevel = options.debug;
47
-
48
- plot.hooks.processDatapoints.push(alertSeries);
49
- }
50
- }
51
-
52
- function alertSeries(plot, series, datapoints) {
53
- var msg = "series " + series.label;
54
- if (debugLevel > 1)
55
- msg += " with " + series.data.length + " points";
56
- alert(msg);
57
- }
58
-
59
- plot.hooks.processOptions.push(checkDebugEnabled);
60
- }
61
-
62
- var options = { debug: 0 };
63
-
64
- $.plot.plugins.push({
65
- init: init,
66
- options: options,
67
- name: "simpledebug",
68
- version: "0.1"
69
- });
70
- })(jQuery);
71
-
72
- We also define "name" and "version". It's not used by Flot, but might
73
- be helpful for other plugins in resolving dependencies.
74
-
75
- Put the above in a file named "jquery.flot.debug.js", include it in an
76
- HTML page and then it can be used with:
77
-
78
- $.plot($("#placeholder"), [...], { debug: 2 });
79
-
80
- This simple plugin illustrates a couple of points:
81
-
82
- - It uses the anonymous function trick to avoid name pollution.
83
- - It can be enabled/disabled through an option.
84
- - Variables in the init function can be used to store plot-specific
85
- state between the hooks.
86
-
87
- The two last points are important because there may be multiple plots
88
- on the same page, and you'd want to make sure they are not mixed up.
89
-
90
-
91
- Shutting down a plugin
92
- ----------------------
93
-
94
- Each plot object has a shutdown hook which is run when plot.shutdown()
95
- is called. This usually mostly happens in case another plot is made on
96
- top of an existing one.
97
-
98
- The purpose of the hook is to give you a chance to unbind any event
99
- handlers you've registered and remove any extra DOM things you've
100
- inserted.
101
-
102
- The problem with event handlers is that you can have registered a
103
- handler which is run in some point in the future, e.g. with
104
- setTimeout(). Meanwhile, the plot may have been shutdown and removed,
105
- but because your event handler is still referencing it, it can't be
106
- garbage collected yet, and worse, if your handler eventually runs, it
107
- may overwrite stuff on a completely different plot.
108
-
109
-
110
- Some hints on the options
111
- -------------------------
112
-
113
- Plugins should always support appropriate options to enable/disable
114
- them because the plugin user may have several plots on the same page
115
- where only one should use the plugin. In most cases it's probably a
116
- good idea if the plugin is turned off rather than on per default, just
117
- like most of the powerful features in Flot.
118
-
119
- If the plugin needs options that are specific to each series, like the
120
- points or lines options in core Flot, you can put them in "series" in
121
- the options object, e.g.
122
-
123
- var options = {
124
- series: {
125
- downsample: {
126
- algorithm: null,
127
- maxpoints: 1000
128
- }
129
- }
130
- }
131
-
132
- Then they will be copied by Flot into each series, providing default
133
- values in case none are specified.
134
-
135
- Think hard and long about naming the options. These names are going to
136
- be public API, and code is going to depend on them if the plugin is
137
- successful.
@@ -1,90 +0,0 @@
1
- About
2
- -----
3
-
4
- Flot is a Javascript plotting library for jQuery. Read more at the
5
- website:
6
-
7
- http://code.google.com/p/flot/
8
-
9
- Take a look at the examples linked from above, they should give a good
10
- impression of what Flot can do and the source code of the examples is
11
- probably the fastest way to learn how to use Flot.
12
-
13
-
14
- Installation
15
- ------------
16
-
17
- Just include the Javascript file after you've included jQuery.
18
-
19
- Generally, all browsers that support the HTML5 canvas tag are
20
- supported.
21
-
22
- For support for Internet Explorer < 9, you can use Excanvas, a canvas
23
- emulator; this is used in the examples bundled with Flot. You just
24
- include the excanvas script like this:
25
-
26
- <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="excanvas.min.js"></script><![endif]-->
27
-
28
- If it's not working on your development IE 6.0, check that it has
29
- support for VML which Excanvas is relying on. It appears that some
30
- stripped down versions used for test environments on virtual machines
31
- lack the VML support.
32
-
33
- You can also try using Flashcanvas (see
34
- http://code.google.com/p/flashcanvas/), which uses Flash to do the
35
- emulation. Although Flash can be a bit slower to load than VML, if
36
- you've got a lot of points, the Flash version can be much faster
37
- overall. Flot contains some wrapper code for activating Excanvas which
38
- Flashcanvas is compatible with.
39
-
40
- You need at least jQuery 1.2.6, but try at least 1.3.2 for interactive
41
- charts because of performance improvements in event handling.
42
-
43
-
44
- Basic usage
45
- -----------
46
-
47
- Create a placeholder div to put the graph in:
48
-
49
- <div id="placeholder"></div>
50
-
51
- You need to set the width and height of this div, otherwise the plot
52
- library doesn't know how to scale the graph. You can do it inline like
53
- this:
54
-
55
- <div id="placeholder" style="width:600px;height:300px"></div>
56
-
57
- You can also do it with an external stylesheet. Make sure that the
58
- placeholder isn't within something with a display:none CSS property -
59
- in that case, Flot has trouble measuring label dimensions which
60
- results in garbled looks and might have trouble measuring the
61
- placeholder dimensions which is fatal (it'll throw an exception).
62
-
63
- Then when the div is ready in the DOM, which is usually on document
64
- ready, run the plot function:
65
-
66
- $.plot($("#placeholder"), data, options);
67
-
68
- Here, data is an array of data series and options is an object with
69
- settings if you want to customize the plot. Take a look at the
70
- examples for some ideas of what to put in or look at the reference
71
- in the file "API.txt". Here's a quick example that'll draw a line from
72
- (0, 0) to (1, 1):
73
-
74
- $.plot($("#placeholder"), [ [[0, 0], [1, 1]] ], { yaxis: { max: 1 } });
75
-
76
- The plot function immediately draws the chart and then returns a plot
77
- object with a couple of methods.
78
-
79
-
80
- What's with the name?
81
- ---------------------
82
-
83
- First: it's pronounced with a short o, like "plot". Not like "flawed".
84
-
85
- So "Flot" rhymes with "plot".
86
-
87
- And if you look up "flot" in a Danish-to-English dictionary, some up
88
- the words that come up are "good-looking", "attractive", "stylish",
89
- "smart", "impressive", "extravagant". One of the main goals with Flot
90
- is pretty looks.
@@ -1,143 +0,0 @@
1
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2
- <html>
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5
- <title>Flot Examples</title>
6
- <link href="layout.css" rel="stylesheet" type="text/css">
7
- <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]-->
8
- <script language="javascript" type="text/javascript" src="../jquery.js"></script>
9
- <script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
10
- </head>
11
- <body>
12
- <h1>Flot Examples</h1>
13
-
14
- <div id="placeholder" style="width:600px;height:300px;"></div>
15
-
16
- <p>Example of loading data dynamically with AJAX. Percentage change in GDP (source: <a href="http://epp.eurostat.ec.europa.eu/tgm/table.do?tab=table&init=1&plugin=1&language=en&pcode=tsieb020">Eurostat</a>). Click the buttons below.</p>
17
-
18
- <p>The data is fetched over HTTP, in this case directly from text
19
- files. Usually the URL would point to some web server handler
20
- (e.g. a PHP page or Java/.NET/Python/Ruby on Rails handler) that
21
- extracts it from a database and serializes it to JSON.</p>
22
-
23
- <p>
24
- <input class="fetchSeries" type="button" value="First dataset"> -
25
- <a href="data-eu-gdp-growth.json">data</a> -
26
- <span></span>
27
- </p>
28
-
29
- <p>
30
- <input class="fetchSeries" type="button" value="Second dataset"> -
31
- <a href="data-japan-gdp-growth.json">data</a> -
32
- <span></span>
33
- </p>
34
-
35
- <p>
36
- <input class="fetchSeries" type="button" value="Third dataset"> -
37
- <a href="data-usa-gdp-growth.json">data</a> -
38
- <span></span>
39
- </p>
40
-
41
- <p>If you combine AJAX with setTimeout, you can poll the server
42
- for new data.</p>
43
-
44
- <p>
45
- <input class="dataUpdate" type="button" value="Poll for data">
46
- </p>
47
-
48
- <script type="text/javascript">
49
- $(function () {
50
- var options = {
51
- lines: { show: true },
52
- points: { show: true },
53
- xaxis: { tickDecimals: 0, tickSize: 1 }
54
- };
55
- var data = [];
56
- var placeholder = $("#placeholder");
57
-
58
- $.plot(placeholder, data, options);
59
-
60
-
61
- // fetch one series, adding to what we got
62
- var alreadyFetched = {};
63
-
64
- $("input.fetchSeries").click(function () {
65
- var button = $(this);
66
-
67
- // find the URL in the link right next to us
68
- var dataurl = button.siblings('a').attr('href');
69
-
70
- // then fetch the data with jQuery
71
- function onDataReceived(series) {
72
- // extract the first coordinate pair so you can see that
73
- // data is now an ordinary Javascript object
74
- var firstcoordinate = '(' + series.data[0][0] + ', ' + series.data[0][1] + ')';
75
-
76
- button.siblings('span').text('Fetched ' + series.label + ', first point: ' + firstcoordinate);
77
-
78
- // let's add it to our current data
79
- if (!alreadyFetched[series.label]) {
80
- alreadyFetched[series.label] = true;
81
- data.push(series);
82
- }
83
-
84
- // and plot all we got
85
- $.plot(placeholder, data, options);
86
- }
87
-
88
- $.ajax({
89
- url: dataurl,
90
- method: 'GET',
91
- dataType: 'json',
92
- success: onDataReceived
93
- });
94
- });
95
-
96
-
97
- // initiate a recurring data update
98
- $("input.dataUpdate").click(function () {
99
- // reset data
100
- data = [];
101
- alreadyFetched = {};
102
-
103
- $.plot(placeholder, data, options);
104
-
105
- var iteration = 0;
106
-
107
- function fetchData() {
108
- ++iteration;
109
-
110
- function onDataReceived(series) {
111
- // we get all the data in one go, if we only got partial
112
- // data, we could merge it with what we already got
113
- data = [ series ];
114
-
115
- $.plot($("#placeholder"), data, options);
116
- }
117
-
118
- $.ajax({
119
- // usually, we'll just call the same URL, a script
120
- // connected to a database, but in this case we only
121
- // have static example files so we need to modify the
122
- // URL
123
- url: "data-eu-gdp-growth-" + iteration + ".json",
124
- method: 'GET',
125
- dataType: 'json',
126
- success: onDataReceived
127
- });
128
-
129
- if (iteration < 5)
130
- setTimeout(fetchData, 1000);
131
- else {
132
- data = [];
133
- alreadyFetched = {};
134
- }
135
- }
136
-
137
- setTimeout(fetchData, 1000);
138
- });
139
- });
140
- </script>
141
-
142
- </body>
143
- </html>
@@ -1,75 +0,0 @@
1
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2
- <html>
3
- <head>
4
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5
- <title>Flot Examples</title>
6
- <link href="layout.css" rel="stylesheet" type="text/css">
7
- <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]-->
8
- <script language="javascript" type="text/javascript" src="../jquery.js"></script>
9
- <script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
10
- </head>
11
- <body>
12
- <h1>Flot Examples</h1>
13
-
14
- <div id="placeholder" style="width:600px;height:300px;"></div>
15
-
16
- <p>Flot has support for simple background decorations such as
17
- lines and rectangles. They can be useful for marking up certain
18
- areas. You can easily add any HTML you need with standard DOM
19
- manipulation, e.g. for labels. For drawing custom shapes there is
20
- also direct access to the canvas.</p>
21
-
22
- <script type="text/javascript">
23
- $(function () {
24
- // generate a dataset
25
- var d1 = [];
26
- for (var i = 0; i < 20; ++i)
27
- d1.push([i, Math.sin(i)]);
28
-
29
- var data = [{ data: d1, label: "Pressure", color: "#333" }];
30
-
31
- // setup background areas
32
- var markings = [
33
- { color: '#f6f6f6', yaxis: { from: 1 } },
34
- { color: '#f6f6f6', yaxis: { to: -1 } },
35
- { color: '#000', lineWidth: 1, xaxis: { from: 2, to: 2 } },
36
- { color: '#000', lineWidth: 1, xaxis: { from: 8, to: 8 } }
37
- ];
38
-
39
- var placeholder = $("#placeholder");
40
-
41
- // plot it
42
- var plot = $.plot(placeholder, data, {
43
- bars: { show: true, barWidth: 0.5, fill: 0.9 },
44
- xaxis: { ticks: [], autoscaleMargin: 0.02 },
45
- yaxis: { min: -2, max: 2 },
46
- grid: { markings: markings }
47
- });
48
-
49
- // add labels
50
- var o;
51
-
52
- o = plot.pointOffset({ x: 2, y: -1.2});
53
- // we just append it to the placeholder which Flot already uses
54
- // for positioning
55
- placeholder.append('<div style="position:absolute;left:' + (o.left + 4) + 'px;top:' + o.top + 'px;color:#666;font-size:smaller">Warming up</div>');
56
-
57
- o = plot.pointOffset({ x: 8, y: -1.2});
58
- placeholder.append('<div style="position:absolute;left:' + (o.left + 4) + 'px;top:' + o.top + 'px;color:#666;font-size:smaller">Actual measurements</div>');
59
-
60
- // draw a little arrow on top of the last label to demonstrate
61
- // canvas drawing
62
- var ctx = plot.getCanvas().getContext("2d");
63
- ctx.beginPath();
64
- o.left += 4;
65
- ctx.moveTo(o.left, o.top);
66
- ctx.lineTo(o.left, o.top - 10);
67
- ctx.lineTo(o.left + 10, o.top - 5);
68
- ctx.lineTo(o.left, o.top);
69
- ctx.fillStyle = "#000";
70
- ctx.fill();
71
- });
72
- </script>
73
-
74
- </body>
75
- </html>