extern/kalker
1
0
Fork 0
mirror of https://github.com/PaddiM8/kalker.git synced 2025-06-26 20:52:29 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added 'help' text to kalk_web

Browse Source
This commit is contained in:
PaddiM8 2021-01-02 18:39:48 +01:00
parent 8c1d9ae0bc
commit e2fbb6b1df
6 changed files with 103 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
kalk_web/package-lock.json generated
View File

@ -6866,6 +6866,58 @@
}
}
},
"raw-loader": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-4.0.2.tgz",
"integrity": "sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==",
"dev": true,
"requires": {
"loader-utils": "^2.0.0",
"schema-utils": "^3.0.0"
},
"dependencies": {
"ajv": {
"version": "6.12.6",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
"integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.1",
"fast-json-stable-stringify": "^2.0.0",
"json-schema-traverse": "^0.4.1",
"uri-js": "^4.2.2"
}
},
"fast-deep-equal": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
"dev": true
},
"loader-utils": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz",
"integrity": "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
},
"schema-utils": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
"integrity": "sha512-6D82/xSzO094ajanoOSbe4YvXWMfn2A//8Y1+MUqFAJul5Bs+yn36xbK9OtNDcRVSBJ9jjeoXftM6CfztsjOAA==",
"dev": true,
"requires": {
"@types/json-schema": "^7.0.6",
"ajv": "^6.12.5",
"ajv-keywords": "^3.5.2"
}
}
}
},
"rc": {
"version": "1.2.8",
"resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",

1
kalk_web/package.json
View File

@ -25,6 +25,7 @@
"mini-css-extract-plugin": "^0.9.0",
"optimize-css-assets-webpack-plugin": "^5.0.3",
"postcss-loader": "^3.0.0",
"raw-loader": "^4.0.2",
"sass": "^1.26.10",
"sass-loader": "^10.0.1",
"svelte": "^3.29.7",

23
kalk_web/src/Calculator.svelte
View File

@ -1,16 +1,30 @@
<script lang="ts">
import helpText from "../../kalk_cli/help.txt";
let outputLines: string[] = [];
let kalkContext;
function handleKeyDown(event: KeyboardEvent, kalk) {
if (event.key == "Enter") {
const target = event.target as HTMLInputElement;
const input = target.textContent;
let output: string;
if (input.trim() == "help") {
output = helpText;
} else {
// Calculate
if (!kalkContext) kalkContext = new kalk.Context();
const output = kalkContext.evaluate(input).toString();
try {
const result = kalkContext.evaluate(input);
if (result) output = result.toString();
} catch (err) {
output = `<span class="error">${err}</span>`;
}
}
outputLines = [...outputLines, input, output];
const inputHTML = `<span class="prompt">&gt;&gt;&nbsp;</span>${target.innerHTML}`;
outputLines = output
? [...outputLines, inputHTML, output]
: [...outputLines, inputHTML];
target.innerHTML = "";
}
}
@ -181,7 +195,10 @@
</style>
<div class="calculator">
<div class="output">
<p class="consoleLine">kalk</p>
<p class="consoleLine">
<span class="hint">Type 'help' for instructions.</span>
</p>
{#each outputLines as line}
<p class="consoleLine">
<span class="prompt">&gt;&gt;</span>

4
kalk_web/src/global.d.ts vendored Normal file
View File

@ -0,0 +1,4 @@
declare module "*.txt" {
const content: any;
export default content;
}

8
kalk_web/src/styles/index.scss
View File

@ -14,4 +14,12 @@ span.operator {
span.prompt {
color: mediumseagreen;
}
span.error {
color: tomato;
}
span.hint {
color: #9c9c9c;
}

32
kalk_web/webpack.config.ts
View File

@ -121,6 +121,10 @@ const config: webpack.Configuration & WebpackDevServer.Configuration = {
use: 'ts-loader',
exclude: /node_modules/,
},
{
test: /\.txt$/i,
loader: 'raw-loader',
},
],
},
devServer: {
@ -169,19 +173,19 @@ const tsconfigPath = path.resolve(__dirname, 'tsconfig.json');
const tsconfig = require('fs').existsSync(tsconfigPath) ? require(tsconfigPath) : {};
if ('compilerOptions' in tsconfig && 'paths' in tsconfig.compilerOptions) {
const aliases = tsconfig.compilerOptions.paths;
for (const alias in aliases) {
const paths = aliases[alias].map((p: string) => path.resolve(__dirname, p));
const aliases = tsconfig.compilerOptions.paths;
for (const alias in aliases) {
const paths = aliases[alias].map((p: string) => path.resolve(__dirname, p));
// Our tsconfig uses glob path formats, whereas webpack just wants directories
// We'll need to transform the glob format into a format acceptable to webpack
const wpAlias = alias.replace(/(\\|\/)\*$/, '');
const wpPaths = paths.map((p: string) => p.replace(/(\\|\/)\*$/, ''));
// Our tsconfig uses glob path formats, whereas webpack just wants directories
// We'll need to transform the glob format into a format acceptable to webpack
const wpAlias = alias.replace(/(\\|\/)\*$/, '');
const wpPaths = paths.map((p: string) => p.replace(/(\\|\/)\*$/, ''));
if (!(wpAlias in config.resolve.alias) && wpPaths.length) {
config.resolve.alias[wpAlias] = wpPaths.length > 1 ? wpPaths : wpPaths[0];
}
}
if (!(wpAlias in config.resolve.alias) && wpPaths.length) {
config.resolve.alias[wpAlias] = wpPaths.length > 1 ? wpPaths : wpPaths[0];
}
}
}
// These options should only apply to production builds
@ -195,9 +199,9 @@ if (prod) {
cssProcessorOptions: {
map: sourceMapsInProduction
? {
inline: false,
annotation: true,
}
inline: false,
annotation: true,
}
: false,
},
cssProcessorPluginOptions: {