# Ideas

- Programming Experience of Lively4? 
- Lively4 as an alternative evolution brannch to Lively Kernel, Lively Webwerkstatt, and Lively Web
- Lively Next as Sister Project to Lively4 (different goals lead to different architecture)

## Goals in Lively4:
- Making the Web-technologies (HTML DOM, JavaScript, CSS the material to work with and build uppon) vs. comming up with an alternative better way the web should have been build
- Taking the programming experience of Lively Kernel and applying them to general Web development


## What is the "Lively Kernel PX"?

- Halo: point, drag, drop, copy and inspect objects
  - Selection
  - Hand

- Some form of "live programming" experience

## Material

- Source Code 
  - HTML, JavaScript, CSS
  - Markdown
- HTML Elements
  - drag and drop
  - copy and paste
- (Pen-based Note taking)


## Stories

- Bootstrapping a Self-supporting System (again)
  - from File Editor to container to ...
- Whats is the model: html elements vs. objects


# Tools we build and that form the Lively4 PX

- Lively Container
- Lively Sync (easier github workflow)
- Workspace

- Github Issues  
- Hashtag Navigation

# Whats Lively4 vs other Lively Kernel versions?

- New project
- Persistent local "lively content" for each Web-page
- Can be loaded into normal "web-sites" #Lively4Chrome

# Research

- Bouncing ball and soap bubbles

# Implementation Technologies


## Special Lively4 API

- livelyMigrate
- livelyExample
- livelyPrepareSave

## What we work with:

- Web-compnents (templates and module for defining own "tags")
- Next Gen JavaScript (e.g. Classes, Promises, Async, Modules) using transpilation as needed
- Service workerthat maps Cloud Storage / Web services into one file-based fetch API
- (optional) custom server for better github access


# UX

- Halo
- Graffle Mode
- Context menu
- Code as UI

# Open Problem

- Module system and packages for client side JavaScript
  - What are modules and how are they loaded at runtime?
  - What is the granularity of modules? How are smaller modules combined into bigger ones?
  - How are modules shipped? Developed? Developed at run-time?
    - Linking files at runtime? 
    - Copying files into repositpry?
    - Specifying dependencies? In development? For deployment?
  - Lively Next does ship its own packaging system....
- Migrating objects?
- Explicit configuration vs. lookup of components (templates)

# Other Tools

- Lively Debugger
- AST Explorer
- Continous Editor
- Test Runner
- Inspector
- Search Widget
- Services
- Drawboard
- Filesystems (Mount Points)

# Widgets

- Window
- Table
- Progress
- Resizer
- Separator
- Connector
- Menu
- Pdf


# Metaphors

- glue, scissors, felt pens 







