quick_script 0.0.53 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (24) hide show
  1. data/README.md +149 -0
  2. data/lib/quick_script/engine.rb +16 -0
  3. data/lib/quick_script/version.rb +1 -1
  4. data/lib/quick_script.rb +3 -2
  5. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/classes.js.coffee +0 -0
  6. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/date.js +0 -0
  7. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/framework.js.coffee +4 -3
  8. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/fullcalendar.min.js +0 -0
  9. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/jquery-ui.min.js +0 -0
  10. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/jquery.fileupload.js +0 -0
  11. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/jquery.history.js +0 -0
  12. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/jquery.iframe-transport.js +0 -0
  13. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/jquery.min.js +0 -0
  14. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/jquery.qtip.min.js +0 -0
  15. data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/knockout.js +0 -0
  16. data/vendor/assets/javascripts/quick_script.js +12 -0
  17. data/vendor/assets/stylesheets/quick_script/basics.css.sass +51 -0
  18. data/{lib/quick_script/assets/css → vendor/assets/stylesheets/quick_script}/buttons.css +0 -0
  19. data/{lib/quick_script/assets/css/basics.css.sass → vendor/assets/stylesheets/quick_script/elements.css.sass} +2 -53
  20. data/{lib/quick_script/assets/css → vendor/assets/stylesheets/quick_script}/mixins.css.sass +0 -0
  21. data/vendor/assets/stylesheets/quick_script.css +4 -0
  22. metadata +23 -20
  23. data/lib/quick_script/assets/css/quick_script.css +0 -4
  24. data/lib/quick_script/assets/js/quick_script.js +0 -12
