dakedres/ronin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Started guides

Browse Source
This commit is contained in:
Devine Lu Linvega 2019-07-13 20:19:18 +09:00
parent 55b1e54fad
commit d309a9f032
9 changed files with 127 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
desktop/sources/index.html
View File

@ -11,6 +11,7 @@
<link rel="stylesheet" type="text/css" href="links/reset.css"/>
<link rel="stylesheet" type="text/css" href="links/fonts.css"/>
<link rel="stylesheet" type="text/css" href="links/main.css"/>
<link rel="stylesheet" type="text/css" href="links/theme.css"/>
<title>Ronin</title>
</head>
<body>
@ -41,6 +42,7 @@
ronin.controller.addRole('default', 'Edit', 'selectall')
ronin.controller.add("default","Project","Run",() => { ronin.commander.run(); },"CmdOrCtrl+R");
ronin.controller.add("default","Commander","Toggle",() => { ronin.commander.toggle(); },"CmdOrCtrl+K");
ronin.controller.commit();

14
desktop/sources/links/main.css
View File

@ -1,10 +1,12 @@
body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular",courier,monospace; background:000; -webkit-user-select: none; font-size:12px;}
body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular",courier,monospace; background:000; -webkit-app-region: drag; -webkit-user-select: none; font-size:12px; transition: background 500ms}
*:focus {outline: none; }
#ronin { background:var(--b_low); height: 100vh; width:100vw; -webkit-app-region: drag; }
#ronin #commander { z-index: 9000; top: 0px; left: 0px; position: absolute; width: calc(50vw - 90px); height: calc(100vh - 60px); margin: 30px; border-right: 1px solid #333; -webkit-app-region: no-drag; padding-right: 30px;}
#ronin #commander textarea { background: none; width: 100%; height: calc(100vh - 75px); resize: none; font-size: 12px;color: white; }
#ronin #commander div#status { color:#555; }
#ronin { height: calc(100vh - 60px); width:calc(100vw - 60px); -webkit-app-region: drag; padding: 30px;overflow: hidden; }
#ronin #wrapper { overflow: hidden; position: relative; }
#ronin #wrapper #commander { z-index: 9000; position: relative; width: 300px; height: calc(100vh - 60px); border-right: 1px solid #333; -webkit-app-region: no-drag; padding-right: 30px; transition: margin-left 250ms;}
#ronin #wrapper #commander textarea { background: none; width: 100%; height: calc(100vh - 75px); resize: none; font-size: 12px;color: white; }
#ronin #wrapper #commander div#status { color:#555; position: absolute; bottom: 0px; }
#ronin #wrapper #commander.hidden { margin-left:-331px; }
#ronin canvas#surface { position: absolute; right:30px; top:30px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><circle cx='10' cy='10' r='1' fill='%23555'></circle></svg>"); background-size: 10px 10px; background-position: -4px -4px; -webkit-user-select: none;-webkit-app-region: no-drag;}
#ronin canvas#surface { position: absolute; right:0px; top:0px; -webkit-user-select: none;-webkit-app-region: no-drag; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20'><circle cx='10' cy='10' r='1' fill='%23555'></circle></svg>"); background-size: 10px 10px; background-position: -4px -4px; }

2
desktop/sources/links/theme.css Normal file
View File

@ -0,0 +1,2 @@
body { background:var(--background); }
#ronin #commander { background:var(--background); }

32
desktop/sources/scripts/commander.js
View File

