scittle 2022-10-17 | Slack Archive

Scittle is working in Photoshop!


<html>
<head>
  <script src="scittle.js"></script>    
</head>

<body>
  <sp-button id="mybtn">Launch Alert</sp-button>  

  <script type="application/x-scittle">
 
     (def ps (js/require "photoshop"))
    
     (def core (.-core ps))

     (let [el (js/document.getElementById "mybtn")]
       (.addEventListener el "click"
         (fn [e]
           (. core (showAlert "Hello Scittle CLJS!")))))
  
  </script>

</body>
</html>

This is run in the context of a UXP plugin, which is basically a mini web-page, which has access to Photoshop api via “Photoshop” require. Panel has a button, which pops alert. Im not sure if Scittle is usable in a standalone user script context. Haven’t tried Cherry yet, but it might be more suitable for that. Next steps: Try to get https://github.com/babashka/scittle/blob/main/doc/nrepl, and drive actions from my IDE repl. Photoshop says their Chromium runtime supports websockets.

💯 2

🤯 2

borkdude16:10:33

Hell yeah :)

borkdude16:10:39

How does this work, photoshop loads html pages?

borkdude16:10:53

This is exciting :) Do you have a screenshot of photoshop itself?

chromalchemy16:10:21

chromalchemy16:10:01

Their newer “UXP” api allows • running standalone js files ◦ (nice fit for squint/cherry). • running a plugin ◦ which has several flavors, ▪︎ basic plugin • a html page context running in a modified Chromium V8. ◦ (nice fit for Scittle) ▪︎ node-style, react.js plugin • (not sure if this surfaces enough to run nbb) ◦ They say this can just run actions (headless, no UI), or use the HTML page context for UI and state management.

borkdude16:10:06

What does it mean to have "standalone js files"?

borkdude16:10:54

you can't use JS code in the script tag?

chromalchemy16:10:46

If I save the Squint JS output from this as a .psjs file.

(ns test)

(def ps (require '"photoshop"))

(. js/ps.core (showAlert "Hello"))

I can just open the script file with Photoshop app (double click), and the action will run in Photoshop. No “plugin”, no “panel” in UI, no retained state, etc.

chromalchemy16:10:53

JS code can be run in the script tag in the plugin/html context.

borkdude16:10:19

Does the photoshop API give you access to the filesystem?

borkdude16:10:32

We could make a SCI runtime that reads a .cljs file from a config directory or so

chromalchemy16:10:14

> Does the photoshop API give you access to the filesystem? Yes, but I think it is an abstracted wrapper, for security and cross-platform reasons. https://developer.adobe.com/photoshop/uxp/guides/uxp_guide/uxp-misc/file-access/ https://developer.adobe.com/photoshop/uxp/uxp/reference-js/Modules/uxp/Persistent%20File%20Storage/

borkdude16:10:42

Then the single file approach could also work with SCI

borkdude16:10:36

similar to what we've done with #C03DPCLCV9N which is a VSCode extension which loads .cljs files from user directories

chromalchemy16:10:25

Cool. Joyride is definitely prior art. It might even be cool to put a code editor it a panel in the Photoshop app for a built-in repl. Regarding SCI, I think I was coming to that realization after contemplating if Scittle could be used for the standalone file script option. I would like to pursue the custom SCI runtime. Ultimately I think I would like to have a stateful user-space for driving the program, so the single-file thing might be more sideline? But single files would definitely be simple to share/distribute! I would think they should be able to call each other too..

chromalchemy16:10:46

I believe there is another level of CLI based tooling that I need to explore. I will see if nbb will run directly, maybe with different plugin template? They say their stack can use NPM, file access, and such. So that’s beyond the regular browser context…

chromalchemy16:10:28

Photoshop has a lot of powerful functionality, but a somewhat clunky and inconsistent UI. I am hoping this open-ended Clojure scripting option can make it more fun and productive to use. Forging tighter feedback loops between user intent and visual results on the canvas! Potentially break it out of it’s Adobe monolith mode, and better integrate it into external (mediated?) workflows. And maybe even bring in some of Clojure’s immutability and advanced state management in to Photoshop’s mostly mutable layer stack.

👍 1

chromalchemy17:10:45

So ultimately I want to invoke cljs->ps/api code from within photoshop (like internal al’acarte scripts,plugin panel UI, and application context hotkeys).. ..and outside of it (external clojure/bb process that has wider scope and more powerful runtime)

2022-10-17

Channels