slickgrid-rails 0.1.0 → 0.2.0
Sign up to get free protection for your applications and to get access to all the features.
- data/.gitignore +1 -0
- data/.rvmrc +1 -1
- data/Gemfile +0 -2
- data/Gemfile.lock +24 -14
- data/README.md +107 -2
- data/bootstrap.sh +2 -0
- data/lib/slickgrid/rails/version.rb +2 -2
- data/lib/slickgrid/table.rb +7 -23
- data/slickgrid-rails.gemspec +4 -2
- data/vendor/assets/javascripts/slick.js +3 -1
- data/vendor/assets/javascripts/slick/controls/columnpicker.js +25 -18
- data/vendor/assets/javascripts/slick/grid.js +39 -23
- data/vendor/assets/javascripts/slick/remotemodel.js.coffee +58 -0
- data/vendor/assets/javascripts/slick/sorters.js.coffee +28 -0
- data/vendor/assets/stylesheets/slick/controls/{columnpicker.css → columnpicker.css.scss} +0 -0
- data/vendor/assets/stylesheets/slick/editors.css.scss +100 -0
- data/vendor/assets/stylesheets/slick/grid.css.scss +16 -0
- data/vendor/assets/stylesheets/slick/remotemodel.css.scss +20 -0
- metadata +31 -15
- data/vendor/assets/javascripts/slick/remotemodel.js +0 -164
data/.gitignore
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
pkg/
|
data/.rvmrc
CHANGED
@@ -1 +1 @@
|
|
1
|
-
rvm use --create ruby-1.9.3-
|
1
|
+
rvm use --create ruby-1.9.3-p125@slickgrid-rails
|
data/Gemfile
CHANGED
data/Gemfile.lock
CHANGED
@@ -2,6 +2,7 @@ PATH
|
|
2
2
|
remote: .
|
3
3
|
specs:
|
4
4
|
slickgrid-rails (0.1.0)
|
5
|
+
coffee-rails
|
5
6
|
jquery-plugins-rails
|
6
7
|
jquery-rails
|
7
8
|
railties (~> 3.0)
|
@@ -10,9 +11,9 @@ PATH
|
|
10
11
|
GEM
|
11
12
|
remote: https://rubygems.org/
|
12
13
|
specs:
|
13
|
-
actionpack (3.2.
|
14
|
-
activemodel (= 3.2.
|
15
|
-
activesupport (= 3.2.
|
14
|
+
actionpack (3.2.2)
|
15
|
+
activemodel (= 3.2.2)
|
16
|
+
activesupport (= 3.2.2)
|
16
17
|
builder (~> 3.0.0)
|
17
18
|
erubis (~> 2.7.0)
|
18
19
|
journey (~> 1.0.1)
|
@@ -20,35 +21,44 @@ GEM
|
|
20
21
|
rack-cache (~> 1.1)
|
21
22
|
rack-test (~> 0.6.1)
|
22
23
|
sprockets (~> 2.1.2)
|
23
|
-
activemodel (3.2.
|
24
|
-
activesupport (= 3.2.
|
24
|
+
activemodel (3.2.2)
|
25
|
+
activesupport (= 3.2.2)
|
25
26
|
builder (~> 3.0.0)
|
26
|
-
activesupport (3.2.
|
27
|
+
activesupport (3.2.2)
|
27
28
|
i18n (~> 0.6)
|
28
29
|
multi_json (~> 1.0)
|
29
30
|
builder (3.0.0)
|
31
|
+
coffee-rails (3.2.2)
|
32
|
+
coffee-script (>= 2.2.0)
|
33
|
+
railties (~> 3.2.0)
|
34
|
+
coffee-script (2.2.0)
|
35
|
+
coffee-script-source
|
36
|
+
execjs
|
37
|
+
coffee-script-source (1.2.0)
|
30
38
|
erubis (2.7.0)
|
39
|
+
execjs (1.3.0)
|
40
|
+
multi_json (~> 1.0)
|
31
41
|
hike (1.2.1)
|
32
42
|
i18n (0.6.0)
|
33
|
-
journey (1.0.
|
43
|
+
journey (1.0.3)
|
34
44
|
jquery-plugins-rails (0.1.0)
|
35
45
|
jquery-rails
|
36
46
|
railties (~> 3.0)
|
37
|
-
jquery-rails (2.0.
|
38
|
-
railties (>= 3.2.0
|
47
|
+
jquery-rails (2.0.1)
|
48
|
+
railties (>= 3.2.0, < 5.0)
|
39
49
|
thor (~> 0.14)
|
40
50
|
json (1.6.5)
|
41
|
-
multi_json (1.0
|
51
|
+
multi_json (1.1.0)
|
42
52
|
rack (1.4.1)
|
43
|
-
rack-cache (1.
|
53
|
+
rack-cache (1.2)
|
44
54
|
rack (>= 0.4)
|
45
55
|
rack-ssl (1.3.2)
|
46
56
|
rack
|
47
57
|
rack-test (0.6.1)
|
48
58
|
rack (>= 1.0)
|
49
|
-
railties (3.2.
|
50
|
-
actionpack (= 3.2.
|
51
|
-
activesupport (= 3.2.
|
59
|
+
railties (3.2.2)
|
60
|
+
actionpack (= 3.2.2)
|
61
|
+
activesupport (= 3.2.2)
|
52
62
|
rack-ssl (~> 1.3.2)
|
53
63
|
rake (>= 0.8.7)
|
54
64
|
rdoc (~> 3.4)
|
data/README.md
CHANGED
@@ -1,6 +1,9 @@
|
|
1
1
|
# SlickGrid::Rails
|
2
2
|
|
3
|
-
|
3
|
+
slickgrid-rails is a simple gem to add
|
4
|
+
[SlickGrid](https://github.com/mleibman/SlickGrid) vendor files to the Rails
|
5
|
+
asset pipeline. It also provides a simple `SlickGrid::Table` class to render JSON
|
6
|
+
output suitable for the Grid/DataView.
|
4
7
|
|
5
8
|
## Installation
|
6
9
|
|
@@ -18,7 +21,109 @@ Or install it yourself as:
|
|
18
21
|
|
19
22
|
## Usage
|
20
23
|
|
21
|
-
|
24
|
+
To use the basic grid functionality you just need to include the slick.js file
|
25
|
+
in your Sprocket manifest:
|
26
|
+
|
27
|
+
//= require slick
|
28
|
+
|
29
|
+
The above example will include all required jQuery dependencies and
|
30
|
+
core.js/grid.js from SlickGrid. To use one of the more advanced example modules
|
31
|
+
simply add them to your manifest:
|
32
|
+
|
33
|
+
//= require slick/dataview
|
34
|
+
//= require slick/editors
|
35
|
+
//= require slick/formatters
|
36
|
+
|
37
|
+
### Rails Table Helper
|
38
|
+
|
39
|
+
A simple table helper is included to generate SlickGrid compatible JSON output:
|
40
|
+
|
41
|
+
require "slickgrid/table"
|
42
|
+
|
43
|
+
class UsersTable < SlickGrid::Table
|
44
|
+
column :name
|
45
|
+
column :email
|
46
|
+
column :last_login
|
47
|
+
end
|
48
|
+
|
49
|
+
To render a list of all users add the following to your controller:
|
50
|
+
|
51
|
+
class UsersController < ApplicationController
|
52
|
+
def index
|
53
|
+
respond_with(@users) do |format|
|
54
|
+
format.json { render :json => UsersTable.new(@users).as_json }
|
55
|
+
end
|
56
|
+
end
|
57
|
+
end
|
58
|
+
|
59
|
+
The `SlickGrid::Table` class will render columns for each model instance by
|
60
|
+
simply calling the column methods on the instance. If you want to customize the
|
61
|
+
output, specify a custom generator function:
|
62
|
+
|
63
|
+
class UsersTable < SlickGrid::Table
|
64
|
+
column :name, generator: ->(obj) { "#{obj.first_name} #{obj.last_name}" }
|
65
|
+
column :email
|
66
|
+
column :last_login
|
67
|
+
end
|
68
|
+
|
69
|
+
### Rails Model Support
|
70
|
+
|
71
|
+
This gem also replaces the example RemoteModel (which can only load data from
|
72
|
+
digg.com) to support loading and updating standard Rails REST models. First,
|
73
|
+
include the class into your manifest:
|
74
|
+
|
75
|
+
//= require slick/remotemodel
|
76
|
+
|
77
|
+
Then update your table definition to include a path column for each
|
78
|
+
instance:
|
79
|
+
|
80
|
+
class UsersTable < SlickGrid::Table
|
81
|
+
...
|
82
|
+
column :path, generator: ->(obj) { user_path(obj) }
|
83
|
+
end
|
84
|
+
|
85
|
+
Finally wire up all the grid events (example taken from the
|
86
|
+
[requirejs-controllers](https://github.com/madvertise/requirejs-controllers)
|
87
|
+
gem):
|
88
|
+
|
89
|
+
initGrid: (@selector, @columns, @options) ->
|
90
|
+
@dataView = new Slick.Data.DataView()
|
91
|
+
@grid = new Slick.Grid(@selector, @dataView, @columns, @options)
|
92
|
+
@model = model = new Slick.Data.RemoteModel()
|
93
|
+
|
94
|
+
initLoader: ->
|
95
|
+
@model.onDataLoading.subscribe (e, args) =>
|
96
|
+
@showIndicator()
|
97
|
+
|
98
|
+
@model.onDataLoaded.subscribe (e, args) =>
|
99
|
+
@hideIndicator()
|
100
|
+
|
101
|
+
@model.onDataLoadedSuccess.subscribe (e, args) =>
|
102
|
+
@dataView.beginUpdate()
|
103
|
+
@dataView.setItems(args.data)
|
104
|
+
@dataView.endUpdate()
|
105
|
+
@grid.invalidateAllRows()
|
106
|
+
@grid.render()
|
107
|
+
|
108
|
+
@model.onDataLoadedError.subscribe (e, args) =>
|
109
|
+
alert("failed to load data from server")
|
110
|
+
|
111
|
+
initWriter: ->
|
112
|
+
@model.onDataWriting.subscribe (e, args) =>
|
113
|
+
@showIndicator("Writing")
|
114
|
+
|
115
|
+
@model.onDataWritten.subscribe (e, args) =>
|
116
|
+
@hideIndicator()
|
117
|
+
|
118
|
+
@model.onDataWrittenSuccess.subscribe (e, args) =>
|
119
|
+
@dataView.updateItem(args.item.id, args.data)
|
120
|
+
@grid.updateRow(args.row)
|
121
|
+
|
122
|
+
@model.onDataWrittenError.subscribe (e, args) =>
|
123
|
+
alert("failed to write data on server")
|
124
|
+
|
125
|
+
@grid.onCellChange.subscribe (e, args) =>
|
126
|
+
@model.writeData(args)
|
22
127
|
|
23
128
|
## Contributing
|
24
129
|
|
data/bootstrap.sh
ADDED
data/lib/slickgrid/table.rb
CHANGED
@@ -2,11 +2,14 @@ module SlickGrid
|
|
2
2
|
class Table
|
3
3
|
|
4
4
|
class << self
|
5
|
+
# for easy access in generator functions
|
6
|
+
include ::Rails.application.routes.url_helpers
|
7
|
+
|
5
8
|
attr_reader :columns
|
6
9
|
|
7
|
-
def
|
8
|
-
@columns ||= {}
|
9
|
-
@columns[name] = options
|
10
|
+
def column(name, options={})
|
11
|
+
@columns ||= {id: {hidden: true}}
|
12
|
+
@columns[name.to_sym] = options
|
10
13
|
end
|
11
14
|
end
|
12
15
|
|
@@ -15,37 +18,18 @@ module SlickGrid
|
|
15
18
|
def initialize(collection, i18n_scope="")
|
16
19
|
@collection = collection
|
17
20
|
@i18n_scope = i18n_scope
|
18
|
-
@hidden_columns = [:id]
|
19
21
|
end
|
20
22
|
|
21
23
|
def columns
|
22
24
|
self.class.columns
|
23
25
|
end
|
24
26
|
|
25
|
-
def hide_column(name)
|
26
|
-
@hidden_columns |= [name.to_sym]
|
27
|
-
end
|
28
|
-
|
29
|
-
def active_columns
|
30
|
-
columns.keys - @hidden_columns
|
31
|
-
end
|
32
|
-
|
33
27
|
def as_json
|
34
|
-
|
35
|
-
columns: generate_columns,
|
36
|
-
rows: generate_rows,
|
37
|
-
}
|
28
|
+
generate_rows
|
38
29
|
end
|
39
30
|
|
40
31
|
protected
|
41
32
|
|
42
|
-
def generate_columns
|
43
|
-
active_columns.map do |column|
|
44
|
-
options = columns[column][:options] || {}
|
45
|
-
{ :id => column, :field => column, :name => column }.merge(options)
|
46
|
-
end
|
47
|
-
end
|
48
|
-
|
49
33
|
def generate_rows
|
50
34
|
@collection.map do |obj|
|
51
35
|
generate_row(obj)
|
data/slickgrid-rails.gemspec
CHANGED
@@ -5,14 +5,16 @@ Gem::Specification.new do |gem|
|
|
5
5
|
gem.name = "slickgrid-rails"
|
6
6
|
gem.version = SlickGrid::Rails::VERSION
|
7
7
|
gem.authors = ["Benedikt Böhm"]
|
8
|
-
gem.email = ["
|
8
|
+
gem.email = ["benedikt.boehm@madvertise.com"]
|
9
9
|
gem.description = %q{SlickGrid Integration for Rails 3.x}
|
10
10
|
gem.summary = %q{SlickGrid Integration for Rails 3.x}
|
11
11
|
gem.homepage = "https://github.com/madvertise/slickgrid-rails"
|
12
12
|
|
13
13
|
gem.add_dependency "railties", "~> 3.0"
|
14
|
-
|
14
|
+
|
15
|
+
gem.add_dependency "coffee-rails"
|
15
16
|
gem.add_dependency "jquery-plugins-rails"
|
17
|
+
gem.add_dependency "jquery-rails"
|
16
18
|
gem.add_dependency "sass-rails"
|
17
19
|
|
18
20
|
gem.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
|
@@ -1,6 +1,7 @@
|
|
1
1
|
(function ($) {
|
2
2
|
function SlickColumnPicker(columns, grid, options) {
|
3
3
|
var $menu;
|
4
|
+
var columnCheckboxes;
|
4
5
|
|
5
6
|
var defaults = {
|
6
7
|
fadeSpeed:250
|
@@ -22,36 +23,41 @@
|
|
22
23
|
function handleHeaderContextMenu(e, args) {
|
23
24
|
e.preventDefault();
|
24
25
|
$menu.empty();
|
26
|
+
columnCheckboxes = [];
|
25
27
|
|
26
28
|
var $li, $input;
|
27
29
|
for (var i = 0; i < columns.length; i++) {
|
28
30
|
$li = $("<li />").appendTo($menu);
|
29
|
-
|
30
|
-
$input
|
31
|
-
.attr("id", "columnpicker_" + i)
|
32
|
-
.data("id", columns[i].id)
|
33
|
-
.appendTo($li);
|
31
|
+
$input = $("<input type='checkbox' />").data("column-id", columns[i].id);
|
32
|
+
columnCheckboxes.push($input);
|
34
33
|
|
35
34
|
if (grid.getColumnIndex(columns[i].id) != null) {
|
36
35
|
$input.attr("checked", "checked");
|
37
36
|
}
|
38
37
|
|
39
|
-
$("<label
|
38
|
+
$("<label />")
|
40
39
|
.text(columns[i].name)
|
40
|
+
.prepend($input)
|
41
41
|
.appendTo($li);
|
42
42
|
}
|
43
43
|
|
44
44
|
$("<hr/>").appendTo($menu);
|
45
45
|
$li = $("<li />").appendTo($menu);
|
46
|
-
$input = $("<input type='checkbox'
|
47
|
-
$("<label
|
46
|
+
$input = $("<input type='checkbox' />").data("option", "autoresize");
|
47
|
+
$("<label />")
|
48
|
+
.text("Force fit columns")
|
49
|
+
.prepend($input)
|
50
|
+
.appendTo($li);
|
48
51
|
if (grid.getOptions().forceFitColumns) {
|
49
52
|
$input.attr("checked", "checked");
|
50
53
|
}
|
51
54
|
|
52
55
|
$li = $("<li />").appendTo($menu);
|
53
|
-
$input = $("<input type='checkbox'
|
54
|
-
$("<label
|
56
|
+
$input = $("<input type='checkbox' />").data("option", "syncresize");
|
57
|
+
$("<label />")
|
58
|
+
.text("Synchronous resize")
|
59
|
+
.prepend($input)
|
60
|
+
.appendTo($li);
|
55
61
|
if (grid.getOptions().syncColumnCellResize) {
|
56
62
|
$input.attr("checked", "checked");
|
57
63
|
}
|
@@ -63,7 +69,7 @@
|
|
63
69
|
}
|
64
70
|
|
65
71
|
function updateColumn(e) {
|
66
|
-
if (e.target.
|
72
|
+
if ($(e.target).data("option") == "autoresize") {
|
67
73
|
if (e.target.checked) {
|
68
74
|
grid.setOptions({forceFitColumns:true});
|
69
75
|
grid.autosizeColumns();
|
@@ -73,7 +79,7 @@
|
|
73
79
|
return;
|
74
80
|
}
|
75
81
|
|
76
|
-
if (e.target.
|
82
|
+
if ($(e.target).data("option") == "syncresize") {
|
77
83
|
if (e.target.checked) {
|
78
84
|
grid.setOptions({syncColumnCellResize:true});
|
79
85
|
} else {
|
@@ -83,17 +89,18 @@
|
|
83
89
|
}
|
84
90
|
|
85
91
|
if ($(e.target).is(":checkbox")) {
|
86
|
-
if ($menu.find(":checkbox:checked").length == 0) {
|
87
|
-
$(e.target).attr("checked", "checked");
|
88
|
-
return;
|
89
|
-
}
|
90
|
-
|
91
92
|
var visibleColumns = [];
|
92
|
-
|
93
|
+
$.each(columnCheckboxes, function (i, e) {
|
93
94
|
if ($(this).is(":checked")) {
|
94
95
|
visibleColumns.push(columns[i]);
|
95
96
|
}
|
96
97
|
});
|
98
|
+
|
99
|
+
if (!visibleColumns.length) {
|
100
|
+
$(e.target).attr("checked", "checked");
|
101
|
+
return;
|
102
|
+
}
|
103
|
+
|
97
104
|
grid.setColumns(visibleColumns);
|
98
105
|
}
|
99
106
|
}
|
@@ -267,23 +267,23 @@ if (typeof Slick === "undefined") {
|
|
267
267
|
bindAncestorScrollEvents();
|
268
268
|
|
269
269
|
$container
|
270
|
-
.
|
270
|
+
.bind("resize.slickgrid", resizeCanvas);
|
271
271
|
$viewport
|
272
|
-
.
|
272
|
+
.bind("scroll.slickgrid", handleScroll);
|
273
273
|
$headerScroller
|
274
|
-
.
|
275
|
-
.
|
274
|
+
.bind("contextmenu.slickgrid", handleHeaderContextMenu)
|
275
|
+
.bind("click.slickgrid", handleHeaderClick);
|
276
276
|
$canvas
|
277
|
-
.
|
278
|
-
.
|
279
|
-
.
|
280
|
-
.
|
281
|
-
.
|
282
|
-
.
|
283
|
-
.
|
284
|
-
.
|
285
|
-
.
|
286
|
-
.
|
277
|
+
.bind("keydown.slickgrid", handleKeyDown)
|
278
|
+
.bind("click.slickgrid", handleClick)
|
279
|
+
.bind("dblclick.slickgrid", handleDblClick)
|
280
|
+
.bind("contextmenu.slickgrid", handleContextMenu)
|
281
|
+
.bind("draginit", handleDragInit)
|
282
|
+
.bind("dragstart", handleDragStart)
|
283
|
+
.bind("drag", handleDrag)
|
284
|
+
.bind("dragend", handleDragEnd)
|
285
|
+
.delegate(".slick-cell", "mouseenter", handleMouseEnter)
|
286
|
+
.delegate(".slick-cell", "mouseleave", handleMouseLeave);
|
287
287
|
}
|
288
288
|
}
|
289
289
|
|
@@ -485,6 +485,9 @@ if (typeof Slick === "undefined") {
|
|
485
485
|
|
486
486
|
function setupColumnSort() {
|
487
487
|
$headers.click(function (e) {
|
488
|
+
// temporary workaround for a bug in jQuery 1.7.1 (http://bugs.jquery.com/ticket/11328)
|
489
|
+
e.metaKey = e.metaKey || e.ctrlKey;
|
490
|
+
|
488
491
|
if ($(e.target).hasClass("slick-resizable-handle")) {
|
489
492
|
return;
|
490
493
|
}
|
@@ -501,7 +504,8 @@ if (typeof Slick === "undefined") {
|
|
501
504
|
}
|
502
505
|
|
503
506
|
var sortOpts = null;
|
504
|
-
|
507
|
+
var i = 0;
|
508
|
+
for (; i < sortColumns.length; i++) {
|
505
509
|
if (sortColumns[i].columnId == column.id) {
|
506
510
|
sortOpts = sortColumns[i];
|
507
511
|
sortOpts.sortAsc = !sortOpts.sortAsc;
|
@@ -509,15 +513,22 @@ if (typeof Slick === "undefined") {
|
|
509
513
|
}
|
510
514
|
}
|
511
515
|
|
512
|
-
if (
|
513
|
-
|
516
|
+
if (e.metaKey && options.multiColumnSort) {
|
517
|
+
if (sortOpts) {
|
518
|
+
sortColumns.splice(i, 1);
|
519
|
+
}
|
514
520
|
}
|
521
|
+
else {
|
522
|
+
if ((!e.shiftKey && !e.metaKey) || !options.multiColumnSort) {
|
523
|
+
sortColumns = [];
|
524
|
+
}
|
515
525
|
|
516
|
-
|
517
|
-
|
518
|
-
|
519
|
-
|
520
|
-
|
526
|
+
if (!sortOpts) {
|
527
|
+
sortOpts = { columnId: column.id, sortAsc: true };
|
528
|
+
sortColumns.push(sortOpts);
|
529
|
+
} else if (sortColumns.length == 0) {
|
530
|
+
sortColumns.push(sortOpts);
|
531
|
+
}
|
521
532
|
}
|
522
533
|
|
523
534
|
setSortColumns(sortColumns);
|
@@ -1001,6 +1012,10 @@ if (typeof Slick === "undefined") {
|
|
1001
1012
|
});
|
1002
1013
|
}
|
1003
1014
|
|
1015
|
+
function getSortColumns() {
|
1016
|
+
return sortColumns;
|
1017
|
+
}
|
1018
|
+
|
1004
1019
|
function handleSelectedRangesChanged(e, ranges) {
|
1005
1020
|
selectedRows = [];
|
1006
1021
|
var hash = {};
|
@@ -1273,7 +1288,7 @@ if (typeof Slick === "undefined") {
|
|
1273
1288
|
}
|
1274
1289
|
scrollDir = 0;
|
1275
1290
|
for (i = 0, rl = rows.length; i < rl; i++) {
|
1276
|
-
if (currentEditor && activeRow === i) {
|
1291
|
+
if (currentEditor && activeRow === rows[i]) {
|
1277
1292
|
makeActiveCellNormal();
|
1278
1293
|
}
|
1279
1294
|
if (rowsCache[rows[i]]) {
|
@@ -2710,6 +2725,7 @@ if (typeof Slick === "undefined") {
|
|
2710
2725
|
"updateColumnHeader": updateColumnHeader,
|
2711
2726
|
"setSortColumn": setSortColumn,
|
2712
2727
|
"setSortColumns": setSortColumns,
|
2728
|
+
"getSortColumns": getSortColumns,
|
2713
2729
|
"autosizeColumns": autosizeColumns,
|
2714
2730
|
"getOptions": getOptions,
|
2715
2731
|
"setOptions": setOptions,
|
@@ -0,0 +1,58 @@
|
|
1
|
+
class RemoteModel
|
2
|
+
constructor: (@url) ->
|
3
|
+
@onDataLoading = new Slick.Event()
|
4
|
+
@onDataLoaded = new Slick.Event()
|
5
|
+
@onDataLoadedSuccess = new Slick.Event()
|
6
|
+
@onDataLoadedError = new Slick.Event()
|
7
|
+
|
8
|
+
@onDataWriting = new Slick.Event()
|
9
|
+
@onDataWritten = new Slick.Event()
|
10
|
+
@onDataWrittenSuccess = new Slick.Event()
|
11
|
+
@onDataWrittenError = new Slick.Event()
|
12
|
+
|
13
|
+
@request = null
|
14
|
+
|
15
|
+
loadData: ->
|
16
|
+
if @request
|
17
|
+
@request.abort()
|
18
|
+
|
19
|
+
@onDataLoading.notify()
|
20
|
+
|
21
|
+
@request = $.ajax
|
22
|
+
url: @url
|
23
|
+
dataType: 'json'
|
24
|
+
cache: false
|
25
|
+
complete: =>
|
26
|
+
@onDataLoaded.notify()
|
27
|
+
success: (response) =>
|
28
|
+
@request = null
|
29
|
+
@onDataLoadedSuccess.notify({data: response})
|
30
|
+
error: =>
|
31
|
+
@onDataLoadedError.notify()
|
32
|
+
|
33
|
+
writeData: (args) ->
|
34
|
+
@onDataWriting.notify()
|
35
|
+
|
36
|
+
$.ajax
|
37
|
+
url: args.item.path
|
38
|
+
type: 'PUT'
|
39
|
+
data: args.item
|
40
|
+
dataType: 'json'
|
41
|
+
complete: =>
|
42
|
+
@onDataWritten.notify()
|
43
|
+
success: (response) =>
|
44
|
+
@onDataWrittenSuccess.notify({
|
45
|
+
row: args.row
|
46
|
+
item: args.item
|
47
|
+
data: response[0]
|
48
|
+
})
|
49
|
+
error: =>
|
50
|
+
@onDataWrittenError.notify()
|
51
|
+
|
52
|
+
$.extend(true, window, {
|
53
|
+
"Slick": {
|
54
|
+
"Data": {
|
55
|
+
"RemoteModel": RemoteModel
|
56
|
+
}
|
57
|
+
}
|
58
|
+
})
|
@@ -0,0 +1,28 @@
|
|
1
|
+
# native javascript sorter. used by default if no sorter is specified
|
2
|
+
NativeSorter = (field, dir, a, b) ->
|
3
|
+
x = a[field]
|
4
|
+
y = b[field]
|
5
|
+
return 0 if x == y
|
6
|
+
return dir * if x < y then -1 else 1
|
7
|
+
|
8
|
+
# simple sorter factory to read sorter function from column defintion while
|
9
|
+
# retaining the current closures sort column and sort direction
|
10
|
+
class SorterFactory
|
11
|
+
constructor: (args) ->
|
12
|
+
@sortCol = args.sortCol
|
13
|
+
@sortField = args.sortCol.field
|
14
|
+
@sortDir = if args.sortAsc then 1 else -1
|
15
|
+
@sortMethod = if @sortCol.sorter? then @sortCol.sorter else NativeSorter
|
16
|
+
|
17
|
+
return (a, b) =>
|
18
|
+
return @sortMethod(@sortField, @sortDir, a, b)
|
19
|
+
|
20
|
+
# merge sorter functions into global slickgrid namespace
|
21
|
+
$.extend(true, window, {
|
22
|
+
"Slick": {
|
23
|
+
"Sorters": {
|
24
|
+
"Sorter": SorterFactory
|
25
|
+
"Native": NativeSorter
|
26
|
+
}
|
27
|
+
}
|
28
|
+
})
|
File without changes
|
@@ -0,0 +1,100 @@
|
|
1
|
+
/* Slick.Editors.Text, Slick.Editors.Date */
|
2
|
+
input.editor-text {
|
3
|
+
width: 100%;
|
4
|
+
height: 100%;
|
5
|
+
border: 0;
|
6
|
+
margin: 0;
|
7
|
+
background: transparent;
|
8
|
+
outline: 0;
|
9
|
+
padding: 0;
|
10
|
+
|
11
|
+
}
|
12
|
+
|
13
|
+
.ui-datepicker-trigger {
|
14
|
+
margin-top: 2px;
|
15
|
+
padding: 0;
|
16
|
+
vertical-align: top;
|
17
|
+
}
|
18
|
+
|
19
|
+
/* Slick.Editors.PercentComplete */
|
20
|
+
input.editor-percentcomplete {
|
21
|
+
width: 100%;
|
22
|
+
height: 100%;
|
23
|
+
border: 0;
|
24
|
+
margin: 0;
|
25
|
+
background: transparent;
|
26
|
+
outline: 0;
|
27
|
+
padding: 0;
|
28
|
+
|
29
|
+
float: left;
|
30
|
+
}
|
31
|
+
|
32
|
+
.editor-percentcomplete-picker {
|
33
|
+
position: relative;
|
34
|
+
display: inline-block;
|
35
|
+
width: 16px;
|
36
|
+
height: 100%;
|
37
|
+
background: image-url("slick/pencil.gif") no-repeat center center;
|
38
|
+
overflow: visible;
|
39
|
+
z-index: 1000;
|
40
|
+
float: right;
|
41
|
+
}
|
42
|
+
|
43
|
+
.editor-percentcomplete-helper {
|
44
|
+
border: 0 solid gray;
|
45
|
+
position: absolute;
|
46
|
+
top: -2px;
|
47
|
+
left: -9px;
|
48
|
+
background: image-url("slick/editor-helper-bg.gif") no-repeat top left;
|
49
|
+
padding-left: 9px;
|
50
|
+
|
51
|
+
width: 120px;
|
52
|
+
height: 140px;
|
53
|
+
display: none;
|
54
|
+
overflow: visible;
|
55
|
+
}
|
56
|
+
|
57
|
+
.editor-percentcomplete-wrapper {
|
58
|
+
background: beige;
|
59
|
+
padding: 20px 8px;
|
60
|
+
|
61
|
+
width: 100%;
|
62
|
+
height: 98px;
|
63
|
+
border: 1px solid gray;
|
64
|
+
border-left: 0;
|
65
|
+
}
|
66
|
+
|
67
|
+
.editor-percentcomplete-buttons {
|
68
|
+
float: right;
|
69
|
+
}
|
70
|
+
|
71
|
+
.editor-percentcomplete-buttons button {
|
72
|
+
width: 80px;
|
73
|
+
}
|
74
|
+
|
75
|
+
.editor-percentcomplete-slider {
|
76
|
+
float: left;
|
77
|
+
}
|
78
|
+
|
79
|
+
.editor-percentcomplete-picker:hover .editor-percentcomplete-helper {
|
80
|
+
display: block;
|
81
|
+
}
|
82
|
+
|
83
|
+
.editor-percentcomplete-helper:hover {
|
84
|
+
display: block;
|
85
|
+
}
|
86
|
+
|
87
|
+
/* Slick.Editors.YesNoSelect */
|
88
|
+
select.editor-yesno {
|
89
|
+
width: 100%;
|
90
|
+
margin: 0;
|
91
|
+
vertical-align: middle;
|
92
|
+
}
|
93
|
+
|
94
|
+
/* Slick.Editors.Checkbox */
|
95
|
+
input.editor-checkbox {
|
96
|
+
margin: 0;
|
97
|
+
height: 100%;
|
98
|
+
padding: 0;
|
99
|
+
border: 0;
|
100
|
+
}
|
@@ -156,3 +156,19 @@ classes should alter those!
|
|
156
156
|
position: absolute;
|
157
157
|
border: 2px dashed black;
|
158
158
|
}
|
159
|
+
|
160
|
+
.slick-headerrow-column {
|
161
|
+
text-overflow: clip;
|
162
|
+
-moz-box-sizing: border-box;
|
163
|
+
box-sizing: border-box;
|
164
|
+
}
|
165
|
+
|
166
|
+
.slick-headerrow-column input {
|
167
|
+
margin: 0;
|
168
|
+
padding: 0;
|
169
|
+
width: 100%;
|
170
|
+
height: 100%;
|
171
|
+
-moz-box-sizing: border-box;
|
172
|
+
box-sizing: border-box;
|
173
|
+
vertical-align: top;
|
174
|
+
}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
.loading-indicator {
|
2
|
+
display: inline-block;
|
3
|
+
padding: 12px;
|
4
|
+
background: white;
|
5
|
+
-opacity: 0.5;
|
6
|
+
color: black;
|
7
|
+
font-weight: bold;
|
8
|
+
z-index: 9999;
|
9
|
+
border: 1px solid red;
|
10
|
+
-moz-border-radius: 10px;
|
11
|
+
-webkit-border-radius: 10px;
|
12
|
+
-moz-box-shadow: 0 0 5px red;
|
13
|
+
-webkit-box-shadow: 0px 0px 5px red;
|
14
|
+
-text-shadow: 1px 1px 1px white;
|
15
|
+
}
|
16
|
+
|
17
|
+
.loading-indicator label {
|
18
|
+
padding-left: 20px;
|
19
|
+
background: image-url('slick/ajax-loader-small.gif') no-repeat center left;
|
20
|
+
}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: slickgrid-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.2.0
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,11 +9,11 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2012-
|
12
|
+
date: 2012-03-19 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: railties
|
16
|
-
requirement: &
|
16
|
+
requirement: &16419360 !ruby/object:Gem::Requirement
|
17
17
|
none: false
|
18
18
|
requirements:
|
19
19
|
- - ~>
|
@@ -21,10 +21,10 @@ dependencies:
|
|
21
21
|
version: '3.0'
|
22
22
|
type: :runtime
|
23
23
|
prerelease: false
|
24
|
-
version_requirements: *
|
24
|
+
version_requirements: *16419360
|
25
25
|
- !ruby/object:Gem::Dependency
|
26
|
-
name:
|
27
|
-
requirement: &
|
26
|
+
name: coffee-rails
|
27
|
+
requirement: &16418840 !ruby/object:Gem::Requirement
|
28
28
|
none: false
|
29
29
|
requirements:
|
30
30
|
- - ! '>='
|
@@ -32,10 +32,21 @@ dependencies:
|
|
32
32
|
version: '0'
|
33
33
|
type: :runtime
|
34
34
|
prerelease: false
|
35
|
-
version_requirements: *
|
35
|
+
version_requirements: *16418840
|
36
36
|
- !ruby/object:Gem::Dependency
|
37
37
|
name: jquery-plugins-rails
|
38
|
-
requirement: &
|
38
|
+
requirement: &16418340 !ruby/object:Gem::Requirement
|
39
|
+
none: false
|
40
|
+
requirements:
|
41
|
+
- - ! '>='
|
42
|
+
- !ruby/object:Gem::Version
|
43
|
+
version: '0'
|
44
|
+
type: :runtime
|
45
|
+
prerelease: false
|
46
|
+
version_requirements: *16418340
|
47
|
+
- !ruby/object:Gem::Dependency
|
48
|
+
name: jquery-rails
|
49
|
+
requirement: &16417920 !ruby/object:Gem::Requirement
|
39
50
|
none: false
|
40
51
|
requirements:
|
41
52
|
- - ! '>='
|
@@ -43,10 +54,10 @@ dependencies:
|
|
43
54
|
version: '0'
|
44
55
|
type: :runtime
|
45
56
|
prerelease: false
|
46
|
-
version_requirements: *
|
57
|
+
version_requirements: *16417920
|
47
58
|
- !ruby/object:Gem::Dependency
|
48
59
|
name: sass-rails
|
49
|
-
requirement: &
|
60
|
+
requirement: &16417500 !ruby/object:Gem::Requirement
|
50
61
|
none: false
|
51
62
|
requirements:
|
52
63
|
- - ! '>='
|
@@ -54,20 +65,22 @@ dependencies:
|
|
54
65
|
version: '0'
|
55
66
|
type: :runtime
|
56
67
|
prerelease: false
|
57
|
-
version_requirements: *
|
68
|
+
version_requirements: *16417500
|
58
69
|
description: SlickGrid Integration for Rails 3.x
|
59
70
|
email:
|
60
|
-
-
|
71
|
+
- benedikt.boehm@madvertise.com
|
61
72
|
executables: []
|
62
73
|
extensions: []
|
63
74
|
extra_rdoc_files: []
|
64
75
|
files:
|
76
|
+
- .gitignore
|
65
77
|
- .rvmrc
|
66
78
|
- Gemfile
|
67
79
|
- Gemfile.lock
|
68
80
|
- LICENSE
|
69
81
|
- README.md
|
70
82
|
- Rakefile
|
83
|
+
- bootstrap.sh
|
71
84
|
- fetch.sh
|
72
85
|
- lib/slickgrid-rails.rb
|
73
86
|
- lib/slickgrid/rails.rb
|
@@ -126,11 +139,14 @@ files:
|
|
126
139
|
- vendor/assets/javascripts/slick/plugins/checkboxselectcolumn.js
|
127
140
|
- vendor/assets/javascripts/slick/plugins/rowmovemanager.js
|
128
141
|
- vendor/assets/javascripts/slick/plugins/rowselectionmodel.js
|
129
|
-
- vendor/assets/javascripts/slick/remotemodel.js
|
130
|
-
- vendor/assets/
|
142
|
+
- vendor/assets/javascripts/slick/remotemodel.js.coffee
|
143
|
+
- vendor/assets/javascripts/slick/sorters.js.coffee
|
144
|
+
- vendor/assets/stylesheets/slick/controls/columnpicker.css.scss
|
131
145
|
- vendor/assets/stylesheets/slick/controls/pager.css.scss
|
132
146
|
- vendor/assets/stylesheets/slick/default-theme.css.scss
|
147
|
+
- vendor/assets/stylesheets/slick/editors.css.scss
|
133
148
|
- vendor/assets/stylesheets/slick/grid.css.scss
|
149
|
+
- vendor/assets/stylesheets/slick/remotemodel.css.scss
|
134
150
|
homepage: https://github.com/madvertise/slickgrid-rails
|
135
151
|
licenses: []
|
136
152
|
post_install_message:
|
@@ -151,7 +167,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
151
167
|
version: '0'
|
152
168
|
requirements: []
|
153
169
|
rubyforge_project:
|
154
|
-
rubygems_version: 1.8.
|
170
|
+
rubygems_version: 1.8.17
|
155
171
|
signing_key:
|
156
172
|
specification_version: 3
|
157
173
|
summary: SlickGrid Integration for Rails 3.x
|
@@ -1,164 +0,0 @@
|
|
1
|
-
(function ($) {
|
2
|
-
/***
|
3
|
-
* A sample AJAX data store implementation.
|
4
|
-
* Right now, it's hooked up to load all Apple-related Digg stories, but can
|
5
|
-
* easily be extended to support and JSONP-compatible backend that accepts paging parameters.
|
6
|
-
*/
|
7
|
-
function RemoteModel() {
|
8
|
-
// private
|
9
|
-
var PAGESIZE = 50;
|
10
|
-
var data = {length: 0};
|
11
|
-
var searchstr = "apple";
|
12
|
-
var sortcol = null;
|
13
|
-
var sortdir = 1;
|
14
|
-
var h_request = null;
|
15
|
-
var req = null; // ajax request
|
16
|
-
|
17
|
-
// events
|
18
|
-
var onDataLoading = new Slick.Event();
|
19
|
-
var onDataLoaded = new Slick.Event();
|
20
|
-
|
21
|
-
|
22
|
-
function init() {
|
23
|
-
}
|
24
|
-
|
25
|
-
|
26
|
-
function isDataLoaded(from, to) {
|
27
|
-
for (var i = from; i <= to; i++) {
|
28
|
-
if (data[i] == undefined || data[i] == null) {
|
29
|
-
return false;
|
30
|
-
}
|
31
|
-
}
|
32
|
-
|
33
|
-
return true;
|
34
|
-
}
|
35
|
-
|
36
|
-
|
37
|
-
function clear() {
|
38
|
-
for (var key in data) {
|
39
|
-
delete data[key];
|
40
|
-
}
|
41
|
-
data.length = 0;
|
42
|
-
}
|
43
|
-
|
44
|
-
|
45
|
-
function ensureData(from, to) {
|
46
|
-
if (req) {
|
47
|
-
req.abort();
|
48
|
-
for (var i = req.fromPage; i <= req.toPage; i++)
|
49
|
-
data[i * PAGESIZE] = undefined;
|
50
|
-
}
|
51
|
-
|
52
|
-
if (from < 0) {
|
53
|
-
from = 0;
|
54
|
-
}
|
55
|
-
|
56
|
-
var fromPage = Math.floor(from / PAGESIZE);
|
57
|
-
var toPage = Math.floor(to / PAGESIZE);
|
58
|
-
|
59
|
-
while (data[fromPage * PAGESIZE] !== undefined && fromPage < toPage)
|
60
|
-
fromPage++;
|
61
|
-
|
62
|
-
while (data[toPage * PAGESIZE] !== undefined && fromPage < toPage)
|
63
|
-
toPage--;
|
64
|
-
|
65
|
-
if (fromPage > toPage || ((fromPage == toPage) && data[fromPage * PAGESIZE] !== undefined)) {
|
66
|
-
// TODO: look-ahead
|
67
|
-
return;
|
68
|
-
}
|
69
|
-
|
70
|
-
var url = "http://services.digg.com/search/stories?query=" + searchstr + "&offset=" + (fromPage * PAGESIZE) + "&count=" + (((toPage - fromPage) * PAGESIZE) + PAGESIZE) + "&appkey=http://slickgrid.googlecode.com&type=javascript";
|
71
|
-
|
72
|
-
switch (sortcol) {
|
73
|
-
case "diggs":
|
74
|
-
url += ("&sort=" + ((sortdir > 0) ? "digg_count-asc" : "digg_count-desc"));
|
75
|
-
break;
|
76
|
-
}
|
77
|
-
|
78
|
-
if (h_request != null) {
|
79
|
-
clearTimeout(h_request);
|
80
|
-
}
|
81
|
-
|
82
|
-
h_request = setTimeout(function () {
|
83
|
-
for (var i = fromPage; i <= toPage; i++)
|
84
|
-
data[i * PAGESIZE] = null; // null indicates a 'requested but not available yet'
|
85
|
-
|
86
|
-
onDataLoading.notify({from: from, to: to});
|
87
|
-
|
88
|
-
req = $.jsonp({
|
89
|
-
url: url,
|
90
|
-
callbackParameter: "callback",
|
91
|
-
cache: true, // Digg doesn't accept the autogenerated cachebuster param
|
92
|
-
success: onSuccess,
|
93
|
-
error: function () {
|
94
|
-
onError(fromPage, toPage)
|
95
|
-
}
|
96
|
-
});
|
97
|
-
req.fromPage = fromPage;
|
98
|
-
req.toPage = toPage;
|
99
|
-
}, 50);
|
100
|
-
}
|
101
|
-
|
102
|
-
|
103
|
-
function onError(fromPage, toPage) {
|
104
|
-
alert("error loading pages " + fromPage + " to " + toPage);
|
105
|
-
}
|
106
|
-
|
107
|
-
function onSuccess(resp) {
|
108
|
-
var from = this.fromPage * PAGESIZE, to = from + resp.count;
|
109
|
-
data.length = parseInt(resp.total);
|
110
|
-
|
111
|
-
for (var i = 0; i < resp.stories.length; i++) {
|
112
|
-
data[from + i] = resp.stories[i];
|
113
|
-
data[from + i].index = from + i;
|
114
|
-
}
|
115
|
-
|
116
|
-
req = null;
|
117
|
-
|
118
|
-
onDataLoaded.notify({from: from, to: to});
|
119
|
-
}
|
120
|
-
|
121
|
-
|
122
|
-
function reloadData(from, to) {
|
123
|
-
for (var i = from; i <= to; i++)
|
124
|
-
delete data[i];
|
125
|
-
|
126
|
-
ensureData(from, to);
|
127
|
-
}
|
128
|
-
|
129
|
-
|
130
|
-
function setSort(column, dir) {
|
131
|
-
sortcol = column;
|
132
|
-
sortdir = dir;
|
133
|
-
clear();
|
134
|
-
}
|
135
|
-
|
136
|
-
function setSearch(str) {
|
137
|
-
searchstr = str;
|
138
|
-
clear();
|
139
|
-
}
|
140
|
-
|
141
|
-
|
142
|
-
init();
|
143
|
-
|
144
|
-
return {
|
145
|
-
// properties
|
146
|
-
"data": data,
|
147
|
-
|
148
|
-
// methods
|
149
|
-
"clear": clear,
|
150
|
-
"isDataLoaded": isDataLoaded,
|
151
|
-
"ensureData": ensureData,
|
152
|
-
"reloadData": reloadData,
|
153
|
-
"setSort": setSort,
|
154
|
-
"setSearch": setSearch,
|
155
|
-
|
156
|
-
// events
|
157
|
-
"onDataLoading": onDataLoading,
|
158
|
-
"onDataLoaded": onDataLoaded
|
159
|
-
};
|
160
|
-
}
|
161
|
-
|
162
|
-
// Slick.Data.RemoteModel
|
163
|
-
$.extend(true, window, { Slick: { Data: { RemoteModel: RemoteModel }}});
|
164
|
-
})(jQuery);
|