File tree Expand file tree Collapse file tree 1 file changed +52
-0
lines changed Expand file tree Collapse file tree 1 file changed +52
-0
lines changed Original file line number Diff line number Diff line change @@ -111,6 +111,58 @@ def drawCuteSmiley(canvas: html.Canvas) = {
111
111
}
112
112
```
113
113
114
+ ### Using ` Fetch ` to make API calls in the browser
115
+
116
+ ``` scala mdoc:js
117
+ def fetchBoredApi (element : html.Pre ) = {
118
+ val url =
119
+ " https://www.boredapi.com/api/activity"
120
+
121
+ val responseText = for {
122
+ response <- dom.fetch(url)
123
+ text <- response.text()
124
+ } yield {
125
+ text
126
+ }
127
+
128
+ for (text <- responseText)
129
+ pre.textContent = text
130
+ }
131
+ ```
132
+
133
+ ### Using Websockets
134
+
135
+ ``` scala mdoc:js
136
+ def echoWebSocket (input : html.Input , pre : html.Pre ) = {
137
+ val echo = " wss://echo.websocket.org"
138
+ val socket = new dom.WebSocket (echo)
139
+
140
+ socket.onmessage = {
141
+ (e : dom.MessageEvent ) =>
142
+ pre.textContent +=
143
+ e.data.toString
144
+ }
145
+
146
+ socket.onopen = { (e : dom.Event ) =>
147
+ in.onkeyup = { (e : dom.Event ) =>
148
+ socket.send(input.value)
149
+ }
150
+ }
151
+ }
152
+ ```
153
+
154
+ ### Styling an HTML element
155
+
156
+ ``` scala mdoc:js
157
+ def changeColor (div : html.Div ) = {
158
+ val colors = Seq (" red" , " green" , " blue" )
159
+
160
+ val index = util.Random .nextInt(colors.length)
161
+
162
+ div.style.color = colors(index)
163
+ }
164
+ ```
165
+
114
166
## Contributing
115
167
116
168
The DOM API is always evolving, and ` scala-js-dom ` tries to provide a thin-but-idiomatic Scala interface to modern browser APIs, without breaking the spec.
You can’t perform that action at this time.
0 commit comments