Basic Getting started

Running JS files where CORS is enabled

js-do https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js

Now the cdn is returning the mime type as follows:

Content-Type: "application/javascript; charset=utf-8"

but places like GitHub are not cdns, so you need to specify that the mime type needs to be detected

js-do/automime https://raw.githubusercontent.com/oakmac/chessboardjs/master/src/chessboard.js

Setting CSS from a remote file

css-do/automime https://raw.githubusercontent.com/oakmac/chessboardjs/master/src/chessboard.css

Like JS, if the remote location is not setting the mime type, you need to specify /automime

Evaluating JS in the console

js-do {var foo = 'test'}

This places variables and functions in the global JS environment e.g. window.foo now has a value of 'test'. It is in the global scope because it creates a script tag in the DOM and then uses that to evaluate. If you want synchronous operation, you can try js-do/local. I've used that to solve an error that said I can't call an awaiter function from a reb.Promise().

What is reb and short cut functions?

reb is a JS collection that holds a number of JS functions that deal with the transfer of JS values to Rebol. Some of the one letter functions eg. __reb.I__functions deallocate references to the memory for the JS values once it has been sent to Rebol. You can see the definitions here though this line number may vary.

Let's send an integer value to Rebol, and print it off

let ivalue = reb.Integer(10) // so we need to make sure that the value in an unambiguous integer
reb.Elide("print [", ivalue, "]") // we create the rebol expression and evaluate it.  10 gets printed

but ivalue is still allocated on the JS side. If we don't need it now, we can immediately release it

reb.Release(ivalue)

but you can also do this in one step with some shortcut functions

let ivalue = reb.Integer(10)
reb.Elide("print [", reb.R(ivalue), "]")

which releases the ivalue as soon as it is used.

There are also reb.T (utf8 string), reb.I (64 bit integer), reb.L (logical value), and reb.V

Sending a JS value back to Rebol

js-do https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js // cookie handling code

js-do {reb.Elide("user:", reb.T(Cookies.get('name')))}

Note that js-do can declare global JS variables.

The JS function reb.T or reb.Text evaluates its contents (in this case a function to grab a cookie named 'name' from the environment ), and this value is used by the JS function reb.Elide to create a rebol value named user with the JS value returned by reb.T

So, if the value of the cookie named name is "Graham", then the rebol variable user now has "Graham" as its value.

js-eval - alternative for getting JS expression values into Rebol

result: js-eval {1 + 2}
>> 3

result: js-eval {"abc" + "def"}
>> "abcdef"

Js-eval* for global evaluation

 >> js-eval* {var x = 1}`

 >> js-eval*/value {x}
 == 1

 Use js-eval*/local for local evaluation

 Use js-eval*/value to return a value

 >> result: js-eval*/value {"abc" + 'cde'}
 == "abccde"

Getting a DIV into Rebol

result: js-eval {document.getElementById("replpad").outerHTML}

Getting a Rebol value into JS

foo: js-native [t [text!]]{console.log(reb.Spell(reb.ArgR('t')))}

text t is picked up as an argument by ArgR, sent to Spell and then printed to the JS console

reb.Spell() , where reb.Spell(nnnnn), takes the memory address nnnnn of a Rebol string, and passes that value (currently a string) to JS.

How to modify the DOM

replpad-write/html {<div id="test">Hello</div>}

prints Hello to the DOM.

js-do {document.getElementById('test').innerHTML = "Goodbye"}

and then that replaces Hello with Goodbye ‌

Find the location of executing script

 first split-path js-eval "window.location.href"