navigator 5.0.0 → 5.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- checksums.yaml.gz.sig +0 -0
- data.tar.gz.sig +0 -0
- data/{LICENSE.md → LICENSE.adoc} +29 -30
- data/README.adoc +498 -0
- data/lib/navigator/identity.rb +4 -15
- data/lib/navigator/menu.rb +2 -2
- metadata +28 -27
- metadata.gz.sig +0 -0
- data/README.md +0 -419
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 36e931176dfe1a48ff4d76239b41240d9471670743adbe1ee3d7c899489afd7e
|
4
|
+
data.tar.gz: 441e9f59c712057dc0830164688cf9d6161e127df2aa94a7808c4e403985e376
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 47b3c9bc66476586e4b84980436f98bee8b61b2d4b64d68dd16c2c61e061062a4e6f7145d9de06e22f3e9a791e1d818cd342510f8e00df2df34a2762a7bd2693
|
7
|
+
data.tar.gz: db0adaf4faffeb123718592b98f26b4b22bc2dde353f28b1a2c0da988a4e56cfcf4c8d5ff9fe21a56f27926e52f78645ed7821d51d93a11547aff064c2cb615d
|
checksums.yaml.gz.sig
CHANGED
Binary file
|
data.tar.gz.sig
CHANGED
Binary file
|
data/{LICENSE.md → LICENSE.adoc}
RENAMED
@@ -1,4 +1,4 @@
|
|
1
|
-
|
1
|
+
= Apache License
|
2
2
|
|
3
3
|
Version 2.0, January 2004
|
4
4
|
|
@@ -6,7 +6,7 @@ http://www.apache.org/licenses
|
|
6
6
|
|
7
7
|
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
8
8
|
|
9
|
-
|
9
|
+
== 1. Definitions
|
10
10
|
|
11
11
|
"License" shall mean the terms and conditions for use, reproduction, and distribution as defined by
|
12
12
|
Sections 1 through 9 of this document.
|
@@ -54,14 +54,14 @@ Contribution."
|
|
54
54
|
"Contributor" shall mean Licensor and any individual or Legal Entity on behalf of whom a
|
55
55
|
Contribution has been received by Licensor and subsequently incorporated within the Work.
|
56
56
|
|
57
|
-
|
57
|
+
== 2. Grant of Copyright License
|
58
58
|
|
59
59
|
Subject to the terms and conditions of this License, each Contributor hereby grants to You a
|
60
60
|
perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable copyright license to
|
61
61
|
reproduce, prepare Derivative Works of, publicly display, publicly perform, sublicense, and
|
62
62
|
distribute the Work and such Derivative Works in Source or Object form.
|
63
63
|
|
64
|
-
|
64
|
+
== 3. Grant of Patent License
|
65
65
|
|
66
66
|
Subject to the terms and conditions of this License, each Contributor hereby grants to You a
|
67
67
|
perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable (except as stated in this
|
@@ -74,39 +74,38 @@ a Contribution incorporated within the Work constitutes direct or contributory p
|
|
74
74
|
then any patent licenses granted to You under this License for that Work shall terminate as of the
|
75
75
|
date such litigation is filed.
|
76
76
|
|
77
|
-
|
77
|
+
== 4. Redistribution
|
78
78
|
|
79
79
|
You may reproduce and distribute copies of the Work or Derivative Works thereof in any medium, with
|
80
80
|
or without modifications, and in Source or Object form, provided that You meet the following
|
81
81
|
conditions:
|
82
82
|
|
83
|
-
|
83
|
+
. You must give any other recipients of the Work or Derivative Works a copy of this License; and
|
84
84
|
|
85
|
-
|
86
|
-
|
85
|
+
. You must cause any modified files to carry prominent notices stating that You changed the files;
|
86
|
+
and
|
87
87
|
|
88
|
-
|
89
|
-
|
90
|
-
|
88
|
+
. You must retain, in the Source form of any Derivative Works that You distribute, all copyright,
|
89
|
+
patent, trademark, and attribution notices from the Source form of the Work, excluding those
|
90
|
+
notices that do not pertain to any part of the Derivative Works; and
|
91
91
|
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
construed as modifying the License.
|
92
|
+
. If the Work includes a "NOTICE" text file as part of its distribution, then any Derivative Works
|
93
|
+
that You distribute must include a readable copy of the attribution notices contained within such
|
94
|
+
NOTICE file, excluding those notices that do not pertain to any part of the Derivative Works, in
|
95
|
+
at least one of the following places: within a NOTICE text file distributed as part of the
|
96
|
+
Derivative Works; within the Source form or documentation, if provided along with the Derivative
|
97
|
+
Works; or, within a display generated by the Derivative Works, if and wherever such third-party
|
98
|
+
notices normally appear. The contents of the NOTICE file are for informational purposes only and
|
99
|
+
do not modify the License. You may add Your own attribution notices within Derivative Works that
|
100
|
+
You distribute, alongside or as an addendum to the NOTICE text from the Work, provided that such
|
101
|
+
additional attribution notices cannot be construed as modifying the License.
|
103
102
|
|
104
103
|
You may add Your own copyright statement to Your modifications and may provide additional or
|
105
104
|
different license terms and conditions for use, reproduction, or distribution of Your modifications,
|
106
105
|
or for any such Derivative Works as a whole, provided Your use, reproduction, and distribution of
|
107
106
|
the Work otherwise complies with the conditions stated in this License.
|
108
107
|
|
109
|
-
|
108
|
+
== 5. Submission of Contributions
|
110
109
|
|
111
110
|
Unless You explicitly state otherwise, any Contribution intentionally submitted for inclusion in the
|
112
111
|
Work by You to the Licensor shall be under the terms and conditions of this License, without any
|
@@ -114,13 +113,13 @@ additional terms or conditions. Notwithstanding the above, nothing herein shall
|
|
114
113
|
the terms of any separate license agreement you may have executed with Licensor regarding such
|
115
114
|
Contributions.
|
116
115
|
|
117
|
-
|
116
|
+
== 6. Trademarks
|
118
117
|
|
119
118
|
This License does not grant permission to use the trade names, trademarks, service marks, or product
|
120
119
|
names of the Licensor, except as required for reasonable and customary use in describing the origin
|
121
120
|
of the Work and reproducing the content of the NOTICE file.
|
122
121
|
|
123
|
-
|
122
|
+
== 7. Disclaimer of Warranty
|
124
123
|
|
125
124
|
Unless required by applicable law or agreed to in writing, Licensor provides the Work (and each
|
126
125
|
Contributor provides its Contributions) on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
@@ -129,7 +128,7 @@ TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A PARTICULAR PURPOSE. Y
|
|
129
128
|
responsible for determining the appropriateness of using or redistributing the Work and assume any
|
130
129
|
risks associated with Your exercise of permissions under this License.
|
131
130
|
|
132
|
-
|
131
|
+
== 8. Limitation of Liability
|
133
132
|
|
134
133
|
In no event and under no legal theory, whether in tort (including negligence), contract, or
|
135
134
|
otherwise, unless required by applicable law (such as deliberate and grossly negligent acts) or
|
@@ -139,7 +138,7 @@ License or out of the use or inability to use the Work (including but not limite
|
|
139
138
|
loss of goodwill, work stoppage, computer failure or malfunction, or any and all other commercial
|
140
139
|
damages or losses), even if such Contributor has been advised of the possibility of such damages.
|
141
140
|
|
142
|
-
|
141
|
+
== 9. Accepting Warranty or Additional Liability
|
143
142
|
|
144
143
|
While redistributing the Work or Derivative Works thereof, You may choose to offer, and charge a fee
|
145
144
|
for, acceptance of support, warranty, indemnity, or other liability obligations and/or rights
|
@@ -151,11 +150,11 @@ additional liability.
|
|
151
150
|
|
152
151
|
END OF TERMS AND CONDITIONS
|
153
152
|
|
154
|
-
Copyright
|
153
|
+
Copyright link:https://www.alchemists.io[Alchemists].
|
155
154
|
|
156
155
|
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in
|
157
|
-
compliance with the License. You may obtain a
|
158
|
-
the License.
|
156
|
+
compliance with the License. You may obtain a link:https://www.apache.org/licenses/LICENSE-2.0[copy]
|
157
|
+
of the License.
|
159
158
|
|
160
159
|
Unless required by applicable law or agreed to in writing, software distributed under the License is
|
161
160
|
distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
data/README.adoc
ADDED
@@ -0,0 +1,498 @@
|
|
1
|
+
:toc: macro
|
2
|
+
:toclevels: 5
|
3
|
+
:figure-caption!:
|
4
|
+
|
5
|
+
= Navigator
|
6
|
+
|
7
|
+
[link=http://badge.fury.io/rb/navigator]
|
8
|
+
image::https://badge.fury.io/rb/navigator.svg[Gem Version]
|
9
|
+
[link=https://circleci.com/gh/bkuhlmann/navigator]
|
10
|
+
image::https://circleci.com/gh/bkuhlmann/navigator.svg?style=svg[Circle CI Status]
|
11
|
+
|
12
|
+
Enhances Rails with a DSL for menu navigation.
|
13
|
+
|
14
|
+
toc::[]
|
15
|
+
|
16
|
+
== Features
|
17
|
+
|
18
|
+
* Provides a DSL for building navigation menus.
|
19
|
+
* Supports auto-detection/highlighting of active menu items based on current path (customizable for
|
20
|
+
non-path usage too).
|
21
|
+
* Supports sub-menus, nested tags, HTML attributes, etc.
|
22
|
+
* Supports the following HTML tags:
|
23
|
+
** div
|
24
|
+
** section
|
25
|
+
** header
|
26
|
+
** h1 - h6
|
27
|
+
** nav
|
28
|
+
** ul
|
29
|
+
** li
|
30
|
+
** a
|
31
|
+
** img
|
32
|
+
** b
|
33
|
+
** em
|
34
|
+
** s
|
35
|
+
** small
|
36
|
+
** span
|
37
|
+
** strong
|
38
|
+
** sub
|
39
|
+
** sup
|
40
|
+
** form
|
41
|
+
** label
|
42
|
+
** select
|
43
|
+
** option
|
44
|
+
** input
|
45
|
+
** button
|
46
|
+
* Provides `+link+`, `+image+`, and `+item+` convenience methods for succinct ways to build commonly
|
47
|
+
used menu elements.
|
48
|
+
|
49
|
+
== Requirements
|
50
|
+
|
51
|
+
. https://www.ruby-lang.org[Ruby 2.7.x].
|
52
|
+
. http://rubyonrails.org[Ruby on Rails 6.0.x].
|
53
|
+
|
54
|
+
== Setup
|
55
|
+
|
56
|
+
=== Production
|
57
|
+
|
58
|
+
To install, run:
|
59
|
+
|
60
|
+
....
|
61
|
+
gem install navigator
|
62
|
+
....
|
63
|
+
|
64
|
+
Add the following to your Gemfile:
|
65
|
+
|
66
|
+
....
|
67
|
+
gem "navigator"
|
68
|
+
....
|
69
|
+
|
70
|
+
=== Development
|
71
|
+
|
72
|
+
To contribute, run:
|
73
|
+
|
74
|
+
....
|
75
|
+
git clone https://github.com/bkuhlmann/navigator.git
|
76
|
+
cd navigator
|
77
|
+
bin/setup
|
78
|
+
....
|
79
|
+
|
80
|
+
You can also use the IRB console for direct access to all objects:
|
81
|
+
|
82
|
+
....
|
83
|
+
bin/console
|
84
|
+
....
|
85
|
+
|
86
|
+
== Usage
|
87
|
+
|
88
|
+
The following are examples using the navigation view helper:
|
89
|
+
|
90
|
+
=== Unordered List (simple)
|
91
|
+
|
92
|
+
Code:
|
93
|
+
|
94
|
+
[source,ruby]
|
95
|
+
----
|
96
|
+
navigation do
|
97
|
+
item "Dashboard", "/dashboard"
|
98
|
+
item "News", "/posts"
|
99
|
+
end
|
100
|
+
----
|
101
|
+
|
102
|
+
Result:
|
103
|
+
|
104
|
+
[source,html]
|
105
|
+
----
|
106
|
+
<ul>
|
107
|
+
<li><a href="/dashboard">Dashboard</a></li>
|
108
|
+
<li><a href="/posts">Posts</a></li>
|
109
|
+
</ul>
|
110
|
+
----
|
111
|
+
|
112
|
+
=== Unordered List (with attributes)
|
113
|
+
|
114
|
+
Code:
|
115
|
+
|
116
|
+
[source,ruby]
|
117
|
+
----
|
118
|
+
navigation "ul", attributes: {class: "nav"} do
|
119
|
+
item "Dashboard", "/dashboard", item_attributes: {class: "active"}
|
120
|
+
item "News", "/posts"
|
121
|
+
end
|
122
|
+
----
|
123
|
+
|
124
|
+
Result:
|
125
|
+
|
126
|
+
[source,html]
|
127
|
+
----
|
128
|
+
<ul class="nav">
|
129
|
+
<li class="active"><a href="/dashboard">Dashboard</a></li>
|
130
|
+
<li><a href="/posts">Posts</a></li>
|
131
|
+
</ul>
|
132
|
+
----
|
133
|
+
|
134
|
+
=== Unordered List (with multiple data attributes)
|
135
|
+
|
136
|
+
Code:
|
137
|
+
|
138
|
+
[source,ruby]
|
139
|
+
----
|
140
|
+
navigation do
|
141
|
+
item "Home", "/home", item_attributes: {data: {id: 1, type: "public"}}
|
142
|
+
end
|
143
|
+
----
|
144
|
+
|
145
|
+
Result:
|
146
|
+
|
147
|
+
[source,html]
|
148
|
+
----
|
149
|
+
<ul>
|
150
|
+
<li data-id="1" data-type="public"><a href="/home">Home</a></li>
|
151
|
+
</ul>
|
152
|
+
----
|
153
|
+
|
154
|
+
_TIP: Nested data– attributes can be applied to any menu item in the same manner as Rails view
|
155
|
+
helpers._
|
156
|
+
|
157
|
+
=== Nav (with links)
|
158
|
+
|
159
|
+
Code:
|
160
|
+
|
161
|
+
[source,ruby]
|
162
|
+
----
|
163
|
+
navigation "nav" do
|
164
|
+
a "Dashboard", attributes: {href: "/dashboard"}
|
165
|
+
a "News", attributes: {href: "/posts"}
|
166
|
+
end
|
167
|
+
----
|
168
|
+
|
169
|
+
Result:
|
170
|
+
|
171
|
+
[source,html]
|
172
|
+
----
|
173
|
+
<nav>
|
174
|
+
<a href="/dashboard">Dashboard</a>
|
175
|
+
<a href="/posts">Posts</a>
|
176
|
+
</nav>
|
177
|
+
----
|
178
|
+
|
179
|
+
=== Foundation Menu
|
180
|
+
|
181
|
+
Code:
|
182
|
+
|
183
|
+
[source,ruby]
|
184
|
+
----
|
185
|
+
navigation "nav", attributes: {class: "top-bar", "data-topbar" => nil} do
|
186
|
+
ul attributes: {class: "title-area"} do
|
187
|
+
li attributes: {class: "name"} do
|
188
|
+
h1 do
|
189
|
+
a "Demo", attributes: {href: "/home"}
|
190
|
+
end
|
191
|
+
end
|
192
|
+
end
|
193
|
+
|
194
|
+
section attributes: {class: "top-bar-section"} do
|
195
|
+
ul attributes: {class: "left"} do
|
196
|
+
item "Home", "/"
|
197
|
+
item "About", "/about"
|
198
|
+
end
|
199
|
+
|
200
|
+
ul attributes: {class: "right"} do
|
201
|
+
item "v1.0.0", '#'
|
202
|
+
end
|
203
|
+
|
204
|
+
ul attributes: {class: "right"} do
|
205
|
+
item "Login", "/login", link_attributes: {class: "button tiny round"}
|
206
|
+
end
|
207
|
+
end
|
208
|
+
end
|
209
|
+
----
|
210
|
+
|
211
|
+
Result:
|
212
|
+
|
213
|
+
[source,html]
|
214
|
+
----
|
215
|
+
<nav class="top-bar" data-topbar="">
|
216
|
+
<ul class="title-area">
|
217
|
+
<li class="name">
|
218
|
+
<h1><a href="/" class="active">Demo</a></h1>
|
219
|
+
</li>
|
220
|
+
</ul>
|
221
|
+
|
222
|
+
<section class="top-bar-section">
|
223
|
+
<ul class="left">
|
224
|
+
<li class="active"><a href="/">Home</a></li>
|
225
|
+
<li><a href="/about">About</a></li>
|
226
|
+
</ul>
|
227
|
+
|
228
|
+
<ul class="right">
|
229
|
+
<li><a href="#">v1.0.0</a></li>
|
230
|
+
</ul>
|
231
|
+
|
232
|
+
<ul class="right">
|
233
|
+
<li><a class="button tiny round" href="/login">Login</a></li>
|
234
|
+
</ul>
|
235
|
+
</section>
|
236
|
+
</nav>
|
237
|
+
----
|
238
|
+
|
239
|
+
=== Bootstrap Dropdown
|
240
|
+
|
241
|
+
Code:
|
242
|
+
|
243
|
+
[source,ruby]
|
244
|
+
----
|
245
|
+
navigation "nav" do
|
246
|
+
item "Dashboard", admin_dashboard_path
|
247
|
+
li attributes: {class: "dropdown"} do
|
248
|
+
a "Manage", attributes: {href: "#", class: "dropdown-toggle", "data-toggle" => "dropdown"} do
|
249
|
+
b attributes: {class: "caret"}
|
250
|
+
end
|
251
|
+
ul attributes: {class: "dropdown-menu"} do
|
252
|
+
item "Dashboard", admin_dashboard_path
|
253
|
+
item "Users", admin_users_path
|
254
|
+
end
|
255
|
+
end
|
256
|
+
end
|
257
|
+
----
|
258
|
+
|
259
|
+
Result:
|
260
|
+
|
261
|
+
[source,html]
|
262
|
+
----
|
263
|
+
<ul class="nav">
|
264
|
+
<li><a href="/admin/dashboard">Dashboard</a></li>
|
265
|
+
<li class="dropdown">
|
266
|
+
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
|
267
|
+
Manage
|
268
|
+
<b class="caret"></b>
|
269
|
+
</a>
|
270
|
+
<ul class="dropdown-menu">
|
271
|
+
<li><a href="/admin/dashboard">Dashboard</a></li>
|
272
|
+
<li><a href="/admin/users">Users</a></li>
|
273
|
+
</ul>
|
274
|
+
</li>
|
275
|
+
</ul>
|
276
|
+
----
|
277
|
+
|
278
|
+
=== Menu Helpers
|
279
|
+
|
280
|
+
There are several convenience methods, in addition to the standard HTML tags, that can make for
|
281
|
+
shorter lines of code. The following describes each:
|
282
|
+
|
283
|
+
When building links, the default is:
|
284
|
+
|
285
|
+
[source,ruby]
|
286
|
+
----
|
287
|
+
navigation "nav", activator: activator do
|
288
|
+
a "Home", attributes: {href: home_path}
|
289
|
+
end
|
290
|
+
----
|
291
|
+
|
292
|
+
...but can be written as:
|
293
|
+
|
294
|
+
[source,ruby]
|
295
|
+
----
|
296
|
+
navigation "nav", activator: activator do
|
297
|
+
link "Home", home_path
|
298
|
+
end
|
299
|
+
----
|
300
|
+
|
301
|
+
When building images, the default is:
|
302
|
+
|
303
|
+
[source,ruby]
|
304
|
+
----
|
305
|
+
navigation "nav", activator: activator do
|
306
|
+
img attributes: {src: "https://placehold.it/50x50", alt: "Example"}
|
307
|
+
end
|
308
|
+
----
|
309
|
+
|
310
|
+
..but can be written as:
|
311
|
+
|
312
|
+
[source,ruby]
|
313
|
+
----
|
314
|
+
navigation "nav", activator: activator do
|
315
|
+
image "https://placehold.it/50x50", "Example"
|
316
|
+
end
|
317
|
+
----
|
318
|
+
|
319
|
+
When building menu items, the default is:
|
320
|
+
|
321
|
+
[source,ruby]
|
322
|
+
----
|
323
|
+
navigation "nav", activator: activator do
|
324
|
+
li do
|
325
|
+
a "Home", attributes: {href: home_path}
|
326
|
+
end
|
327
|
+
end
|
328
|
+
----
|
329
|
+
|
330
|
+
...but can be written as:
|
331
|
+
|
332
|
+
[source,ruby]
|
333
|
+
----
|
334
|
+
navigation "nav", activator: activator do
|
335
|
+
item "Home", "/dashboard"
|
336
|
+
end
|
337
|
+
----
|
338
|
+
|
339
|
+
These are just a few, simple, examples of what can be achieved. See the specs for additional usage
|
340
|
+
and customization.
|
341
|
+
|
342
|
+
== Customization
|
343
|
+
|
344
|
+
The `+navigation+` view helper can accept an optional `+Navigator::TagActivator+` instance.
|
345
|
+
|
346
|
+
Code:
|
347
|
+
|
348
|
+
[source,ruby]
|
349
|
+
----
|
350
|
+
activator = Navigator::TagActivator.new search_value: request.env["PATH_INFO"]
|
351
|
+
|
352
|
+
navigation "nav", activator: activator do
|
353
|
+
link "Home", home_path
|
354
|
+
link "About", about_path
|
355
|
+
end
|
356
|
+
----
|
357
|
+
|
358
|
+
Result:
|
359
|
+
|
360
|
+
[source,html]
|
361
|
+
----
|
362
|
+
<nav>
|
363
|
+
<a href="/home" class="active">Home</a>
|
364
|
+
<a href="/about" class="active">About</a>
|
365
|
+
</nav>
|
366
|
+
----
|
367
|
+
|
368
|
+
This is the default behavior for all navigation menus and is how menu items automaticaly get the
|
369
|
+
"`active`" class when the item URL (in this case "`/home`") matches the `+request.env[“PATH_INFO"]+`
|
370
|
+
to indicate current page/active tab.
|
371
|
+
|
372
|
+
`+Navigator::TagActivator+` instances can be configured as follows:
|
373
|
+
|
374
|
+
* search_key = Optional. The HTML tag attribute to search for. Default: :href.
|
375
|
+
* search_value = Required. The value to match against the search_key value in order to update the
|
376
|
+
value of the target_key. Default: nil.
|
377
|
+
* target_key = Optional. The HTML tag attribute key value to update when the search_value and
|
378
|
+
search_key value match. Default: :class.
|
379
|
+
* target_value = Optional. The value to be applied to the target_key value. If no value exists, then
|
380
|
+
the value is added. Otherwise, if a value exists then the value is appended to the existing value.
|
381
|
+
Default: "`active`".
|
382
|
+
|
383
|
+
This customization allows for more sophisticated detection/updating of active HTML tags. For
|
384
|
+
example, the example code (above) could be rewritten to use `data` attributes and customized
|
385
|
+
styles.
|
386
|
+
|
387
|
+
Code:
|
388
|
+
|
389
|
+
[source,ruby]
|
390
|
+
----
|
391
|
+
activator = Navigator::TagActivator.new search_key: "data-id",
|
392
|
+
search_value: "123",
|
393
|
+
target_key: "data-style"
|
394
|
+
target_value: "current"
|
395
|
+
|
396
|
+
navigation "nav", activator: activator do
|
397
|
+
link "Home", home_path, attributes: {data: {id: "123", data-style="info"}}
|
398
|
+
link "About", about_path attributes: {data: {id: "789"}}
|
399
|
+
end
|
400
|
+
----
|
401
|
+
|
402
|
+
Result:
|
403
|
+
|
404
|
+
[source,html]
|
405
|
+
----
|
406
|
+
<nav>
|
407
|
+
<a href="/home" data-id="123" data-style="info current">Home</a>
|
408
|
+
<a href="/about" data-id="789">About</a>
|
409
|
+
</nav>
|
410
|
+
----
|
411
|
+
|
412
|
+
Lastly, the search value can be a _regular expression_ to make things easier when dealing with
|
413
|
+
complicated routes, sub- menus, etc.
|
414
|
+
|
415
|
+
Code:
|
416
|
+
|
417
|
+
[source,ruby]
|
418
|
+
----
|
419
|
+
profile_activator = Navigator::TagActivator.new search_value: /^profile.+/
|
420
|
+
|
421
|
+
navigation do
|
422
|
+
item "Dashboard", dashboard_path
|
423
|
+
li activator: profile_activator do
|
424
|
+
link "Profile", '#'
|
425
|
+
|
426
|
+
ul do
|
427
|
+
item "Addresses", profile_addresses_path
|
428
|
+
item "Emails", profile_emails_path
|
429
|
+
end
|
430
|
+
end
|
431
|
+
end
|
432
|
+
----
|
433
|
+
|
434
|
+
Result:
|
435
|
+
|
436
|
+
[source,html]
|
437
|
+
----
|
438
|
+
<ul>
|
439
|
+
<li><a href="/dashboard">Dashboard</a></li>
|
440
|
+
<li class="active">
|
441
|
+
<a href="#">Profile</a>
|
442
|
+
<ul>
|
443
|
+
<li><a href="profile/addresses">Addresses</a></li>
|
444
|
+
<li><a href="profile/emails">Emails</a></li>
|
445
|
+
</ul>
|
446
|
+
</li>
|
447
|
+
</ul>
|
448
|
+
----
|
449
|
+
|
450
|
+
Assuming either the `Addresses` or `Emails` menu item was clicked, the `Profile` menu item
|
451
|
+
would be active due to the regular expression (i.e. `/^profile.+/) matching one of the the
|
452
|
+
`profile/` paths.
|
453
|
+
|
454
|
+
== Tests
|
455
|
+
|
456
|
+
To test, run:
|
457
|
+
|
458
|
+
[source,bash]
|
459
|
+
----
|
460
|
+
bundle exec rake
|
461
|
+
----
|
462
|
+
|
463
|
+
To test the dummy application, run:
|
464
|
+
|
465
|
+
[source,bash]
|
466
|
+
----
|
467
|
+
cd spec/dummy
|
468
|
+
bin/rails server
|
469
|
+
----
|
470
|
+
|
471
|
+
== Versioning
|
472
|
+
|
473
|
+
Read link:https://semver.org[Semantic Versioning] for details. Briefly, it means:
|
474
|
+
|
475
|
+
* Major (X.y.z) - Incremented for any backwards incompatible public API changes.
|
476
|
+
* Minor (x.Y.z) - Incremented for new, backwards compatible, public API enhancements/fixes.
|
477
|
+
* Patch (x.y.Z) - Incremented for small, backwards compatible, bug fixes.
|
478
|
+
|
479
|
+
== Code of Conduct
|
480
|
+
|
481
|
+
Please note that this project is released with a link:CODE_OF_CONDUCT.adoc[CODE OF CONDUCT]. By
|
482
|
+
participating in this project you agree to abide by its terms.
|
483
|
+
|
484
|
+
== Contributions
|
485
|
+
|
486
|
+
Read link:CONTRIBUTING.adoc[CONTRIBUTING] for details.
|
487
|
+
|
488
|
+
== License
|
489
|
+
|
490
|
+
Read link:LICENSE.adoc[LICENSE] for details.
|
491
|
+
|
492
|
+
== History
|
493
|
+
|
494
|
+
Read link:CHANGES.adoc[CHANGES] for details.
|
495
|
+
|
496
|
+
== Credits
|
497
|
+
|
498
|
+
Engineered by link:https://www.alchemists.io/team/brooke_kuhlmann.html[Brooke Kuhlmann].
|
data/lib/navigator/identity.rb
CHANGED
@@ -3,20 +3,9 @@
|
|
3
3
|
module Navigator
|
4
4
|
# Gem identity information.
|
5
5
|
module Identity
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
def self.label
|
11
|
-
"Navigator"
|
12
|
-
end
|
13
|
-
|
14
|
-
def self.version
|
15
|
-
"5.0.0"
|
16
|
-
end
|
17
|
-
|
18
|
-
def self.version_label
|
19
|
-
"#{label} #{version}"
|
20
|
-
end
|
6
|
+
NAME = "navigator"
|
7
|
+
LABEL = "Navigator"
|
8
|
+
VERSION = "5.1.0"
|
9
|
+
VERSION_LABEL = "#{LABEL} #{VERSION}"
|
21
10
|
end
|
22
11
|
end
|
data/lib/navigator/menu.rb
CHANGED
@@ -3,11 +3,11 @@
|
|
3
3
|
module Navigator
|
4
4
|
# Renders a HTML menu.
|
5
5
|
class Menu
|
6
|
-
# rubocop:disable
|
6
|
+
# rubocop:disable Layout/LineLength
|
7
7
|
def self.allowed_methods
|
8
8
|
/^(div|section|header|h[1-6]|nav|ul|li|a|img|b|em|s|small|span|strong|sub|sup|form|label|select|option|input|button)$/
|
9
9
|
end
|
10
|
-
# rubocop:enable
|
10
|
+
# rubocop:enable Layout/LineLength
|
11
11
|
|
12
12
|
def initialize template,
|
13
13
|
tag: "ul",
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: navigator
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 5.
|
4
|
+
version: 5.1.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Brooke Kuhlmann
|
@@ -10,9 +10,9 @@ bindir: bin
|
|
10
10
|
cert_chain:
|
11
11
|
- |
|
12
12
|
-----BEGIN CERTIFICATE-----
|
13
|
-
MIIC/
|
14
|
-
|
15
|
-
|
13
|
+
MIIC/jCCAeagAwIBAgIBAzANBgkqhkiG9w0BAQsFADAlMSMwIQYDVQQDDBpicm9v
|
14
|
+
a2UvREM9YWxjaGVtaXN0cy9EQz1pbzAeFw0yMDAzMTUxNDQ1MzJaFw0yMTAzMTUx
|
15
|
+
NDQ1MzJaMCUxIzAhBgNVBAMMGmJyb29rZS9EQz1hbGNoZW1pc3RzL0RDPWlvMIIB
|
16
16
|
IjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA6l1qpXTiomH1RfMRloyw7MiE
|
17
17
|
xyVx/x8Yc3EupdH7uhNaTXQGyORN6aOY//1QXXMHIZ9tW74nZLhesWMSUMYy0XhB
|
18
18
|
brs+KkurHnc9FnEJAbG7ebGvl/ncqZt72nQvaxpDxvuCBHgJAz+8i5wl6FhLw+oT
|
@@ -20,15 +20,15 @@ cert_chain:
|
|
20
20
|
D5vkU0YlAm1r98BymuJlcQ1qdkVEI1d48ph4kcS0S0nv1RiuyVb6TCAR3Nu3VaVq
|
21
21
|
3fPzZKJLZBx67UvXdbdicWPiUR75elI4PXpLIic3xytaF52ZJYyKZCNZJhNwfQID
|
22
22
|
AQABozkwNzAJBgNVHRMEAjAAMAsGA1UdDwQEAwIEsDAdBgNVHQ4EFgQU0nzow9vc
|
23
|
-
2CdikiiE3fJhP/
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
23
|
+
2CdikiiE3fJhP/gY4ggwDQYJKoZIhvcNAQELBQADggEBAIHhAlD3po4sTYqacXaQ
|
24
|
+
XI9jIhrfMy//2PgbHWcETtlJPBeNUbbSNBABcllUHKqYsVDlSvSmss034KSWNR8F
|
25
|
+
bF1GcloicyvcCC4y6IoW4it0COAcdeaaxkxiBSgKdQFpff9REnDlIKK4uQ9lLxIo
|
26
|
+
Y2G5xubiziKZkyfWFuSr67PIjW3Bu673D1JVBArhA1qbgQmYQcy1CkGOjo+iO8Nf
|
27
|
+
7u/QSfBHb+r/bXhKscDgPpnKwbUmvgO2+94zJG9KsrmIydlzYfsD09aXKx0t6Xy4
|
28
|
+
2XV8FRa7/JimI07sPLC13eLY3xd/aYTi85Z782KIA4j0G8XEEWAX0ouBhlXPocZv
|
29
|
+
QWc=
|
30
30
|
-----END CERTIFICATE-----
|
31
|
-
date: 2020-
|
31
|
+
date: 2020-04-01 00:00:00.000000000 Z
|
32
32
|
dependencies:
|
33
33
|
- !ruby/object:Gem::Dependency
|
34
34
|
name: rails
|
@@ -176,42 +176,42 @@ dependencies:
|
|
176
176
|
requirements:
|
177
177
|
- - "~>"
|
178
178
|
- !ruby/object:Gem::Version
|
179
|
-
version: '
|
179
|
+
version: '6.0'
|
180
180
|
type: :development
|
181
181
|
prerelease: false
|
182
182
|
version_requirements: !ruby/object:Gem::Requirement
|
183
183
|
requirements:
|
184
184
|
- - "~>"
|
185
185
|
- !ruby/object:Gem::Version
|
186
|
-
version: '
|
186
|
+
version: '6.0'
|
187
187
|
- !ruby/object:Gem::Dependency
|
188
188
|
name: rspec-rails
|
189
189
|
requirement: !ruby/object:Gem::Requirement
|
190
190
|
requirements:
|
191
191
|
- - "~>"
|
192
192
|
- !ruby/object:Gem::Version
|
193
|
-
version: '
|
193
|
+
version: '4.0'
|
194
194
|
type: :development
|
195
195
|
prerelease: false
|
196
196
|
version_requirements: !ruby/object:Gem::Requirement
|
197
197
|
requirements:
|
198
198
|
- - "~>"
|
199
199
|
- !ruby/object:Gem::Version
|
200
|
-
version: '
|
200
|
+
version: '4.0'
|
201
201
|
- !ruby/object:Gem::Dependency
|
202
202
|
name: rubocop
|
203
203
|
requirement: !ruby/object:Gem::Requirement
|
204
204
|
requirements:
|
205
205
|
- - "~>"
|
206
206
|
- !ruby/object:Gem::Version
|
207
|
-
version: '0.
|
207
|
+
version: '0.79'
|
208
208
|
type: :development
|
209
209
|
prerelease: false
|
210
210
|
version_requirements: !ruby/object:Gem::Requirement
|
211
211
|
requirements:
|
212
212
|
- - "~>"
|
213
213
|
- !ruby/object:Gem::Version
|
214
|
-
version: '0.
|
214
|
+
version: '0.79'
|
215
215
|
- !ruby/object:Gem::Dependency
|
216
216
|
name: rubocop-performance
|
217
217
|
requirement: !ruby/object:Gem::Requirement
|
@@ -260,25 +260,25 @@ dependencies:
|
|
260
260
|
requirements:
|
261
261
|
- - "~>"
|
262
262
|
- !ruby/object:Gem::Version
|
263
|
-
version: '0.
|
263
|
+
version: '0.18'
|
264
264
|
type: :development
|
265
265
|
prerelease: false
|
266
266
|
version_requirements: !ruby/object:Gem::Requirement
|
267
267
|
requirements:
|
268
268
|
- - "~>"
|
269
269
|
- !ruby/object:Gem::Version
|
270
|
-
version: '0.
|
270
|
+
version: '0.18'
|
271
271
|
description:
|
272
272
|
email:
|
273
273
|
- brooke@alchemists.io
|
274
274
|
executables: []
|
275
275
|
extensions: []
|
276
276
|
extra_rdoc_files:
|
277
|
-
- README.
|
278
|
-
- LICENSE.
|
277
|
+
- README.adoc
|
278
|
+
- LICENSE.adoc
|
279
279
|
files:
|
280
|
-
- LICENSE.
|
281
|
-
- README.
|
280
|
+
- LICENSE.adoc
|
281
|
+
- README.adoc
|
282
282
|
- app/helpers/navigator/navigation_helper.rb
|
283
283
|
- lib/navigator.rb
|
284
284
|
- lib/navigator/engine.rb
|
@@ -286,13 +286,14 @@ files:
|
|
286
286
|
- lib/navigator/menu.rb
|
287
287
|
- lib/navigator/tag.rb
|
288
288
|
- lib/navigator/tag_activator.rb
|
289
|
-
homepage: https://
|
289
|
+
homepage: https://www.alchemists.io/projects/navigator
|
290
290
|
licenses:
|
291
291
|
- Apache-2.0
|
292
292
|
metadata:
|
293
|
-
source_code_uri: https://github.com/bkuhlmann/navigator
|
294
|
-
changelog_uri: https://github.com/bkuhlmann/navigator/blob/master/CHANGES.md
|
295
293
|
bug_tracker_uri: https://github.com/bkuhlmann/navigator/issues
|
294
|
+
changelog_uri: https://www.alchemists.io/projects/navigator/changes.html
|
295
|
+
documentation_uri: https://www.alchemists.io/projects/navigator
|
296
|
+
source_code_uri: https://github.com/bkuhlmann/navigator
|
296
297
|
post_install_message:
|
297
298
|
rdoc_options: []
|
298
299
|
require_paths:
|
metadata.gz.sig
CHANGED
Binary file
|
data/README.md
DELETED
@@ -1,419 +0,0 @@
|
|
1
|
-
<p align="center">
|
2
|
-
<img src="navigator.png" alt="Navigator Icon"/>
|
3
|
-
</p>
|
4
|
-
|
5
|
-
# Navigator
|
6
|
-
|
7
|
-
[![Gem Version](https://badge.fury.io/rb/navigator.svg)](http://badge.fury.io/rb/navigator)
|
8
|
-
[![Code Climate Maintainability](https://api.codeclimate.com/v1/badges/2f8632ec1f734ea9561a/maintainability)](https://codeclimate.com/github/bkuhlmann/navigator/maintainability)
|
9
|
-
[![Code Climate Test Coverage](https://api.codeclimate.com/v1/badges/2f8632ec1f734ea9561a/test_coverage)](https://codeclimate.com/github/bkuhlmann/navigator/test_coverage)
|
10
|
-
[![Circle CI Status](https://circleci.com/gh/bkuhlmann/navigator.svg?style=svg)](https://circleci.com/gh/bkuhlmann/navigator)
|
11
|
-
|
12
|
-
Enhances Rails with a DSL for menu navigation.
|
13
|
-
|
14
|
-
<!-- Tocer[start]: Auto-generated, don't remove. -->
|
15
|
-
|
16
|
-
## Table of Contents
|
17
|
-
|
18
|
-
- [Features](#features)
|
19
|
-
- [Requirements](#requirements)
|
20
|
-
- [Setup](#setup)
|
21
|
-
- [Usage](#usage)
|
22
|
-
- [Unordered List (simple)](#unordered-list-simple)
|
23
|
-
- [Unordered List (with attributes)](#unordered-list-with-attributes)
|
24
|
-
- [Unordered List (with multiple data attributes)](#unordered-list-with-multiple-data-attributes)
|
25
|
-
- [Nav (with links)](#nav-with-links)
|
26
|
-
- [Foundation Menu](#foundation-menu)
|
27
|
-
- [Bootstrap Dropdown](#bootstrap-dropdown)
|
28
|
-
- [Menu Helpers](#menu-helpers)
|
29
|
-
- [Customization](#customization)
|
30
|
-
- [Tests](#tests)
|
31
|
-
- [Versioning](#versioning)
|
32
|
-
- [Code of Conduct](#code-of-conduct)
|
33
|
-
- [Contributions](#contributions)
|
34
|
-
- [License](#license)
|
35
|
-
- [History](#history)
|
36
|
-
- [Credits](#credits)
|
37
|
-
|
38
|
-
<!-- Tocer[finish]: Auto-generated, don't remove. -->
|
39
|
-
|
40
|
-
## Features
|
41
|
-
|
42
|
-
- Provides a DSL for building navigation menus.
|
43
|
-
- Supports auto-detection/highlighting of active menu items based on current path (customizable for
|
44
|
-
non-path usage too).
|
45
|
-
- Supports sub-menus, nested tags, HTML attributes, etc.
|
46
|
-
- Supports the following HTML tags:
|
47
|
-
- div
|
48
|
-
- section
|
49
|
-
- header
|
50
|
-
- h1 - h6
|
51
|
-
- nav
|
52
|
-
- ul
|
53
|
-
- li
|
54
|
-
- a
|
55
|
-
- img
|
56
|
-
- b
|
57
|
-
- em
|
58
|
-
- s
|
59
|
-
- small
|
60
|
-
- span
|
61
|
-
- strong
|
62
|
-
- sub
|
63
|
-
- sup
|
64
|
-
- form
|
65
|
-
- label
|
66
|
-
- select
|
67
|
-
- option
|
68
|
-
- input
|
69
|
-
- button
|
70
|
-
- Provides `link`, `image`, and `item` convenience methods for succinct ways to build commonly used
|
71
|
-
menu elements.
|
72
|
-
|
73
|
-
## Requirements
|
74
|
-
|
75
|
-
1. [Ruby 2.6.x](https://www.ruby-lang.org).
|
76
|
-
1. [Ruby on Rails 5.x.x](http://rubyonrails.org).
|
77
|
-
|
78
|
-
## Setup
|
79
|
-
|
80
|
-
Type the following to install:
|
81
|
-
|
82
|
-
gem install navigator
|
83
|
-
|
84
|
-
Add the following to your Gemfile:
|
85
|
-
|
86
|
-
gem "navigator"
|
87
|
-
|
88
|
-
## Usage
|
89
|
-
|
90
|
-
The following are examples using the navigation view helper:
|
91
|
-
|
92
|
-
### Unordered List (simple)
|
93
|
-
|
94
|
-
Code:
|
95
|
-
|
96
|
-
navigation do
|
97
|
-
item "Dashboard", "/dashboard"
|
98
|
-
item "News", "/posts"
|
99
|
-
end
|
100
|
-
|
101
|
-
Result:
|
102
|
-
|
103
|
-
<ul>
|
104
|
-
<li><a href="/dashboard">Dashboard</a></li>
|
105
|
-
<li><a href="/posts">Posts</a></li>
|
106
|
-
</ul>
|
107
|
-
|
108
|
-
### Unordered List (with attributes)
|
109
|
-
|
110
|
-
Code:
|
111
|
-
|
112
|
-
navigation "ul", attributes: {class: "nav"} do
|
113
|
-
item "Dashboard", "/dashboard", item_attributes: {class: "active"}
|
114
|
-
item "News", "/posts"
|
115
|
-
end
|
116
|
-
|
117
|
-
Result:
|
118
|
-
|
119
|
-
<ul class="nav">
|
120
|
-
<li class="active"><a href="/dashboard">Dashboard</a></li>
|
121
|
-
<li><a href="/posts">Posts</a></li>
|
122
|
-
</ul>
|
123
|
-
|
124
|
-
### Unordered List (with multiple data attributes)
|
125
|
-
|
126
|
-
Code:
|
127
|
-
|
128
|
-
navigation do
|
129
|
-
item "Home", "/home", item_attributes: {data: {id: 1, type: "public"}}
|
130
|
-
end
|
131
|
-
|
132
|
-
Result:
|
133
|
-
|
134
|
-
<ul>
|
135
|
-
<li data-id="1" data-type="public"><a href="/home">Home</a></li>
|
136
|
-
</ul>
|
137
|
-
|
138
|
-
*TIP: Nested data-- attributes can be applied to any menu item in the same manner as Rails view
|
139
|
-
helpers.*
|
140
|
-
|
141
|
-
### Nav (with links)
|
142
|
-
|
143
|
-
Code:
|
144
|
-
|
145
|
-
navigation "nav" do
|
146
|
-
a "Dashboard", attributes: {href: "/dashboard"}
|
147
|
-
a "News", attributes: {href: "/posts"}
|
148
|
-
end
|
149
|
-
|
150
|
-
Result:
|
151
|
-
|
152
|
-
<nav>
|
153
|
-
<a href="/dashboard">Dashboard</a>
|
154
|
-
<a href="/posts">Posts</a>
|
155
|
-
</nav>
|
156
|
-
|
157
|
-
### Foundation Menu
|
158
|
-
|
159
|
-
Code:
|
160
|
-
|
161
|
-
navigation "nav", attributes: {class: "top-bar", "data-topbar" => nil} do
|
162
|
-
ul attributes: {class: "title-area"} do
|
163
|
-
li attributes: {class: "name"} do
|
164
|
-
h1 do
|
165
|
-
a "Demo", attributes: {href: "/home"}
|
166
|
-
end
|
167
|
-
end
|
168
|
-
end
|
169
|
-
|
170
|
-
section attributes: {class: "top-bar-section"} do
|
171
|
-
ul attributes: {class: "left"} do
|
172
|
-
item "Home", "/"
|
173
|
-
item "About", "/about"
|
174
|
-
end
|
175
|
-
|
176
|
-
ul attributes: {class: "right"} do
|
177
|
-
item "v1.0.0", '#'
|
178
|
-
end
|
179
|
-
|
180
|
-
ul attributes: {class: "right"} do
|
181
|
-
item "Login", "/login", link_attributes: {class: "button tiny round"}
|
182
|
-
end
|
183
|
-
end
|
184
|
-
end
|
185
|
-
|
186
|
-
Result:
|
187
|
-
|
188
|
-
<nav class="top-bar" data-topbar="">
|
189
|
-
<ul class="title-area">
|
190
|
-
<li class="name">
|
191
|
-
<h1><a href="/" class="active">Demo</a></h1>
|
192
|
-
</li>
|
193
|
-
</ul>
|
194
|
-
|
195
|
-
<section class="top-bar-section">
|
196
|
-
<ul class="left">
|
197
|
-
<li class="active"><a href="/">Home</a></li>
|
198
|
-
<li><a href="/about">About</a></li>
|
199
|
-
</ul>
|
200
|
-
|
201
|
-
<ul class="right">
|
202
|
-
<li><a href="#">v1.0.0</a></li>
|
203
|
-
</ul>
|
204
|
-
|
205
|
-
<ul class="right">
|
206
|
-
<li><a class="button tiny round" href="/login">Login</a></li>
|
207
|
-
</ul>
|
208
|
-
</section>
|
209
|
-
</nav>
|
210
|
-
|
211
|
-
### Bootstrap Dropdown
|
212
|
-
|
213
|
-
Code:
|
214
|
-
|
215
|
-
navigation "nav" do
|
216
|
-
item "Dashboard", admin_dashboard_path
|
217
|
-
li attributes: {class: "dropdown"} do
|
218
|
-
a "Manage", attributes: {href: "#", class: "dropdown-toggle", "data-toggle" => "dropdown"} do
|
219
|
-
b attributes: {class: "caret"}
|
220
|
-
end
|
221
|
-
ul attributes: {class: "dropdown-menu"} do
|
222
|
-
item "Dashboard", admin_dashboard_path
|
223
|
-
item "Users", admin_users_path
|
224
|
-
end
|
225
|
-
end
|
226
|
-
end
|
227
|
-
|
228
|
-
Result:
|
229
|
-
|
230
|
-
<ul class="nav">
|
231
|
-
<li><a href="/admin/dashboard">Dashboard</a></li>
|
232
|
-
<li class="dropdown">
|
233
|
-
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
|
234
|
-
Manage
|
235
|
-
<b class="caret"></b>
|
236
|
-
</a>
|
237
|
-
<ul class="dropdown-menu">
|
238
|
-
<li><a href="/admin/dashboard">Dashboard</a></li>
|
239
|
-
<li><a href="/admin/users">Users</a></li>
|
240
|
-
</ul>
|
241
|
-
</li>
|
242
|
-
</ul>
|
243
|
-
|
244
|
-
### Menu Helpers
|
245
|
-
|
246
|
-
There are several convenience methods, in addition to the standard HTML tags, that can make for
|
247
|
-
shorter lines of code. The following describes each:
|
248
|
-
|
249
|
-
When building links, the default is:
|
250
|
-
|
251
|
-
navigation "nav", activator: activator do
|
252
|
-
a "Home", attributes: {href: home_path}
|
253
|
-
end
|
254
|
-
|
255
|
-
...but can be written as:
|
256
|
-
|
257
|
-
navigation "nav", activator: activator do
|
258
|
-
link "Home", home_path
|
259
|
-
end
|
260
|
-
|
261
|
-
When building images, the default is:
|
262
|
-
|
263
|
-
navigation "nav", activator: activator do
|
264
|
-
img attributes: {src: "https://placehold.it/50x50", alt: "Example"}
|
265
|
-
end
|
266
|
-
|
267
|
-
...but can be written as:
|
268
|
-
|
269
|
-
navigation "nav", activator: activator do
|
270
|
-
image "https://placehold.it/50x50", "Example"
|
271
|
-
end
|
272
|
-
|
273
|
-
When building menu items, the default is:
|
274
|
-
|
275
|
-
navigation "nav", activator: activator do
|
276
|
-
li do
|
277
|
-
a "Home", attributes: {href: home_path}
|
278
|
-
end
|
279
|
-
end
|
280
|
-
|
281
|
-
...but can be written as:
|
282
|
-
|
283
|
-
navigation "nav", activator: activator do
|
284
|
-
item "Home", "/dashboard"
|
285
|
-
end
|
286
|
-
|
287
|
-
These are just a few, simple, examples of what can be achieved. See the specs for additional usage
|
288
|
-
and customization.
|
289
|
-
|
290
|
-
## Customization
|
291
|
-
|
292
|
-
The `navigation` view helper can accept an optional `Navigator::TagActivator` instance. Example:
|
293
|
-
|
294
|
-
# Code
|
295
|
-
activator = Navigator::TagActivator.new search_value: request.env["PATH_INFO"]
|
296
|
-
|
297
|
-
navigation "nav", activator: activator do
|
298
|
-
link "Home", home_path
|
299
|
-
link "About", about_path
|
300
|
-
end
|
301
|
-
|
302
|
-
<!-- Result -->
|
303
|
-
<nav>
|
304
|
-
<a href="/home" class="active">Home</a>
|
305
|
-
<a href="/about" class="active">About</a>
|
306
|
-
</nav>
|
307
|
-
|
308
|
-
This is the default behavior for all navigation menus and is how menu items automaticaly get the
|
309
|
-
"active" class when the item URL (in this case "/home") matches the `request.env[“PATH_INFO"]` to
|
310
|
-
indicate current page/active tab.
|
311
|
-
|
312
|
-
`Navigator::TagActivator` instances can be configured as follows:
|
313
|
-
|
314
|
-
- search_key = Optional. The HTML tag attribute to search for. Default: :href.
|
315
|
-
- search_value = Required. The value to match against the search_key value in order to update the
|
316
|
-
value of the target_key. Default: nil.
|
317
|
-
- target_key = Optional. The HTML tag attribute key value to update when the search_value and
|
318
|
-
search_key value match. Default: :class.
|
319
|
-
- target_value = Optional. The value to be applied to the target_key value. If no value exists, then
|
320
|
-
the value is added. Otherwise, if a value exists then the value is appended to the existing value.
|
321
|
-
Default: "active".
|
322
|
-
|
323
|
-
This customization allows for more sophisticated detection/updating of active HTML tags. For
|
324
|
-
example, the example code (above) could be rewritten to use `data-*` attributes and customized
|
325
|
-
styles as follows:
|
326
|
-
|
327
|
-
# Code
|
328
|
-
activator = Navigator::TagActivator.new search_key: "data-id",
|
329
|
-
search_value: "123",
|
330
|
-
target_key: "data-style"
|
331
|
-
target_value: "current"
|
332
|
-
|
333
|
-
navigation "nav", activator: activator do
|
334
|
-
link "Home", home_path, attributes: {data: {id: "123", data-style="info"}}
|
335
|
-
link "About", about_path attributes: {data: {id: "789"}}
|
336
|
-
end
|
337
|
-
|
338
|
-
<!-- Result -->
|
339
|
-
<nav>
|
340
|
-
<a href="/home" data-id="123" data-style="info current">Home</a>
|
341
|
-
<a href="/about" data-id="789">About</a>
|
342
|
-
</nav>
|
343
|
-
|
344
|
-
Lastly, the search value can be a *regular expression* to make things easier when dealing with
|
345
|
-
complicated routes, sub- menus, etc. Example:
|
346
|
-
|
347
|
-
# Code
|
348
|
-
profile_activator = Navigator::TagActivator.new search_value: /^profile.+/
|
349
|
-
|
350
|
-
navigation do
|
351
|
-
item "Dashboard", dashboard_path
|
352
|
-
li activator: profile_activator do
|
353
|
-
link "Profile", '#'
|
354
|
-
|
355
|
-
ul do
|
356
|
-
item "Addresses", profile_addresses_path
|
357
|
-
item "Emails", profile_emails_path
|
358
|
-
end
|
359
|
-
end
|
360
|
-
end
|
361
|
-
|
362
|
-
<!-- Result -->
|
363
|
-
<ul>
|
364
|
-
<li><a href="/dashboard">Dashboard</a></li>
|
365
|
-
<li class="active">
|
366
|
-
<a href="#">Profile</a>
|
367
|
-
<ul>
|
368
|
-
<li><a href="profile/addresses">Addresses</a></li>
|
369
|
-
<li><a href="profile/emails">Emails</a></li>
|
370
|
-
</ul>
|
371
|
-
</li>
|
372
|
-
</ul>
|
373
|
-
|
374
|
-
Assuming either the `Addresses` or `Emails` menu item was clicked, the `Profile` menu item would be
|
375
|
-
active due to the regular expression (i.e. `/^profile.+/`) matching one of the the `profile/*`
|
376
|
-
paths.
|
377
|
-
|
378
|
-
## Tests
|
379
|
-
|
380
|
-
To test, run:
|
381
|
-
|
382
|
-
bundle exec rake
|
383
|
-
|
384
|
-
To test the dummy application, run:
|
385
|
-
|
386
|
-
cd spec/dummy
|
387
|
-
bin/rails server
|
388
|
-
|
389
|
-
## Versioning
|
390
|
-
|
391
|
-
Read [Semantic Versioning](https://semver.org) for details. Briefly, it means:
|
392
|
-
|
393
|
-
- Major (X.y.z) - Incremented for any backwards incompatible public API changes.
|
394
|
-
- Minor (x.Y.z) - Incremented for new, backwards compatible, public API enhancements/fixes.
|
395
|
-
- Patch (x.y.Z) - Incremented for small, backwards compatible, bug fixes.
|
396
|
-
|
397
|
-
## Code of Conduct
|
398
|
-
|
399
|
-
Please note that this project is released with a [CODE OF CONDUCT](CODE_OF_CONDUCT.md). By
|
400
|
-
participating in this project you agree to abide by its terms.
|
401
|
-
|
402
|
-
## Contributions
|
403
|
-
|
404
|
-
Read [CONTRIBUTING](CONTRIBUTING.md) for details.
|
405
|
-
|
406
|
-
## License
|
407
|
-
|
408
|
-
Copyright 2012 [Alchemists](https://www.alchemists.io).
|
409
|
-
Read [LICENSE](LICENSE.md) for details.
|
410
|
-
|
411
|
-
## History
|
412
|
-
|
413
|
-
Read [CHANGES](CHANGES.md) for details.
|
414
|
-
Built with [Gemsmith](https://github.com/bkuhlmann/gemsmith).
|
415
|
-
|
416
|
-
## Credits
|
417
|
-
|
418
|
-
Developed by [Brooke Kuhlmann](https://www.alchemists.io) at
|
419
|
-
[Alchemists](https://www.alchemists.io).
|