rocky 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.md +137 -5
- data/lib/rocky/version.rb +1 -1
- metadata +1 -1
data/README.md
CHANGED
@@ -1,6 +1,13 @@
|
|
1
1
|
# Rocky
|
2
2
|
|
3
|
-
|
3
|
+
Current status: Middleware in development
|
4
|
+
|
5
|
+
Rocky is CoffeeScript Middleware that binds class objects with HTML page elements.
|
6
|
+
Class objects interact with page elements through Backbone events.
|
7
|
+
Rocky also implements the logic of the following components:
|
8
|
+
Modal (Dynamic building and binding)
|
9
|
+
Puppet page (Blank page, which closed after the action and sends instructions to the parent window)
|
10
|
+
|
4
11
|
|
5
12
|
## Installation
|
6
13
|
|
@@ -11,14 +18,139 @@ Add this line to your application's Gemfile:
|
|
11
18
|
And then execute:
|
12
19
|
|
13
20
|
$ bundle
|
21
|
+
$ rails g rocky:install
|
22
|
+
|
23
|
+
Last command will add the following lines in file (app/assets/javascripts/application.js):
|
24
|
+
|
25
|
+
//= require underscore
|
26
|
+
//= require backbone
|
27
|
+
//= require middleware
|
28
|
+
//= require application/#{your_application_name}
|
29
|
+
|
30
|
+
## Login Form example
|
31
|
+
|
32
|
+
Login Controller (SessionsController):
|
33
|
+
|
34
|
+
def new
|
35
|
+
@user_session = UserSession.new
|
36
|
+
end
|
37
|
+
|
38
|
+
def create
|
39
|
+
@user_session = log_in(params[:user_session])
|
40
|
+
|
41
|
+
if logged_in?
|
42
|
+
render :json => { :completed => true, :url => root_path }
|
43
|
+
else
|
44
|
+
flash.now[:alert] = "Incorrect email or password"
|
45
|
+
render :json => { :completed => false, :template => render_to_string("sessions/new") }
|
46
|
+
end
|
47
|
+
end
|
48
|
+
|
49
|
+
Login Template (sessions/new.haml):
|
50
|
+
|
51
|
+
.login.form{ :data => { :block => "login_form" } }
|
52
|
+
|
53
|
+
- flash.each do |key, value|
|
54
|
+
%div{ :class => "alert alert-#{key == :notice ? 'success' : 'error'}" }= value
|
55
|
+
|
56
|
+
= form_for(@user_session, :url => login_path, :remote => true, :method => :post) do |form|
|
57
|
+
|
58
|
+
.field
|
59
|
+
= form.label :email
|
60
|
+
= form.text_field :email, :autofocus => true
|
61
|
+
|
62
|
+
.field
|
63
|
+
= form.label :password
|
64
|
+
= form.password_field :password
|
65
|
+
|
66
|
+
.actions
|
67
|
+
link_to "Facebook login", "javascript:void(0)", :data => { :url => "facebook_oauth2_path",
|
68
|
+
:action => "open_connection",
|
69
|
+
:name => "Log into My Application",
|
70
|
+
:width => 600,
|
71
|
+
:height => 400 }
|
72
|
+
|
73
|
+
= form.check_box :remember_me
|
74
|
+
= form.label :remember_me, "Keep me logged in"
|
75
|
+
= link_to "Log In", "javascript:void(0)", :data => { :action => "submit" }
|
76
|
+
|
77
|
+
Login CoffeeScript View Class (app/assets/javascripts/application/view/login.js.coffee):
|
78
|
+
|
79
|
+
class MyApplicationName.Views.Login extends Middleware.System.Base
|
80
|
+
|
81
|
+
constructor: (@container) ->
|
82
|
+
super(@container)
|
83
|
+
@initForm()
|
84
|
+
|
85
|
+
initForm: =>
|
86
|
+
@form = @container.find("form")
|
87
|
+
|
88
|
+
MyApplicationName.Views.Login.initOpenConnection(@form.find("a[data-action=open_connection]"))
|
89
|
+
|
90
|
+
@form.on "ajax:success", @createResponse
|
91
|
+
@form.on "request:completed", @completeForm
|
92
|
+
@form.on "request:failed", @updateForm
|
93
|
+
|
94
|
+
@submitButton = @form.find("a[data-action=submit]")
|
95
|
+
@submitButton.on "click", =>
|
96
|
+
@form.trigger("submit.rails")
|
97
|
+
|
98
|
+
createResponse: (event, json) =>
|
99
|
+
if json["completed"] == true
|
100
|
+
@form.trigger("request:completed", json)
|
101
|
+
else
|
102
|
+
@form.trigger("request:failed", json)
|
103
|
+
|
104
|
+
completeForm: (event, json) =>
|
105
|
+
window.location.replace(json["url"])
|
106
|
+
|
107
|
+
updateForm: (event, json) =>
|
108
|
+
@container.replaceWith(json["template"])
|
109
|
+
MyApplicationName.Views.Login.bindMany("*[data-block=login_form]")
|
110
|
+
|
111
|
+
@initOpenConnection: (button) ->
|
112
|
+
button.on "click", (e) ->
|
113
|
+
left = (screen.width/2)-(button.data("width")/2)
|
114
|
+
top = (screen.height/2)-(button.data("height")/2)
|
115
|
+
window.open(button.data("url"),
|
116
|
+
button.data("name"),
|
117
|
+
"menubar=no,toolbar=no,status=no,width=#{button.data('width')},height=#{button.data('height')},toolbar=no,left=#{left},top=#{top}"
|
118
|
+
).focus()
|
119
|
+
|
120
|
+
e.stopPropagation()
|
121
|
+
return false
|
122
|
+
|
123
|
+
jQuery ->
|
124
|
+
MyApplicationName.Views.Login.bindMany("*[data-block=login_form]")
|
125
|
+
|
126
|
+
### Modal Example:
|
127
|
+
|
128
|
+
HTML Header:
|
129
|
+
|
130
|
+
%header{ :data => { :block => "header" } }
|
131
|
+
.buttons
|
132
|
+
- if logged_in?
|
133
|
+
= link_to "Edit account", edit_user_path(current_user), :data => { :remote => true, :action => "edit_user" }
|
134
|
+
|
135
|
+
Header CoffeeScript View Class (app/assets/javascripts/application/views/header.js.coffee):
|
136
|
+
|
137
|
+
class MyApplicationName.Views.Header extends Middleware.System.Base
|
138
|
+
|
139
|
+
constructor: (@container) ->
|
140
|
+
super(@container)
|
141
|
+
@initElements()
|
14
142
|
|
15
|
-
|
143
|
+
initElements: =>
|
144
|
+
@editUserButton = @container.find("a[data-action='edit_user']")
|
145
|
+
@editUserButton.on "ajax:success", @createEditUserContainer
|
16
146
|
|
17
|
-
|
147
|
+
createEditUserContainer: (event, json) =>
|
148
|
+
@editUserContainer = Middleware.Component.Modal.create("edit_user")
|
149
|
+
@editUserContainer.fill("hello")
|
18
150
|
|
19
|
-
|
151
|
+
jQuery ->
|
152
|
+
MyApplicationname.Views.Header.bindMany("*[data-block='header']")
|
20
153
|
|
21
|
-
TODO: Write usage instructions here
|
22
154
|
|
23
155
|
## Contributing
|
24
156
|
|
data/lib/rocky/version.rb
CHANGED