diff --git a/CHANGELOG.md b/CHANGELOG.md index 36e53301..a756eb0e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,7 @@ Development ----------- +- Serve pyodide JS files locally [PR #186](https://github.com/berinhard/pyp5js/pull/186) +- Create sketch using p5.js from CDN [PR #191](https://github.com/berinhard/pyp5js/pull/191) - Add `keyIsDown` event to Transcrypt mode - [PR #187](https://github.com/berinhard/pyp5js/pull/187) - Fix bug with multiple events calls - PR #187 too diff --git a/MANIFEST.in b/MANIFEST.in index f3a10725..2bc9dde9 100644 --- a/MANIFEST.in +++ b/MANIFEST.in @@ -1,4 +1,3 @@ -recursive-include pyp5js/static * recursive-include pyp5js/templates * recursive-include pyp5js/http/templates * recursive-include pyp5js/http/static * diff --git a/docs/index.md b/docs/index.md index efb8815a..97eeec77 100644 --- a/docs/index.md +++ b/docs/index.md @@ -69,11 +69,7 @@ $ SKETCHBOOK_DIR='~/my-custom-sketchbook' pyp5js serve Now, have fun =] -## Internals details - -The web application is an interface to reduce barriers on playing around with -`pyp5js` to newcomers and people who don't feel confortable with the terminal -interface. But if you want to use the terminal, `pyp5js` also exposes a CLI. +## Command Line Interface So, to start a new sketch, you'll have to run: @@ -86,7 +82,7 @@ This command will create a directory with the following code structure using **p ``` ~ my_sketch/ ~ static / - - p5.js + ~ target / - index.html - my_sketch.py ``` @@ -132,6 +128,10 @@ as specifying the sketch directory. You can check them by running: ``` $ pyp5js --help + +# or also + +$ pyp5js new --help ``` diff --git a/pyp5js/cli.py b/pyp5js/cli.py index fc89898a..ae4647d8 100755 --- a/pyp5js/cli.py +++ b/pyp5js/cli.py @@ -25,12 +25,13 @@ def command_line_entrypoint(): @click.option('--monitor', '-m', is_flag=True, help='Starts the monitor command too') @click.option('--interpreter', '-i', type=click.Choice(AVAILABLE_INTERPRETERS), default=PYODIDE_INTERPRETER, help='Which python tool to use to run the sketch. (defaults to pyodide)') @click.option('--template', '-t', type=click.Path(exists=True), help='Specify a custom index.html template to use.') -def configure_new_sketch(sketch_name, monitor, interpreter, template): +@click.option('--cdn/--local', default=True) +def configure_new_sketch(sketch_name, monitor, interpreter, template, use_cdn): """ Create dir and configure boilerplate - Example:\n $ pyp5js new my_sketch -i pyodide """ - files = commands.new_sketch(sketch_name, interpreter, template_file=template) + files = commands.new_sketch(sketch_name, interpreter, template_file=template, use_cdn=use_cdn) cprint.ok(f"Your sketch was created!") diff --git a/pyp5js/commands.py b/pyp5js/commands.py index b7a5c0f2..03da992d 100644 --- a/pyp5js/commands.py +++ b/pyp5js/commands.py @@ -14,24 +14,35 @@ from pyp5js.config import PYODIDE_INTERPRETER -def new_sketch(sketch_name, interpreter=PYODIDE_INTERPRETER, template_file=""): +def new_sketch(sketch_name, interpreter=PYODIDE_INTERPRETER, template_file="", use_cdn=True): """ Creates a new sketch with the required assets and a index.html file, based on pyp5js's templates :param sketch_name: name for new sketch :param interpreter: interpreter to use (transcrypt or pyodide) :param template_file: use a custom template for index.html instead of default one + :param use_cdn: if false, the sketch will have copies of required static assets (p5.js and pyodide) :type sketch_name: string :return: file names :rtype: list of strings """ - sketch = Sketch(sketch_name, interpreter=interpreter, index_template=template_file) + cfg = { + "interpreter": interpreter, + "index_template": template_file, + } + if not use_cdn: + cfg["p5_js_url"] = "/static/p5.js" + # TODO: static version for pyodide too + + sketch = Sketch(sketch_name, **cfg) sketch.create_sketch_dir() templates_files = [ (sketch.config.get_base_sketch_template(), sketch.sketch_py), - (PYP5JS_FILES.p5js, sketch.p5js), ] + if not use_cdn: + templates_files.append((PYP5JS_FILES.p5js, sketch.p5js)) + # TODO: copy pyodide files to static dir too for src, dest in templates_files: shutil.copyfile(src, dest) diff --git a/pyp5js/config/fs.py b/pyp5js/config/fs.py index 8022c33c..563439d7 100644 --- a/pyp5js/config/fs.py +++ b/pyp5js/config/fs.py @@ -17,13 +17,9 @@ def __init__(self): def templates_dir(self): return self.install.joinpath('templates') - @property - def assets_dir(self): - return self.install.joinpath('assets') - @property def static_dir(self): - return self.assets_dir.joinpath('static') + return self.install.joinpath('http', 'static') @property def pytop5js(self): @@ -31,11 +27,11 @@ def pytop5js(self): @property def p5js(self): - return self.static_dir.joinpath('p5', 'p5.min.js') + return self.static_dir.joinpath('js', 'p5', 'p5.min.js') @property def p5_yml(self): - return self.assets_dir.joinpath('p5_reference.yml') + return self.static_dir.joinpath('p5_reference.yml') ##### TRANSCRYPT SPECIFICS diff --git a/pyp5js/config/sketch.py b/pyp5js/config/sketch.py index 648308f5..e1bccc69 100644 --- a/pyp5js/config/sketch.py +++ b/pyp5js/config/sketch.py @@ -5,6 +5,7 @@ TRANSCRYPT_INTERPRETER = 'transcrypt' PYODIDE_INTERPRETER = 'pyodide' +P5_JS_CDN = 'https://cdn.jsdelivr.net/npm/p5@1.4.0/lib/p5.min.js' class SketchConfig: @@ -14,9 +15,10 @@ def from_json(cls, json_file_path): config_data = json.load(fd) return cls(**config_data) - def __init__(self, interpreter, index_template=""): + def __init__(self, interpreter, **kwargs): self.interpreter = interpreter - self.index_template = index_template # must be a string + self.index_template = kwargs.get("index_template", "") + self.p5_js_url = kwargs.get("p5_js_url", P5_JS_CDN) @property def index_template_path(self): @@ -29,7 +31,9 @@ def write(self, fname): with open(fname, "w") as fd: data = { "interpreter": self.interpreter, - "index_template": index_template + "index_template": index_template, + # TODO: also store pyodide_js_url + "p5_js_url": self.p5_js_url, } json.dump(data, fd) diff --git a/pyp5js/assets/static/p5/addons/p5.sound.js b/pyp5js/http/static/js/p5/addons/p5.sound.js similarity index 100% rename from pyp5js/assets/static/p5/addons/p5.sound.js rename to pyp5js/http/static/js/p5/addons/p5.sound.js diff --git a/pyp5js/assets/static/p5/addons/p5.sound.min.js b/pyp5js/http/static/js/p5/addons/p5.sound.min.js similarity index 100% rename from pyp5js/assets/static/p5/addons/p5.sound.min.js rename to pyp5js/http/static/js/p5/addons/p5.sound.min.js diff --git a/pyp5js/assets/static/p5/p5.js b/pyp5js/http/static/js/p5/p5.js similarity index 100% rename from pyp5js/assets/static/p5/p5.js rename to pyp5js/http/static/js/p5/p5.js diff --git a/pyp5js/assets/static/p5/p5.min.js b/pyp5js/http/static/js/p5/p5.min.js similarity index 100% rename from pyp5js/assets/static/p5/p5.min.js rename to pyp5js/http/static/js/p5/p5.min.js diff --git a/pyp5js/assets/p5_reference.yml b/pyp5js/http/static/p5_reference.yml similarity index 100% rename from pyp5js/assets/p5_reference.yml rename to pyp5js/http/static/p5_reference.yml diff --git a/pyp5js/http/templates/view_sketch.html b/pyp5js/http/templates/view_sketch.html index 89153d73..a054e89b 100644 --- a/pyp5js/http/templates/view_sketch.html +++ b/pyp5js/http/templates/view_sketch.html @@ -67,7 +67,7 @@ {% block content %}
- +