data/README.md ADDED
@@ -0,0 +1,149 @@
1
+ QuickScript Javascript Framework
2
+ ================================
3
+
4
+ QuickScript is a javascript library that enhances KnockoutJS to bind to persistent database models and provide a dynamic view structure. The key components are:
5
+
6
+ * **View** : a javascript representation of HTML layouts and templates used to manipulate models
7
+ * **Model** : a bindable representation of a database model to handle JSON response
8
+ * **Adapter** : an interface to talk to a JSON-responsive API server
9
+
10
+ Together, these components allow you to talk to a database and update views dynamically. For example, views can be embedded within other views, allowing complex layouts.
11
+
12
+ Installation
13
+ ------------
14
+
15
+ 1. To use QuickScript with Rails, add it to your gem file.
16
+
17
+ gem "quick_script"
18
+
19
+ The additional gems are also helpful, but optional
20
+
21
+ gem "compass-rails" # for compass css-styling support
22
+ gem "tinymce-rails" # for tinymce editor support
23
+
24
+ 2. Next, you'll want to add include the helper module in the controller for useful rails controller functionality
25
+
26
+ class ApplicationController
27
+ include QuickScript::Interaction
28
+ ...
29
+ end
30
+
31
+ 3. Update your application.html.erb file.
32
+
33
+ You will want to include your view templates. I normally create them in my "app/views/shared" folder as "views.html.erb" or "templates.html.erb". Whatever you name them, include them in your application.html.erb layout file using render tags.
34
+
35
+ Next, add the QuickScript initialization tag. For this README, let's assume we're building a TodoList application that talks to a server having multiple Todo items. Your layout file should look like the following:
36
+
37
+ <!DOCTYPE html>
38
+ <html>
39
+ <head>
40
+ <title>TodoListApp</title>
41
+ <%= stylesheet_link_tag "application", :media => "all" %>
42
+ <%= javascript_include_tag "application" %>
43
+ <%= render :partial => 'shared/templates' %>
44
+ <%= render :partial => 'shared/views' %>
45
+ <%= csrf_meta_tags %>
46
+ </head>
47
+ <body>
48
+ <%= include_view_box %>
49
+ <%= include_quick_script_init "TodoListApp" %>
50
+ </body>
51
+ </html>
52
+
53
+ 4. Add the appropriate 'requires' to javascript and css asset files. To include everything, just add the following to both the application.js and application.css files:
54
+
55
+ //= require quick_script
56
+
57
+ 5. Next you'll want to create your views.js.coffee and models.js.coffee files. This is where the heart of all your client-side code will be. Views will be the logic tied to your view templates, and models will be the models that encapsulate the data retrieved from your API server. First, you'll want to setup your application-level view which initializes everything in views.js.coffee.
58
+
59
+ class TodoListApp extends @AppView # note it extends AppView, not View
60
+ init : ->
61
+ @addView 'mylist', TodoListView, 'view-todolist'
62
+ # any other app initialization javascript stuff you want to do
63
+ load : ->
64
+ @selectView 'mylist'
65
+
66
+ Don't forget to add these files to your application.js
67
+
68
+ //= require models
69
+ //= require view_models
70
+
71
+ 5. That's it! Now start creating views for your application. Let's continue with our TodoList example.
72
+
73
+ Models
74
+ ------
75
+
76
+ First, let's define the classes that will tie in to the database models.
77
+
78
+ class Task extends @Model
79
+ @includeCollection(this) # provides Task.Collection
80
+ @includeAdapter # provides Task.Adapter
81
+ new ModelAdapter
82
+ load_url : '/tasks'
83
+ save_url : '/task'
84
+ , this
85
+ init : ->
86
+ # match fields in json response. initialize with a value
87
+ ko.addField 'description', '', this
88
+ ko.addField 'completed', false, this
89
+
90
+ That should be enough for this example. Now let's use our Todo model in a view.
91
+
92
+ Views
93
+ -----
94
+
95
+ A standard view looks liks the following:
96
+
97
+ class TodoListView extends @View
98
+ init : ->
99
+ # here we could add additional sub-views if we wanted...
100
+ @tasks = new Task.Collection() # our list of views
101
+ @task = new Task() # hold our new task
102
+ load : ->
103
+ @tasks.load ['my_tasks']
104
+ saveTask : =>
105
+ @task.save ['description'], (resp)=>
106
+ if @task.hasErrors()
107
+ Overlay.notify 'Couldn't save this task!', 'bg-red'
108
+ else
109
+ Overlay.notify 'Task saved!'
110
+ @task.reset()
111
+
112
+ Then, in our view templates file, we need to add our html code that binds to the view:
113
+
114
+ <%= jqtpl 'view-todolist' do %>
115
+ <div class="todolist">
116
+ <ul class="task" data-bind="foreach : tasks.views">
117
+ <li>
118
+ <span data-bind="text : model.description"></span>
119
+ </li>
120
+ </ul>
121
+ </div>
122
+ <div class="newtask">
123
+ <input type="text" placeholder="Enter new task..." data-bind="value : task.description, handleEnter : saveTask" />
124
+ </div>
125
+ <% end %>
126
+
127
+ ModelAdapters
128
+ -------------
129
+
130
+ More coming soon...
131
+
132
+ Rails API
133
+ ---------
134
+
135
+ More coming soon...
136
+
137
+ Tips
138
+ ----
139
+
140
+ 1. Any thing you want to bind to must be constructed in the init method
141
+ 2. Each view should generally keep its own model instances to prevent other views from changing (especially views for editing models)
142
+ 3. Use the 'absorb' method on models to preserve bindings, instead of instantiating
143
+ 4. Use the load method on a view to initialize the view before display
144
+
145
+ Thanks To...
146
+ ------------
147
+
148
+ All the contributors to KnockoutJS. Probably one of the best JS libraries since jQuery.
149
+
data/lib/quick_script/engine.rb ADDED
@@ -0,0 +1,16 @@
1
+ module QuickScript
2
+ class Engine < ::Rails::Engine
3
+ #config.tinymce = ActiveSupport::OrderedOptions.new
4
+
5
+ # Set an explicit base path for TinyMCE assets (usually defaults to /assets/tinymce)
6
+ #config.tinymce.base = nil
7
+
8
+ #initializer "precompile", :group => :all do |app|
9
+ #app.config.assets.precompile << "tinymce.js"
10
+ #end
11
+
12
+ #initializer "helper" do |app|
13
+ #ActionController::Base.helper(Helper)
14
+ #end
15
+ end
16
+ end
data/lib/quick_script/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module QuickScript
2
- VERSION = "0.0.53"
2
+ VERSION = "0.2.0"
3
3
  end
data/lib/quick_script.rb CHANGED
@@ -1,6 +1,7 @@
1
1
  require 'quick_script/base'
2
2
  require 'quick_script/helpers'
3
3
  require 'quick_script/interaction'
4
+ require 'quick_script/engine'
4
5
 
5
6
  module QuickScript
6
7
  # Your code goes here...
@@ -9,8 +10,8 @@ module QuickScript
9
10
  raise "ActionController is not available yet." unless defined?(ActionController)
10
11
  ActionController::Base.send(:include, QuickScript::Base)
11
12
  ActionController::Base.send(:helper, QuickScript::Helpers)
12
- QuickScript.install_or_update(:js)
13
- QuickScript.install_or_update(:css)
13
+ #QuickScript.install_or_update(:js)
14
+ #QuickScript.install_or_update(:css)
14
15
  @intialized = true
15
16
  end
16
17
 
