Seperate demo into html, ts, and css

Closes #38

gulpfile.ts

@@ -1,31 +1,44 @@
 import { watch, src, dest, series } from 'gulp'
 import { createProject } from 'gulp-typescript'
-import { rollup, RollupOutput } from 'rollup'
+import { rollup } from 'rollup'
 type Stream=NodeJS.ReadWriteStream
 const tsProject = createProject('tsconfig.json')
-const sourceGlob = 'src/*'
+const sourceGlob = 'src/lib/*'
 export function buildEs (): Stream {
   return src(sourceGlob)
     .pipe(tsProject())
-    .pipe(dest('dist/es'))
+    .pipe(dest('dist/lib'))
 }
-async function useRollup (): Promise<RollupOutput> {
+async function rollupToUmd (): Promise<void> {
   const bundle = await rollup({
-    input: 'dist/es/pixelmanipulator.js'
+    input: 'dist/lib/pixelmanipulator.js'
   })
-  return await bundle.write({
+  await bundle.write({
     file: 'dist/umd/pixelmanipulator.js',
     format: 'umd',
     name: 'pixelmanipulator'
   })
+  return await bundle.close()
 }
 function postRollup (): Stream {
-  return src('dist/es/*.d.ts')
+  return src('dist/lib/*.d.ts')
     .pipe(dest('dist/umd'))
 }
-export const buildUmd = series(buildEs, useRollup, postRollup)
-export const build = buildUmd
+export const buildUmd = series(buildEs, rollupToUmd, postRollup)
+const demoSrcGlob = 'src/demo/*.ts'
+export function demoTsc (): Stream {
+  return src(demoSrcGlob)
+    .pipe(tsProject())
+    .pipe(dest('dist/demo'))
+}
+export const buildDemo = series(buildUmd, demoTsc)
+export const build = buildDemo
 export default build
 export function buildWatch (): void {
-  watch(sourceGlob, { ignoreInitial: false }, build)
+  watch([sourceGlob, demoSrcGlob], { ignoreInitial: false }, build)
+}
+export function buildWatchLib (): void {
+  watch(sourceGlob, { ignoreInitial: false }, buildUmd)
 }
+// This is called a "modeline". It's a (n)vi(m)|ex thing.
+// vi: tabstop=2 shiftwidth=2 expandtab

package.json

@@ -3,7 +3,8 @@
   "version": "4.5.2",
   "description": "Run any cellular automata on an html5 canvas.",
   "main": "dist/umd/pixelmanipulator.js",
-  "module": "dist/es/pixelmanipulator.js",
+  "module": "dist/lib/pixelmanipulator.js",
+  "types": "dist/lib/pixelmanipulator.d.js",
   "repository": "git@github.com:Lazerbeak12345/pixelmanipulator.git",
   "homepage": "https://lazerbeak12345.github.io/pixelmanipulator",
   "author": "Nathan Fritzler <nfblaster@live.com>",