src/alchi-test: init
This commit is contained in:
parent
ec47abb921
commit
33f456cc6e
1
src/alchi-test/.gitignore
vendored
Normal file
1
src/alchi-test/.gitignore
vendored
Normal file
|
@ -0,0 +1 @@
|
|||
node_modules
|
105
src/alchi-test/README.md
Normal file
105
src/alchi-test/README.md
Normal file
|
@ -0,0 +1,105 @@
|
|||
*Looking for a shareable component template? Go here --> [sveltejs/component-template](https://github.com/sveltejs/component-template)*
|
||||
|
||||
---
|
||||
|
||||
# svelte app
|
||||
|
||||
This is a project template for [Svelte](https://svelte.dev) apps. It lives at https://github.com/sveltejs/template.
|
||||
|
||||
To create a new project based on this template using [degit](https://github.com/Rich-Harris/degit):
|
||||
|
||||
```bash
|
||||
npx degit sveltejs/template svelte-app
|
||||
cd svelte-app
|
||||
```
|
||||
|
||||
*Note that you will need to have [Node.js](https://nodejs.org) installed.*
|
||||
|
||||
|
||||
## Get started
|
||||
|
||||
Install the dependencies...
|
||||
|
||||
```bash
|
||||
cd svelte-app
|
||||
npm install
|
||||
```
|
||||
|
||||
...then start [Rollup](https://rollupjs.org):
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
Navigate to [localhost:5000](http://localhost:5000). You should see your app running. Edit a component file in `src`, save it, and reload the page to see your changes.
|
||||
|
||||
By default, the server will only respond to requests from localhost. To allow connections from other computers, edit the `sirv` commands in package.json to include the option `--host 0.0.0.0`.
|
||||
|
||||
If you're using [Visual Studio Code](https://code.visualstudio.com/) we recommend installing the official extension [Svelte for VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode). If you are using other editors you may need to install a plugin in order to get syntax highlighting and intellisense.
|
||||
|
||||
## Building and running in production mode
|
||||
|
||||
To create an optimised version of the app:
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
You can run the newly built app with `npm run start`. This uses [sirv](https://github.com/lukeed/sirv), which is included in your package.json's `dependencies` so that the app will work when you deploy to platforms like [Heroku](https://heroku.com).
|
||||
|
||||
|
||||
## Single-page app mode
|
||||
|
||||
By default, sirv will only respond to requests that match files in `public`. This is to maximise compatibility with static fileservers, allowing you to deploy your app anywhere.
|
||||
|
||||
If you're building a single-page app (SPA) with multiple routes, sirv needs to be able to respond to requests for *any* path. You can make it so by editing the `"start"` command in package.json:
|
||||
|
||||
```js
|
||||
"start": "sirv public --single"
|
||||
```
|
||||
|
||||
## Using TypeScript
|
||||
|
||||
This template comes with a script to set up a TypeScript development environment, you can run it immediately after cloning the template with:
|
||||
|
||||
```bash
|
||||
node scripts/setupTypeScript.js
|
||||
```
|
||||
|
||||
Or remove the script via:
|
||||
|
||||
```bash
|
||||
rm scripts/setupTypeScript.js
|
||||
```
|
||||
|
||||
## Deploying to the web
|
||||
|
||||
### With [Vercel](https://vercel.com)
|
||||
|
||||
Install `vercel` if you haven't already:
|
||||
|
||||
```bash
|
||||
npm install -g vercel
|
||||
```
|
||||
|
||||
Then, from within your project folder:
|
||||
|
||||
```bash
|
||||
cd public
|
||||
vercel deploy --name my-project
|
||||
```
|
||||
|
||||
### With [surge](https://surge.sh/)
|
||||
|
||||
Install `surge` if you haven't already:
|
||||
|
||||
```bash
|
||||
npm install -g surge
|
||||
```
|
||||
|
||||
Then, from within your project folder:
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
surge public my-project.surge.sh
|
||||
```
|
32
src/alchi-test/package.json
Normal file
32
src/alchi-test/package.json
Normal file
|
@ -0,0 +1,32 @@
|
|||
{
|
||||
"name": "alchi-test",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "rollup -c",
|
||||
"dev": "rollup -c -w",
|
||||
"start": "sirv public",
|
||||
"convert-choices": "bash scripts/convert-choices-to-json.sh"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@alheimsins/b5-johnson-120-ipip-neo-pi-r": "^5.2.7",
|
||||
"@rollup/plugin-commonjs": "^17.0.0",
|
||||
"@rollup/plugin-json": "^4.1.0",
|
||||
"@rollup/plugin-node-resolve": "^11.0.0",
|
||||
"chroma-js": "^2.1.0",
|
||||
"json-stringify-pretty-compact": "^3.0.0",
|
||||
"ncs-color": "^1.0.0",
|
||||
"rollup": "^2.3.4",
|
||||
"rollup-plugin-copy": "^3.3.0",
|
||||
"rollup-plugin-css-only": "^3.1.0",
|
||||
"rollup-plugin-livereload": "^2.0.0",
|
||||
"rollup-plugin-svelte": "^7.0.0",
|
||||
"rollup-plugin-terser": "^7.0.0",
|
||||
"svelte": "^3.0.0",
|
||||
"svelte-knob": "^1.0.2",
|
||||
"underscore": "^1.12.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"sirv-cli": "^1.0.0"
|
||||
}
|
||||
}
|
1
src/alchi-test/public/build/bundle.css
Normal file
1
src/alchi-test/public/build/bundle.css
Normal file
File diff suppressed because one or more lines are too long
2
src/alchi-test/public/build/bundle.js
Normal file
2
src/alchi-test/public/build/bundle.js
Normal file
File diff suppressed because one or more lines are too long
1
src/alchi-test/public/build/bundle.js.map
Normal file
1
src/alchi-test/public/build/bundle.js.map
Normal file
File diff suppressed because one or more lines are too long
63
src/alchi-test/public/global.css
Normal file
63
src/alchi-test/public/global.css
Normal file
|
@ -0,0 +1,63 @@
|
|||
html, body {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #333;
|
||||
margin: 0;
|
||||
padding: 8px;
|
||||
box-sizing: border-box;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgb(0,100,200);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: rgb(0,80,160);
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
input, button, select, textarea {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
-webkit-padding: 0.4em 0;
|
||||
padding: 0.4em;
|
||||
margin: 0 0 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
input:disabled {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
button {
|
||||
color: #333;
|
||||
background-color: #f4f4f4;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
button:not(:disabled):active {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
border-color: #666;
|
||||
}
|
19
src/alchi-test/public/index.html
Normal file
19
src/alchi-test/public/index.html
Normal file
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width,initial-scale=1'>
|
||||
|
||||
<title>alchi-test</title>
|
||||
|
||||
<link rel='icon' type='image/png' href=''>
|
||||
<!--<link rel='icon' type='image/png' href='/favicon.png'>-->
|
||||
<!--<link rel='stylesheet' href='/global.css'>-->
|
||||
<link rel='stylesheet' href='/build/bundle.css'>
|
||||
|
||||
<script defer src='/build/bundle.js'></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
95
src/alchi-test/rollup.config.js
Normal file
95
src/alchi-test/rollup.config.js
Normal file
|
@ -0,0 +1,95 @@
|
|||
import svelte from 'rollup-plugin-svelte';
|
||||
import commonjs from '@rollup/plugin-commonjs';
|
||||
import resolve from '@rollup/plugin-node-resolve';
|
||||
import livereload from 'rollup-plugin-livereload';
|
||||
import { terser } from 'rollup-plugin-terser';
|
||||
import css from 'rollup-plugin-css-only';
|
||||
import json from '@rollup/plugin-json';
|
||||
import copy from 'rollup-plugin-copy'
|
||||
|
||||
const production = !process.env.ROLLUP_WATCH;
|
||||
|
||||
function serve() {
|
||||
let server;
|
||||
|
||||
function toExit() {
|
||||
if (server) server.kill(0);
|
||||
}
|
||||
|
||||
return {
|
||||
writeBundle() {
|
||||
if (server) return;
|
||||
server = require('child_process').spawn('npm', ['run', 'start', '--', '--dev'], {
|
||||
stdio: ['ignore', 'inherit', 'inherit'],
|
||||
shell: true
|
||||
});
|
||||
|
||||
process.on('SIGTERM', toExit);
|
||||
process.on('exit', toExit);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
export default {
|
||||
input: 'src/main.js',
|
||||
output: {
|
||||
sourcemap: true,
|
||||
format: 'iife',
|
||||
name: 'app',
|
||||
file: 'public/build/bundle.js'
|
||||
},
|
||||
plugins: [
|
||||
svelte({
|
||||
compilerOptions: {
|
||||
// enable run-time checks when not in production
|
||||
dev: !production
|
||||
}
|
||||
}),
|
||||
// we'll extract any component CSS out into
|
||||
// a separate file - better for performance
|
||||
css({ output: 'bundle.css' }),
|
||||
|
||||
// If you have external dependencies installed from
|
||||
// npm, you'll most likely need these plugins. In
|
||||
// some cases you'll need additional configuration -
|
||||
// consult the documentation for details:
|
||||
// https://github.com/rollup/plugins/tree/master/packages/commonjs
|
||||
resolve({
|
||||
browser: true,
|
||||
dedupe: ['svelte']
|
||||
}),
|
||||
commonjs({
|
||||
include: 'node_modules/**',
|
||||
//dynamicRequireTargets: ['node_modules/@alheimsins/b5-johnson-120-ipip-neo-pi-r/data/**'],
|
||||
transformMixedEsModules: true,
|
||||
}),
|
||||
|
||||
json(),
|
||||
|
||||
copy({
|
||||
targets: [
|
||||
/*
|
||||
{ src: 'node_modules/@alheimsins/b5-johnson-120-ipip-neo-pi-r/data', dest: 'public' },
|
||||
{ src: 'src/index.html', dest: 'dist/public' },
|
||||
{ src: ['assets/fonts/arial.woff', 'assets/fonts/arial.woff2'], dest: 'dist/public/fonts' },
|
||||
{ src: 'assets/images/**'+'/*', dest: 'dist/public/images' }
|
||||
*/
|
||||
]
|
||||
}),
|
||||
|
||||
// In dev mode, call `npm run start` once
|
||||
// the bundle has been generated
|
||||
!production && serve(),
|
||||
|
||||
// Watch the `public` directory and refresh the
|
||||
// browser on changes when not in production
|
||||
!production && livereload('public'),
|
||||
|
||||
// If we're building for production (npm run build
|
||||
// instead of npm run dev), minify
|
||||
production && terser()
|
||||
],
|
||||
watch: {
|
||||
clearScreen: false
|
||||
}
|
||||
};
|
1
src/alchi-test/src/.gitignore
vendored
Normal file
1
src/alchi-test/src/.gitignore
vendored
Normal file
|
@ -0,0 +1 @@
|
|||
svelte-knob/.git
|
1516
src/alchi-test/src/App.svelte
Normal file
1516
src/alchi-test/src/App.svelte
Normal file
File diff suppressed because it is too large
Load diff
461
src/alchi-test/src/bigfive2alchi.js
Normal file
461
src/alchi-test/src/bigfive2alchi.js
Normal file
|
@ -0,0 +1,461 @@
|
|||
|
||||
// big five to alchi
|
||||
|
||||
// M: maximum value. 1 or 100
|
||||
function elementOfBigfive({ o, c, e, a, n }, M=1) {
|
||||
/*
|
||||
// formula 1
|
||||
return {
|
||||
e1: ( o + e + (M-n) + c + (M-a))/5,
|
||||
e2: ((M-o) + (M-e) + n + (M-c) + (M-a))/5,
|
||||
e3: ( o + e + n + (M-c) + a )/5,
|
||||
e4: ((M-o) + (M-e) + (M-n) + c + a )/5,
|
||||
};
|
||||
*/
|
||||
|
||||
// formula 2
|
||||
return {
|
||||
e1: ( o + e + (M-n) + c + 2*(M-a))/6,
|
||||
e2: ((M-o) + (M-e) + n + (M-c) + 2*(M-a))/6,
|
||||
e3: ( o + e + n + (M-c) + 2* a )/6,
|
||||
e4: ((M-o) + (M-e) + (M-n) + c + 2* a )/6,
|
||||
};
|
||||
}
|
||||
|
||||
const oppositeElement = {
|
||||
e1: 'e2',
|
||||
e2: 'e1',
|
||||
e3: 'e4',
|
||||
e4: 'e3',
|
||||
};
|
||||
|
||||
function modalityOfElements(baseElement, secondElement) {
|
||||
if (baseElement == secondElement) return 'mutable';
|
||||
if (secondElement == oppositeElement[baseElement]) return 'forbidden';
|
||||
// cardinal = x plays a childish element (fire or air)
|
||||
// fixed = x plays a mature element (earth or water)
|
||||
if (secondElement == 'e1' || secondElement == 'e3') return 'cardinal';
|
||||
return 'fixed';
|
||||
}
|
||||
|
||||
const nameOfMBTI = {
|
||||
e1: { e1: 'INTP', e2: 'INFJ', e3: 'INFP', e4: 'INTJ' },
|
||||
e2: { e1: 'ESTP', e2: 'ESFJ', e3: 'ESFP', e4: 'ESTJ' },
|
||||
e3: { e1: 'ENTP', e2: 'ENFJ', e3: 'ENFP', e4: 'ENTJ' },
|
||||
e4: { e1: 'ISTP', e2: 'ISFJ', e3: 'ISFP', e4: 'ISTJ' },
|
||||
};
|
||||
|
||||
const nameOfZodiac = {
|
||||
e1: { e1: 'Sagittarius', e2: 'forbidden', e3: 'Aries', e4: 'Leo' },
|
||||
e2: { e1: 'forbidden', e2: 'Virgo', e3: 'Capricorn', e4: 'Taurus' },
|
||||
e3: { e1: 'Libra', e2: 'Aquarius', e3: 'Gemini', e4: 'forbidden' },
|
||||
e4: { e1: 'Cancer', e2: 'Scorpius', e3: 'forbidden', e4: 'Pisces' },
|
||||
};
|
||||
|
||||
const nameOfDiagonal = {
|
||||
'12': 'fire-earth',
|
||||
'34': 'air-water',
|
||||
};
|
||||
|
||||
function zodiacOfElements(baseElement, secondElement) {
|
||||
return nameOfZodiac[baseElement] && nameOfZodiac[baseElement][secondElement];
|
||||
}
|
||||
|
||||
function mbtiOfElements(baseElement, secondElement) {
|
||||
return nameOfMBTI[baseElement] && nameOfMBTI[baseElement][secondElement];
|
||||
}
|
||||
|
||||
function diagonalOfAgree(agree) {
|
||||
if (agree > 50) return 'air-water';
|
||||
if (agree < 50) return 'fire-earth';
|
||||
if (agree == 50) return undefined;
|
||||
}
|
||||
|
||||
const cardinalElementOfDiagonal = { '12': 'e3', '34': 'e1' };
|
||||
const fixedElementOfDiagonal = { '12': 'e4', '34': 'e2' };
|
||||
|
||||
// round
|
||||
function num(n) {
|
||||
return Math.round(n);
|
||||
return n.toFixed(1);
|
||||
}
|
||||
|
||||
function ambiguousInterpretation(bigfive) {
|
||||
const { o, c, e, a, n } = bigfive;
|
||||
|
||||
// TODO verify: result is ambiguous. this is a sign of element earth or element water.
|
||||
|
||||
return `\
|
||||
result is ambiguous. this is a sign of element earth or element water.
|
||||
|
||||
we expect these correlations:
|
||||
|
||||
* high O = high E
|
||||
* high C = low N
|
||||
|
||||
generated by [alchi/src/bigfive.html](https://milahu.github.io/alchi/src/bigfive.html#ocean=${o}.${c}.${e}.${a}.${n})
|
||||
`;
|
||||
}
|
||||
|
||||
function getInterpretation(bigfive, elementObject) {
|
||||
const { o, c, e, a, n } = bigfive;
|
||||
let res = '';
|
||||
const elementList = Object.keys(elementObject).map(elm => [elm, elementObject[elm]]);
|
||||
elementList.sort((a, b) => b[1] - a[1]); // sort descending
|
||||
|
||||
const range = elementList[0][1] - elementList[3][1];
|
||||
if (range < 10) {
|
||||
return ambiguousInterpretation(bigfive);
|
||||
}
|
||||
|
||||
const rangeStrong = elementList[0][1] - elementList[2][1];
|
||||
const rangeWeak = elementList[1][1] - elementList[3][1];
|
||||
|
||||
// score vs opposite element
|
||||
const fireScore = elementObject.e1 - elementObject.e2;
|
||||
const airScore = elementObject.e3 - elementObject.e4;
|
||||
|
||||
//const virtualAgree = 50 + 5/8*(Math.abs(airScore) - Math.abs(fireScore)); // formula 1
|
||||
const virtualAgree = (200/3 + (Math.abs(airScore) - Math.abs(fireScore)))/(4/3); // formula 2
|
||||
|
||||
const diagonalSign = Math.sign(Math.abs(fireScore) - Math.abs(airScore));
|
||||
|
||||
const diagonalMap = { '-1': '34', '0': '?', '1': '12' };
|
||||
const diagonal = diagonalMap[diagonalSign];
|
||||
|
||||
const baseElementFromDiagonal =
|
||||
diagonal == '?' ? '?' :
|
||||
diagonal == '12'
|
||||
? ( fireScore == 0 ? '?' : fireScore > 0 ? 'e1' : 'e2' )
|
||||
: ( airScore == 0 ? '?' : airScore > 0 ? 'e3' : 'e4' )
|
||||
;
|
||||
const baseElement = baseElementFromDiagonal;
|
||||
|
||||
const cardinalElement = cardinalElementOfDiagonal[diagonal];
|
||||
const fixedElement = fixedElementOfDiagonal[diagonal];
|
||||
|
||||
const modalityRange = elementObject[cardinalElement] - elementObject[fixedElement];
|
||||
const modality = Math.abs(modalityRange) < 5 ? 'mutable'
|
||||
: modalityRange > 0 ? 'cardinal' : 'fixed';
|
||||
const modalityElement =
|
||||
modality == 'mutable' ? baseElement :
|
||||
modality == 'cardinal' ? cardinalElement : fixedElement
|
||||
;
|
||||
|
||||
res += `\
|
||||
derivation: element and modality:
|
||||
|
||||
* diagonalRange: ${num(fireScore)} fire-earth + ${num(airScore)} air-water
|
||||
* element ${nameOfElement[baseElementFromDiagonal]}
|
||||
* valid modalities (cardinal mutable fixed): ${nameOfElement[cardinalElement]} ${nameOfElement[baseElement]} ${nameOfElement[fixedElement]}
|
||||
* modalityRange: ${num(modalityRange)} ${nameOfElement[cardinalElement]}-${nameOfElement[fixedElement]}
|
||||
* ${modality} modality
|
||||
* ${nameOfElement[baseElementFromDiagonal]} plays ${nameOfElement[modalityElement]}
|
||||
|
||||
verification: virtual diagonal, computed from O C E N:
|
||||
|
||||
* virtualAgree ${num(virtualAgree)}
|
||||
* virtualDiagonal ${nameOfDiagonal[diagonal]}
|
||||
`;
|
||||
|
||||
|
||||
|
||||
if (Math.sign(virtualAgree - 50) != Math.sign(bigfive.a - 50)) {
|
||||
res += `* contradiction: agree ${bigfive.a} + virtualAgree ${num(virtualAgree)}\n`;
|
||||
}
|
||||
else {
|
||||
res += `* symmetry: agree ${bigfive.a} + virtualAgree ${num(virtualAgree)}\n`;
|
||||
}
|
||||
|
||||
//console.log(`baseElement ${baseElement}`);
|
||||
if (baseElement == '?') {
|
||||
return ambiguousInterpretation(bigfive);;
|
||||
}
|
||||
else {
|
||||
|
||||
// prepend to res
|
||||
res = `\
|
||||
short: ${nameOfElement[baseElement]} plays ${nameOfElement[modalityElement]}
|
||||
|
||||
translations:
|
||||
|
||||
* ${mbtiOfElements(baseElement, modalityElement)} in MBTI
|
||||
* ${zodiacOfElements(baseElement, modalityElement)} = ${modalityOfElements(baseElement, modalityElement)} ${nameOfElement[baseElement]} in zodiac (calendar-astrology is fake)
|
||||
* ${carlJungNameOfModality[modality]} ${carlJungNameOfElement[baseElement]} in Carl Jung
|
||||
|
||||
generated by [alchi/src/bigfive.html](https://milahu.github.io/alchi/src/bigfive.html#ocean=${o}.${c}.${e}.${a}.${n})
|
||||
|
||||
--
|
||||
${modality != 'mutable' ? `
|
||||
note: verbal tests (questionnaires) easily confuse element and modality,
|
||||
so element and modality can be swapped:
|
||||
|
||||
* ${nameOfElement[modalityElement]} plays ${nameOfElement[baseElement]}
|
||||
* ${mbtiOfElements(modalityElement, baseElement)}
|
||||
* ${zodiacOfElements(modalityElement, baseElement)}
|
||||
* ${modalityOfElements(modalityElement, baseElement)} ${nameOfElement[modalityElement]}
|
||||
|
||||
to find your element, try to find your body type:
|
||||
|
||||
* heart-shape → fire
|
||||
* pear-shape → earth
|
||||
* endo-morph → air
|
||||
* ecto-morph → water
|
||||
` : ''}
|
||||
element ${nameOfElement[baseElement]} translations:
|
||||
|
||||
* ${keirseyNameOfElement[baseElement]} in David Keirsey
|
||||
* ${sheldonNameOfElement[baseElement]} in William Sheldon
|
||||
* ${dressColorOfElement[baseElement]} in alchi dress color
|
||||
* ${southParkNameOfElement[baseElement]} in South Park
|
||||
* ${harryPotterNameOfElement[baseElement]} in Harry Potter
|
||||
* ${healthtypeNameOfElement[baseElement]} in ph360.me (health type)
|
||||
* ${flowprofileNameOfElement[baseElement]} in flowgenomeproject (flow profile)
|
||||
|
||||
` + res;
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
[ note: verbal tests (questionnaires) easily confuse element and modality, ]
|
||||
|
||||
... or element and modality show your two modalities (cardinal and fixed).
|
||||
|
||||
TODO verify
|
||||
|
||||
*/
|
||||
|
||||
return res;
|
||||
}
|
||||
|
||||
const nameOfElement = {
|
||||
e1: 'fire',
|
||||
e2: 'earth',
|
||||
e3: 'air',
|
||||
e4: 'water',
|
||||
};
|
||||
|
||||
const keirseyNameOfElement = {
|
||||
e1: 'Artisan',
|
||||
e2: 'Guardian',
|
||||
e3: 'Idealist',
|
||||
e4: 'Rational',
|
||||
};
|
||||
|
||||
const carlJungNameOfElement = {
|
||||
e1: 'Ntuiting',
|
||||
e2: 'Sensing',
|
||||
e3: 'Feeling',
|
||||
e4: 'Thinking',
|
||||
};
|
||||
|
||||
const carlJungNameOfModality = {
|
||||
'cardinal': 'extraverted',
|
||||
'mutable': 'ambiverted',
|
||||
'fixed': 'introverted',
|
||||
};
|
||||
|
||||
const sheldonNameOfElement = {
|
||||
e1: 'heart-shape mesomorph',
|
||||
e2: 'pear-shape mesomorph',
|
||||
e3: 'hourglass-shape endomorph',
|
||||
e4: 'rhombus-shape ectomorph',
|
||||
};
|
||||
|
||||
const dressColorOfElement = {
|
||||
e1: 'yellow top + blue bottom',
|
||||
e2: 'blue bottom + yellow top',
|
||||
e3: 'red top + green bottom',
|
||||
e4: 'green top + red bottom',
|
||||
};
|
||||
|
||||
const southParkNameOfElement = {
|
||||
e1: 'Kenny',
|
||||
e2: 'Stan',
|
||||
e3: 'Eric',
|
||||
e4: 'Kyle',
|
||||
};
|
||||
|
||||
const harryPotterNameOfElement = {
|
||||
e1: 'Gryffindor',
|
||||
e2: 'Hufflepuff',
|
||||
e3: 'Ravenclaw',
|
||||
e4: 'Slytherin',
|
||||
};
|
||||
|
||||
const healthtypeNameOfElement = {
|
||||
e1: 'Crusader',
|
||||
e2: 'Guardian',
|
||||
e3: 'Connector',
|
||||
e4: 'Sensor',
|
||||
};
|
||||
|
||||
const flowprofileNameOfElement = {
|
||||
e1: 'Hard Charger',
|
||||
e2: 'Flow Goer',
|
||||
e3: 'Crowd Pleaser',
|
||||
e4: 'Deep Thinker',
|
||||
};
|
||||
|
||||
|
||||
|
||||
function sortedElements(elementObject) {
|
||||
const elementList = Object.keys(elementObject).map(elm => [elm, elementObject[elm]]);
|
||||
elementList.sort((a, b) => b[1] - a[1]); // sort descending
|
||||
return elementList.map(([elm, val]) => `${num(val)} ${nameOfElement[elm]}`).join(' + ');
|
||||
}
|
||||
|
||||
export function handle_form_change(form) {
|
||||
console.dir({ form });
|
||||
const bigfive = Array.from(form).reduce((acc, input) => {
|
||||
acc[input.name] = input.valueAsNumber;
|
||||
document.getElementById(input.name).innerHTML = input.value;
|
||||
return acc;
|
||||
}, {});
|
||||
|
||||
handle_new_bigfive(bigfive);
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function svg_of_bigfive(bigfive) {
|
||||
|
||||
const elements = elementOfBigfive(bigfive, 100);
|
||||
const { o, c, e, a, n } = bigfive;
|
||||
const { e1, e2, e3, e4 } = elements;
|
||||
|
||||
// upscale
|
||||
//const scale_x = (a > 50) ? 1 : (2 - (a / 50));
|
||||
//const scale_y = (a < 50) ? 1 : (0 + (a / 50));
|
||||
|
||||
// downscale to 50%
|
||||
//const scale_x = (a > 50) ? 1 : 1/(2 - (a / 50));
|
||||
//const scale_y = (a < 50) ? 1 : 1/(0 + (a / 50));
|
||||
|
||||
// downscale to 75%
|
||||
const scale_x = (a > 50) ? 1 : ((1/(2 - (a / 50)) - 1) * 0.5 + 1);
|
||||
const scale_y = (a < 50) ? 1 : ((1/(0 + (a / 50)) - 1) * 0.5 + 1);
|
||||
|
||||
//console.log(`a = ${a} scale_x = ${scale_x} scale_y = ${scale_y}`);
|
||||
|
||||
return `
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 240 240"
|
||||
>
|
||||
<defs>
|
||||
<clipPath id="clip-colors">
|
||||
<path fill="none" stroke="black" stroke-width="5" d="
|
||||
M+0+${e1 * scale_y} L+${e3 * scale_x}+0 L+0-${e2 * scale_y} L-${e4 * scale_x}+0 z
|
||||
"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<g transform="translate(120, 120) scale(${scale_x}, ${scale_y})">
|
||||
<!-- stroke-linejoin="round" stroke-linecap="round" -->
|
||||
|
||||
<!-- coordinate axis -->
|
||||
<path fill="none" stroke="black" stroke-width="2" d="
|
||||
M+0+100 L+0-100
|
||||
M+100+0 L-100+0
|
||||
"/>
|
||||
|
||||
<!-- background colors -->
|
||||
<g clip-path="url(#clip-colors)">
|
||||
<path fill="green" d="M+0+0 L+100-100 L-100-100 z"/>
|
||||
<path fill="red" d="M+0+0 L+100+100 L-100+100 z"/>
|
||||
<path fill="yellow" d="M+0+0 L+100+100 L+100-100 z"/>
|
||||
<path fill="blue" d="M+0+0 L-100+100 L-100-100 z"/>
|
||||
</g>
|
||||
|
||||
<!-- diamond frame -->
|
||||
<path fill="none" stroke="black" stroke-width="3" d="
|
||||
M+0+100 L+100+0 L+0-100 L-100+0 z
|
||||
"/>
|
||||
|
||||
<!-- labels. explicit color to make darkreader work -->
|
||||
<text x="0" y="0" fill="black" alignment-baseline="mathematical" text-anchor="middle">
|
||||
<tspan dominant-baseline="central" x="0" y="110">${Math.round(e1)} Fire</tspan>
|
||||
<tspan dominant-baseline="central" x="0" y="-110">${Math.round(e2)} Earth</tspan>
|
||||
|
||||
<tspan dominant-baseline="central" x="110" y="-30">${Math.round(e3)}</tspan>
|
||||
<tspan dominant-baseline="central" x="110" y="0">A</tspan>
|
||||
<tspan dominant-baseline="central" x="110" y="15">i</tspan>
|
||||
<tspan dominant-baseline="central" x="110" y="30">r</tspan>
|
||||
|
||||
<tspan dominant-baseline="central" x="-110" y="-45">${Math.round(e4)}</tspan>
|
||||
<tspan dominant-baseline="central" x="-110" y="-15">W</tspan>
|
||||
<tspan dominant-baseline="central" x="-110" y="0">a</tspan>
|
||||
<tspan dominant-baseline="central" x="-110" y="15">t</tspan>
|
||||
<tspan dominant-baseline="central" x="-110" y="30">e</tspan>
|
||||
<tspan dominant-baseline="central" x="-110" y="45">r</tspan>
|
||||
</text>
|
||||
|
||||
</g>
|
||||
</svg>
|
||||
`;
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function handle_new_bigfive(bigfive, target = null) {
|
||||
//console.dir({ bigfive });
|
||||
const elements = elementOfBigfive(bigfive, 100);
|
||||
const { o, c, e, a, n } = bigfive;
|
||||
const { e1, e2, e3, e4 } = elements;
|
||||
console.log(`o ${o} + c ${c} + e ${e} + a ${a} + n ${n} -> e1 ${e1} + e2 ${e2} + e3 ${e3} + e4 ${e4}`);
|
||||
|
||||
// set URL
|
||||
document.location.hash = `#ocean=${o}.${c}.${e}.${a}.${n}`;
|
||||
|
||||
//document.getElementById('result').innerHTML = `o ${o} + c ${c} + e ${e} + a ${a} + n ${n} → e1 ${e1} + e2 ${e2} + e3 ${e3} + e4 ${e4}`;
|
||||
//document.getElementById('result').innerHTML = `${o} open + ${c} conscient + ${e} extravert + ${a} agree + ${n} neuro → ${e1} fire + ${e2} earth + ${e3} air + ${e4} water`;
|
||||
|
||||
//${o} open + ${c} conscient + ${e} extravert + ${a} agree + ${n} neuro
|
||||
//ocean ${o}.${c}.${e}.${a}.${n} → ${sortedElements(elements)}
|
||||
|
||||
target || (target = document.getElementById('result'));
|
||||
|
||||
target.innerHTML = `
|
||||
|
||||
<pre>
|
||||
ocean ${o} ${c} ${e} ${a} ${n} → ${sortedElements(elements)}
|
||||
|
||||
${getInterpretation(bigfive, elements)}
|
||||
</pre>
|
||||
`;
|
||||
|
||||
return;
|
||||
|
||||
//console.dir({ bigfive });
|
||||
const outform = document.getElementById('output');
|
||||
Array.from(outform).forEach(input => {
|
||||
//console.dir({ input: { name: input.name, value: input.value, elm: input.name[1] } });
|
||||
input.value = elements[input.name];
|
||||
document.getElementById(input.name).innerHTML = input.value;
|
||||
});
|
||||
}
|
||||
|
||||
const bigfiveOfElement = {
|
||||
e1: { o: 100, c: 100, e: 100, a: 0, n: 0 },
|
||||
e2: { o: 0, c: 0, e: 0, a: 0, n: 100 },
|
||||
e3: { o: 100, c: 0, e: 100, a: 100, n: 100 },
|
||||
e4: { o: 0, c: 100, e: 0, a: 100, n: 0 },
|
||||
};
|
||||
|
||||
|
||||
function setInput(bigfive) {
|
||||
const inputForm = document.getElementById('input');
|
||||
Array.from(inputForm).forEach(input => {
|
||||
input.value = bigfive[input.name];
|
||||
});
|
||||
inputForm.dispatchEvent(new Event('change'));
|
||||
}
|
||||
|
||||
function e(elm) {
|
||||
const bigfive = bigfiveOfElement['e'+elm];
|
||||
setInput(bigfive);
|
||||
}
|
||||
|
||||
|
10
src/alchi-test/src/main.js
Normal file
10
src/alchi-test/src/main.js
Normal file
|
@ -0,0 +1,10 @@
|
|||
import App from './App.svelte';
|
||||
|
||||
const app = new App({
|
||||
target: document.body,
|
||||
props: {
|
||||
name: 'world'
|
||||
}
|
||||
});
|
||||
|
||||
export default app;
|
32
src/alchi-test/src/test-data/README.md
Normal file
32
src/alchi-test/src/test-data/README.md
Normal file
|
@ -0,0 +1,32 @@
|
|||
we try to keep all important files in the `alchi` monorepo.
|
||||
|
||||
these files have a permissive license,
|
||||
so we can safely keep a copy here:
|
||||
|
||||
* big five from the NPM package `@alheimsins/b5-johnson-120-ipip-neo-pi-r` ([github](https://github.com/Alheimsins/b5-johnson-120-ipip-neo-pi-r/issues)) (MIT license)
|
||||
* based on the [International Personality Item Pool](https://ipip.ori.org/) ([public domain](https://ipip.ori.org/newPermission.htm))
|
||||
|
||||
other files have unclear licensing,
|
||||
so we do not know, if we can include them here.
|
||||
we could beg the authors for a permission to copy the files,
|
||||
but we have better things to do with our time : )
|
||||
|
||||
as a temporary workaround,
|
||||
we move these files to separate repositories,
|
||||
to minimize loss on DCMA takedowns by copyright trolls.
|
||||
|
||||
as a fallback, we provide scraping tools for the client side,
|
||||
so if a file is taken down for "copyright infringement",
|
||||
our users can still access the data.
|
||||
|
||||
if the trolls succeed to takedown our `alchi` monorepo,
|
||||
we have multiple backup locations, see [MIRRORS.md](../../../../MIRRORS.md).
|
||||
|
||||
ps: fuck all the censorship laws!
|
||||
copyright, patents, personal right for privacy,
|
||||
politeness, political correctness, war on hatespeech, war on blasphemy, ....
|
||||
they all are shit, cos they always only help the wrong people.
|
||||
|
||||
pps: we also reject the belief, that only polite people can be smart.
|
||||
"iustum necare reges impios" my ass!
|
||||
sadly the world is more complex than "black and white".
|
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue