glen/polytree
1
0
Fork 0
Code Issues 5 Pull Requests Projects Releases Wiki Activity

feat: Minimal working p5/CoffeeScript setup

Browse Source
This commit is contained in:
Glen Whitney 2021-04-18 11:40:29 -07:00
parent d94c749830
commit 63dfa62ffd
6 changed files with 109248 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.gitignore vendored
View File

@ -49,4 +49,6 @@ flycheck_*.el
# network security # network security
/network-security.data /network-security.data
# Javascript from CoffeeScript files in main directory
/*.js

25
README.md
View File

@ -4,4 +4,27 @@ Starting from a central polygon, one can imagine a tree _P_ of polygons created
## Implementation ## Implementation
As a first pass, PolyTree will consist of a Processing sketch written in CoffeeScript and intended to be served with HarpJS. As a first pass, PolyTree will consist of a Processing sketch written in CoffeeScript along with a minimal framework for deploying it (a bit of HTML and JavaScript).
## Running
Although you can use any server and CoffeeScript compiler you like, one path of low resistance for running PolyTree is to use Node.js. Hence, the following procedure assumes you have the node package manager (npm) already installed.
Make sure you have http-server and CoffeeScript installed globally (note you may need to run the following with sudo depending on your setup):
```bash
npm install -g http-server coffeescript
```
Clone this repository and enter its top-level directory:
```
git clone https://code.studioinfinity.org/glen/polytree.git
cd polytree
```
Set coffee to compile the main script (the "--watch" flag is only necessary if you may be editing the script and would like the files being served to update automatically), and start serving the files:
```
coffee --watch -c polytree.coffee &
http-server
```
Now visit http://localhost:8080 in your browser.

5
index.html Normal file
View File

@ -0,0 +1,5 @@
<html>
<head>
<script type="module" src="polytree.js"></script></head>
<body>
<h1>PolyTree</h1></body></html>

17
lib/loadp5.js Normal file
View File

@ -0,0 +1,17 @@
export var p5;
export var p5loaded = new Promise(async function(resolve, reject) {
var success = false;
try {
p5 = await import('https://cdn.jsdelivr.net/npm/p5/lib/p5.js');
console.log('CDN import of p5 OK');
success = true; }
catch(err) {
console.log('CDN import of p5 failed: ' + JSON.stringify(err));
try {
p5 = await import('./p5.js');
success = true; }
catch {}
console.log('Used local fallback for p5'); }
p5 = window.p5;
delete window.p5;
if (success) { resolve(); } else { reject(); }});

109185
lib/p5.js Normal file
View File

File diff suppressed because one or more lines are too long

15
polytree.coffee Normal file
View File

@ -0,0 +1,15 @@
# PolyTree, intended to be loaded as a module
import {p5, p5loaded} from './lib/loadp5.js'
sketch = (p) ->
p.setup = =>
p.createCanvas window.innerWidth, 575, p.WEBGL
p.background 224
p.ellipse 0, 0, 100, 50
p.ellipse p.width/4, -p.height/4, 50, 100
show = () ->
P5 = new p5 sketch
p5loaded.then show