From 2ee0e07bb6346d29bc5e57ec8aac348143e2d50f Mon Sep 17 00:00:00 2001 From: syuilo Date: Mon, 20 Apr 2020 21:35:27 +0900 Subject: refactor(client): :sparkles: --- src/client/components/page/page.block.vue | 4 +- src/client/components/page/page.button.vue | 20 +- src/client/components/page/page.canvas.vue | 4 +- src/client/components/page/page.counter.vue | 8 +- src/client/components/page/page.if.vue | 4 +- src/client/components/page/page.number-input.vue | 8 +- src/client/components/page/page.post.vue | 10 +- src/client/components/page/page.radio-button.vue | 8 +- src/client/components/page/page.section.vue | 4 +- src/client/components/page/page.switch.vue | 8 +- src/client/components/page/page.text-input.vue | 8 +- src/client/components/page/page.text.vue | 8 +- src/client/components/page/page.textarea-input.vue | 8 +- src/client/components/page/page.textarea.vue | 8 +- src/client/components/page/page.vue | 76 +--- .../page-editor/els/page-editor.el.button.vue | 8 +- .../pages/page-editor/els/page-editor.el.if.vue | 10 +- .../page-editor/els/page-editor.el.section.vue | 4 +- .../pages/page-editor/page-editor.blocks.vue | 4 +- .../pages/page-editor/page-editor.script-block.vue | 24 +- src/client/pages/page-editor/page-editor.vue | 18 +- src/client/scripts/aoiscript/evaluator.ts | 429 --------------------- src/client/scripts/aoiscript/index.ts | 139 ------- src/client/scripts/aoiscript/type-checker.ts | 187 --------- src/client/scripts/hpml/evaluator.ts | 349 +++++++++++++++++ src/client/scripts/hpml/index.ts | 139 +++++++ src/client/scripts/hpml/lib.ts | 124 ++++++ src/client/scripts/hpml/type-checker.ts | 187 +++++++++ 28 files changed, 900 insertions(+), 908 deletions(-) delete mode 100644 src/client/scripts/aoiscript/evaluator.ts delete mode 100644 src/client/scripts/aoiscript/index.ts delete mode 100644 src/client/scripts/aoiscript/type-checker.ts create mode 100644 src/client/scripts/hpml/evaluator.ts create mode 100644 src/client/scripts/hpml/index.ts create mode 100644 src/client/scripts/hpml/lib.ts create mode 100644 src/client/scripts/hpml/type-checker.ts (limited to 'src') diff --git a/src/client/components/page/page.block.vue b/src/client/components/page/page.block.vue index 04bbb0b858..0a4b068b63 100644 --- a/src/client/components/page/page.block.vue +++ b/src/client/components/page/page.block.vue @@ -1,5 +1,5 @@ diff --git a/src/client/components/page/page.counter.vue b/src/client/components/page/page.counter.vue index f7557c003a..a3674b87a2 100644 --- a/src/client/components/page/page.counter.vue +++ b/src/client/components/page/page.counter.vue @@ -1,6 +1,6 @@ @@ -16,7 +16,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, @@ -27,8 +27,8 @@ export default Vue.extend({ }, watch: { v() { - this.script.aoiScript.updatePageVar(this.value.name, this.v); - this.script.eval(); + this.hpml.updatePageVar(this.value.name, this.v); + this.hpml.eval(); } }, methods: { diff --git a/src/client/components/page/page.if.vue b/src/client/components/page/page.if.vue index a714a522e8..d73153bcd1 100644 --- a/src/client/components/page/page.if.vue +++ b/src/client/components/page/page.if.vue @@ -1,6 +1,6 @@ @@ -12,7 +12,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true }, page: { diff --git a/src/client/components/page/page.number-input.vue b/src/client/components/page/page.number-input.vue index 9ea1ebb642..56899b1b20 100644 --- a/src/client/components/page/page.number-input.vue +++ b/src/client/components/page/page.number-input.vue @@ -1,6 +1,6 @@ @@ -16,7 +16,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, @@ -27,8 +27,8 @@ export default Vue.extend({ }, watch: { v() { - this.script.aoiScript.updatePageVar(this.value.name, this.v); - this.script.eval(); + this.hpml.updatePageVar(this.value.name, this.v); + this.hpml.eval(); } } }); diff --git a/src/client/components/page/page.post.vue b/src/client/components/page/page.post.vue index 80e0f70cb2..9942a68d55 100644 --- a/src/client/components/page/page.post.vue +++ b/src/client/components/page/page.post.vue @@ -23,22 +23,22 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, data() { return { - text: this.script.interpolate(this.value.text), + text: this.hpml.interpolate(this.value.text), posted: false, posting: false, faCheck, faPaperPlane }; }, watch: { - 'script.vars': { + 'hpml.vars': { handler() { - this.text = this.script.interpolate(this.value.text); + this.text = this.hpml.interpolate(this.value.text); }, deep: true } @@ -53,7 +53,7 @@ export default Vue.extend({ showCancelButton: false, cancelableByBgClick: false }); - const canvas = this.script.aoiScript.canvases[this.value.canvasId]; + const canvas = this.hpml.canvases[this.value.canvasId]; canvas.toBlob(blob => { const data = new FormData(); data.append('file', blob); diff --git a/src/client/components/page/page.radio-button.vue b/src/client/components/page/page.radio-button.vue index dd5cbcbded..99d9ead385 100644 --- a/src/client/components/page/page.radio-button.vue +++ b/src/client/components/page/page.radio-button.vue @@ -1,6 +1,6 @@ @@ -17,7 +17,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, @@ -28,8 +28,8 @@ export default Vue.extend({ }, watch: { v() { - this.script.aoiScript.updatePageVar(this.value.name, this.v); - this.script.eval(); + this.hpml.updatePageVar(this.value.name, this.v); + this.hpml.eval(); } } }); diff --git a/src/client/components/page/page.section.vue b/src/client/components/page/page.section.vue index b83c773f71..c9758a0dbe 100644 --- a/src/client/components/page/page.section.vue +++ b/src/client/components/page/page.section.vue @@ -3,7 +3,7 @@ {{ value.title }}
- +
@@ -16,7 +16,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true }, page: { diff --git a/src/client/components/page/page.switch.vue b/src/client/components/page/page.switch.vue index 79d871df8f..9f04ad19c4 100644 --- a/src/client/components/page/page.switch.vue +++ b/src/client/components/page/page.switch.vue @@ -1,6 +1,6 @@ @@ -16,7 +16,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, @@ -27,8 +27,8 @@ export default Vue.extend({ }, watch: { v() { - this.script.aoiScript.updatePageVar(this.value.name, this.v); - this.script.eval(); + this.hpml.updatePageVar(this.value.name, this.v); + this.hpml.eval(); } } }); diff --git a/src/client/components/page/page.text-input.vue b/src/client/components/page/page.text-input.vue index 843d541de6..0d09f9fb5e 100644 --- a/src/client/components/page/page.text-input.vue +++ b/src/client/components/page/page.text-input.vue @@ -1,6 +1,6 @@ @@ -16,7 +16,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, @@ -27,8 +27,8 @@ export default Vue.extend({ }, watch: { v() { - this.script.aoiScript.updatePageVar(this.value.name, this.v); - this.script.eval(); + this.hpml.updatePageVar(this.value.name, this.v); + this.hpml.eval(); } } }); diff --git a/src/client/components/page/page.text.vue b/src/client/components/page/page.text.vue index aeab31225e..66e2acb90a 100644 --- a/src/client/components/page/page.text.vue +++ b/src/client/components/page/page.text.vue @@ -15,13 +15,13 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, data() { return { - text: this.script.interpolate(this.value.text), + text: this.hpml.interpolate(this.value.text), }; }, computed: { @@ -38,9 +38,9 @@ export default Vue.extend({ } }, watch: { - 'script.vars': { + 'hpml.vars': { handler() { - this.text = this.script.interpolate(this.value.text); + this.text = this.hpml.interpolate(this.value.text); }, deep: true } diff --git a/src/client/components/page/page.textarea-input.vue b/src/client/components/page/page.textarea-input.vue index 5ba22e7c58..5e0cc43779 100644 --- a/src/client/components/page/page.textarea-input.vue +++ b/src/client/components/page/page.textarea-input.vue @@ -1,6 +1,6 @@ @@ -16,7 +16,7 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, @@ -27,8 +27,8 @@ export default Vue.extend({ }, watch: { v() { - this.script.aoiScript.updatePageVar(this.value.name, this.v); - this.script.eval(); + this.hpml.updatePageVar(this.value.name, this.v); + this.hpml.eval(); } } }); diff --git a/src/client/components/page/page.textarea.vue b/src/client/components/page/page.textarea.vue index 78b74dd64c..abb30d78ee 100644 --- a/src/client/components/page/page.textarea.vue +++ b/src/client/components/page/page.textarea.vue @@ -14,19 +14,19 @@ export default Vue.extend({ value: { required: true }, - script: { + hpml: { required: true } }, data() { return { - text: this.script.interpolate(this.value.text), + text: this.hpml.interpolate(this.value.text), }; }, watch: { - 'script.vars': { + 'hpml.vars': { handler() { - this.text = this.script.interpolate(this.value.text); + this.text = this.hpml.interpolate(this.value.text); }, deep: true } diff --git a/src/client/components/page/page.vue b/src/client/components/page/page.vue index 99cc6e67e5..e3b04d7fd6 100644 --- a/src/client/components/page/page.vue +++ b/src/client/components/page/page.vue @@ -1,56 +1,19 @@ diff --git a/src/client/pages/page-editor/els/page-editor.el.button.vue b/src/client/pages/page-editor/els/page-editor.el.button.vue index 508d77a7a0..9ca9fe06f3 100644 --- a/src/client/pages/page-editor/els/page-editor.el.button.vue +++ b/src/client/pages/page-editor/els/page-editor.el.button.vue @@ -21,12 +21,12 @@ - + - + - + @@ -57,7 +57,7 @@ export default Vue.extend({ value: { required: true }, - aoiScript: { + hpml: { required: true, }, }, diff --git a/src/client/pages/page-editor/els/page-editor.el.if.vue b/src/client/pages/page-editor/els/page-editor.el.if.vue index 1c6a33e1b3..0449b9cf2b 100644 --- a/src/client/pages/page-editor/els/page-editor.el.if.vue +++ b/src/client/pages/page-editor/els/page-editor.el.if.vue @@ -10,16 +10,16 @@
- + - + - + - +
@@ -45,7 +45,7 @@ export default Vue.extend({ value: { required: true }, - aoiScript: { + hpml: { required: true, }, }, diff --git a/src/client/pages/page-editor/els/page-editor.el.section.vue b/src/client/pages/page-editor/els/page-editor.el.section.vue index c1d5497f4c..a32cf9c753 100644 --- a/src/client/pages/page-editor/els/page-editor.el.section.vue +++ b/src/client/pages/page-editor/els/page-editor.el.section.vue @@ -11,7 +11,7 @@
- +
@@ -37,7 +37,7 @@ export default Vue.extend({ value: { required: true }, - aoiScript: { + hpml: { required: true, }, }, diff --git a/src/client/pages/page-editor/page-editor.blocks.vue b/src/client/pages/page-editor/page-editor.blocks.vue index c6ec42b8da..6e9408e0b7 100644 --- a/src/client/pages/page-editor/page-editor.blocks.vue +++ b/src/client/pages/page-editor/page-editor.blocks.vue @@ -1,6 +1,6 @@ @@ -32,7 +32,7 @@ export default Vue.extend({ type: Array, required: true }, - aoiScript: { + hpml: { required: true, }, }, diff --git a/src/client/pages/page-editor/page-editor.script-block.vue b/src/client/pages/page-editor/page-editor.script-block.vue index 7e3bbf0c88..9eafd5daa0 100644 --- a/src/client/pages/page-editor/page-editor.script-block.vue +++ b/src/client/pages/page-editor/page-editor.script-block.vue @@ -24,15 +24,15 @@
@@ -44,13 +44,13 @@ {{ $t('_pages.script.blocks._fn.slots') }} - +
- +
- +
@@ -62,7 +62,7 @@ import { v4 as uuid } from 'uuid'; import i18n from '../../i18n'; import XContainer from './page-editor.container.vue'; import MkTextarea from '../../components/ui/textarea.vue'; -import { isLiteralBlock, funcDefs, blockDefs } from '../../scripts/aoiscript/index'; +import { isLiteralBlock, funcDefs, blockDefs } from '../../scripts/hpml/index'; export default Vue.extend({ i18n, @@ -88,7 +88,7 @@ export default Vue.extend({ required: false, default: false }, - aoiScript: { + hpml: { required: true, }, name: { @@ -156,7 +156,7 @@ export default Vue.extend({ if (this.value.type && this.value.type.startsWith('fn:')) { const fnName = this.value.type.split(':')[1]; - const fn = this.aoiScript.getVarByName(fnName); + const fn = this.hpml.getVarByName(fnName); const empties = []; for (let i = 0; i < fn.value.slots.length; i++) { @@ -202,9 +202,9 @@ export default Vue.extend({ deep: true }); - this.$watch('aoiScript.variables', () => { + this.$watch('hpml.variables', () => { if (this.type != null && this.value) { - this.error = this.aoiScript.typeCheck(this.value); + this.error = this.hpml.typeCheck(this.value); } }, { deep: true @@ -226,7 +226,7 @@ export default Vue.extend({ }, _getExpectedType(slot: number) { - return this.aoiScript.getExpectedType(this.value, slot); + return this.hpml.getExpectedType(this.value, slot); } } }); diff --git a/src/client/pages/page-editor/page-editor.vue b/src/client/pages/page-editor/page-editor.vue index 21d7af9a34..4437c7716d 100644 --- a/src/client/pages/page-editor/page-editor.vue +++ b/src/client/pages/page-editor/page-editor.vue @@ -46,7 +46,7 @@ - + @@ -62,7 +62,7 @@ @input="v => updateVariable(v)" @remove="() => removeVariable(variable)" :key="variable.name" - :aoi-script="aoiScript" + :hpml="hpml" :name="variable.name" :title="variable.name" :draggable="true" @@ -100,8 +100,8 @@ import MkButton from '../../components/ui/button.vue'; import MkSelect from '../../components/ui/select.vue'; import MkSwitch from '../../components/ui/switch.vue'; import MkInput from '../../components/ui/input.vue'; -import { blockDefs } from '../../scripts/aoiscript/index'; -import { ASTypeChecker } from '../../scripts/aoiscript/type-checker'; +import { blockDefs } from '../../scripts/hpml/index'; +import { HpmlTypeChecker } from '../../scripts/hpml/type-checker'; import { url } from '../../config'; import { collectPageVars } from '../../scripts/collect-page-vars'; import { selectDriveFile } from '../../scripts/select-drive-file'; @@ -145,7 +145,7 @@ export default Vue.extend({ alignCenter: false, hideTitleWhenPinned: false, variables: [], - aoiScript: null, + hpml: null, script: '', showOptions: false, url, @@ -166,14 +166,14 @@ export default Vue.extend({ }, async created() { - this.aoiScript = new ASTypeChecker(); + this.hpml = new HpmlTypeChecker(); this.$watch('variables', () => { - this.aoiScript.variables = this.variables; + this.hpml.variables = this.variables; }, { deep: true }); this.$watch('content', () => { - this.aoiScript.pageVars = collectPageVars(this.content); + this.hpml.pageVars = collectPageVars(this.content); }, { deep: true }); if (this.initPageId) { @@ -322,7 +322,7 @@ export default Vue.extend({ name = name.trim(); - if (this.aoiScript.isUsedName(name)) { + if (this.hpml.isUsedName(name)) { this.$root.dialog({ type: 'error', text: this.$t('_pages.variableNameIsAlreadyUsed') diff --git a/src/client/scripts/aoiscript/evaluator.ts b/src/client/scripts/aoiscript/evaluator.ts deleted file mode 100644 index dbd4735fde..0000000000 --- a/src/client/scripts/aoiscript/evaluator.ts +++ /dev/null @@ -1,429 +0,0 @@ -import autobind from 'autobind-decorator'; -import * as seedrandom from 'seedrandom'; -import Chart from 'chart.js'; -import * as tinycolor from 'tinycolor2'; -import { Variable, PageVar, envVarsDef, funcDefs, Block, isFnBlock } from '.'; -import { version } from '../../config'; -import { AiScript, utils, parse, values } from '@syuilo/aiscript'; -import { createAiScriptEnv } from '../create-aiscript-env'; - -// https://stackoverflow.com/questions/38493564/chart-area-background-color-chartjs -Chart.pluginService.register({ - beforeDraw: function (chart, easing) { - if (chart.config.options.chartArea && chart.config.options.chartArea.backgroundColor) { - var ctx = chart.chart.ctx; - ctx.save(); - ctx.fillStyle = chart.config.options.chartArea.backgroundColor; - ctx.fillRect(0, 0, chart.chart.width, chart.chart.height); - ctx.restore(); - } - } -}); - -type Fn = { - slots: string[]; - exec: (args: Record) => ReturnType; -}; - -/** - * AoiScript evaluator - */ -export class ASEvaluator { - private variables: Variable[]; - private pageVars: PageVar[]; - private envVars: Record; - public aiscript?: AiScript; - private pageVarUpdatedCallback; - public canvases: Record = {}; - - private opts: { - randomSeed: string; visitor?: any; page?: any; url?: string; - enableAiScript: boolean; - }; - - constructor(vm: any, variables: Variable[], pageVars: PageVar[], opts: ASEvaluator['opts']) { - this.variables = variables; - this.pageVars = pageVars; - this.opts = opts; - - if (this.opts.enableAiScript) { - this.aiscript = new AiScript({ ...createAiScriptEnv(vm, { - storageKey: 'pages:' + opts.page.id - }), ...{ - 'MkPages:updated': values.FN_NATIVE(([callback]) => { - this.pageVarUpdatedCallback = callback; - }), - 'MkPages:get_canvas': values.FN_NATIVE(([id]) => { - utils.assertString(id); - const canvas = this.canvases[id.value]; - const ctx = canvas.getContext('2d'); - return values.OBJ(new Map([ - ['clear_rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.clearRect(x.value, y.value, width.value, height.value) })], - ['fill_rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.fillRect(x.value, y.value, width.value, height.value) })], - ['stroke_rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.strokeRect(x.value, y.value, width.value, height.value) })], - ['fill_text', values.FN_NATIVE(([text, x, y, width]) => { ctx.fillText(text.value, x.value, y.value, width ? width.value : undefined) })], - ['stroke_text', values.FN_NATIVE(([text, x, y, width]) => { ctx.strokeText(text.value, x.value, y.value, width ? width.value : undefined) })], - ['set_line_width', values.FN_NATIVE(([width]) => { ctx.lineWidth = width.value })], - ['set_font', values.FN_NATIVE(([font]) => { ctx.font = font.value })], - ['set_fill_style', values.FN_NATIVE(([style]) => { ctx.fillStyle = style.value })], - ['set_stroke_style', values.FN_NATIVE(([style]) => { ctx.strokeStyle = style.value })], - ['begin_path', values.FN_NATIVE(() => { ctx.beginPath() })], - ['close_path', values.FN_NATIVE(() => { ctx.closePath() })], - ['move_to', values.FN_NATIVE(([x, y]) => { ctx.moveTo(x.value, y.value) })], - ['line_to', values.FN_NATIVE(([x, y]) => { ctx.lineTo(x.value, y.value) })], - ['arc', values.FN_NATIVE(([x, y, radius, startAngle, endAngle]) => { ctx.arc(x.value, y.value, radius.value, startAngle.value, endAngle.value) })], - ['rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.rect(x.value, y.value, width.value, height.value) })], - ['fill', values.FN_NATIVE(() => { ctx.fill() })], - ['stroke', values.FN_NATIVE(() => { ctx.stroke() })], - ])); - }), - 'MkPages:chart': values.FN_NATIVE(([id, opts]) => { - utils.assertString(id); - utils.assertObject(opts); - const canvas = this.canvases[id.value]; - const color = getComputedStyle(document.documentElement).getPropertyValue('--accent'); - const chart = new Chart(canvas, { - type: opts.value.get('type').value, - data: { - labels: opts.value.get('labels').value.map(x => x.value), - datasets: opts.value.get('datasets').value.map(x => ({ - label: x.value.has('label') ? x.value.get('label').value : '', - data: x.value.get('data').value.map(x => x.value), - pointRadius: 0, - lineTension: 0, - borderWidth: 2, - borderColor: x.value.has('color') ? x.value.get('color') : color, - backgroundColor: tinycolor(x.value.has('color') ? x.value.get('color') : color).setAlpha(0.1).toRgbString(), - })) - }, - options: { - responsive: false, - devicePixelRatio: 1.5, - title: { - display: opts.value.has('title'), - text: opts.value.has('title') ? opts.value.get('title').value : '', - fontSize: 14, - }, - layout: { - padding: { - left: 32, - right: 32, - top: opts.value.has('title') ? 16 : 32, - bottom: 16 - } - }, - legend: { - display: opts.value.get('datasets').value.filter(x => x.value.has('label') && x.value.get('label').value).length === 0 ? false : true, - position: 'bottom', - labels: { - boxWidth: 16, - } - }, - tooltips: { - enabled: false, - }, - chartArea: { - backgroundColor: '#fff' - }, - ...(opts.value.get('type').value === 'radar' ? { - scale: { - ticks: { - display: opts.value.has('show_tick_label') ? opts.value.get('show_tick_label').value : false, - min: opts.value.has('min') ? opts.value.get('min').value : undefined, - max: opts.value.has('max') ? opts.value.get('max').value : undefined, - maxTicksLimit: 8, - }, - pointLabels: { - fontSize: 12 - } - } - } : { - scales: { - yAxes: [{ - ticks: { - display: opts.value.has('show_tick_label') ? opts.value.get('show_tick_label').value : true, - min: opts.value.has('min') ? opts.value.get('min').value : undefined, - max: opts.value.has('max') ? opts.value.get('max').value : undefined, - } - }] - } - }) - } - }); - }), - }}, { - in: (q) => { - return new Promise(ok => { - vm.$root.dialog({ - title: q, - input: {} - }).then(({ canceled, result: a }) => { - ok(a); - }); - }); - }, - out: (value) => { - console.log(value); - }, - log: (type, params) => { - }, - }); - } - - const date = new Date(); - - this.envVars = { - AI: 'kawaii', - VERSION: version, - URL: opts.page ? `${opts.url}/@${opts.page.user.username}/pages/${opts.page.name}` : '', - LOGIN: opts.visitor != null, - NAME: opts.visitor ? opts.visitor.name || opts.visitor.username : '', - USERNAME: opts.visitor ? opts.visitor.username : '', - USERID: opts.visitor ? opts.visitor.id : '', - NOTES_COUNT: opts.visitor ? opts.visitor.notesCount : 0, - FOLLOWERS_COUNT: opts.visitor ? opts.visitor.followersCount : 0, - FOLLOWING_COUNT: opts.visitor ? opts.visitor.followingCount : 0, - IS_CAT: opts.visitor ? opts.visitor.isCat : false, - SEED: opts.randomSeed ? opts.randomSeed : '', - YMD: `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`, - AISCRIPT_DISABLED: !this.opts.enableAiScript, - NULL: null - }; - } - - public registerCanvas(id: string, canvas: any) { - this.canvases[id] = canvas; - } - - @autobind - public updatePageVar(name: string, value: any) { - const pageVar = this.pageVars.find(v => v.name === name); - if (pageVar !== undefined) { - pageVar.value = value; - if (this.pageVarUpdatedCallback) { - if (this.aiscript) this.aiscript.execFn(this.pageVarUpdatedCallback, [values.STR(name), utils.jsToVal(value)]); - } - } else { - throw new AoiScriptError(`No such page var '${name}'`); - } - } - - @autobind - public updateRandomSeed(seed: string) { - this.opts.randomSeed = seed; - this.envVars.SEED = seed; - } - - @autobind - private interpolate(str: string, scope: Scope) { - return str.replace(/{(.+?)}/g, match => { - const v = scope.getState(match.slice(1, -1).trim()); - return v == null ? 'NULL' : v.toString(); - }); - } - - @autobind - public evaluateVars(): Record { - const values: Record = {}; - - for (const [k, v] of Object.entries(this.envVars)) { - values[k] = v; - } - - for (const v of this.pageVars) { - values[v.name] = v.value; - } - - for (const v of this.variables) { - values[v.name] = this.evaluate(v, new Scope([values])); - } - - return values; - } - - @autobind - private evaluate(block: Block, scope: Scope): any { - if (block.type === null) { - return null; - } - - if (block.type === 'number') { - return parseInt(block.value, 10); - } - - if (block.type === 'text' || block.type === 'multiLineText') { - return this.interpolate(block.value || '', scope); - } - - if (block.type === 'textList') { - return this.interpolate(block.value || '', scope).trim().split('\n'); - } - - if (block.type === 'ref') { - return scope.getState(block.value); - } - - if (block.type === 'aiScriptVar') { - if (this.aiscript) { - try { - return utils.valToJs(this.aiscript.scope.get(block.value)); - } catch (e) { - return null; - } - } else { - return null; - } - } - - if (isFnBlock(block)) { // ユーザー関数定義 - return { - slots: block.value.slots.map(x => x.name), - exec: (slotArg: Record) => { - return this.evaluate(block.value.expression, scope.createChildScope(slotArg, block.id)); - } - } as Fn; - } - - if (block.type.startsWith('fn:')) { // ユーザー関数呼び出し - const fnName = block.type.split(':')[1]; - const fn = scope.getState(fnName); - const args = {} as Record; - for (let i = 0; i < fn.slots.length; i++) { - const name = fn.slots[i]; - args[name] = this.evaluate(block.args[i], scope); - } - return fn.exec(args); - } - - if (block.args === undefined) return null; - - const date = new Date(); - const day = `${this.opts.visitor ? this.opts.visitor.id : ''} ${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`; - - const funcs: { [p in keyof typeof funcDefs]: Function } = { - not: (a: boolean) => !a, - or: (a: boolean, b: boolean) => a || b, - and: (a: boolean, b: boolean) => a && b, - eq: (a: any, b: any) => a === b, - notEq: (a: any, b: any) => a !== b, - gt: (a: number, b: number) => a > b, - lt: (a: number, b: number) => a < b, - gtEq: (a: number, b: number) => a >= b, - ltEq: (a: number, b: number) => a <= b, - if: (bool: boolean, a: any, b: any) => bool ? a : b, - for: (times: number, fn: Fn) => { - const result = []; - for (let i = 0; i < times; i++) { - result.push(fn.exec({ - [fn.slots[0]]: i + 1 - })); - } - return result; - }, - add: (a: number, b: number) => a + b, - subtract: (a: number, b: number) => a - b, - multiply: (a: number, b: number) => a * b, - divide: (a: number, b: number) => a / b, - mod: (a: number, b: number) => a % b, - round: (a: number) => Math.round(a), - strLen: (a: string) => a.length, - strPick: (a: string, b: number) => a[b - 1], - strReplace: (a: string, b: string, c: string) => a.split(b).join(c), - strReverse: (a: string) => a.split('').reverse().join(''), - join: (texts: string[], separator: string) => texts.join(separator || ''), - stringToNumber: (a: string) => parseInt(a), - numberToString: (a: number) => a.toString(), - splitStrByLine: (a: string) => a.split('\n'), - pick: (list: any[], i: number) => list[i - 1], - listLen: (list: any[]) => list.length, - random: (probability: number) => Math.floor(seedrandom(`${this.opts.randomSeed}:${block.id}`)() * 100) < probability, - rannum: (min: number, max: number) => min + Math.floor(seedrandom(`${this.opts.randomSeed}:${block.id}`)() * (max - min + 1)), - randomPick: (list: any[]) => list[Math.floor(seedrandom(`${this.opts.randomSeed}:${block.id}`)() * list.length)], - dailyRandom: (probability: number) => Math.floor(seedrandom(`${day}:${block.id}`)() * 100) < probability, - dailyRannum: (min: number, max: number) => min + Math.floor(seedrandom(`${day}:${block.id}`)() * (max - min + 1)), - dailyRandomPick: (list: any[]) => list[Math.floor(seedrandom(`${day}:${block.id}`)() * list.length)], - seedRandom: (seed: any, probability: number) => Math.floor(seedrandom(seed)() * 100) < probability, - seedRannum: (seed: any, min: number, max: number) => min + Math.floor(seedrandom(seed)() * (max - min + 1)), - seedRandomPick: (seed: any, list: any[]) => list[Math.floor(seedrandom(seed)() * list.length)], - DRPWPM: (list: string[]) => { - const xs = []; - let totalFactor = 0; - for (const x of list) { - const parts = x.split(' '); - const factor = parseInt(parts.pop()!, 10); - const text = parts.join(' '); - totalFactor += factor; - xs.push({ factor, text }); - } - const r = seedrandom(`${day}:${block.id}`)() * totalFactor; - let stackedFactor = 0; - for (const x of xs) { - if (r >= stackedFactor && r <= stackedFactor + x.factor) { - return x.text; - } else { - stackedFactor += x.factor; - } - } - return xs[0].text; - }, - }; - - const fnName = block.type; - const fn = (funcs as any)[fnName]; - if (fn == null) { - throw new AoiScriptError(`No such function '${fnName}'`); - } else { - return fn(...block.args.map(x => this.evaluate(x, scope))); - } - } -} - -class AoiScriptError extends Error { - public info?: any; - - constructor(message: string, info?: any) { - super(message); - - this.info = info; - - // Maintains proper stack trace for where our error was thrown (only available on V8) - if (Error.captureStackTrace) { - Error.captureStackTrace(this, AoiScriptError); - } - } -} - -class Scope { - private layerdStates: Record[]; - public name: string; - - constructor(layerdStates: Scope['layerdStates'], name?: Scope['name']) { - this.layerdStates = layerdStates; - this.name = name || 'anonymous'; - } - - @autobind - public createChildScope(states: Record, name?: Scope['name']): Scope { - const layer = [states, ...this.layerdStates]; - return new Scope(layer, name); - } - - /** - * 指定した名前の変数の値を取得します - * @param name 変数名 - */ - @autobind - public getState(name: string): any { - for (const later of this.layerdStates) { - const state = later[name]; - if (state !== undefined) { - return state; - } - } - - throw new AoiScriptError( - `No such variable '${name}' in scope '${this.name}'`, { - scope: this.layerdStates - }); - } -} diff --git a/src/client/scripts/aoiscript/index.ts b/src/client/scripts/aoiscript/index.ts deleted file mode 100644 index 7f34964064..0000000000 --- a/src/client/scripts/aoiscript/index.ts +++ /dev/null @@ -1,139 +0,0 @@ -/** - * AoiScript - */ - -import { - faMagic, - faSquareRootAlt, - faAlignLeft, - faShareAlt, - faPlus, - faMinus, - faTimes, - faDivide, - faList, - faQuoteRight, - faEquals, - faGreaterThan, - faLessThan, - faGreaterThanEqual, - faLessThanEqual, - faNotEqual, - faDice, - faSortNumericUp, - faExchangeAlt, - faRecycle, - faIndent, - faCalculator, -} from '@fortawesome/free-solid-svg-icons'; -import { faFlag } from '@fortawesome/free-regular-svg-icons'; - -export type Block = { - id: string; - type: string; - args: Block[]; - value: V; -}; - -export type FnBlock = Block<{ - slots: { - name: string; - type: Type; - }[]; - expression: Block; -}>; - -export type Variable = Block & { - name: string; -}; - -export type Type = 'string' | 'number' | 'boolean' | 'stringArray' | null; - -export const funcDefs: Record = { - if: { in: ['boolean', 0, 0], out: 0, category: 'flow', icon: faShareAlt, }, - for: { in: ['number', 'function'], out: null, category: 'flow', icon: faRecycle, }, - not: { in: ['boolean'], out: 'boolean', category: 'logical', icon: faFlag, }, - or: { in: ['boolean', 'boolean'], out: 'boolean', category: 'logical', icon: faFlag, }, - and: { in: ['boolean', 'boolean'], out: 'boolean', category: 'logical', icon: faFlag, }, - add: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faPlus, }, - subtract: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faMinus, }, - multiply: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faTimes, }, - divide: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faDivide, }, - mod: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faDivide, }, - round: { in: ['number'], out: 'number', category: 'operation', icon: faCalculator, }, - eq: { in: [0, 0], out: 'boolean', category: 'comparison', icon: faEquals, }, - notEq: { in: [0, 0], out: 'boolean', category: 'comparison', icon: faNotEqual, }, - gt: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faGreaterThan, }, - lt: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faLessThan, }, - gtEq: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faGreaterThanEqual, }, - ltEq: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faLessThanEqual, }, - strLen: { in: ['string'], out: 'number', category: 'text', icon: faQuoteRight, }, - strPick: { in: ['string', 'number'], out: 'string', category: 'text', icon: faQuoteRight, }, - strReplace: { in: ['string', 'string', 'string'], out: 'string', category: 'text', icon: faQuoteRight, }, - strReverse: { in: ['string'], out: 'string', category: 'text', icon: faQuoteRight, }, - join: { in: ['stringArray', 'string'], out: 'string', category: 'text', icon: faQuoteRight, }, - stringToNumber: { in: ['string'], out: 'number', category: 'convert', icon: faExchangeAlt, }, - numberToString: { in: ['number'], out: 'string', category: 'convert', icon: faExchangeAlt, }, - splitStrByLine: { in: ['string'], out: 'stringArray', category: 'convert', icon: faExchangeAlt, }, - pick: { in: [null, 'number'], out: null, category: 'list', icon: faIndent, }, - listLen: { in: [null], out: 'number', category: 'list', icon: faIndent, }, - rannum: { in: ['number', 'number'], out: 'number', category: 'random', icon: faDice, }, - dailyRannum: { in: ['number', 'number'], out: 'number', category: 'random', icon: faDice, }, - seedRannum: { in: [null, 'number', 'number'], out: 'number', category: 'random', icon: faDice, }, - random: { in: ['number'], out: 'boolean', category: 'random', icon: faDice, }, - dailyRandom: { in: ['number'], out: 'boolean', category: 'random', icon: faDice, }, - seedRandom: { in: [null, 'number'], out: 'boolean', category: 'random', icon: faDice, }, - randomPick: { in: [0], out: 0, category: 'random', icon: faDice, }, - dailyRandomPick: { in: [0], out: 0, category: 'random', icon: faDice, }, - seedRandomPick: { in: [null, 0], out: 0, category: 'random', icon: faDice, }, - DRPWPM: { in: ['stringArray'], out: 'string', category: 'random', icon: faDice, }, // dailyRandomPickWithProbabilityMapping -}; - -export const literalDefs: Record = { - text: { out: 'string', category: 'value', icon: faQuoteRight, }, - multiLineText: { out: 'string', category: 'value', icon: faAlignLeft, }, - textList: { out: 'stringArray', category: 'value', icon: faList, }, - number: { out: 'number', category: 'value', icon: faSortNumericUp, }, - ref: { out: null, category: 'value', icon: faMagic, }, - aiScriptVar: { out: null, category: 'value', icon: faMagic, }, - fn: { out: 'function', category: 'value', icon: faSquareRootAlt, }, -}; - -export const blockDefs = [ - ...Object.entries(literalDefs).map(([k, v]) => ({ - type: k, out: v.out, category: v.category, icon: v.icon - })), - ...Object.entries(funcDefs).map(([k, v]) => ({ - type: k, out: v.out, category: v.category, icon: v.icon - })) -]; - -export function isFnBlock(block: Block): block is FnBlock { - return block.type === 'fn'; -} - -export type PageVar = { name: string; value: any; type: Type; }; - -export const envVarsDef: Record = { - AI: 'string', - URL: 'string', - VERSION: 'string', - LOGIN: 'boolean', - NAME: 'string', - USERNAME: 'string', - USERID: 'string', - NOTES_COUNT: 'number', - FOLLOWERS_COUNT: 'number', - FOLLOWING_COUNT: 'number', - IS_CAT: 'boolean', - SEED: null, - YMD: 'string', - AISCRIPT_DISABLED: 'boolean', - NULL: null, -}; - -export function isLiteralBlock(v: Block) { - if (v.type === null) return true; - if (literalDefs[v.type]) return true; - return false; -} diff --git a/src/client/scripts/aoiscript/type-checker.ts b/src/client/scripts/aoiscript/type-checker.ts deleted file mode 100644 index c10198e119..0000000000 --- a/src/client/scripts/aoiscript/type-checker.ts +++ /dev/null @@ -1,187 +0,0 @@ -import autobind from 'autobind-decorator'; -import { Type, Block, funcDefs, envVarsDef, Variable, PageVar, isLiteralBlock } from '.'; - -type TypeError = { - arg: number; - expect: Type; - actual: Type; -}; - -/** - * AoiScript type checker - */ -export class ASTypeChecker { - public variables: Variable[]; - public pageVars: PageVar[]; - - constructor(variables: ASTypeChecker['variables'] = [], pageVars: ASTypeChecker['pageVars'] = []) { - this.variables = variables; - this.pageVars = pageVars; - } - - @autobind - public typeCheck(v: Block): TypeError | null { - if (isLiteralBlock(v)) return null; - - const def = funcDefs[v.type]; - if (def == null) { - throw new Error('Unknown type: ' + v.type); - } - - const generic: Type[] = []; - - for (let i = 0; i < def.in.length; i++) { - const arg = def.in[i]; - const type = this.infer(v.args[i]); - if (type === null) continue; - - if (typeof arg === 'number') { - if (generic[arg] === undefined) { - generic[arg] = type; - } else if (type !== generic[arg]) { - return { - arg: i, - expect: generic[arg], - actual: type - }; - } - } else if (type !== arg) { - return { - arg: i, - expect: arg, - actual: type - }; - } - } - - return null; - } - - @autobind - public getExpectedType(v: Block, slot: number): Type { - const def = funcDefs[v.type]; - if (def == null) { - throw new Error('Unknown type: ' + v.type); - } - - const generic: Type[] = []; - - for (let i = 0; i < def.in.length; i++) { - const arg = def.in[i]; - const type = this.infer(v.args[i]); - if (type === null) continue; - - if (typeof arg === 'number') { - if (generic[arg] === undefined) { - generic[arg] = type; - } - } - } - - if (typeof def.in[slot] === 'number') { - return generic[def.in[slot]] || null; - } else { - return def.in[slot]; - } - } - - @autobind - public infer(v: Block): Type { - if (v.type === null) return null; - if (v.type === 'text') return 'string'; - if (v.type === 'multiLineText') return 'string'; - if (v.type === 'textList') return 'stringArray'; - if (v.type === 'number') return 'number'; - if (v.type === 'ref') { - const variable = this.variables.find(va => va.name === v.value); - if (variable) { - return this.infer(variable); - } - - const pageVar = this.pageVars.find(va => va.name === v.value); - if (pageVar) { - return pageVar.type; - } - - const envVar = envVarsDef[v.value]; - if (envVar !== undefined) { - return envVar; - } - - return null; - } - if (v.type === 'aiScriptVar') return null; - if (v.type === 'fn') return null; // todo - if (v.type.startsWith('fn:')) return null; // todo - - const generic: Type[] = []; - - const def = funcDefs[v.type]; - - for (let i = 0; i < def.in.length; i++) { - const arg = def.in[i]; - if (typeof arg === 'number') { - const type = this.infer(v.args[i]); - - if (generic[arg] === undefined) { - generic[arg] = type; - } else { - if (type !== generic[arg]) { - generic[arg] = null; - } - } - } - } - - if (typeof def.out === 'number') { - return generic[def.out]; - } else { - return def.out; - } - } - - @autobind - public getVarByName(name: string): Variable { - const v = this.variables.find(x => x.name === name); - if (v !== undefined) { - return v; - } else { - throw new Error(`No such variable '${name}'`); - } - } - - @autobind - public getVarsByType(type: Type): Variable[] { - if (type == null) return this.variables; - return this.variables.filter(x => (this.infer(x) === null) || (this.infer(x) === type)); - } - - @autobind - public getEnvVarsByType(type: Type): string[] { - if (type == null) return Object.keys(envVarsDef); - return Object.entries(envVarsDef).filter(([k, v]) => v === null || type === v).map(([k, v]) => k); - } - - @autobind - public getPageVarsByType(type: Type): string[] { - if (type == null) return this.pageVars.map(v => v.name); - return this.pageVars.filter(v => type === v.type).map(v => v.name); - } - - @autobind - public isUsedName(name: string) { - if (this.variables.some(v => v.name === name)) { - return true; - } - - if (this.pageVars.some(v => v.name === name)) { - return true; - } - - if (envVarsDef[name]) { - return true; - } - - return false; - } -} diff --git a/src/client/scripts/hpml/evaluator.ts b/src/client/scripts/hpml/evaluator.ts new file mode 100644 index 0000000000..f1fcdde0e5 --- /dev/null +++ b/src/client/scripts/hpml/evaluator.ts @@ -0,0 +1,349 @@ +import autobind from 'autobind-decorator'; +import * as seedrandom from 'seedrandom'; +import { Variable, PageVar, envVarsDef, funcDefs, Block, isFnBlock } from '.'; +import { version } from '../../config'; +import { AiScript, utils, values } from '@syuilo/aiscript'; +import { createAiScriptEnv } from '../create-aiscript-env'; +import { collectPageVars } from '../collect-page-vars'; +import { initLib } from './lib'; + +type Fn = { + slots: string[]; + exec: (args: Record) => ReturnType; +}; + +/** + * Hpml evaluator + */ +export class Hpml { + private variables: Variable[]; + private pageVars: PageVar[]; + private envVars: Record; + public aiscript?: AiScript; + private pageVarUpdatedCallback; + public canvases: Record = {}; + public vars: Record; + public page: Record; + + private opts: { + randomSeed: string; visitor?: any; url?: string; + enableAiScript: boolean; + }; + + constructor(vm: any, page: Hpml['page'], opts: Hpml['opts']) { + this.page = page; + this.variables = this.page.variables; + this.pageVars = collectPageVars(this.page.content); + this.opts = opts; + + if (this.opts.enableAiScript) { + this.aiscript = new AiScript({ ...createAiScriptEnv(vm, { + storageKey: 'pages:' + this.page.id + }), ...initLib(this)}, { + in: (q) => { + return new Promise(ok => { + vm.$root.dialog({ + title: q, + input: {} + }).then(({ canceled, result: a }) => { + ok(a); + }); + }); + }, + out: (value) => { + console.log(value); + }, + log: (type, params) => { + }, + }); + + this.aiscript.scope.opts.onUpdated = (name, value) => { + this.eval(); + }; + } + + const date = new Date(); + + this.envVars = { + AI: 'kawaii', + VERSION: version, + URL: this.page ? `${opts.url}/@${this.page.user.username}/pages/${this.page.name}` : '', + LOGIN: opts.visitor != null, + NAME: opts.visitor ? opts.visitor.name || opts.visitor.username : '', + USERNAME: opts.visitor ? opts.visitor.username : '', + USERID: opts.visitor ? opts.visitor.id : '', + NOTES_COUNT: opts.visitor ? opts.visitor.notesCount : 0, + FOLLOWERS_COUNT: opts.visitor ? opts.visitor.followersCount : 0, + FOLLOWING_COUNT: opts.visitor ? opts.visitor.followingCount : 0, + IS_CAT: opts.visitor ? opts.visitor.isCat : false, + SEED: opts.randomSeed ? opts.randomSeed : '', + YMD: `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`, + AISCRIPT_DISABLED: !this.opts.enableAiScript, + NULL: null + }; + + this.eval(); + } + + @autobind + public eval() { + try { + this.vars = this.evaluateVars(); + } catch (e) { + //this.onError(e); + } + } + + @autobind + public interpolate(str: string) { + if (str == null) return null; + return str.replace(/{(.+?)}/g, match => { + const v = this.vars ? this.vars[match.slice(1, -1).trim()] : null; + return v == null ? 'NULL' : v.toString(); + }); + } + + @autobind + public callAiScript(fn: string) { + try { + if (this.aiscript) this.aiscript.execFn(this.aiscript.scope.get(fn), []); + } catch (e) {} + } + + @autobind + public registerCanvas(id: string, canvas: any) { + this.canvases[id] = canvas; + } + + @autobind + public updatePageVar(name: string, value: any) { + const pageVar = this.pageVars.find(v => v.name === name); + if (pageVar !== undefined) { + pageVar.value = value; + if (this.pageVarUpdatedCallback) { + if (this.aiscript) this.aiscript.execFn(this.pageVarUpdatedCallback, [values.STR(name), utils.jsToVal(value)]); + } + } else { + throw new HpmlError(`No such page var '${name}'`); + } + } + + @autobind + public updateRandomSeed(seed: string) { + this.opts.randomSeed = seed; + this.envVars.SEED = seed; + } + + @autobind + private _interpolate(str: string, scope: Scope) { + return str.replace(/{(.+?)}/g, match => { + const v = scope.getState(match.slice(1, -1).trim()); + return v == null ? 'NULL' : v.toString(); + }); + } + + @autobind + public evaluateVars(): Record { + const values: Record = {}; + + for (const [k, v] of Object.entries(this.envVars)) { + values[k] = v; + } + + for (const v of this.pageVars) { + values[v.name] = v.value; + } + + for (const v of this.variables) { + values[v.name] = this.evaluate(v, new Scope([values])); + } + + return values; + } + + @autobind + private evaluate(block: Block, scope: Scope): any { + if (block.type === null) { + return null; + } + + if (block.type === 'number') { + return parseInt(block.value, 10); + } + + if (block.type === 'text' || block.type === 'multiLineText') { + return this._interpolate(block.value || '', scope); + } + + if (block.type === 'textList') { + return this._interpolate(block.value || '', scope).trim().split('\n'); + } + + if (block.type === 'ref') { + return scope.getState(block.value); + } + + if (block.type === 'aiScriptVar') { + if (this.aiscript) { + try { + return utils.valToJs(this.aiscript.scope.get(block.value)); + } catch (e) { + return null; + } + } else { + return null; + } + } + + if (isFnBlock(block)) { // ユーザー関数定義 + return { + slots: block.value.slots.map(x => x.name), + exec: (slotArg: Record) => { + return this.evaluate(block.value.expression, scope.createChildScope(slotArg, block.id)); + } + } as Fn; + } + + if (block.type.startsWith('fn:')) { // ユーザー関数呼び出し + const fnName = block.type.split(':')[1]; + const fn = scope.getState(fnName); + const args = {} as Record; + for (let i = 0; i < fn.slots.length; i++) { + const name = fn.slots[i]; + args[name] = this.evaluate(block.args[i], scope); + } + return fn.exec(args); + } + + if (block.args === undefined) return null; + + const date = new Date(); + const day = `${this.opts.visitor ? this.opts.visitor.id : ''} ${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`; + + const funcs: { [p in keyof typeof funcDefs]: Function } = { + not: (a: boolean) => !a, + or: (a: boolean, b: boolean) => a || b, + and: (a: boolean, b: boolean) => a && b, + eq: (a: any, b: any) => a === b, + notEq: (a: any, b: any) => a !== b, + gt: (a: number, b: number) => a > b, + lt: (a: number, b: number) => a < b, + gtEq: (a: number, b: number) => a >= b, + ltEq: (a: number, b: number) => a <= b, + if: (bool: boolean, a: any, b: any) => bool ? a : b, + for: (times: number, fn: Fn) => { + const result = []; + for (let i = 0; i < times; i++) { + result.push(fn.exec({ + [fn.slots[0]]: i + 1 + })); + } + return result; + }, + add: (a: number, b: number) => a + b, + subtract: (a: number, b: number) => a - b, + multiply: (a: number, b: number) => a * b, + divide: (a: number, b: number) => a / b, + mod: (a: number, b: number) => a % b, + round: (a: number) => Math.round(a), + strLen: (a: string) => a.length, + strPick: (a: string, b: number) => a[b - 1], + strReplace: (a: string, b: string, c: string) => a.split(b).join(c), + strReverse: (a: string) => a.split('').reverse().join(''), + join: (texts: string[], separator: string) => texts.join(separator || ''), + stringToNumber: (a: string) => parseInt(a), + numberToString: (a: number) => a.toString(), + splitStrByLine: (a: string) => a.split('\n'), + pick: (list: any[], i: number) => list[i - 1], + listLen: (list: any[]) => list.length, + random: (probability: number) => Math.floor(seedrandom(`${this.opts.randomSeed}:${block.id}`)() * 100) < probability, + rannum: (min: number, max: number) => min + Math.floor(seedrandom(`${this.opts.randomSeed}:${block.id}`)() * (max - min + 1)), + randomPick: (list: any[]) => list[Math.floor(seedrandom(`${this.opts.randomSeed}:${block.id}`)() * list.length)], + dailyRandom: (probability: number) => Math.floor(seedrandom(`${day}:${block.id}`)() * 100) < probability, + dailyRannum: (min: number, max: number) => min + Math.floor(seedrandom(`${day}:${block.id}`)() * (max - min + 1)), + dailyRandomPick: (list: any[]) => list[Math.floor(seedrandom(`${day}:${block.id}`)() * list.length)], + seedRandom: (seed: any, probability: number) => Math.floor(seedrandom(seed)() * 100) < probability, + seedRannum: (seed: any, min: number, max: number) => min + Math.floor(seedrandom(seed)() * (max - min + 1)), + seedRandomPick: (seed: any, list: any[]) => list[Math.floor(seedrandom(seed)() * list.length)], + DRPWPM: (list: string[]) => { + const xs = []; + let totalFactor = 0; + for (const x of list) { + const parts = x.split(' '); + const factor = parseInt(parts.pop()!, 10); + const text = parts.join(' '); + totalFactor += factor; + xs.push({ factor, text }); + } + const r = seedrandom(`${day}:${block.id}`)() * totalFactor; + let stackedFactor = 0; + for (const x of xs) { + if (r >= stackedFactor && r <= stackedFactor + x.factor) { + return x.text; + } else { + stackedFactor += x.factor; + } + } + return xs[0].text; + }, + }; + + const fnName = block.type; + const fn = (funcs as any)[fnName]; + if (fn == null) { + throw new HpmlError(`No such function '${fnName}'`); + } else { + return fn(...block.args.map(x => this.evaluate(x, scope))); + } + } +} + +class HpmlError extends Error { + public info?: any; + + constructor(message: string, info?: any) { + super(message); + + this.info = info; + + // Maintains proper stack trace for where our error was thrown (only available on V8) + if (Error.captureStackTrace) { + Error.captureStackTrace(this, HpmlError); + } + } +} + +class Scope { + private layerdStates: Record[]; + public name: string; + + constructor(layerdStates: Scope['layerdStates'], name?: Scope['name']) { + this.layerdStates = layerdStates; + this.name = name || 'anonymous'; + } + + @autobind + public createChildScope(states: Record, name?: Scope['name']): Scope { + const layer = [states, ...this.layerdStates]; + return new Scope(layer, name); + } + + /** + * 指定した名前の変数の値を取得します + * @param name 変数名 + */ + @autobind + public getState(name: string): any { + for (const later of this.layerdStates) { + const state = later[name]; + if (state !== undefined) { + return state; + } + } + + throw new HpmlError( + `No such variable '${name}' in scope '${this.name}'`, { + scope: this.layerdStates + }); + } +} diff --git a/src/client/scripts/hpml/index.ts b/src/client/scripts/hpml/index.ts new file mode 100644 index 0000000000..c87d5b9985 --- /dev/null +++ b/src/client/scripts/hpml/index.ts @@ -0,0 +1,139 @@ +/** + * Hpml + */ + +import { + faMagic, + faSquareRootAlt, + faAlignLeft, + faShareAlt, + faPlus, + faMinus, + faTimes, + faDivide, + faList, + faQuoteRight, + faEquals, + faGreaterThan, + faLessThan, + faGreaterThanEqual, + faLessThanEqual, + faNotEqual, + faDice, + faSortNumericUp, + faExchangeAlt, + faRecycle, + faIndent, + faCalculator, +} from '@fortawesome/free-solid-svg-icons'; +import { faFlag } from '@fortawesome/free-regular-svg-icons'; + +export type Block = { + id: string; + type: string; + args: Block[]; + value: V; +}; + +export type FnBlock = Block<{ + slots: { + name: string; + type: Type; + }[]; + expression: Block; +}>; + +export type Variable = Block & { + name: string; +}; + +export type Type = 'string' | 'number' | 'boolean' | 'stringArray' | null; + +export const funcDefs: Record = { + if: { in: ['boolean', 0, 0], out: 0, category: 'flow', icon: faShareAlt, }, + for: { in: ['number', 'function'], out: null, category: 'flow', icon: faRecycle, }, + not: { in: ['boolean'], out: 'boolean', category: 'logical', icon: faFlag, }, + or: { in: ['boolean', 'boolean'], out: 'boolean', category: 'logical', icon: faFlag, }, + and: { in: ['boolean', 'boolean'], out: 'boolean', category: 'logical', icon: faFlag, }, + add: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faPlus, }, + subtract: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faMinus, }, + multiply: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faTimes, }, + divide: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faDivide, }, + mod: { in: ['number', 'number'], out: 'number', category: 'operation', icon: faDivide, }, + round: { in: ['number'], out: 'number', category: 'operation', icon: faCalculator, }, + eq: { in: [0, 0], out: 'boolean', category: 'comparison', icon: faEquals, }, + notEq: { in: [0, 0], out: 'boolean', category: 'comparison', icon: faNotEqual, }, + gt: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faGreaterThan, }, + lt: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faLessThan, }, + gtEq: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faGreaterThanEqual, }, + ltEq: { in: ['number', 'number'], out: 'boolean', category: 'comparison', icon: faLessThanEqual, }, + strLen: { in: ['string'], out: 'number', category: 'text', icon: faQuoteRight, }, + strPick: { in: ['string', 'number'], out: 'string', category: 'text', icon: faQuoteRight, }, + strReplace: { in: ['string', 'string', 'string'], out: 'string', category: 'text', icon: faQuoteRight, }, + strReverse: { in: ['string'], out: 'string', category: 'text', icon: faQuoteRight, }, + join: { in: ['stringArray', 'string'], out: 'string', category: 'text', icon: faQuoteRight, }, + stringToNumber: { in: ['string'], out: 'number', category: 'convert', icon: faExchangeAlt, }, + numberToString: { in: ['number'], out: 'string', category: 'convert', icon: faExchangeAlt, }, + splitStrByLine: { in: ['string'], out: 'stringArray', category: 'convert', icon: faExchangeAlt, }, + pick: { in: [null, 'number'], out: null, category: 'list', icon: faIndent, }, + listLen: { in: [null], out: 'number', category: 'list', icon: faIndent, }, + rannum: { in: ['number', 'number'], out: 'number', category: 'random', icon: faDice, }, + dailyRannum: { in: ['number', 'number'], out: 'number', category: 'random', icon: faDice, }, + seedRannum: { in: [null, 'number', 'number'], out: 'number', category: 'random', icon: faDice, }, + random: { in: ['number'], out: 'boolean', category: 'random', icon: faDice, }, + dailyRandom: { in: ['number'], out: 'boolean', category: 'random', icon: faDice, }, + seedRandom: { in: [null, 'number'], out: 'boolean', category: 'random', icon: faDice, }, + randomPick: { in: [0], out: 0, category: 'random', icon: faDice, }, + dailyRandomPick: { in: [0], out: 0, category: 'random', icon: faDice, }, + seedRandomPick: { in: [null, 0], out: 0, category: 'random', icon: faDice, }, + DRPWPM: { in: ['stringArray'], out: 'string', category: 'random', icon: faDice, }, // dailyRandomPickWithProbabilityMapping +}; + +export const literalDefs: Record = { + text: { out: 'string', category: 'value', icon: faQuoteRight, }, + multiLineText: { out: 'string', category: 'value', icon: faAlignLeft, }, + textList: { out: 'stringArray', category: 'value', icon: faList, }, + number: { out: 'number', category: 'value', icon: faSortNumericUp, }, + ref: { out: null, category: 'value', icon: faMagic, }, + aiScriptVar: { out: null, category: 'value', icon: faMagic, }, + fn: { out: 'function', category: 'value', icon: faSquareRootAlt, }, +}; + +export const blockDefs = [ + ...Object.entries(literalDefs).map(([k, v]) => ({ + type: k, out: v.out, category: v.category, icon: v.icon + })), + ...Object.entries(funcDefs).map(([k, v]) => ({ + type: k, out: v.out, category: v.category, icon: v.icon + })) +]; + +export function isFnBlock(block: Block): block is FnBlock { + return block.type === 'fn'; +} + +export type PageVar = { name: string; value: any; type: Type; }; + +export const envVarsDef: Record = { + AI: 'string', + URL: 'string', + VERSION: 'string', + LOGIN: 'boolean', + NAME: 'string', + USERNAME: 'string', + USERID: 'string', + NOTES_COUNT: 'number', + FOLLOWERS_COUNT: 'number', + FOLLOWING_COUNT: 'number', + IS_CAT: 'boolean', + SEED: null, + YMD: 'string', + AISCRIPT_DISABLED: 'boolean', + NULL: null, +}; + +export function isLiteralBlock(v: Block) { + if (v.type === null) return true; + if (literalDefs[v.type]) return true; + return false; +} diff --git a/src/client/scripts/hpml/lib.ts b/src/client/scripts/hpml/lib.ts new file mode 100644 index 0000000000..9c71cfaba5 --- /dev/null +++ b/src/client/scripts/hpml/lib.ts @@ -0,0 +1,124 @@ +import * as tinycolor from 'tinycolor2'; +import Chart from 'chart.js'; +import { Hpml } from './evaluator'; +import { values, utils } from '@syuilo/aiscript'; + +// https://stackoverflow.com/questions/38493564/chart-area-background-color-chartjs +Chart.pluginService.register({ + beforeDraw: function (chart, easing) { + if (chart.config.options.chartArea && chart.config.options.chartArea.backgroundColor) { + var ctx = chart.chart.ctx; + ctx.save(); + ctx.fillStyle = chart.config.options.chartArea.backgroundColor; + ctx.fillRect(0, 0, chart.chart.width, chart.chart.height); + ctx.restore(); + } + } +}); + +export function initLib(hpml: Hpml) { + return { + 'MkPages:updated': values.FN_NATIVE(([callback]) => { + hpml.pageVarUpdatedCallback = callback; + }), + 'MkPages:get_canvas': values.FN_NATIVE(([id]) => { + utils.assertString(id); + const canvas = hpml.canvases[id.value]; + const ctx = canvas.getContext('2d'); + return values.OBJ(new Map([ + ['clear_rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.clearRect(x.value, y.value, width.value, height.value) })], + ['fill_rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.fillRect(x.value, y.value, width.value, height.value) })], + ['stroke_rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.strokeRect(x.value, y.value, width.value, height.value) })], + ['fill_text', values.FN_NATIVE(([text, x, y, width]) => { ctx.fillText(text.value, x.value, y.value, width ? width.value : undefined) })], + ['stroke_text', values.FN_NATIVE(([text, x, y, width]) => { ctx.strokeText(text.value, x.value, y.value, width ? width.value : undefined) })], + ['set_line_width', values.FN_NATIVE(([width]) => { ctx.lineWidth = width.value })], + ['set_font', values.FN_NATIVE(([font]) => { ctx.font = font.value })], + ['set_fill_style', values.FN_NATIVE(([style]) => { ctx.fillStyle = style.value })], + ['set_stroke_style', values.FN_NATIVE(([style]) => { ctx.strokeStyle = style.value })], + ['begin_path', values.FN_NATIVE(() => { ctx.beginPath() })], + ['close_path', values.FN_NATIVE(() => { ctx.closePath() })], + ['move_to', values.FN_NATIVE(([x, y]) => { ctx.moveTo(x.value, y.value) })], + ['line_to', values.FN_NATIVE(([x, y]) => { ctx.lineTo(x.value, y.value) })], + ['arc', values.FN_NATIVE(([x, y, radius, startAngle, endAngle]) => { ctx.arc(x.value, y.value, radius.value, startAngle.value, endAngle.value) })], + ['rect', values.FN_NATIVE(([x, y, width, height]) => { ctx.rect(x.value, y.value, width.value, height.value) })], + ['fill', values.FN_NATIVE(() => { ctx.fill() })], + ['stroke', values.FN_NATIVE(() => { ctx.stroke() })], + ])); + }), + 'MkPages:chart': values.FN_NATIVE(([id, opts]) => { + utils.assertString(id); + utils.assertObject(opts); + const canvas = hpml.canvases[id.value]; + const color = getComputedStyle(document.documentElement).getPropertyValue('--accent'); + Chart.defaults.global.defaultFontColor = '#555'; + const chart = new Chart(canvas, { + type: opts.value.get('type').value, + data: { + labels: opts.value.get('labels').value.map(x => x.value), + datasets: opts.value.get('datasets').value.map(x => ({ + label: x.value.has('label') ? x.value.get('label').value : '', + data: x.value.get('data').value.map(x => x.value), + pointRadius: 0, + lineTension: 0, + borderWidth: 2, + borderColor: x.value.has('color') ? x.value.get('color') : color, + backgroundColor: tinycolor(x.value.has('color') ? x.value.get('color') : color).setAlpha(0.1).toRgbString(), + })) + }, + options: { + responsive: false, + devicePixelRatio: 1.5, + title: { + display: opts.value.has('title'), + text: opts.value.has('title') ? opts.value.get('title').value : '', + fontSize: 14, + }, + layout: { + padding: { + left: 32, + right: 32, + top: opts.value.has('title') ? 16 : 32, + bottom: 16 + } + }, + legend: { + display: opts.value.get('datasets').value.filter(x => x.value.has('label') && x.value.get('label').value).length === 0 ? false : true, + position: 'bottom', + labels: { + boxWidth: 16, + } + }, + tooltips: { + enabled: false, + }, + chartArea: { + backgroundColor: '#fff' + }, + ...(opts.value.get('type').value === 'radar' ? { + scale: { + ticks: { + display: opts.value.has('show_tick_label') ? opts.value.get('show_tick_label').value : false, + min: opts.value.has('min') ? opts.value.get('min').value : undefined, + max: opts.value.has('max') ? opts.value.get('max').value : undefined, + maxTicksLimit: 8, + }, + pointLabels: { + fontSize: 12 + } + } + } : { + scales: { + yAxes: [{ + ticks: { + display: opts.value.has('show_tick_label') ? opts.value.get('show_tick_label').value : true, + min: opts.value.has('min') ? opts.value.get('min').value : undefined, + max: opts.value.has('max') ? opts.value.get('max').value : undefined, + } + }] + } + }) + } + }); + }) + }; +} diff --git a/src/client/scripts/hpml/type-checker.ts b/src/client/scripts/hpml/type-checker.ts new file mode 100644 index 0000000000..14950e0195 --- /dev/null +++ b/src/client/scripts/hpml/type-checker.ts @@ -0,0 +1,187 @@ +import autobind from 'autobind-decorator'; +import { Type, Block, funcDefs, envVarsDef, Variable, PageVar, isLiteralBlock } from '.'; + +type TypeError = { + arg: number; + expect: Type; + actual: Type; +}; + +/** + * Hpml type checker + */ +export class HpmlTypeChecker { + public variables: Variable[]; + public pageVars: PageVar[]; + + constructor(variables: HpmlTypeChecker['variables'] = [], pageVars: HpmlTypeChecker['pageVars'] = []) { + this.variables = variables; + this.pageVars = pageVars; + } + + @autobind + public typeCheck(v: Block): TypeError | null { + if (isLiteralBlock(v)) return null; + + const def = funcDefs[v.type]; + if (def == null) { + throw new Error('Unknown type: ' + v.type); + } + + const generic: Type[] = []; + + for (let i = 0; i < def.in.length; i++) { + const arg = def.in[i]; + const type = this.infer(v.args[i]); + if (type === null) continue; + + if (typeof arg === 'number') { + if (generic[arg] === undefined) { + generic[arg] = type; + } else if (type !== generic[arg]) { + return { + arg: i, + expect: generic[arg], + actual: type + }; + } + } else if (type !== arg) { + return { + arg: i, + expect: arg, + actual: type + }; + } + } + + return null; + } + + @autobind + public getExpectedType(v: Block, slot: number): Type { + const def = funcDefs[v.type]; + if (def == null) { + throw new Error('Unknown type: ' + v.type); + } + + const generic: Type[] = []; + + for (let i = 0; i < def.in.length; i++) { + const arg = def.in[i]; + const type = this.infer(v.args[i]); + if (type === null) continue; + + if (typeof arg === 'number') { + if (generic[arg] === undefined) { + generic[arg] = type; + } + } + } + + if (typeof def.in[slot] === 'number') { + return generic[def.in[slot]] || null; + } else { + return def.in[slot]; + } + } + + @autobind + public infer(v: Block): Type { + if (v.type === null) return null; + if (v.type === 'text') return 'string'; + if (v.type === 'multiLineText') return 'string'; + if (v.type === 'textList') return 'stringArray'; + if (v.type === 'number') return 'number'; + if (v.type === 'ref') { + const variable = this.variables.find(va => va.name === v.value); + if (variable) { + return this.infer(variable); + } + + const pageVar = this.pageVars.find(va => va.name === v.value); + if (pageVar) { + return pageVar.type; + } + + const envVar = envVarsDef[v.value]; + if (envVar !== undefined) { + return envVar; + } + + return null; + } + if (v.type === 'aiScriptVar') return null; + if (v.type === 'fn') return null; // todo + if (v.type.startsWith('fn:')) return null; // todo + + const generic: Type[] = []; + + const def = funcDefs[v.type]; + + for (let i = 0; i < def.in.length; i++) { + const arg = def.in[i]; + if (typeof arg === 'number') { + const type = this.infer(v.args[i]); + + if (generic[arg] === undefined) { + generic[arg] = type; + } else { + if (type !== generic[arg]) { + generic[arg] = null; + } + } + } + } + + if (typeof def.out === 'number') { + return generic[def.out]; + } else { + return def.out; + } + } + + @autobind + public getVarByName(name: string): Variable { + const v = this.variables.find(x => x.name === name); + if (v !== undefined) { + return v; + } else { + throw new Error(`No such variable '${name}'`); + } + } + + @autobind + public getVarsByType(type: Type): Variable[] { + if (type == null) return this.variables; + return this.variables.filter(x => (this.infer(x) === null) || (this.infer(x) === type)); + } + + @autobind + public getEnvVarsByType(type: Type): string[] { + if (type == null) return Object.keys(envVarsDef); + return Object.entries(envVarsDef).filter(([k, v]) => v === null || type === v).map(([k, v]) => k); + } + + @autobind + public getPageVarsByType(type: Type): string[] { + if (type == null) return this.pageVars.map(v => v.name); + return this.pageVars.filter(v => type === v.type).map(v => v.name); + } + + @autobind + public isUsedName(name: string) { + if (this.variables.some(v => v.name === name)) { + return true; + } + + if (this.pageVars.some(v => v.name === name)) { + return true; + } + + if (envVarsDef[name]) { + return true; + } + + return false; + } +} -- cgit v1.2.3-freya