    var _sc = { vars: {} }

    _sc._sc_valueListener = function _sc_valueListener(e) {
        e.preventDefault()
        var strResult = e.target.value
        if (e.target.type === 'checkbox') {
            strResult = e.target.checked
        }
        _sc[e.target.getAttribute('sc-value')] = strResult
        e.target.value = strResult
        _sc._digest()
    }

    _sc.spawn = function spawn(u,v) {
        eval('_sc.vars.'+u+' = v')
        eval('Object.defineProperties(_sc, {"' + u + '": { set: function(n) { this.vars.' + u + ' = n; _sc._digest(); }, get: function() { return this.vars.' + u + '; } } })')
    }

    _sc._digest = function _digest() {
        var listIf = document.querySelectorAll('[sc-if]')
        var listMarkUp = document.querySelectorAll('sc-markup[name]')
        var listValue = document.querySelectorAll('input[sc-value], textarea[sc-value]')
        var listSelectValue = document.querySelectorAll('select[sc-value]')

        for (var key in _sc.vars) {
            eval('var ' + key + '= _sc.vars.' + key )
        }
        listIf.forEach(function (item) {
            try {
                if (eval(item.getAttribute('sc-if'))) {
                    item.style.display = ''
                } else {
                    item.style.display = 'none'
                }
            } catch (e) {
                console.log(e);
            }
        })
        listMarkUp.forEach(function (item) {
            if (eval('typeof ' + item.getAttribute('name') + '!= "undefined"')) {
                eval('item.innerHTML =' + item.getAttribute('name'))
            } else {
                item.innerHTML = ''
            }
        })
        listValue.forEach(function (item) {
            if (eval('typeof ' + item.getAttribute('sc-value') + '!= "undefined"')) {
                //switch
                if ( eval('item.value != ' + item.getAttribute('sc-value') ) ) {
                    eval('item.value =' + item.getAttribute('sc-value'))
                }
                if (item.type === 'checkbox') {
                    if (eval(item.getAttribute('sc-value'))) {
                        eval('item.checked = true')
                    } else {
                        eval('item.checked = false')
                    }
                }
            } else {
                item.innerHTML = ''
            }
        })
    }

    _sc._sc_bindEvents = function _sc_bindEvents() {
        var listValue = document.querySelectorAll('input[sc-value], textarea[sc-value]')
        var clickEv = document.querySelectorAll('[sc-click]')
        var listSelectValue = document.querySelectorAll('select[sc-value]')

        listValue.forEach(function (item) {
            item.removeEventListener('input', _sc._sc_valueListener, true)
            item.addEventListener('input', _sc._sc_valueListener, true)
        })
        clickEv.forEach(function (item) {
            if (item.settedClick) return true;
            item.addEventListener('click', function () {
                eval(item.getAttribute('sc-click'))
                _sc._digest()
            }, true)
            item.settedClick = true
        })
    }

    _sc.binder = function binder() {
        _sc.patternMarkUp = /\{\{([^}]*)}}/g
        document.body.innerHTML = document.body.innerHTML.replace(_sc.patternMarkUp, function(match, varName) {
            if (typeof _sc.vars[varName] == "undefined") {
                _sc.spawn(varName, '')
            }
            return '<sc-markup name="' + varName + '"></sc-markup>'
        })
        _sc._digest()
        _sc._sc_bindEvents()
    }