# SCI script tag

## What is this?

This project exposes the Small Clojure Interpreter in the browser in such a way that you can use it with the `script` tag.

## Project status

This project is currently experimental and breaking changes are bound to happen. Feedback is welcome on Github.

You can get a copy of `sci-script-tag.js` here. If you want a pinned version of `sci-script-tag.js`, your best bet is to download your own copy and host it yourself.

## Usage

Include `sci-script-tag.js` and write a `script` tag where `type` is set to `application/x-sci`. Use `:export` to make the function available in the JavaScript environment. The name is processed using `munge`.

          <head>
      <script src="https://borkdude.github.io/sci-script-tag/js/sci-script-tag.js" type="application/javascript"></script>

      <script type="application/x-sci">
        (defn ^:export my-alert []
          (js/alert "You clicked!"))
      </script>

    </head>

    <body>
      <button onclick="my_alert()">
        Click me!
      </button>
    </body>

## Source from file

When you have a file on your server, say `cljs/script.cljs`, you can load it using the `src` attribute:

    <script src="cljs/script.cljs" type="application/x-sci"></script>

## Reagent plugin

To enable reagent, in addition to `sci-script-tag.js`, you need to include `sci-script-tag-plugin-reagent.js`.

    <script src="https://borkdude.github.io/sci-script-tag/js/sci-script-tag-plugin-reagent.js" type="application/javascript"></script>
    <script type="application/x-sci">
      (require '[reagent.core :as r]
               '[reagent.dom :as rdom])

      (def state (r/atom {:clicks 0}))

      (defn my-component []
        [:div
          [:p "Clicks: " (:clicks @state)]
          [:p [:button {:on-click #(swap! state update :clicks inc)}
           "Click me!"]]])

      (rdom/render [my-component] (.getElementById js/document "app"))
    </script>

Also see a tic-tac-toe demo.