jquery_cheats 4.1.3 → 4.2.0
Sign up to get free protection for your applications and to get access to all the features.
- data/README.md +1 -3
- data/app/assets/javascripts/jquery_cheats/jquery_cheats.js +252 -167
- data/jquery_cheats.gemspec +1 -1
- data/lib/jquery_cheats.rb +4 -0
- metadata +1 -1
data/README.md
CHANGED
@@ -71,6 +71,4 @@ string such as(item=4&item2=3)
|
|
71
71
|
|
72
72
|
##Graphing
|
73
73
|
|
74
|
-
JQuery Cheats
|
75
|
-
|
76
|
-
See the wiki to learn how to make a bar chart, or pie chart.
|
74
|
+
JQuery Cheats works in conjunction with [plotSimple](http://github.com/plowdawg/plotSimple) to provide you with a graphing interface.
|
@@ -1,144 +1,229 @@
|
|
1
1
|
//*==============SPECIAL THANKS TO:===========
|
2
2
|
// IX3 for his response from Stackoverflow
|
3
3
|
|
4
|
-
$(document).ready(function(){
|
4
|
+
$(document).ready(function() {
|
5
5
|
//the following are for AJAX requests of form objects
|
6
|
-
$("select[data-onchange]").live("change",function()
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
6
|
+
$("select[data-onchange]").live("change", function() {
|
7
|
+
$.ajax({
|
8
|
+
type : "post",
|
9
|
+
url : $(this).attr("data-url"),
|
10
|
+
data : $(this).serialize(),
|
11
|
+
success : function(data) {
|
12
|
+
eval(data);
|
13
|
+
},
|
14
|
+
dataType : "script"
|
15
|
+
});
|
16
|
+
});
|
17
|
+
$('input[type="radio"][data-onclick]').live("change", function() {
|
15
18
|
data = $(this).serialze();
|
16
|
-
if($(this).attr("data-params"))
|
17
|
-
|
18
|
-
data += "&"+$(this).attr("data-params");
|
19
|
+
if($(this).attr("data-params")) {
|
20
|
+
data += "&" + $(this).attr("data-params");
|
19
21
|
}
|
20
22
|
$.ajax({
|
21
|
-
type: "post",
|
22
|
-
url: eval($(this).attr("data-onclick")),
|
23
|
-
data: data,
|
24
|
-
success: function(data){
|
25
|
-
|
23
|
+
type : "post",
|
24
|
+
url : eval($(this).attr("data-onclick")),
|
25
|
+
data : data,
|
26
|
+
success : function(data) {
|
27
|
+
eval(data);
|
28
|
+
},
|
29
|
+
dataType : "script"
|
26
30
|
})
|
27
31
|
});
|
28
32
|
//The following Load jqPlot graphs and charts
|
29
|
-
$("div.piechart").each(function(){
|
30
|
-
pieChart($(this).attr("id")
|
33
|
+
$("div.piechart").each(function() {
|
34
|
+
pieChart($(this).attr("id"), $(this).attr("data-xmlurl"));
|
31
35
|
});
|
32
|
-
|
33
|
-
|
34
|
-
|
36
|
+
|
37
|
+
$("div.stackedcolumn").each(function() {
|
38
|
+
stackedColumn($(this).attr("id"), $(this).attr("data-xmlurl"))
|
39
|
+
})
|
35
40
|
//IX3 CONTRIUBTUITION
|
36
|
-
|
41
|
+
updateBarCharts();
|
37
42
|
//next function commented out because it causes issues with browser...will work on it....
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
+
$("body").on("DOMSubtreeModified", function(e) {
|
44
|
+
//console.log(e);
|
45
|
+
updateBarCharts();
|
46
|
+
});
|
47
|
+
//CONTRIBUTION END
|
43
48
|
//The following provide click-to-link capabilities in charts
|
44
|
-
$("div.piechart").live('jqplotDataClick',function(ev,seriesIndex,pointIndex,data){
|
45
|
-
if(data[2] != "")
|
46
|
-
|
47
|
-
|
49
|
+
$("div.piechart").live('jqplotDataClick', function(ev, seriesIndex, pointIndex, data) {
|
50
|
+
if(data[2] != "") {
|
51
|
+
|
48
52
|
window.location = data[2];
|
49
53
|
}
|
50
54
|
});
|
51
|
-
$("div.barchart").live('jqplotDataClick',function(ev,seriesIndex,pointIndex,data){
|
52
|
-
if(data[2] != "")
|
53
|
-
|
54
|
-
window.location = data[2];
|
55
|
+
$("div.barchart").live('jqplotDataClick', function(ev, seriesIndex, pointIndex, data) {
|
56
|
+
if(data[2] != "") {
|
57
|
+
window.location = data[2];
|
55
58
|
}
|
56
59
|
});
|
60
|
+
$('div.stackedcolumn').live('jqplotDataClick',
|
61
|
+
function (ev, seriesIndex, pointIndex, data) {
|
62
|
+
//loaded from a global array in loadLinks...FixMe!
|
63
|
+
window.location = links[seriesIndex];
|
64
|
+
});
|
57
65
|
});
|
58
|
-
|
59
|
-
|
60
|
-
{
|
61
|
-
|
62
|
-
|
63
|
-
barChart($(this).attr("id"),$(this).attr("data-xmlurl"));
|
64
|
-
})
|
65
|
-
}
|
66
|
-
function barChart(name,xmlurl)
|
67
|
-
{
|
68
|
-
$.ajax({url: xmlurl,
|
69
|
-
type: "get",
|
70
|
-
success: function(xml){
|
71
|
-
loadBGImage(name,xml);
|
66
|
+
|
67
|
+
//functions specific to a stacked column
|
68
|
+
function stackedColumn(name, xmlurl) {
|
69
|
+
$.get(xmlurl, function(xml) {
|
70
|
+
loadLinks(xml);
|
72
71
|
establishSize(name,xml);
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
}
|
79
|
-
$.jqplot(name,[bars],{
|
80
|
-
seriesColors: getSeriesColors(xml),
|
81
|
-
seriesDefaults:
|
72
|
+
var s1 = [2, 6, 7, 10];
|
73
|
+
var s2 = [7, 5, 3, 4];
|
74
|
+
var s3 = [14, 9, 3, 8];
|
75
|
+
var series = loadStackedColumns(xml)
|
76
|
+
for(var i = 0; i < series.length; i++)
|
82
77
|
{
|
83
|
-
|
84
|
-
renderOptions:
|
78
|
+
for(var j = 0; j < series[i].length; j++)
|
85
79
|
{
|
86
|
-
|
80
|
+
$("#debug").append(series[i][j]+"|");
|
81
|
+
}
|
82
|
+
$("#debug").append("<br />");
|
83
|
+
}
|
84
|
+
$.jqplot(name,series , {
|
85
|
+
// Tell the plot to stack the bars.
|
86
|
+
stackSeries : true,
|
87
|
+
title: getTitle(xml),
|
88
|
+
captureRightClick : true,
|
89
|
+
seriesDefaults : {
|
90
|
+
renderer : $.jqplot.BarRenderer,
|
91
|
+
rendererOptions : {
|
92
|
+
// Put a 30 pixel margin between bars.
|
93
|
+
barMargin : 30,
|
94
|
+
// Highlight bars when mouse button pressed.
|
95
|
+
// Disables default highlighting on mouse over.
|
96
|
+
highlightMouseDown : true
|
97
|
+
},
|
98
|
+
pointLabels : {
|
99
|
+
show : true
|
100
|
+
}
|
87
101
|
},
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
labels: pointLabels,
|
92
|
-
}
|
93
|
-
}],
|
94
|
-
title:
|
95
|
-
{
|
96
|
-
text: getTitle(xml)
|
97
|
-
},
|
98
|
-
grid:
|
99
|
-
{
|
100
|
-
background: getBGColor(xml),
|
101
|
-
gridLine: getGridLineColor(xml),
|
102
|
-
borderColor: getGridBorderColor(xml)
|
103
|
-
},
|
104
|
-
axesDefaults:
|
105
|
-
{
|
106
|
-
tickRenderer: $.jqplot.CanvasAxisTickRenderer
|
107
|
-
},
|
108
|
-
axes:
|
109
|
-
{
|
110
|
-
xaxis:
|
111
|
-
{
|
112
|
-
renderer: $.jqplot.CategoryAxisRenderer,
|
113
|
-
tickOptions:{
|
114
|
-
angle: 30
|
102
|
+
axes : {
|
103
|
+
xaxis : {
|
104
|
+
renderer : $.jqplot.CategoryAxisRenderer
|
115
105
|
},
|
116
|
-
|
117
|
-
|
106
|
+
yaxis : {
|
107
|
+
// Don't pad out the bottom of the data range. By default,
|
108
|
+
// axes scaled as if data extended 10% above and below the
|
109
|
+
// actual range to prevent data points right on grid boundaries.
|
110
|
+
// Don't want to do that here.
|
111
|
+
padMin : 0
|
112
|
+
}
|
113
|
+
},
|
114
|
+
legend : {
|
115
|
+
show : true,
|
116
|
+
location : 'e',
|
117
|
+
placement : 'outside'
|
118
118
|
}
|
119
|
-
}
|
119
|
+
});
|
120
|
+
});
|
121
|
+
}
|
122
|
+
|
123
|
+
function loadLinks(xml)
|
124
|
+
{
|
125
|
+
//Global, but maybe we can find a way around this later...FixMe!
|
126
|
+
links = [];
|
127
|
+
$(xml).find("series").each(function(){
|
128
|
+
links.push($(this).attr("link"));
|
120
129
|
});
|
121
|
-
return true;
|
122
|
-
},
|
123
|
-
error: function(xhr, status, error) {
|
124
|
-
var err = eval("(" + xhr.responseText + ")");
|
125
|
-
alert(err.Message);
|
126
|
-
},
|
127
|
-
async: false,
|
128
|
-
timeout: 3000});
|
129
130
|
}
|
130
|
-
function
|
131
|
+
function loadStackedColumns(xml)
|
131
132
|
{
|
132
|
-
var
|
133
|
+
var bar = [];
|
134
|
+
var partions = [];
|
135
|
+
$(xml).find("series").each(function(){
|
136
|
+
$(this).children("partion").each(function(){
|
137
|
+
bar.push(parseInt($(this).attr("size")));
|
138
|
+
});
|
139
|
+
partions.push(bar);
|
140
|
+
bar = new Array();
|
141
|
+
});
|
142
|
+
return partions;
|
143
|
+
}
|
144
|
+
//functions specific to barchart
|
145
|
+
function updateBarCharts() {
|
146
|
+
$("div.barchart:not([data-barchartloaded])").each(function() {
|
147
|
+
$(this).attr("data-barchartloaded", "1");
|
148
|
+
barChart($(this).attr("id"), $(this).attr("data-xmlurl"));
|
149
|
+
})
|
150
|
+
}
|
151
|
+
|
152
|
+
function barChart(name, xmlurl) {
|
153
|
+
$.ajax({
|
154
|
+
url : xmlurl,
|
155
|
+
type : "get",
|
156
|
+
success : function(xml) {
|
157
|
+
loadBGImage(name, xml);
|
158
|
+
establishSize(name, xml);
|
159
|
+
bars = getBars(xml);
|
160
|
+
pointLabels = [];
|
161
|
+
for( i = 0; i < bars.length; i++) {
|
162
|
+
pointLabels.push(bars[i][1]);
|
163
|
+
}
|
164
|
+
$.jqplot(name, [bars], {
|
165
|
+
seriesColors : getSeriesColors(xml),
|
166
|
+
seriesDefaults : {
|
167
|
+
renderer : $.jqplot.BarRenderer,
|
168
|
+
renderOptions : {
|
169
|
+
fillToZero : true,
|
170
|
+
barWidth : getBarWidth(xml)
|
171
|
+
},
|
172
|
+
pointLabels : {
|
173
|
+
show : true
|
174
|
+
}
|
175
|
+
},
|
176
|
+
series : [{
|
177
|
+
pointLabels : {
|
178
|
+
labels : pointLabels,
|
179
|
+
}
|
180
|
+
}],
|
181
|
+
title : {
|
182
|
+
text : getTitle(xml)
|
183
|
+
},
|
184
|
+
grid : {
|
185
|
+
background : getBGColor(xml),
|
186
|
+
gridLine : getGridLineColor(xml),
|
187
|
+
borderColor : getGridBorderColor(xml)
|
188
|
+
},
|
189
|
+
axesDefaults : {
|
190
|
+
tickRenderer : $.jqplot.CanvasAxisTickRenderer
|
191
|
+
},
|
192
|
+
axes : {
|
193
|
+
xaxis : {
|
194
|
+
renderer : $.jqplot.CategoryAxisRenderer,
|
195
|
+
tickOptions : {
|
196
|
+
angle : 30
|
197
|
+
},
|
198
|
+
ticks : getTicks(xml),
|
199
|
+
autoscale : true
|
200
|
+
}
|
201
|
+
}
|
202
|
+
});
|
203
|
+
return true;
|
204
|
+
},
|
205
|
+
error : function(xhr, status, error) {
|
206
|
+
var err = eval("(" + xhr.responseText + ")");
|
207
|
+
alert(err.Message);
|
208
|
+
},
|
209
|
+
async : false,
|
210
|
+
timeout : 3000
|
211
|
+
});
|
212
|
+
}
|
213
|
+
|
214
|
+
function getBars(xml) {
|
215
|
+
var bars = [];
|
133
216
|
var bar = [];
|
134
217
|
var categoryId = 1;
|
135
|
-
$(xml).find("category").each(function(){
|
136
|
-
$(this).find("bar").each(function()
|
137
|
-
{
|
218
|
+
$(xml).find("category").each(function() {
|
219
|
+
$(this).find("bar").each(function() {
|
138
220
|
bar.push(categoryId);
|
139
221
|
bar.push(parseInt($(this).attr("size")));
|
140
222
|
var link = $(this).attr("link");
|
141
|
-
if(link)
|
223
|
+
if(link)
|
224
|
+
bar.push(link);
|
225
|
+
else
|
226
|
+
bar.push("");
|
142
227
|
bars.push(bar);
|
143
228
|
bar = new Array();
|
144
229
|
});
|
@@ -146,101 +231,101 @@ function getBars(xml)
|
|
146
231
|
});
|
147
232
|
return bars;
|
148
233
|
}
|
149
|
-
|
150
|
-
{
|
234
|
+
|
235
|
+
function getBarWidth(xml) {
|
151
236
|
var width = $(xml).find("render").attr("barwidth");
|
152
|
-
if(!width)
|
237
|
+
if(!width)
|
238
|
+
return null;
|
239
|
+
else
|
240
|
+
return width;
|
153
241
|
}
|
154
|
-
|
155
|
-
{
|
242
|
+
|
243
|
+
function getTicks(xml) {
|
156
244
|
var ticks = [];
|
157
|
-
$(xml).find("category").each(function(){
|
158
|
-
ticks.push
|
245
|
+
$(xml).find("category").each(function() {
|
246
|
+
ticks.push($(this).find("tick").attr("text"));
|
159
247
|
});
|
160
248
|
return ticks;
|
161
249
|
}
|
250
|
+
|
162
251
|
//functions specific to piechart
|
163
|
-
function pieChart(name,xmlurl)
|
164
|
-
{
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
{
|
173
|
-
renderer: $.jqplot.PieRenderer,
|
174
|
-
renderOptions:
|
175
|
-
{
|
176
|
-
showDataLabels: true
|
252
|
+
function pieChart(name, xmlurl) {
|
253
|
+
$.get(xmlurl, function(xml) {
|
254
|
+
establishSize(name, xml);
|
255
|
+
loadBGImage(name, xml);
|
256
|
+
$.jqplot(name, [getSlices(xml)], {
|
257
|
+
seriesDefaults : {
|
258
|
+
renderer : $.jqplot.PieRenderer,
|
259
|
+
renderOptions : {
|
260
|
+
showDataLabels : true
|
177
261
|
}
|
178
262
|
},
|
179
|
-
legend:
|
180
|
-
|
181
|
-
|
182
|
-
location: 'e'
|
263
|
+
legend : {
|
264
|
+
show : true,
|
265
|
+
location : 'e'
|
183
266
|
}
|
184
267
|
});
|
185
268
|
});
|
186
269
|
}
|
187
|
-
|
188
|
-
{
|
270
|
+
|
271
|
+
function getSlices(xml) {
|
189
272
|
var slices = [];
|
190
|
-
$(xml).find("category").each(function(){
|
191
|
-
$(this).find("slice").each(function(){
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
273
|
+
$(xml).find("category").each(function() {
|
274
|
+
$(this).find("slice").each(function() {
|
275
|
+
slice = new Array($(this).attr("name"));
|
276
|
+
slice.push(parseInt($(this).attr("size")));
|
277
|
+
var link = $(this).attr("link");
|
278
|
+
if(link)
|
279
|
+
slice.push(link);
|
280
|
+
else
|
281
|
+
slice.push("");
|
282
|
+
slices.push(slice);
|
283
|
+
});
|
198
284
|
});
|
199
285
|
return slices;
|
200
286
|
}
|
287
|
+
|
201
288
|
//functions that can be used by all
|
202
|
-
function loadBGImage(name,xml)
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
{
|
207
|
-
bgimage = "url('"+$(this).text()+"')";
|
289
|
+
function loadBGImage(name, xml) {
|
290
|
+
var bgimage = "none";
|
291
|
+
$(xml).find("backgroundImage").each(function() {
|
292
|
+
bgimage = "url('" + $(this).text() + "')";
|
208
293
|
});
|
209
|
-
$("div#"+name).css("background-image",bgimage);
|
294
|
+
$("div#" + name).css("background-image", bgimage);
|
210
295
|
}
|
211
|
-
|
212
|
-
{
|
296
|
+
|
297
|
+
function establishSize(name, xml) {
|
213
298
|
var $grid = $(xml).find("grid");
|
214
|
-
$("div#"+name).css("width"
|
215
|
-
$("div#"+name).css("height"
|
299
|
+
$("div#" + name).css("width", $grid.find("width").text());
|
300
|
+
$("div#" + name).css("height", $grid.find("height").text());
|
216
301
|
}
|
217
|
-
|
218
|
-
{
|
302
|
+
|
303
|
+
function getTitle(xml) {
|
219
304
|
var title = null;
|
220
|
-
$(xml).find("title").each(function(){
|
305
|
+
$(xml).find("title").each(function() {
|
221
306
|
title = $(this).text();
|
222
307
|
});
|
223
308
|
return title;
|
224
309
|
}
|
225
|
-
|
226
|
-
{
|
310
|
+
|
311
|
+
function getBGColor(xml) {
|
227
312
|
return $(xml).find("background").text();
|
228
313
|
}
|
229
|
-
|
230
|
-
{
|
314
|
+
|
315
|
+
function getGridLineColor(xml) {
|
231
316
|
return $(xml).find("grid lineColor").text();
|
232
317
|
}
|
233
|
-
|
234
|
-
{
|
318
|
+
|
319
|
+
function getGridBorderColor(xml) {
|
235
320
|
return $(xml).find("grid borderColor").text();
|
236
321
|
}
|
237
|
-
|
238
|
-
{
|
322
|
+
|
323
|
+
function getSeriesColors(xml) {
|
239
324
|
colors = [];
|
240
|
-
$(xml).find("grid seriesColor").each(function()
|
241
|
-
{
|
325
|
+
$(xml).find("grid seriesColor").each(function() {
|
242
326
|
colors.push($(this).text());
|
243
327
|
});
|
244
|
-
if(colors.length < 1)
|
328
|
+
if(colors.length < 1)
|
329
|
+
colors.push("#0f0");
|
245
330
|
return colors;
|
246
331
|
}
|
data/jquery_cheats.gemspec
CHANGED
data/lib/jquery_cheats.rb
CHANGED
@@ -47,6 +47,10 @@ module JQueryCheats
|
|
47
47
|
#we will have to relly on XML to get the rest of the data...
|
48
48
|
end
|
49
49
|
|
50
|
+
def stackedcolumn(name,xmlurl)
|
51
|
+
html = "<div id=\"#{name}\" class=\"stackedcolumn\" data-xmlurl=\"#{xmlurl}\"></div>".html_safe
|
52
|
+
end
|
53
|
+
|
50
54
|
def initialize
|
51
55
|
|
52
56
|
end
|