diff --git a/src/App.vue b/src/App.vue
index ce01029..2d74dbe 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -54,7 +54,7 @@ Dark.set(true)
-
+
@@ -63,8 +63,7 @@ Dark.set(true)
Crystal Math Worktable
-
-
+
@@ -75,7 +74,7 @@ Dark.set(true)
-->
-
+
diff --git a/src/assets/grid.svg b/src/assets/grid.svg
index ac2d34e..697c2a7 100644
--- a/src/assets/grid.svg
+++ b/src/assets/grid.svg
@@ -2,11 +2,11 @@
-
+
-
+
diff --git a/src/assets/l2.svg b/src/assets/l2.svg
index f45c422..1d6e8b2 100644
--- a/src/assets/l2.svg
+++ b/src/assets/l2.svg
@@ -19,20 +19,20 @@
bordercolor="#000000"
borderopacity="0.25"
inkscape:pageshadow="2"
- inkscape:pageopacity="0.0"
- inkscape:pagecheckerboard="0"
+ inkscape:pageopacity="0"
+ inkscape:pagecheckerboard="true"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
showgrid="false"
- inkscape:zoom="0.51843089"
- inkscape:cx="-180.35191"
- inkscape:cy="555.52245"
+ inkscape:zoom="0.733172"
+ inkscape:cx="497.15483"
+ inkscape:cy="634.23044"
inkscape:window-width="1920"
inkscape:window-height="1001"
inkscape:window-x="-7"
inkscape:window-y="-7"
inkscape:window-maximized="1"
- inkscape:current-layer="layer2">
+ inkscape:current-layer="g5278">
@@ -49,30 +49,29 @@
inkscape:label="Text"
transform="matrix(0.26458333,0,0,0.26458333,10.166581,13.777983)"
style="fill:#550000">
- C
- M
+
+
+
+
+
+
+
+
diff --git a/src/components/RangeChart.vue b/src/components/RangeChart.vue
new file mode 100644
index 0000000..25fc305
--- /dev/null
+++ b/src/components/RangeChart.vue
@@ -0,0 +1,110 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/src/main.ts b/src/main.ts
index 5ce924a..b5c8da8 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -50,7 +50,7 @@ app.use(Quasar, {
config: {
brand: {
primary: '#553564',
- secondary: '#c1eeff',
+ secondary: '#7da9b2',
accent: '#9C27B0',
dark: '#1d1d1d',
diff --git a/src/pages/Editor.vue b/src/pages/Editor.vue
index 90d910b..d30263a 100644
--- a/src/pages/Editor.vue
+++ b/src/pages/Editor.vue
@@ -3,20 +3,26 @@ import { onMounted, ref } from 'vue'
import { v4 as uuidv4 } from 'uuid'
import { MathPage } from '../support/page'
import { MathStatement } from '../support/parse'
-import { EvaluationResult, hasOwnProperty } from '../support/types'
+import { ChartBox, EvaluationResult, hasOwnProperty } from '../support/types'
import Statement from '../components/Statement.vue'
import VarDeclEditor from './VarDeclEditor.vue'
import ExpressionEditor from './ExpressionEditor.vue'
import TextBox from '../components/TextBox.vue'
+<<<<<<< HEAD
import ImageBox from '../components/ImageBox.vue'
import FunctionEditor from '../components/FunctionEditor.vue'
import { RichTextBox, ImageContainer } from '../support/types'
+=======
+import FunctionEditor from '../components/FunctionEditor.vue'
+import RangeChart from '../components/RangeChart.vue'
+import RangeChartEditor from './RangeChartEditor.vue'
+import { RichTextBox } from '../support/types'
+>>>>>>> 17a6aea76db7a943a190d4db6524e6b16c01392e
import { stepX, stepY } from '../support/const'
import { checkLoggedIn, loggedOut } from '../support/auth'
import router from '../router'
-
const math = new MathPage(uuidv4());
const statements = ref([]);
const evaluation = ref();
@@ -39,7 +45,7 @@ const variableListingColumns = [
label: 'Value',
},
]
-
+
const stmOnControlledDragStop = (stmt: MathStatement) => (e: { event: MouseEvent, data: { x: number, y: number } }) => {
console.log(e)
@@ -196,8 +202,42 @@ const makeNewRichTextBox = () => {
richEditModal.value = true;
};
-const richTextStatements = ref([]);
+const chartBoxKey = ref(uuidv4())
+const chartBoxes = ref([])
+
+const newChartModalOpen = ref(false)
+const openNewChartModal = () => {
+ newChartModalOpen.value = true
+}
+
+const saveNewChartBox = (chartBox: ChartBox) => {
+ chartBoxes.value.push(chartBox)
+ newChartModalOpen.value = false
+}
+
+const editingChartBox = ref()
+const chartEditModalOpen = ref(false)
+const openChartEditModal = (box: ChartBox) => {
+ editingChartBox.value = box
+ chartEditModalOpen.value = true
+}
+
+const saveEditingChartBox = () => {
+ chartEditModalOpen.value = false
+ chartBoxKey.value = uuidv4()
+}
+
+const moveChartBox = (id: number, x: number, y: number) => {
+ chartBoxes.value[id].x = x
+ chartBoxes.value[id].y = y
+}
+const removeChartBox = (id: number) => {
+ chartBoxes.value.splice(id, 1);
+};
+const richTextStatements = ref([
+ new RichTextBox("Hello World"),
+]);
const richEditModal = ref(false);
const richEditExpression = ref("");
const richEditID = ref(0);
@@ -297,16 +337,14 @@ onMounted(() => {
-
-
- Title
+
+
+
+ Crystal Math Worktable
+
+ Logout
-
-
-
-
-
@@ -361,9 +399,20 @@ onMounted(() => {
-
+
+
+
+
+
{
+
+
+
+
+
+
+
+
{
/>
makeNewRichTextBox()"
/>
@@ -440,6 +501,12 @@ onMounted(() => {
title="Add an image box"
@click="() => makeNewImageBox()"
/>
+ openNewChartModal()"
+ />
@@ -464,7 +531,7 @@ onMounted(() => {
-
+
@@ -481,21 +548,16 @@ onMounted(() => {
/>
-
-
-
-
- Status
-
-
-
diff --git a/src/pages/RangeChartEditor.vue b/src/pages/RangeChartEditor.vue
new file mode 100644
index 0000000..b7e59e1
--- /dev/null
+++ b/src/pages/RangeChartEditor.vue
@@ -0,0 +1,118 @@
+
+
+
+
+
+ {{ chartBoxModalError }}
+
+
+
+
+
+
+
+
+
+
+
+
+ saveChartBox()">
+
+
+
diff --git a/src/quasar-variables.sass b/src/quasar-variables.sass
index edc3022..ad6e563 100644
--- a/src/quasar-variables.sass
+++ b/src/quasar-variables.sass
@@ -1,5 +1,5 @@
$primary : #553564
-$secondary : #26A69A
+$secondary : #008e80
$accent : #9C27B0
$dark : #1D1D1D
@@ -8,5 +8,5 @@ $dark : #1D1D1D
$positive : #21BA45
$negative : #C10015
-$info : #31CCEC
+$info : #7da9b2
$warning : #F2C037
\ No newline at end of file
diff --git a/src/support/page.ts b/src/support/page.ts
index cb2336e..3b55eed 100644
--- a/src/support/page.ts
+++ b/src/support/page.ts
@@ -128,6 +128,25 @@ export class MathPage {
.filter(x => x.isFunctionDeclaration())
}
+ /** Look up a function statement by name, if it exists. */
+ getFunctionByName(name: string): MathStatement|undefined {
+ for ( const fn of this.functions() ) {
+ const node = fn.parse() as math.FunctionAssignmentNode
+ if ( node.name === name ) {
+ return fn
+ }
+ }
+ }
+
+ /** Look up a function statement by name, if it exists. */
+ getFunctionByNameOrFail(name: string): MathStatement {
+ const fn = this.getFunctionByName(name)
+ if ( !fn ) {
+ throw new Error('Unable to find function with name: ' + name)
+ }
+ return fn
+ }
+
/** Evaluate the current state of the page and get the result. */
evaluate(): EvaluationResult {
const evaluations: Record = {}
diff --git a/src/support/types.ts b/src/support/types.ts
index d14794c..248ef7f 100644
--- a/src/support/types.ts
+++ b/src/support/types.ts
@@ -111,3 +111,16 @@ export class ImageContainer {
}
+export class ChartBox {
+ // eslint-disable-next-line max-params
+ constructor(
+ public fnName: string,
+ public minX: number,
+ public maxX: number,
+ public stepX: number = 1,
+ public x: number = 0,
+ public y: number = 0,
+ ) {}
+}
+
+