@pie-element/math-templated 5.1.0 → 5.2.0

package/module/demo.js

@@ -0,0 +1,67 @@
+import Configure from './configure.js';
+import Element from './element.js';
+import * as controller from './controller.js';
+
+var generate = {};
+
+generate.model = (id, element) => ({
+  id,
+  element,
+  rationale: 'Rationale',
+  partialScoring: true,
+  prompt: 'There are 24 students in the class. They had the choice to buy supplies from two different stores, Store A and B. Each of them bought 2 binders and 5 notebooks. The students have a total of $420 to spend.',
+  scoringType: 'auto',
+  feedbackEnabled: false,
+  promptEnabled: true,
+  rationaleEnabled: true,
+  teacherInstructionsEnabled: true,
+  studentInstructionsEnabled: true,
+  toolbarEditorPosition: 'bottom',
+  validationDefault: 'literal',
+  ignoreOrderDefault: false,
+  allowTrailingZerosDefault: false,
+  teacherInstructions: 'These are teacher instructions',
+  customKeys: [], // these have effect on player only?
+  equationEditor: 'geometry',
+  markup: `
+    <p>If the unit price of a notebook in Store A is $1.50, what is the unit price of a binder? \${{0}}</p>
+    <p>If the unit price of a binder in Store B is $2.80, what is the unit price of a notebook? \${{1}}</p>
+  `,
+  responses: {
+    0: {
+      allowTrailingZeros: false,
+      answer: '5',
+      id: '1',
+      validation: 'symbolic',
+      ignoreOrder: false,
+      alternates: {}
+    },
+    1: {
+      allowTrailingZeros: false,
+      answer: '2.38',
+      id: '1',
+      validation: 'literal',
+      ignoreOrder: false,
+      alternates: {}
+    }
+  }
+});
+
+const { model } = generate;
+
+var config = {
+  elements: {
+    'math-templated': '../..',
+  },
+  models: [model('1', 'math-templated')],
+};
+
+//Note: demo-el is a custom element loaded in the markup.
+  customElements.whenDefined("demo-el").then(() => {
+    config.models.forEach((m) => {
+      const de = document.createElement("demo-el");
+      document.body.appendChild(de);
+      de.def = { tagName: m.element, Element, Configure, controller };
+      de.model = m;
+    });
+  });