plainCanvas

Adobe Illustrator (CC 2014-) add-on with following functions.
(Japanese README is here)

loads and executes a script file written for paper.js.
(at the initial state, you can use a simple drawing tool.)
exports the image created on the panel onto the artboard.
imports selected paths on the artboard onto the panel.

Installation

Because of the character of this add-on that loads external script files, it is released with an assumtion of doing debugs. Installation steps are as follows.

Setting the debug mode flag refer to Adobe's document - Debugging Unsigned Extensions. (It says "CSXS.10", but the number varies depending on the Illustrator's version. ex."CSXS.11" for Ai 2024(28.2))
Put the folder "com.shspage.csxs.plaincanvas" in the right folder refer to Adobe's document - Extension Folders.
Launch Illustrator and navigate Window -> Extensions fo find plainCanvas.

buttons on the panel

in : imports selected paths on the artboard onto the canvas
out : exports the image created on the canvas onto the artboard
run : executes a script that has an executable function
opt : shows/hides the form for optional values
< : undo
> : redo
CL : clears the canvas
DB : opens the debug tool with a default browser.
RL : reloads the extention panel
load : opens a dialog to select a script file to lead

loading a script file

Drag and drop a script file you want to load onto the panel.
You can also use load button to select a script file.
Drawing on the panel will be cleared after loading is complete.

script files that can be loaded

There're some sample scripts in "scripts" folder.
Write in JavaScript (not paperscript). For details, see "Using JavaScript Directly" in http://paperjs.org.
ex: new Path() -> new paper.Path() // or use "with(paper){" statement
ex: point1 + point2 -> point1.add(point2)
ex: function onMouseDown(event) -> tool.onMouseDown = function(event)
Set the character encoding to UTF-8.
You can use the UIs for optional values with simple methods. see "js/optionManager.js".
You can set a drawn object as a target for undo/redo by calling the method like this.

undoManager.keep(object);

Note that undoed objects are just hidden, and still exists in the current paper.project.

colors

Since html5 canvas uses RGB color, imported CMYK and GRAY colors may look different from they look on the artboard.
If ALWAYS_EXPORT_RGB (js/main.js) is set false, the original CMYK colors are kept in memory and are applied when they are exported. (When DefaultColorSpace of the artboard is CMYK.)
If ALWAYS_EXPORT_RGB is true, GRAY colors are exported in RGB.
Gradient color and spot color are not supported for now.

exports to an artboard

Following attributes of paper.Path instance on the canvas are exported.
segments, strokeWidth, strokeColor, fillColor, opacity

imports from an artboard

Following attributes of selected PathItems are imported.
pathPoints, strokeWidth, strokeColor, fillColor.
Grouped paths and compoundpaths are imported in released condition.

Loading images

You can load images by dragging and dropping them onto the panel or by using the load button. Supported image formats are jpeg and png.
You can hide the image by clicking [hide image] displayed at the top right of the panel after loading the image. Click again to display.
The loaded image is stored in paper.project.activeLayer.data.raster and can be used in scripts.
The loaded image is discarded when loading a script file or clearing the screen using the CL/RL buttons.

changelog

v.1.2.2

Supports image loading.

v.1.2.1

Added script loading error alert and run error alert.

v.1.2.0

updated libraries

v.1.1.8

Added "run" button. Added sample script for "run" button.
Fix: Even if you load a script file with the same name as one currently loaded, the changes will take effect.

v.1.1.7

The "load" button is back.

v.1.1.6

Set the upper limit of supported versions to 99.9 in manifest.xml.

v.1.1.4

Set the upper limit of supported versions to 24.9 in manifest.xml.

v.1.1.3

Fixed grayColor import/export issue.

v.1.1.2

Removed the "load" button. A drop of a script file is always accepted.
Simplified optionManager methods. Updated the contents of the sample script accordingly.
Expanded the maximum panel size to 2000 x 2000 pixels.

v.1.1.1

Improved to invalidate drop to panel except when loading.

v.1.1.0

Improved to prevent the text on the panel from being selected by dragging.
The script file is loaded by drag-and-drop to the panel.

TODO / known issues

TODO: Review the external script file reading method.
When exporting, there may be cases where the context of things captured from the artboard and those drawn on the canvas are incorrect.
TODO: use importSVG, exportSVG to exchange data with artboard ?

License

When you distribute a modified version, make sure changing the bundle ID. It is represented as "com.shspage.csxs.plaincanvas" in CSXS/manifest.xml and .debug.
Copyright (c) 2015 Hiroyuki Sato. All rights reserved.
http://shspage.com/
This software is distributed under the MIT License.
See the LICENSE.txt for details.
This software uses the following libraries that may have licenses differing from that of the software itself. You can find the libraries and their respective licenses below.
Paper.js v0.12.17 - The Swiss Army Knife of Vector Graphics Scripting.
http://paperjs.org/
Copyright (c) 2011 - 2020, Jürg Lehni & Jonathan Puckey http://juerglehni.com/ & https://puckey.studio/ All rights reserved.

shspage/plainCanvas