4 |
5 | # Glisp
6 |
7 | A Lisp-based Design Tool Bridging Graphic Design and Computational Arts.
8 |
9 | [Demo](https://glisp.app)
10 | [GitHub](https://github.com/baku89/glisp/)
11 |
12 | 
13 |
--------------------------------------------------------------------------------
/src/components/use/index.ts:
--------------------------------------------------------------------------------
1 | export {default as useDraggable} from './use-draggable'
2 | export {default as useKeyboardState} from './use-keyboard-state'
3 | export {default as useResizeSensor} from './use-resize-sensor'
4 | export {default as useRem} from './use-rem'
5 | export {default as useGesture} from './use-gesture'
6 | export {default as useNumericVectorUpdator} from './use-numeric-vector-updator'
7 |
--------------------------------------------------------------------------------
/src/renderer/render-to-svg.ts:
--------------------------------------------------------------------------------
1 | import C2S from 'canvas2svg'
2 | import {MalVal} from '@/mal/types'
3 | import renderToContext from './render-to-context'
4 |
5 | export default function renderToSvg(
6 | view: MalVal,
7 | width: number,
8 | height: number
9 | ) {
10 | const ctx = new C2S(width, height)
11 |
12 | renderToContext(ctx, view)
13 |
14 | return ctx.getSerializedSvg(true)
15 | }
16 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | /dist
4 |
5 | /mal
6 |
7 | /repl/lib/*
8 | /ftp.info.js
9 |
10 | # local env files
11 | .env.local
12 | .env.*.local
13 |
14 | # Log files
15 | npm-debug.log*
16 | yarn-debug.log*
17 | yarn-error.log*
18 |
19 | # Editor directories and files
20 | .idea
21 | .vscode
22 | *.suo
23 | *.ntvs*
24 | *.njsproj
25 | *.sln
26 | *.sw?
27 |
28 | #Electron-builder output
29 | /dist_electron
30 |
--------------------------------------------------------------------------------
/docs/en/_sidebar.md:
--------------------------------------------------------------------------------
1 | - Getting Started
2 |
3 | - [What's Glisp?](about)
4 | - [Syntax](syntax)
5 | - [First Sketch](get-started)
6 |
7 | - Functionality
8 |
9 | - [Applying Styles](styles)
10 | - [Transformation](transform)
11 | - [Draw Tree](draw-tree)
12 | - Primitives
13 | - Handles
14 | - Docstring
15 | - Inverse Evaluation
16 | - Edit Mode
17 | - Units
18 |
19 | - Reference
20 |
21 | - [Cheat Sheet](cheatsheet)
22 | - [Function List](ref)
23 |
--------------------------------------------------------------------------------
/src/components/style/global.styl:
--------------------------------------------------------------------------------
1 | @import 'common.styl'
2 |
3 | *, ::after, ::before
4 | box-sizing border-box
5 | outline none
6 | -webkit-tap-highlight-color transparent
7 |
8 | html
9 | letter-spacing 0.05em
10 | font-size 12px
11 | font-family 'Fira Sans', sans-serif // monospace
12 | -webkit-font-smoothing antialiased
13 | -moz-osx-font-smoothing grayscale
14 |
15 | button
16 | outline none
17 | border none
18 | background none
19 | cursor pointer
20 | user-select none
--------------------------------------------------------------------------------
/src/components/PageIndex/use/index.ts:
--------------------------------------------------------------------------------
1 | export {default as useAppCommands} from './use-app-commands'
2 | export {default as useCompactScrollbar} from './use-compact-scrollbar'
3 | export {default as useDialogCommand} from './use-dialog-command'
4 | export {default as useDialogSettings} from './use-dialog-settings'
5 | export {default as useExpHistory} from './use-exp-history'
6 | export {default as useHitDetector} from './use-hit-detector'
7 | export {default as useURLParser} from './use-url-parser'
8 |
--------------------------------------------------------------------------------
/docs/schema.md:
--------------------------------------------------------------------------------
1 | # スキーマ
2 |
3 | Lisp は文字列としても編集できますが、インスペクタから編集することができます。例えば、円のパスを返すコードは `(circle [0 0] 100)` のようになりますが、Glisp ではこの引数部分を GUI から編集することができます。
4 |
5 | 
6 |
7 | この時、Lisp がどのように GUI コンポーネントへと変換されるかを、**スキーマ** によって設定することができます。例の circle の引数部分は、このようなスキーマ構造となっています。
8 |
9 | ```clojure
10 | [{:label "Center" :type "vec2"}
11 | {:label "Radius" :type "number"}]
12 | ```
13 |
14 | ### 値
15 |
16 | | 型 | UI |
17 | | --- | --- |
18 |
19 |
--------------------------------------------------------------------------------
/public/examples/10-print-chr.glisp:
--------------------------------------------------------------------------------
1 | ;; Example: 10 PRINT CHR$(205.5+RND(1)); : GOTO 10
2 | ;; https://10print.org
3 |
4 | (def w 36)
5 | (def s (/ w 2))
6 |
7 | (defn slash [i p]
8 | (path/transform
9 | (mat2d/* (translate p)
10 | (scale-x (compare (rnd i) .5)))
11 | (line [(- s) (- s)] [s s])))
12 |
13 | (background "snow")
14 |
15 | (style (stroke "salmon" 10)
16 | (for [y (column -5 5 w)
17 | x (column -5 5 w)
18 | :index i]
19 | (slash i [x y])))
--------------------------------------------------------------------------------
/src/pages/embed.ts:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import ResizeSensor from 'resize-sensor'
3 | import VueCompositionApi from '@vue/composition-api'
4 | import App from '@/components/PageEmbed.vue'
5 |
6 | Vue.config.productionTip = false
7 | Vue.use(VueCompositionApi)
8 |
9 | new Vue({
10 | render: h => h(App),
11 | }).$mount('#app')
12 |
13 | const el = document.documentElement
14 | new ResizeSensor(el, () => {
15 | const data = [document.body.scrollWidth, document.body.scrollHeight]
16 | window.parent.postMessage(data, '*')
17 | })
18 |
--------------------------------------------------------------------------------
/public/examples/hello-world.glisp:
--------------------------------------------------------------------------------
1 | ;; Example: Hello World
2 |
3 | (background "darkblue")
4 |
5 | ;; The basic syntax is almost same as Hiccup and Dali
6 | ;; https://github.com/stathissideris/dali/blob/master/doc/syntax.md
7 |
8 | (transform
9 | (translate [50 0])
10 | ;; Imagine former line as:
11 | ;;