matestack-ui-core 0.7.2
Sign up to get free protection for your applications and to get access to all the features.
Potentially problematic release.
This version of matestack-ui-core might be problematic. Click here for more details.
- checksums.yaml +7 -0
- data/MIT-LICENSE +20 -0
- data/README.md +228 -0
- data/Rakefile +34 -0
- data/app/concepts/matestack/ui/core/abbr/abbr.haml +5 -0
- data/app/concepts/matestack/ui/core/abbr/abbr.rb +12 -0
- data/app/concepts/matestack/ui/core/absolute/absolute.haml +3 -0
- data/app/concepts/matestack/ui/core/absolute/absolute.rb +17 -0
- data/app/concepts/matestack/ui/core/action/action.haml +3 -0
- data/app/concepts/matestack/ui/core/action/action.js +49 -0
- data/app/concepts/matestack/ui/core/action/action.rb +52 -0
- data/app/concepts/matestack/ui/core/address/address.haml +5 -0
- data/app/concepts/matestack/ui/core/address/address.rb +5 -0
- data/app/concepts/matestack/ui/core/app/app.haml +4 -0
- data/app/concepts/matestack/ui/core/app/app.js +27 -0
- data/app/concepts/matestack/ui/core/app/app.rb +98 -0
- data/app/concepts/matestack/ui/core/app/store.js +70 -0
- data/app/concepts/matestack/ui/core/article/article.haml +5 -0
- data/app/concepts/matestack/ui/core/article/article.rb +5 -0
- data/app/concepts/matestack/ui/core/async/async.haml +2 -0
- data/app/concepts/matestack/ui/core/async/async.js +76 -0
- data/app/concepts/matestack/ui/core/async/async.rb +12 -0
- data/app/concepts/matestack/ui/core/blockquote/blockquote.haml +5 -0
- data/app/concepts/matestack/ui/core/blockquote/blockquote.rb +11 -0
- data/app/concepts/matestack/ui/core/br/br.haml +5 -0
- data/app/concepts/matestack/ui/core/br/br.rb +5 -0
- data/app/concepts/matestack/ui/core/button/button.haml +5 -0
- data/app/concepts/matestack/ui/core/button/button.rb +11 -0
- data/app/concepts/matestack/ui/core/caption/caption.haml +5 -0
- data/app/concepts/matestack/ui/core/caption/caption.rb +5 -0
- data/app/concepts/matestack/ui/core/collection/content/content.js +98 -0
- data/app/concepts/matestack/ui/core/collection/content/content.rb +18 -0
- data/app/concepts/matestack/ui/core/collection/content/next/next.haml +3 -0
- data/app/concepts/matestack/ui/core/collection/content/next/next.rb +5 -0
- data/app/concepts/matestack/ui/core/collection/content/page/link/link.haml +3 -0
- data/app/concepts/matestack/ui/core/collection/content/page/link/link.rb +5 -0
- data/app/concepts/matestack/ui/core/collection/content/previous/previous.haml +3 -0
- data/app/concepts/matestack/ui/core/collection/content/previous/previous.rb +5 -0
- data/app/concepts/matestack/ui/core/collection/filter/filter.js +48 -0
- data/app/concepts/matestack/ui/core/collection/filter/filter.rb +17 -0
- data/app/concepts/matestack/ui/core/collection/filter/input/input.haml +2 -0
- data/app/concepts/matestack/ui/core/collection/filter/input/input.rb +25 -0
- data/app/concepts/matestack/ui/core/collection/filter/reset/reset.haml +3 -0
- data/app/concepts/matestack/ui/core/collection/filter/reset/reset.rb +5 -0
- data/app/concepts/matestack/ui/core/collection/filter/submit/submit.haml +3 -0
- data/app/concepts/matestack/ui/core/collection/filter/submit/submit.rb +5 -0
- data/app/concepts/matestack/ui/core/collection/helper.rb +113 -0
- data/app/concepts/matestack/ui/core/collection/order/order.js +56 -0
- data/app/concepts/matestack/ui/core/collection/order/order.rb +17 -0
- data/app/concepts/matestack/ui/core/collection/order/toggle/indicator/indicator.rb +13 -0
- data/app/concepts/matestack/ui/core/collection/order/toggle/toggle.haml +3 -0
- data/app/concepts/matestack/ui/core/collection/order/toggle/toggle.rb +5 -0
- data/app/concepts/matestack/ui/core/component/anonym-dynamic-component.js +10 -0
- data/app/concepts/matestack/ui/core/component/children.haml +2 -0
- data/app/concepts/matestack/ui/core/component/component.js +59 -0
- data/app/concepts/matestack/ui/core/component/dynamic.haml +6 -0
- data/app/concepts/matestack/ui/core/component/dynamic.rb +261 -0
- data/app/concepts/matestack/ui/core/component/dynamic_without_rerender.haml +2 -0
- data/app/concepts/matestack/ui/core/component/response.haml +2 -0
- data/app/concepts/matestack/ui/core/component/response_dynamic.haml +7 -0
- data/app/concepts/matestack/ui/core/component/response_dynamic_without_rerender.haml +3 -0
- data/app/concepts/matestack/ui/core/component/static.haml +1 -0
- data/app/concepts/matestack/ui/core/component/static.rb +16 -0
- data/app/concepts/matestack/ui/core/details/details.haml +3 -0
- data/app/concepts/matestack/ui/core/details/details.rb +5 -0
- data/app/concepts/matestack/ui/core/div/div.haml +3 -0
- data/app/concepts/matestack/ui/core/div/div.rb +5 -0
- data/app/concepts/matestack/ui/core/footer/footer.haml +3 -0
- data/app/concepts/matestack/ui/core/footer/footer.rb +5 -0
- data/app/concepts/matestack/ui/core/form/form.haml +2 -0
- data/app/concepts/matestack/ui/core/form/form.js +136 -0
- data/app/concepts/matestack/ui/core/form/form.rb +71 -0
- data/app/concepts/matestack/ui/core/form/inline/inline.haml +6 -0
- data/app/concepts/matestack/ui/core/form/inline/inline.rb +9 -0
- data/app/concepts/matestack/ui/core/form/input/input.haml +27 -0
- data/app/concepts/matestack/ui/core/form/input/input.rb +74 -0
- data/app/concepts/matestack/ui/core/form/select/select.haml +76 -0
- data/app/concepts/matestack/ui/core/form/select/select.rb +73 -0
- data/app/concepts/matestack/ui/core/form/submit/submit.haml +3 -0
- data/app/concepts/matestack/ui/core/form/submit/submit.rb +9 -0
- data/app/concepts/matestack/ui/core/header/header.haml +3 -0
- data/app/concepts/matestack/ui/core/header/header.rb +5 -0
- data/app/concepts/matestack/ui/core/heading/heading.haml +50 -0
- data/app/concepts/matestack/ui/core/heading/heading.rb +5 -0
- data/app/concepts/matestack/ui/core/hr/hr.haml +1 -0
- data/app/concepts/matestack/ui/core/hr/hr.rb +5 -0
- data/app/concepts/matestack/ui/core/html/html.haml +3 -0
- data/app/concepts/matestack/ui/core/html/html.js +10 -0
- data/app/concepts/matestack/ui/core/html/html.rb +17 -0
- data/app/concepts/matestack/ui/core/icon/icon.haml +5 -0
- data/app/concepts/matestack/ui/core/icon/icon.rb +5 -0
- data/app/concepts/matestack/ui/core/img/img.haml +1 -0
- data/app/concepts/matestack/ui/core/img/img.rb +5 -0
- data/app/concepts/matestack/ui/core/input/input.haml +3 -0
- data/app/concepts/matestack/ui/core/input/input.rb +5 -0
- data/app/concepts/matestack/ui/core/isolate/isolate.haml +2 -0
- data/app/concepts/matestack/ui/core/isolate/isolate.rb +11 -0
- data/app/concepts/matestack/ui/core/js/core.js +30 -0
- data/app/concepts/matestack/ui/core/js/event-hub.js +5 -0
- data/app/concepts/matestack/ui/core/js/helpers/query-params-helper.js +56 -0
- data/app/concepts/matestack/ui/core/label/label.haml +5 -0
- data/app/concepts/matestack/ui/core/label/label.rb +5 -0
- data/app/concepts/matestack/ui/core/li/li.haml +5 -0
- data/app/concepts/matestack/ui/core/li/li.rb +5 -0
- data/app/concepts/matestack/ui/core/link/link.haml +5 -0
- data/app/concepts/matestack/ui/core/link/link.rb +26 -0
- data/app/concepts/matestack/ui/core/main/main.haml +3 -0
- data/app/concepts/matestack/ui/core/main/main.rb +5 -0
- data/app/concepts/matestack/ui/core/nav/nav.haml +3 -0
- data/app/concepts/matestack/ui/core/nav/nav.rb +5 -0
- data/app/concepts/matestack/ui/core/ol/ol.haml +3 -0
- data/app/concepts/matestack/ui/core/ol/ol.rb +5 -0
- data/app/concepts/matestack/ui/core/onclick/onclick.haml +2 -0
- data/app/concepts/matestack/ui/core/onclick/onclick.js +21 -0
- data/app/concepts/matestack/ui/core/onclick/onclick.rb +5 -0
- data/app/concepts/matestack/ui/core/page/content.haml +7 -0
- data/app/concepts/matestack/ui/core/page/content.js +17 -0
- data/app/concepts/matestack/ui/core/page/content.rb +5 -0
- data/app/concepts/matestack/ui/core/page/page.haml +9 -0
- data/app/concepts/matestack/ui/core/page/page.rb +175 -0
- data/app/concepts/matestack/ui/core/paragraph/paragraph.haml +5 -0
- data/app/concepts/matestack/ui/core/paragraph/paragraph.rb +5 -0
- data/app/concepts/matestack/ui/core/partial/partial.haml +2 -0
- data/app/concepts/matestack/ui/core/partial/partial.rb +5 -0
- data/app/concepts/matestack/ui/core/pg/pg.haml +5 -0
- data/app/concepts/matestack/ui/core/pg/pg.rb +5 -0
- data/app/concepts/matestack/ui/core/plain/plain.rb +9 -0
- data/app/concepts/matestack/ui/core/progress/progress.haml +3 -0
- data/app/concepts/matestack/ui/core/progress/progress.rb +14 -0
- data/app/concepts/matestack/ui/core/section/section.haml +3 -0
- data/app/concepts/matestack/ui/core/section/section.rb +5 -0
- data/app/concepts/matestack/ui/core/slot/slot.haml +2 -0
- data/app/concepts/matestack/ui/core/slot/slot.rb +5 -0
- data/app/concepts/matestack/ui/core/small/small.haml +5 -0
- data/app/concepts/matestack/ui/core/small/small.rb +5 -0
- data/app/concepts/matestack/ui/core/span/span.haml +5 -0
- data/app/concepts/matestack/ui/core/span/span.rb +5 -0
- data/app/concepts/matestack/ui/core/strong/strong.haml +5 -0
- data/app/concepts/matestack/ui/core/strong/strong.rb +5 -0
- data/app/concepts/matestack/ui/core/sub/sub.haml +5 -0
- data/app/concepts/matestack/ui/core/sub/sub.rb +5 -0
- data/app/concepts/matestack/ui/core/summary/summary.haml +5 -0
- data/app/concepts/matestack/ui/core/summary/summary.rb +5 -0
- data/app/concepts/matestack/ui/core/table/table.haml +3 -0
- data/app/concepts/matestack/ui/core/table/table.rb +5 -0
- data/app/concepts/matestack/ui/core/tbody/tbody.haml +3 -0
- data/app/concepts/matestack/ui/core/tbody/tbody.rb +5 -0
- data/app/concepts/matestack/ui/core/td/td.haml +5 -0
- data/app/concepts/matestack/ui/core/td/td.rb +5 -0
- data/app/concepts/matestack/ui/core/tfoot/tfoot.haml +3 -0
- data/app/concepts/matestack/ui/core/tfoot/tfoot.rb +5 -0
- data/app/concepts/matestack/ui/core/th/th.haml +5 -0
- data/app/concepts/matestack/ui/core/th/th.rb +5 -0
- data/app/concepts/matestack/ui/core/thead/thead.haml +3 -0
- data/app/concepts/matestack/ui/core/thead/thead.rb +5 -0
- data/app/concepts/matestack/ui/core/time/time.haml +3 -0
- data/app/concepts/matestack/ui/core/time/time.rb +11 -0
- data/app/concepts/matestack/ui/core/tr/tr.haml +3 -0
- data/app/concepts/matestack/ui/core/tr/tr.rb +5 -0
- data/app/concepts/matestack/ui/core/transition/transition.haml +5 -0
- data/app/concepts/matestack/ui/core/transition/transition.js +26 -0
- data/app/concepts/matestack/ui/core/transition/transition.rb +31 -0
- data/app/concepts/matestack/ui/core/ul/ul.haml +3 -0
- data/app/concepts/matestack/ui/core/ul/ul.rb +5 -0
- data/app/concepts/matestack/ui/core/video/video.haml +1 -0
- data/app/concepts/matestack/ui/core/video/video.rb +7 -0
- data/app/concepts/matestack/ui/core/view/view.haml +2 -0
- data/app/concepts/matestack/ui/core/view/view.js +42 -0
- data/app/concepts/matestack/ui/core/view/view.rb +5 -0
- data/app/concepts/matestack/ui/core/youtube/youtube.haml +1 -0
- data/app/concepts/matestack/ui/core/youtube/youtube.rb +26 -0
- data/app/helpers/matestack/ui/core/application_helper.rb +35 -0
- data/app/lib/matestack/ui/app.rb +1 -0
- data/app/lib/matestack/ui/core/app_node.rb +53 -0
- data/app/lib/matestack/ui/core/component_node.rb +73 -0
- data/app/lib/matestack/ui/core/page_node.rb +96 -0
- data/app/lib/matestack/ui/core/to_cell.rb +129 -0
- data/app/lib/matestack/ui/dynamic_component.rb +1 -0
- data/app/lib/matestack/ui/page.rb +1 -0
- data/app/lib/matestack/ui/static_component.rb +1 -0
- data/config/routes.rb +3 -0
- data/lib/generators/matestack_app/USAGE +21 -0
- data/lib/generators/matestack_app/matestack_app_generator.rb +26 -0
- data/lib/generators/matestack_app/templates/matestack_app.erb +26 -0
- data/lib/generators/matestack_app/templates/matestack_app_controller.erb +7 -0
- data/lib/generators/matestack_component/USAGE +20 -0
- data/lib/generators/matestack_component/matestack_component_generator.rb +30 -0
- data/lib/generators/matestack_component/templates/matestack_component.haml.erb +5 -0
- data/lib/generators/matestack_component/templates/matestack_component.js.erb +17 -0
- data/lib/generators/matestack_component/templates/matestack_component.rb.erb +13 -0
- data/lib/generators/matestack_component/templates/matestack_component.scss.erb +1 -0
- data/lib/generators/matestack_page/USAGE +28 -0
- data/lib/generators/matestack_page/matestack_page_generator.rb +41 -0
- data/lib/generators/matestack_page/templates/matestack_page.erb +15 -0
- data/lib/matestack/ui/core.rb +15 -0
- data/lib/matestack/ui/core/engine.rb +19 -0
- data/lib/matestack/ui/core/version.rb +7 -0
- data/lib/tasks/matestack/ui/core_tasks.rake +4 -0
- data/vendor/assets/javascripts/manifest.json +4 -0
- data/vendor/assets/javascripts/matestack-ui-core.js +15309 -0
- data/vendor/assets/javascripts/matestack-ui-core.js.map +1 -0
- metadata +350 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: af1594c493057f5f1ef5e9548d9485d2fcac014a9c79519554ed53d61de90703
|
4
|
+
data.tar.gz: 1441194ad2d3da09a0d4ebb60def765442042e77d069afe7a75abae9ab565464
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 70bf6d472b902d96adde03e06ca5ac062fed60f79220ac4de499f996c391198e64fbe8e72fb0a2a7d8c2b08c75de4cb328a9a81b23cf2c2bb92a137de4a92f70
|
7
|
+
data.tar.gz: 141ce7ca2f0857b8c2f4ec3c740d0e89f23c009340b041a4145e8f04000744bacf2fa948c7ac99bb64294f4b5a4321de0713b27bd4feb3f851c8848350f1dc4e
|
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright 2018 Jonas Jabari
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,228 @@
|
|
1
|
+
[![CircleCI](https://circleci.com/gh/basemate/matestack-ui-core/tree/master.svg?style=shield)](https://circleci.com/gh/basemate/matestack-ui-core/tree/master)
|
2
|
+
[![Gitter](https://badges.gitter.im/basemate/community.svg)](https://gitter.im/basemate/community?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
|
3
|
+
[![Gem Version](https://badge.fury.io/rb/matestack-ui-core.svg)](https://badge.fury.io/rb/matestack-ui-core)
|
4
|
+
|
5
|
+
![matestack logo](./logo.png)
|
6
|
+
|
7
|
+
# matestack: Escape the frontend hustle
|
8
|
+
|
9
|
+
## Create maintainable, dynamic and beautiful UIs easily
|
10
|
+
|
11
|
+
As a Rails Engine, matestack deeply integrates a Vue.js based UI into Rails, offering optional prebuilt components. Use it to write dynamic Web-UIs with minimum effort and maximum dev happiness in pure Ruby. The main goals are:
|
12
|
+
|
13
|
+
- Reduction of complexity of modern web development, moving front and backend closer together
|
14
|
+
- More maintainable UI code, using a component-based structure written in Ruby
|
15
|
+
- Increased development speed and happiness, offering prebuilt UI-Components for classic requirements
|
16
|
+
- Modern, dynamic UI feeling without the need to implement a separate JavaScript Application
|
17
|
+
|
18
|
+
matestack can progressively replace the classic Rails-View-Layer. You are able to use
|
19
|
+
it alongside your classic views and incrementally turn your Rails-App into a
|
20
|
+
dynamic Web-App.
|
21
|
+
|
22
|
+
### Installation:
|
23
|
+
|
24
|
+
Click here to see how you can add Matestack UI to your existing Rails application: [Installation Guide](./docs/install)
|
25
|
+
|
26
|
+
### Features:
|
27
|
+
|
28
|
+
#### Define your UI in a Ruby Class
|
29
|
+
```ruby
|
30
|
+
class Pages::MyPage < Matestack::Ui::Page
|
31
|
+
|
32
|
+
def prepare
|
33
|
+
@technologies = ["Rails", "Vue.js", "Trailblazer", "Rspec", "Capybara"]
|
34
|
+
end
|
35
|
+
|
36
|
+
def response
|
37
|
+
components{
|
38
|
+
div id: "technologies" do
|
39
|
+
@technologies.each do |technology|
|
40
|
+
plain "matestack uses #{technology}"
|
41
|
+
end
|
42
|
+
end
|
43
|
+
}
|
44
|
+
end
|
45
|
+
|
46
|
+
end
|
47
|
+
```
|
48
|
+
#### Create a Single Page Application without JavaScript
|
49
|
+
|
50
|
+
```ruby
|
51
|
+
class Apps::MyApp < Matestack::Ui::App
|
52
|
+
|
53
|
+
def response
|
54
|
+
components{
|
55
|
+
header do
|
56
|
+
heading size: 1, text: "My App"
|
57
|
+
end
|
58
|
+
nav do
|
59
|
+
transition path: :my_first_page_path do
|
60
|
+
button text: "Page 1"
|
61
|
+
end
|
62
|
+
transition path: :my_second_page_path do
|
63
|
+
button text: "Page 2"
|
64
|
+
end
|
65
|
+
end
|
66
|
+
main do
|
67
|
+
page_content #pages are dynamically yielded here, when buttons are clicked!
|
68
|
+
end
|
69
|
+
footer do
|
70
|
+
plain "That's it!"
|
71
|
+
end
|
72
|
+
}
|
73
|
+
end
|
74
|
+
|
75
|
+
end
|
76
|
+
```
|
77
|
+
|
78
|
+
```ruby
|
79
|
+
class Pages::MyApp::MyFirstPage < Matestack::Ui::Page
|
80
|
+
|
81
|
+
def response
|
82
|
+
components{
|
83
|
+
div id: "div-on-page-1" do
|
84
|
+
plain "My First Page"
|
85
|
+
end
|
86
|
+
}
|
87
|
+
end
|
88
|
+
|
89
|
+
end
|
90
|
+
```
|
91
|
+
```ruby
|
92
|
+
class Pages::MyApp::MySecondPage < Matestack::Ui::Page
|
93
|
+
|
94
|
+
def response
|
95
|
+
components{
|
96
|
+
div id: "div-on-page-2" do
|
97
|
+
plain "My Second Page"
|
98
|
+
end
|
99
|
+
}
|
100
|
+
end
|
101
|
+
|
102
|
+
end
|
103
|
+
```
|
104
|
+
#### Handle User Interaction dynamically without JavaScript
|
105
|
+
```ruby
|
106
|
+
class Pages::MyPage < Matestack::Ui::Page
|
107
|
+
|
108
|
+
def response
|
109
|
+
components {
|
110
|
+
action my_action_config do
|
111
|
+
button text: "Click me!"
|
112
|
+
end
|
113
|
+
#content gets rerendered without page reload if action succeeded
|
114
|
+
async rerender_on: "my_action_succeeded" do
|
115
|
+
div id: "my-div" do
|
116
|
+
plain DateTime.now
|
117
|
+
end
|
118
|
+
end
|
119
|
+
}
|
120
|
+
end
|
121
|
+
|
122
|
+
def my_action_config
|
123
|
+
{
|
124
|
+
method: :post,
|
125
|
+
path: :some_rails_routing_path,
|
126
|
+
success: {
|
127
|
+
emit: "my_action_succeeded"
|
128
|
+
}
|
129
|
+
}
|
130
|
+
end
|
131
|
+
|
132
|
+
end
|
133
|
+
```
|
134
|
+
#### Handle User Input dynamically without JavaScript
|
135
|
+
```ruby
|
136
|
+
class Pages::MyApp::MyFirstPage < Matestack::Ui::Page
|
137
|
+
|
138
|
+
def prepare
|
139
|
+
@my_model = MyModel.new
|
140
|
+
end
|
141
|
+
|
142
|
+
def response
|
143
|
+
components {
|
144
|
+
form my_form_config, :include do
|
145
|
+
form_input key: :some_model_attribute, type: :text
|
146
|
+
form_submit do
|
147
|
+
button text: "Submit me!"
|
148
|
+
end
|
149
|
+
end
|
150
|
+
async show_on: "form_has_errors", hide_after: 5000 do
|
151
|
+
plain "Data could not be submitted, please check form"
|
152
|
+
end
|
153
|
+
}
|
154
|
+
end
|
155
|
+
|
156
|
+
def my_form_config
|
157
|
+
{
|
158
|
+
for: @my_model,
|
159
|
+
method: :post,
|
160
|
+
path: :some_action_path,
|
161
|
+
success: {
|
162
|
+
transition: {
|
163
|
+
path: :my_second_page_path,
|
164
|
+
}
|
165
|
+
},
|
166
|
+
failure: {
|
167
|
+
emit: "form_has_errors"
|
168
|
+
}
|
169
|
+
}
|
170
|
+
end
|
171
|
+
|
172
|
+
end
|
173
|
+
```
|
174
|
+
#### Websocket Integration without JavaScript
|
175
|
+
```ruby
|
176
|
+
class Pages::MyPage < Matestack::Ui::Page
|
177
|
+
|
178
|
+
def prepare
|
179
|
+
@comments = Comment.last(5)
|
180
|
+
end
|
181
|
+
|
182
|
+
def response
|
183
|
+
components {
|
184
|
+
#content gets rerendered without page reload when
|
185
|
+
#websocket event is received
|
186
|
+
async rerender_on: "comments_changed" do
|
187
|
+
@comments.each do |comment|
|
188
|
+
div do
|
189
|
+
plain comment.content
|
190
|
+
end
|
191
|
+
end
|
192
|
+
end
|
193
|
+
}
|
194
|
+
end
|
195
|
+
|
196
|
+
end
|
197
|
+
```
|
198
|
+
somewhere else on the backend:
|
199
|
+
|
200
|
+
```ruby
|
201
|
+
ActionCable.server.broadcast("matestack_ui_core", {
|
202
|
+
message: "comments_changed"
|
203
|
+
})
|
204
|
+
```
|
205
|
+
|
206
|
+
### Documentation
|
207
|
+
|
208
|
+
Documentation can be found [here](./docs)
|
209
|
+
|
210
|
+
### Changelog
|
211
|
+
|
212
|
+
Changelog can be found [here](./CHANGELOG.md)
|
213
|
+
|
214
|
+
### Roadmap
|
215
|
+
|
216
|
+
We're currently finalizing the roadmap towards to a stable 1.0 release, supposed to happen towards the end of the year! For details make sure to check the [release management project](https://github.com/basemate/matestack-ui-core/projects/2) and get in touch via our [chat](https://gitter.im/basemate/community) for feedback!
|
217
|
+
|
218
|
+
### Community
|
219
|
+
|
220
|
+
As a low-barrier feedback channel for our early users, we have set up a Gitter chat that can be found [here](https://gitter.im/basemate/community). You are very welcome to ask questions and send us feedback there!
|
221
|
+
|
222
|
+
### Contribution
|
223
|
+
|
224
|
+
We are happy to accept contributors of any kind. Please refer to the [Contribution Guide](./docs/contribute)
|
225
|
+
|
226
|
+
### License
|
227
|
+
The gem is available as open source under the terms of the
|
228
|
+
[MIT License](https://opensource.org/licenses/MIT).
|
data/Rakefile
ADDED
@@ -0,0 +1,34 @@
|
|
1
|
+
begin
|
2
|
+
require 'bundler/setup'
|
3
|
+
rescue LoadError
|
4
|
+
puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
|
5
|
+
end
|
6
|
+
|
7
|
+
require 'rdoc/task'
|
8
|
+
|
9
|
+
RDoc::Task.new(:rdoc) do |rdoc|
|
10
|
+
rdoc.rdoc_dir = 'rdoc'
|
11
|
+
rdoc.title = 'Matestack::Ui::Core'
|
12
|
+
rdoc.options << '--line-numbers'
|
13
|
+
rdoc.rdoc_files.include('README.md')
|
14
|
+
rdoc.rdoc_files.include('lib/**/*.rb')
|
15
|
+
end
|
16
|
+
|
17
|
+
APP_RAKEFILE = File.expand_path("spec/dummy/Rakefile", __dir__)
|
18
|
+
load 'rails/tasks/engine.rake'
|
19
|
+
|
20
|
+
load 'rails/tasks/statistics.rake'
|
21
|
+
|
22
|
+
load 'lib/tasks/matestack/ui/core_tasks.rake'
|
23
|
+
|
24
|
+
require 'bundler/gem_tasks'
|
25
|
+
|
26
|
+
require 'rake/testtask'
|
27
|
+
|
28
|
+
# Rake::TestTask.new(:test) do |t|
|
29
|
+
# t.libs << 'test'
|
30
|
+
# t.pattern = 'test/**/*_test.rb'
|
31
|
+
# t.verbose = false
|
32
|
+
# end
|
33
|
+
#
|
34
|
+
# task default: :test
|
@@ -0,0 +1,17 @@
|
|
1
|
+
module Matestack::Ui::Core::Absolute
|
2
|
+
class Absolute < Matestack::Ui::Core::Component::Static
|
3
|
+
|
4
|
+
def setup
|
5
|
+
style = "position: absolute;"
|
6
|
+
style << " top: #{options[:top]}px;" if options[:top]
|
7
|
+
style << " left: #{options[:left]}px;" if options[:left]
|
8
|
+
style << " right: #{options[:right]}px;" if options[:right]
|
9
|
+
style << " bottom: #{options[:bottom]}px;" if options[:bottom]
|
10
|
+
style << " z-index: #{options[:z]};" if options[:z]
|
11
|
+
@tag_attributes.merge!({
|
12
|
+
style: style
|
13
|
+
})
|
14
|
+
end
|
15
|
+
|
16
|
+
end
|
17
|
+
end
|
@@ -0,0 +1,49 @@
|
|
1
|
+
import Vue from 'vue/dist/vue.esm'
|
2
|
+
import Vuex from 'vuex'
|
3
|
+
import axios from 'axios'
|
4
|
+
|
5
|
+
import matestackEventHub from 'js/event-hub'
|
6
|
+
|
7
|
+
import componentMixin from 'component/component'
|
8
|
+
|
9
|
+
const componentDef = {
|
10
|
+
mixins: [componentMixin],
|
11
|
+
data: function(){
|
12
|
+
return {}
|
13
|
+
},
|
14
|
+
methods: {
|
15
|
+
perform: function(){
|
16
|
+
const self = this
|
17
|
+
axios({
|
18
|
+
method: self.componentConfig["method"],
|
19
|
+
url: self.componentConfig["action_path"],
|
20
|
+
data: self.componentConfig["data"],
|
21
|
+
headers: {
|
22
|
+
'X-CSRF-Token': document.getElementsByName("csrf-token")[0].getAttribute('content')
|
23
|
+
}
|
24
|
+
})
|
25
|
+
.then(function(response){
|
26
|
+
if (self.componentConfig["success"] != undefined && self.componentConfig["success"]["emit"] != undefined) {
|
27
|
+
matestackEventHub.$emit(self.componentConfig["success"]["emit"], response.data);
|
28
|
+
}
|
29
|
+
if (self.componentConfig["success"] != undefined && self.componentConfig["success"]["transition"] != undefined && self.$store != undefined) {
|
30
|
+
let path = self.componentConfig["success"]["transition"]["path"]
|
31
|
+
self.$store.dispatch('navigateTo', {url: path, backwards: false})
|
32
|
+
}
|
33
|
+
})
|
34
|
+
.catch(function(error){
|
35
|
+
if (self.componentConfig["failure"] != undefined && self.componentConfig["failure"]["emit"] != undefined) {
|
36
|
+
matestackEventHub.$emit(self.componentConfig["failure"]["emit"], error.response.data);
|
37
|
+
}
|
38
|
+
if (self.componentConfig["failure"] != undefined && self.componentConfig["failure"]["transition"] != undefined && self.$store != undefined) {
|
39
|
+
let path = self.componentConfig["failure"]["transition"]["path"]
|
40
|
+
self.$store.dispatch('navigateTo', {url: path, backwards: false})
|
41
|
+
}
|
42
|
+
})
|
43
|
+
}
|
44
|
+
}
|
45
|
+
}
|
46
|
+
|
47
|
+
let component = Vue.component('matestack-ui-core-action', componentDef)
|
48
|
+
|
49
|
+
export default componentDef
|
@@ -0,0 +1,52 @@
|
|
1
|
+
module Matestack::Ui::Core::Action
|
2
|
+
class Action < Matestack::Ui::Core::Component::Dynamic
|
3
|
+
|
4
|
+
def setup
|
5
|
+
@component_config[:action_path] = action_path
|
6
|
+
@component_config[:method] = options[:method]
|
7
|
+
@component_config[:success] = options[:success]
|
8
|
+
unless options[:success].nil?
|
9
|
+
unless options[:success][:transition].nil?
|
10
|
+
@component_config[:success][:transition][:path] = transition_path options[:success]
|
11
|
+
end
|
12
|
+
end
|
13
|
+
@component_config[:failure] = options[:failure]
|
14
|
+
unless options[:failure].nil?
|
15
|
+
unless options[:failure][:transition].nil?
|
16
|
+
@component_config[:failure][:transition][:path] = transition_path options[:failure]
|
17
|
+
end
|
18
|
+
end
|
19
|
+
if options[:notify].nil?
|
20
|
+
@component_config[:notify] = true
|
21
|
+
end
|
22
|
+
end
|
23
|
+
|
24
|
+
def action_path
|
25
|
+
begin
|
26
|
+
if options[:path].is_a?(Symbol)
|
27
|
+
return ::Rails.application.routes.url_helpers.send(options[:path], options[:params])
|
28
|
+
else
|
29
|
+
return options[:path]
|
30
|
+
end
|
31
|
+
rescue
|
32
|
+
raise "Action path not found"
|
33
|
+
end
|
34
|
+
end
|
35
|
+
|
36
|
+
def transition_path callback_options
|
37
|
+
begin
|
38
|
+
if callback_options[:transition][:path].is_a?(Symbol)
|
39
|
+
return ::Rails.application.routes.url_helpers.send(
|
40
|
+
callback_options[:transition][:path],
|
41
|
+
callback_options[:transition][:params]
|
42
|
+
)
|
43
|
+
else
|
44
|
+
return callback_options[:transition][:path]
|
45
|
+
end
|
46
|
+
rescue
|
47
|
+
raise "Transition path not found"
|
48
|
+
end
|
49
|
+
end
|
50
|
+
|
51
|
+
end
|
52
|
+
end
|