var mercury = require("mercury")

var frameList = require("./views/frame-list")
var frameEditor = require("./views/frame-editor")
var frameData = require("./data/frames")

// Load the data
var initialFrameData = frameData.load()
var frames = mercury.hash(initialFrameData)
// When the data changes, save it
frames(frameData.save)

// Create the default view using the frame set
var frameListEditor = frameList(frames)

var state = mercury.hash({
    frames: frames,
    editor: frameList
})

// Show the frame editor
frameListEditor.onSelectFrame(function (frameId) {
    var editor = frameEditor(frames[frameId])
    
    editor.onExit(function () {
        // Restore the frame list
        state.editor.set(frameList)
    })
})

function render(state) {
    // This is a mercury partial rendered with editor.state instead 
    // of globalSoup.state
    // The immutable internal event list is also passed in
    // Event listeners are obviously not serializable, but 
    // they can expose their state (listener set)
    return h(state.editor.partial())
}

// setup the loop and go.
mercury.app(document.body, render, state)

var mercury = require("mercury")

var frameList = require("./views/frame-list")
var frameEditor = require("./views/frame-editor")
var frameData = require("./data/frames")

// Load the data
var initialFrameData = frameData.load()

// Create the default view using the frame set
var frameListEditor = frameList(frames)

var state = mercury.hash({
    frames: mercury.hash(initialFrameData),
    editor: frameList
})

// When the data changes, save it
state.frames(frameData.save)

// Show the frame editor
frameListEditor.onSelectFrame(function (frameId) {
    var editor = frameEditor(state.frames[frameId])
    
    editor.onExit(function () {
        // Restore the frame list
        state.editor.set(frameList)
    })
})

function render(state) {
    // This is a mercury partial rendered with editor.state instead 
    // of globalSoup.state
    // The immutable internal event list is also passed in
    // Event listeners are obviously not serializable, but 
    // they can expose their state (listener set)
    return h(state.editor.partial())
}

// setup the loop and go.
mercury.app(document.body, render, state)

Consolidate the two pieces of state into a single atom
Consolidate the two pieces of state into a single atom

This helps readability of the code by knowing there is only one
  variable that contains the state and only one variable that
  can be mutated.

This means if you refactor the code into multiple files you
  only have to pass this one variable into the functions
  from the other file.