@ -20,9 +20,11 @@ function Commander (ronin) {
this._status.textContent = 'Idle. (zoom 100%)'
this._input.focus()
this.run()
this.hide()
}
this.run = function (txt = this._input.value) {
if (txt.indexOf('$') > -1) { console.log('Contains $'); return }
console.log('========')
const inter = new Lisp(txt, ronin.library)
inter.toPixels()
@ -33,6 +35,10 @@ function Commander (ronin) {
this.run()
}
this.setStatus = function (msg) {
this._status.textContent = `${msg}`
}
this.update = function () {
}
@ -117,6 +123,26 @@ function Commander (ronin) {
this._input.value = value
}
// Display
this.show = function () {
console.log('show')
this.el.className = ''
}
this.hide = function () {
console.log('hide')
this.el.className = 'hidden'
}
this.toggle = function () {
if (this.el.className === 'hidden') {
this.show()
} else {
this.hide()
}
}
// Events
this.drag = (e) => {
@ -132,12 +158,14 @@ function Commander (ronin) {
if (!file || !file.name) { console.warn('File', 'Not a valid file.'); return }
if (file.name.indexOf('.lisp') > -1) {
const reader = new FileReader()
reader.onload = function (e) {
ronin.commander.load(e.target.result)
reader.onload = (e) => {
this.load(e.target.result)
this.show()
}
reader.readAsText(file)
} else if (file.path) {
this.injectPath(file.path)
this.show()
}
}
}

30
desktop/sources/scripts/library.js
View File

@ -2,11 +2,28 @@ function Library (ronin) {
this.clear = (rect = this.select_all()) => {
}
// IO
this.open = (path, w = 1, h = 1) => {
ronin.surface.open(path, { w, h })
return path
}
this.save = function (path, type = 'jpg') {
console.log('save', path)
// TODO: Save file
return path
}
this.draw = (path, rect) => {
ronin.surface.draw(path, rect)
return rect
}
this.exit = () => {
// TODO: Closes Ronin
}
// Rects
this.pos = (x, y, t = 'pos') => {
@ -26,7 +43,12 @@ function Library (ronin) {
}
this.frame = () => {
return this.rect(0, 0, Math.floor(window.innerWidth / 2) - 15, Math.floor(window.innerHeight) - 30)
return ronin.surface.getFrame()
}
this.center = () => {
const rect = this.frame()
return this.pos(rect.w / 2, rect.h / 2)
}
this.path = (path) => {
@ -63,4 +85,10 @@ function Library (ronin) {
console.log(any)
return any
}
//
this.of = function (h, k) {
return h[k]
}
}

14
desktop/sources/scripts/ronin.js
View File

@ -1,6 +1,6 @@
function Ronin () {
const defaultTheme = {
background: '#eee',
background: '#222',
f_high: '#000',
f_med: '#999',
f_low: '#ccc',
@ -20,8 +20,12 @@ function Ronin () {
this.library = new Library(this)
this.install = function (host = document.body) {
this.commander.install(this.el)
this.surface.install(this.el)
this._wrapper = document.createElement('div')
this._wrapper.id = 'wrapper'
this.commander.install(this._wrapper)
this.surface.install(this._wrapper)
this.el.appendChild(this._wrapper)
host.appendChild(this.el)
this.theme.install()
}
@ -38,6 +42,10 @@ function Ronin () {
this.theme.reset()
}
this.log = function (msg) {
this.commander.setStatus(msg)
}
this.load = function (content = this.default()) {
}

30
desktop/sources/scripts/surface.js
View File

@ -29,6 +29,8 @@ function Surface (ronin) {
this.strokeRect(shape, width, color)
} else if (shape.t === 'line') {
this.strokeLine(shape, width, color)
} else {
console.warn('Unknown type')
}
}
@ -60,6 +62,8 @@ function Surface (ronin) {
this.fill = (shape, color) => {
if (shape.t === 'rect') {
this.fillRect(shape, color)
} else {
console.warn('Unknown type')
}
}
@ -75,7 +79,19 @@ function Surface (ronin) {
this.context.closePath()
}
this.draw = function (path, rect = this.getRect()) {
// IO
this.open = function (path, scale) {
const img = new Image()
img.src = path
img.onload = () => {
ronin.log(`Image(${img.width}x${img.height}), scale:${scale.w}:${scale.h}`)
this.resize({ w: img.width * scale.w, h: img.height * scale.h })
this.context.drawImage(img, 0, 0, img.width * scale.w, img.height * scale.h)
}
}
this.draw = function (path, rect = this.getFrame()) {
const img = new Image()
img.src = path
img.onload = () => {
@ -85,7 +101,7 @@ function Surface (ronin) {
}
}
this.clear = function (rect = this.getRect()) {
this.clear = function (rect = this.getFrame()) {
this.context.clearRect(rect.x, rect.y, rect.w, rect.h)
}
@ -101,14 +117,16 @@ function Surface (ronin) {
}
this.maximize = function () {
this.resize(this.getRect())
this.resize(this.getFrame())
}
this.onResize = function () {
this.maximize()
if (ronin.commander._input.value === '') {
this.maximize()
}
}
this.getRect = function () {
return { x: 0, y: 0, w: Math.floor(window.innerWidth / 2) - 30, h: Math.floor(window.innerHeight) - 60 }
this.getFrame = function () {
return { x: 0, y: 0, w: window.innerWidth - 60, h: window.innerHeight - 60, t: 'rect' }
}
}

20
examples/guides.lisp Normal file
View File

@ -0,0 +1,20 @@
; guides file
((clear)
(stroke (frame) 1 "red")
(stroke
(line
(pos 0 0)
(pos (of (frame) "w") (of (frame) "h")))
1 "red")
(stroke
(line
(pos (of (frame) "w") 0)
(pos 0 (of (frame) "h")))
1 "red")
(stroke (line (pos 0 0) (pos (of (frame) "w") (of (frame) "h"))) 1 "red")
)

2
examples/scale.lisp
View File

@ -1,3 +1,3 @@
; scale file
(echo (scale ($rect) 0.5 0.5))
(open ($path) 0.25 0.25)