zackthehuman · May 6, 2020 19:16 · May 6, 2020
diff --git a/components.care-chat\.js b/components.care-chat\.js
@@ -0,0 +1,21 @@
+import Component from '@glimmer/component';
+import { A } from '@ember/array';
+
+export default class extends Component {
+  messages = A(["initial message"])
+
+  constructor() {
+    super(...arguments);
+
+    const that = this;
+
+    setInterval(function () {
+      that.messages.pushObject('message from polling ' + that.messages.length);
+    }, 5000);
+  }
+
+  sendMessage(text) {
+    this.messages.pushObject(text)
+  }
+}
+
diff --git a/components.message-pane\.js b/components.message-pane\.js
@@ -0,0 +1,15 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
+
+export default class extends Component {
+  @tracked
+  pendingMessage = ''
+
+  @action
+  submitMessage(event) {
+    event.preventDefault();
+    this.args.sendMessage(this.pendingMessage);
+    this.pendingMessage = '';
+  }
+}
diff --git a/controllers.application\.js b/controllers.application\.js
@@ -0,0 +1,5 @@
+import Controller from '@ember/controller';
+
+export default class ApplicationController extends Controller {
+  appName = 'Ember Twiddle';
+}
diff --git a/templates.application\.hbs b/templates.application\.hbs
@@ -0,0 +1,7 @@
+<h1>Welcome to {{this.appName}}</h1>
+<br>
+<br>
+{{outlet}}
+<CareChat /> 
+<br>
+<br>
diff --git a/templates.components.care-chat\.hbs b/templates.components.care-chat\.hbs
@@ -0,0 +1,3 @@
+<p>Stuff from care-chat</p>
+<MessagePane @messages={{this.messages}} @sendMessage={{action this.sendMessage}} />
+<p>More stuff from care-chat</p>
diff --git a/templates.components.message-pane\.hbs b/templates.components.message-pane\.hbs
@@ -0,0 +1,11 @@
+Message pane
+
+<ul>
+{{#each @messages as |message|}}
+<li>{{message}}</li>
+{{/each}}
+</ul>
+
+<form onsubmit={{action this.submitMessage}}>
+	<Input type="text" name="messageText" @value={{this.pendingMessage}}/>
+</form>
diff --git a/twiddle\.json b/twiddle\.json
@@ -0,0 +1,22 @@
+{
+  "version": "0.17.0",
+  "EmberENV": {
+    "FEATURES": {},
+    "_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false,
+    "_APPLICATION_TEMPLATE_WRAPPER": true,
+    "_JQUERY_INTEGRATION": true
+  },
+  "options": {
+    "use_pods": false,
+    "enable-testing": false
+  },
+  "dependencies": {
+    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js",
+    "ember": "3.17.0",
+    "ember-template-compiler": "3.17.0",
+    "ember-testing": "3.17.0"
+  },
+  "addons": {
+    "@glimmer/component": "1.0.0"
+  }
+}