reblocks-parenscript

2024-10-12

An utility to define JavaScript dependencies for Weblocks widgets using Parenscript.

Upstream URL

github.com/40ants/reblocks-parenscript

Author

Alexander Artemenko <svetlyak.40wt@gmail.com>

License

Unlicense
README

reblocks-parenscript - An utility to define JavaScript dependencies for Weblocks widgets using Parenscript.

REBLOCKS-PARENSCRIPT ASDF System Details

Installation

You can install this library from Quicklisp, but you want to receive updates quickly, then install it from Ultralisp.org:

(ql-dist:install-dist "http://dist.ultralisp.org/"
                      :prompt nil)
(ql:quickload :reblocks-parenscript)

Usage

This library should be used to define JavaScript dependencies for Reblocks widgets.

API

REBLOCKS-PARENSCRIPT

package reblocks-parenscript

Classes

PARENSCRIPT-DEPENDENCY

class reblocks-parenscript:parenscript-dependency (local-dependency)

Keeps JavaScript code, created using make-dependency macro or make-dependency* function.

Readers

reader reblocks-parenscript:js-code (parenscript-dependency) (:js)

Functions

function reblocks-parenscript:make-dependency* parenscript-code

This function works similarly like make-dependency macro but accepts Parenscript code as a list. They are related to each other like parenscript:ps macro and parenscript:ps* function.

Use a function version when you want to build a JavaScript code from parts and embed some value into it.

Usually it looks like this:

CL-USER> (let ((widget-id "foo-bar"))
           (reblocks-parenscript:make-dependency*
            `(defun show-alert ()
               (alert (+ "Hello from widget with id = " ,widget-id)))))
#<REBLOCKS-PARENSCRIPT:PARENSCRIPT-DEPENDENCY >

This will generate following JavaScript code:

CL-USER> (format t "~A~%"
                 (reblocks-parenscript:js-code *))
function showAlert() {
    __PS_MV_REG = [];
    return alert('Hello from widget with id = ' + 'foo-bar');
};

Macros

macro reblocks-parenscript:make-dependency &body parenscript-code

This macro creates an object of class parenscript-dependency transformin the BODY into JavaScript Code. It interpreters whole body as a Parenscript code.

Here is a usage example.

CL-USER> (reblocks-parenscript:make-dependency
           (defun show-alert ()
             (ps:chain console (log "Showing alert"))
             (alert "Hello from Lisp!"))

           (set-interval show-alert 3000))
#<REBLOCKS-PARENSCRIPT:PARENSCRIPT-DEPENDENCY >

This dependency will have this JavaScript code:

CL-USER> (format t "~A~%"
                 (reblocks-parenscript:js-code *))
function showAlert() {
    console.log('Showing alert');
    __PS_MV_REG = [];
    return alert('Hello from Lisp!');
};
setInterval(showAlert, 3000);

You can use this dependency in a method of reblocks/dependencies:get-dependencies generic-function like this:

(defmethod reblocks/dependencies:get-dependencies ((widget example))
  (list*
   (reblocks-parenscript:make-dependency
     (defun show-alert ()
       (ps:chain console (log "Showing alert"))
       (alert "Hello from Lisp!"))

     (set-interval show-alert 3000))
   (call-next-method)))

macro reblocks-parenscript:make-js-handler &key lisp-code js-code

Creates a Reblocks action and returns JavaScript code, which can be used as onChange, onClick, etc. handler.

  • Argument LISP-CODE should be a list of conses:

First list item should be action's lambda list. Other list items are wrapped into implicit progn.

  • Argument JS-CODE also should be a list of conses:

Parenscript code, returning an object. This object will be passed to the Lisp part of the handler as keyword arguments.

This macro creates a code which will return a string. The result is suitable to be used inline as value for HTML attributes like onChange, onClick, etc.

Handler must be build from two parts JS and Lisp.

JavaScript part should be written in Parenscript and return an objects. This object will be passed to the backend as keyword arguments for the action, defined by Lisp part of the handler.

The code from JS-CODE argument will be wrapped into a function which is called immediately with implicit arguments.

Here is a real world example. This code processes updates of a text in the HTML input. This way you can make a suggest or on fly value validation:

(:input :value url
        :name "url"
        :type "text"
        :onchange
        (reblocks-parenscript:make-js-handler
         :lisp-code ((&key url)
                     (update-url (branches widget)
                                 url))
         :js-code ((event)
                   ;; This will pass new URL value
                   ;; to the backend:
                   (parenscript:create
                    :url (@ event target value)))))

[generated by 40ANTS-DOC]

Dependencies (11)

  • 40ants-asdf-system
  • alexandria
  • bordeaux-threads
  • ci
  • doc
  • docs-builder
  • named-readtables
  • parenscript
  • pythonic-string-reader
  • reblocks
  • rove
  • GitHub
  • Quicklisp