p5.popup

0.1.0 • Public • Published

p5.popup.js

p5.js simple popup library used for displaying instructions for sketches

auto update docs version, minify and publish to npm PythonLicense: MIT

by oran collins
github.com/wisehackermonkey
oranbusiness@gmail.com
20200629

Live Example

P5.js live editor

P5.js live editable version

CDN Example

CDN links

How to use CDN links

Add one of the following two CDN options to your p5.js sketches html file

Replace X.X.X with the latest version number

<!DOCTYPE html>
<html lang="en">
  <head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/X.XX.X/p5.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/X.XX.X/addons/p5.sound.min.js"></script> 
    <script src="https://cdn.jsdelivr.net/npm/p5.popup@0.0.9/p5.popup.min.js"></script> 
 
    OR
 
    <script src="https://unpkg.com/p5.popup@0.0.9/p5.popup.min.js"></script> 
      
    <link rel="stylesheet" type="text/css" href="style.css">
    <meta charset="utf-8" />
  </head>
  <body>
    <script src="sketch.js"></script>
  </body>
</html>

Brain storm

inital idea

p5.js popup for instructions on how to play game, mobile and desktop  friendly

add: one liner

example

instructions("arrows to move, goal is to get the blocks")
 
//have templates for common input types
instructions([ARROWS,MOUSE],"e key breaks the walls")

example v2

popup("arrows to move, goal is to get the blocks", <show for n seconds>)
 
//have templates for common input types
popup([ARROWS,MOUSE],"e key breaks the walls", <show for n seconds>)

publish npm package

npm version patch
npm publish

how to publish local tag

Sharing Tags

git push origin v0.0.4

TODO

  • github action minifiy
  • auto lint
  • todo add popupMode(BOTTOM)

Links

Package Sidebar

Install

npm i p5.popup

Weekly Downloads

3

Version

0.1.0

License

MIT

Unpacked Size

148 kB

Total Files

16

Last publish

Collaborators

  • wisemonkey