data/{lib/quick_script/assets/js → vendor/assets/javascripts/quick_script}/framework.js.coffee RENAMED
@@ -54,7 +54,6 @@
54
54
  options = {
55
55
  width : $(element).width(),
56
56
  height : $(element).height(),
57
- content_css : '/assets/screen/tinymce.css',
58
57
  theme : 'advanced',
59
58
  theme_advanced_toolbar_location : 'top',
60
59
  theme_advanced_buttons1 : 'bold, italic, underline, separator, undo, redo, separator, bullist, numlist, blockquote, separator, justifyleft, justifycenter, justifyright, separator, image, link, unlink, separator, code',
@@ -63,8 +62,10 @@
63
62
  }
64
63
  val = valueAccessor()
65
64
  options.setup = (ed) ->
66
- ed.onChange.add (ed, l) ->
67
- val(l.content)
65
+ ed.onInit.add (ed, l) ->
66
+ tinyMCE.dom.Event.add ed.getWin(), "blur", ->
67
+ console.log('leaving...')
68
+ val(ed.getContent())
68
69
  # handle destroying an editor (based on what jQuery plugin does)
69
70
  ko.utils.domNodeDisposal.addDisposeCallback element, ->
70
71
  ed = tinyMCE.get(element.id)
data/vendor/assets/javascripts/quick_script.js ADDED
@@ -0,0 +1,12 @@
1
+ // QS_VERSION = 0.0.53;
2
+ //= require ./quick_script/jquery.min
3
+ //= require ./quick_script/jquery-ui.min
4
+ //= require ./quick_script/jquery.iframe-transport
5
+ //= require ./quick_script/jquery.qtip.min
6
+ //= require ./quick_script/jquery.fileupload
7
+ //= require ./quick_script/jquery.history
8
+ //= require ./quick_script/knockout
9
+ //= require ./quick_script/fullcalendar.min
10
+ //= require ./quick_script/date
11
+ //= require ./quick_script/classes
12
+ //= require ./quick_script/framework
data/vendor/assets/stylesheets/quick_script/basics.css.sass ADDED
@@ -0,0 +1,51 @@
1
+ @import mixins
2
+
3
+ .p-rel
4
+ +p-rel
5
+ .p-abs
6
+ +p-abs
7
+ .bold
8
+ +bold
9
+ .t-4
10
+ +t-4
11
+ .t-3
12
+ +t-3
13
+ .t-2
14
+ +t-2
15
+ .t-1
16
+ +t-1
17
+ .t-upper
18
+ +t-upper
19
+ .t-center
20
+ +t-center
21
+ .padded
22
+ +padded
23
+ .left
24
+ +left
25
+ .right
26
+ +right
27
+ .inline, .inl
28
+ +inline
29
+
30
+ .img-shadow-dark
31
+ +img-shadow-dark
32
+
33
+ body
34
+ .mceContentBody
35
+ font-size: 20px
36
+
37
+ h1
38
+ +t-shadow
39
+ +t-center
40
+ +bold
41
+ margin-top: 0px
42
+ h2
43
+ +t-shadow
44
+
45
+ hr
46
+ +colruler
47
+
48
+ .container
49
+ +clear-border
50
+ .colborder
51
+ +colborder
data/{lib/quick_script/assets/css/basics.css.sass → vendor/assets/stylesheets/quick_script/elements.css.sass} RENAMED
@@ -1,51 +1,6 @@
1
- @import mixins
1
+ @import 'mixins'
2
2
 
3
- .p-rel
4
- +p-rel
5
- .p-abs
6
- +p-abs
7
- .bold
8
- +bold
9
- .t-4
10
- +t-4
11
- .t-3
12
- +t-3
13
- .t-2
14
- +t-2
15
- .t-1
16
- +t-1
17
- .t-upper
18
- +t-upper
19
- .t-center
20
- +t-center
21
- .padded
22
- +padded
23
- .left
24
- +left
25
- .right
26
- +right
27
- .inline, .inl
28
- +inline
29
-
30
- .img-shadow-dark
31
- +img-shadow-dark
32
-
33
- body
34
- .mceContentBody
35
- font-size: 20px
36
-
37
- h1
38
- +t-shadow
39
- +t-center
40
- +bold
41
- margin-top: 0px
42
- h2
43
- +t-shadow
44
-
45
- hr
46
- +colruler
47
-
48
- .field
3
+ .placefield
49
4
  +p-rel
50
5
  +inline
51
6
  input, textarea
@@ -65,12 +20,6 @@ hr
65
20
  input:focus, textarea:focus
