@@ -4,6 +4,9 @@ Opal-Browser - Client side web development in pure Ruby, using Opal
4
4
[ ![ Gem Version] ( https://badge.fury.io/rb/opal-browser.svg )] ( http://badge.fury.io/rb/opal-browser )
5
5
[ ![ Code Climate] ( https://img.shields.io/codeclimate/maintainability-percentage/opal/opal-browser.svg )] ( https://codeclimate.com/github/opal/opal-browser )
6
6
[ ![ Build Status] ( https://github.com/opal/opal-browser/workflows/build/badge.svg )] ( https://github.com/opal/opal-browser/actions?query=workflow%3Abuild )
7
+ [ ![ Join Chat] ( https://img.shields.io/badge/slack-join%20chat-46BC99?logo=slack&style=flat )] ( https://slack.opalrb.com/ )
8
+ [ ![ Stack Overflow] ( https://img.shields.io/badge/stackoverflow-%23opalrb-orange.svg?style=flat )] ( https://stackoverflow.com/questions/ask?tags=opalrb,opal-browser )
9
+ [ ![ Documentation] ( https://img.shields.io/badge/docs-updated-blue.svg )] ( https://rubydoc.info/gems/opal-browser )
7
10
8
11
This library aims to be a full-blown wrapper for all the browser API as defined by
9
12
HTML5.
@@ -70,7 +73,7 @@ _And load it in HTML!_
70
73
</html >
71
74
```
72
75
73
- See the examples/integrations/ directory for various ideas on how to quickly start
76
+ See the ` examples/integrations/ ` directory for various ideas on how to quickly start
74
77
development using opal-browser.
75
78
76
79
Features
@@ -109,6 +112,7 @@ Add an event to a given element:
109
112
``` ruby
110
113
$document .at_css(" button" ).on(:click ) do |e |
111
114
e.prevent # Prevent the default action (eg. form submission)
115
+ # You can also use `e.stop` to stop propagating the event to other handlers.
112
116
alert " Button clicked!"
113
117
end
114
118
```
@@ -201,6 +205,17 @@ History
201
205
-------
202
206
The HTML5 History API has been fully wrapped.
203
207
208
+ ``` ruby
209
+ current = $window .history.current
210
+ $window .history.replace(" ?get=params" )
211
+ $window .history.push(" ?get=params" )
212
+ $window .history.back
213
+
214
+ $window .on :popstate do |e |
215
+ p " User clicked a back button! He is now on #{ $window .history.current} "
216
+ end
217
+ ```
218
+
204
219
Storage
205
220
-------
206
221
The HTML5 Storage API has been wrapped and it exports a single Storage class
0 commit comments