Skip to content

Instantly share code, notes, and snippets.

@soapdog

soapdog/test.js

Created January 15, 2018 13:48
Show Gist options
  • Save soapdog/46416dcb3694075ff1b4224cd9d8a446 to your computer and use it in GitHub Desktop.
Save soapdog/46416dcb3694075ff1b4224cd9d8a446 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. soapdog created this gist Jan 15, 2018.
    54 changes: 54 additions & 0 deletions test.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,54 @@
    var h = require('mutant/html-element')
    var Struct = require('mutant/struct')
    var send = require('mutant/send')
    var computed = require('mutant/computed')
    var when = require('mutant/when')

    var state = Struct({
    text: 'Test',
    color: 'red',
    value: 0
    })

    var isBlue = computed([state.color], color => color === 'blue')

    var element = h('div.cool', {
    classList: ['cool', state.text],
    style: {
    'background-color': state.color
    }
    }, [
    h('div', [
    state.text, ' ', state.value, ' ', h('strong', 'test')
    ]),
    h('div', [
    when(isBlue,
    h('button', {
    'ev-click': send(state.color.set, 'red')
    }, 'Change color to red'),
    h('button', {
    'ev-click': send(state.color.set, 'blue')
    }, 'Change color to blue')
    )

    ])
    ])

    setTimeout(function () {
    state.text.set('Another value')
    }, 5000)

    setInterval(function () {
    state.value.set(state.value() + 1)
    }, 1000)

    setInterval(function () {
    // bulk update state
    state.set({
    text: 'Retrieved from server (not really)',
    color: '#FFEECC',
    value: 1337
    })
    }, 10000)

    document.body.appendChild(element)