66
21
  +box-shadow(0 1px 1px rgba(0,0,0,0.2) inset,0 0 6px #8ed928)
67
22
 
68
-
69
- .container
70
- +clear-border
71
- .colborder
72
- +colborder
73
-
74
23
  .backdrop
75
24
  +animate(0.5s)
76
25
  position: fixed
data/vendor/assets/stylesheets/quick_script.css ADDED
@@ -0,0 +1,4 @@
1
+ /* QS_VERSION=0.0.52;
2
+ *= require ./quick_script/basics
3
+ *= require ./quick_script/buttons
4
+ */
metadata CHANGED
@@ -1,13 +1,13 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: quick_script
3
3
  version: !ruby/object:Gem::Version
4
- hash: 117
4
+ hash: 23
5
5
  prerelease:
6
6
  segments:
7
7
  - 0
8
+ - 2
8
9
  - 0
9
- - 53
10
- version: 0.0.53
10
+ version: 0.2.0
11
11
  platform: ruby
12
12
  authors:
13
13
  - Alan Graham
@@ -15,7 +15,7 @@ autorequire:
15
15
  bindir: bin
16
16
  cert_chain: []
17
17
 
18
- date: 2012-04-04 00:00:00 Z
18
+ date: 2012-04-07 00:00:00 Z
19
19
  dependencies: []
20
20
 
21
21
  description: Framework for single-page web applications
@@ -30,30 +30,33 @@ extra_rdoc_files: []
30
30
  files:
31
31
  - .gitignore
32
32
  - Gemfile
33
+ - README.md
33
34
  - Rakefile
34
35
  - lib/quick_script.rb
35
- - lib/quick_script/assets/css/basics.css.sass
36
- - lib/quick_script/assets/css/buttons.css
37
- - lib/quick_script/assets/css/mixins.css.sass
38
- - lib/quick_script/assets/css/quick_script.css
39
- - lib/quick_script/assets/js/classes.js.coffee
40
- - lib/quick_script/assets/js/date.js
41
- - lib/quick_script/assets/js/framework.js.coffee
42
- - lib/quick_script/assets/js/fullcalendar.min.js
43
- - lib/quick_script/assets/js/jquery-ui.min.js
44
- - lib/quick_script/assets/js/jquery.fileupload.js
45
- - lib/quick_script/assets/js/jquery.history.js
46
- - lib/quick_script/assets/js/jquery.iframe-transport.js
47
- - lib/quick_script/assets/js/jquery.min.js
48
- - lib/quick_script/assets/js/jquery.qtip.min.js
49
- - lib/quick_script/assets/js/knockout.js
50
- - lib/quick_script/assets/js/quick_script.js
51
36
  - lib/quick_script/base.rb
37
+ - lib/quick_script/engine.rb
52
38
  - lib/quick_script/helpers.rb
53
39
  - lib/quick_script/interaction.rb
54
40
  - lib/quick_script/railtie.rb
55
41
  - lib/quick_script/version.rb
56
42
  - quick_script.gemspec
43
+ - vendor/assets/javascripts/quick_script.js
44
+ - vendor/assets/javascripts/quick_script/classes.js.coffee
45
+ - vendor/assets/javascripts/quick_script/date.js
46
+ - vendor/assets/javascripts/quick_script/framework.js.coffee
47
+ - vendor/assets/javascripts/quick_script/fullcalendar.min.js
48
+ - vendor/assets/javascripts/quick_script/jquery-ui.min.js
49
+ - vendor/assets/javascripts/quick_script/jquery.fileupload.js
50
+ - vendor/assets/javascripts/quick_script/jquery.history.js
51
+ - vendor/assets/javascripts/quick_script/jquery.iframe-transport.js
52
+ - vendor/assets/javascripts/quick_script/jquery.min.js
53
+ - vendor/assets/javascripts/quick_script/jquery.qtip.min.js
54
+ - vendor/assets/javascripts/quick_script/knockout.js
55
+ - vendor/assets/stylesheets/quick_script.css
56
+ - vendor/assets/stylesheets/quick_script/basics.css.sass
57
+ - vendor/assets/stylesheets/quick_script/buttons.css
58
+ - vendor/assets/stylesheets/quick_script/elements.css.sass
59
+ - vendor/assets/stylesheets/quick_script/mixins.css.sass
57
60
  homepage: ""
58
61
  licenses: []
59
62
 
data/lib/quick_script/assets/css/quick_script.css DELETED
@@ -1,4 +0,0 @@
1
- /* QS_VERSION=0.0.52;
2
- *= require ./basics
3
- *= require ./buttons
4
- */
data/lib/quick_script/assets/js/quick_script.js DELETED
@@ -1,12 +0,0 @@
1
- // QS_VERSION = 0.0.53;
2
- //= require ./jquery.min
3
- //= require ./jquery-ui.min
4
- //= require ./jquery.iframe-transport
5
- //= require ./jquery.qtip.min
6
- //= require ./jquery.fileupload
7
- //= require ./jquery.history
8
- //= require ./knockout
9
- //= require ./fullcalendar.min
10
- //= require ./date
11
- //= require ./classes
12
- //= require ./framework