1 files changed, 112 insertions, 0 deletions
diff --git a/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/inferno/src/index.js b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/inferno/src/index.js
new file mode 100644
index 0000000000..87414c0b38
--- /dev/null
+++ b/third_party/webkit/PerformanceTests/Speedometer/resources/todomvc/architecture-examples/inferno/src/index.js
@@ -0,0 +1,112 @@
+import Inferno from 'inferno';
+import Component from 'inferno-component';
+import { ENTER, filters, read } from './share';
+import { Head, Foot } from './base';
+import Model from './model';
+import Item from './item';
+
+const { render } = Inferno;
+const model = new Model();
+
+class App extends Component {
+    state = {
+        route: read(),
+        todos: model.get()
+    };
+
+    update = arr => this.setState({todos: arr});
+
+    componentWillMount = () => {
+        window.onhashchange = () => this.setState({route: read()});
+    };
+
+    add = e => {
+        if (e.which !== ENTER) return;
+
+        const val = e.target.value.trim();
+        if (!val) return;
+
+        e.target.value = '';
+        this.update(
+            model.add(val)
+        );
+    };
+
+    edit = (todo, val) => {
+        val = val.trim();
+        if (val.length) {
+            this.update(
+                model.put(todo, {title: val, editing: 0})
+            );
+        } else {
+            this.remove(todo);
+        }
+    };
+
+    focus = todo => this.update(
+        model.put(todo, {editing: 1})
+    );
+
+    blur = todo => this.update(
+        model.put(todo, {editing: 0})
+    );
+
+    remove = todo => this.update(
+        model.del(todo)
+    );
+
+    toggleOne = todo => this.update(
+        model.toggle(todo)
+    );
+
+    toggleAll = ev => this.update(
+        model.toggleAll(ev.target.checked)
+    );
+
+    clearCompleted = () => this.update(
+        model.clearCompleted()
+    );
+
+    render(_, {todos, route}) {
+        const num = todos.length;
+        const shown = todos.filter(filters[route]);
+        const numDone = todos.filter(filters.completed).length;
+        const numAct = num - numDone;
+
+        return (
+            <div>
+                <Head onEnter={ this.add } />
+
+                { num ? (
+                    <section className="main">
+                        <input className="toggle-all" type="checkbox"
+                            onClick={ this.toggleAll } checked={ numAct === 0 }
+                        />
+
+                        <ul className="todo-list">
+                            {
+                                shown.map(t =>
+                                    <Item data={t}
+                                        onBlur={ () => this.blur(t) }
+                                        onFocus={ () => this.focus(t) }
+                                        doDelete={ () => this.remove(t) }
+                                        doSave={ val => this.edit(t, val) }
+                                        doToggle={ () => this.toggleOne(t) }
+                                    />
+                                )
+                            }
+                        </ul>
+                    </section>
+                ) : null }
+
+                { (numAct || numDone) ? (
+                    <Foot onClear={ this.clearCompleted }
+                        left={numAct} done={numDone} route={route}
+                    />
+                ) : null }
+            </div>
+        )
+    }
+}
+
+render(<App />, document.getElementById('app'));