Add debouncing and callback

Adding debouncing to code editor changes, will reducue the amount of errors in the console when the code is not executable.
will result in a bit of a delay for the user, but if we keep the debouncing time small it should just be an improvement

also add callback function that get's called when the user changed code, good for application tracking and potential other UI changes (a saved indicator, or similar)

Fix file changing

Fix the switching between files.
Now you can switch between them again :)

Fix first message

First message was not received correctly

sometimes (when the loading of the page is slower (in a real application) the message was sent to soon to the iframe, before it was ready.
fixed the way we listen to ready flag before sending the message.

Hot Fix: Updating of code viewer when files change

When the files array changes and you made manual edits in the code editor, the updates to the files would not be reflected.

Just a REPL

This is now just a REPL.

Add HTML editor tab

Add the ability to change the body of the result view.
I have tutorials where I just need to change the HTML and don't want to use js to do it.

Breaking changes:

The cssStyles object now has new properties. If you overwrite them please add these classed to it.

I eventually will use the default plus your overwritten classes, but not there yet.

editorActions: {
	      container: '',
	      tabItem: '',
	      link: ''
	    },

Add new controls

Add new controls for toggling the content
Add chapter overview to the top for switching between chapters.
Add new chapter progress bar at the bottom.

New css classes:

progressContainer: 'progress-container',
    toggleContentContainer: 'toggle-content-container',
    chaptersContainer: 'chapters-container',
    chapters: {
      current: 'current-chapter',
      chapters: 'chapters',
      chapter: 'chapters-chapter'
    },
    progress: {
      container: 'progress',
      chapter: 'progress-chapter'
    }

Improved Switcher

Improve the switcher between result and console

Added

active state for the switcher
view-only class when only the view screen is visible

• PR #23

Add Result/Console Switcher

Add Links to switch between Result and Console

That we have the ability to only show one of them, have something like a toolbar and the ability to style it.
Only show one of them. Can be extended in the future with a Data Viewer

PRs

• PR 22: Add Switcher

Console & View only

New component to show the output of the console and add the ability to hide the code editor

Console

The new Console component only displays the result of console.log statements. The idea is to have multiple views for code. The Result, the HTML (Inspector style), Data view, Console output.
This new component allows users to write console log statements to see results. In PR #20 I explain the reasoning behind this new component.

View Only chapters

You can now define viewOnly chapters by adding viewOnly option to a chapter. It will hide the editor but still execute code and shows the result.