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

*

Browse Source
This commit is contained in:
neauoire 2020-03-24 16:42:53 +09:00
parent 12339d315c
commit 8742548eaa
7 changed files with 177 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
debug.html Normal file
View File

@ -0,0 +1,32 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ronin</title>
<link rel="stylesheet" type="text/css" href="./links/main.css"/>
<link rel="stylesheet" type="text/css" href="./links/theme.css"/>
<script type="text/javascript" src="./scripts/lib/acels.js"></script>
<script type="text/javascript" src="./scripts/lib/lisp.js"></script>
<script type="text/javascript" src="./scripts/lib/source.js"></script>
<script type="text/javascript" src="./scripts/lib/theme.js"></script>
<script type="text/javascript" src="./scripts/client.js"></script>
<script type="text/javascript" src="./scripts/commander.js"></script>
<script type="text/javascript" src="./scripts/library.js"></script>
<script type="text/javascript" src="./scripts/surface.js"></script>
</head>
<body>
<script>
const client = new Client()
client.install(document.body)
window.addEventListener('load', () => {
client.start()
})
</script>
</body>
</html>

58
index.html
View File

@ -10,15 +10,38 @@
<script>
'use strict'
function Acels (client) {
this.el = document.createElement('ul')
this.el.id = 'acels'
this.order = []
this.all = {}
this.roles = {}
this.pipe = null
this.install = (host = window) => {
host.addEventListener('keydown', this.onKeyDown, false)
host.addEventListener('keyup', this.onKeyUp, false)
this.install = (host = document.body) => {
window.addEventListener('keydown', this.onKeyDown, false)
window.addEventListener('keyup', this.onKeyUp, false)
host.appendChild(this.el)
}
this.start = () => {
const cats = this.sort()
for (const cat of this.order) {
const main = document.createElement('li')
const head = document.createElement('a')
head.innerText = cat
const subs = document.createElement('ul')
for (const item of cats[cat]) {
const option = document.createElement('li')
option.onclick = item.downfn
option.innerHTML = item.accelerator ? `${item.name} <i>${item.accelerator.replace('CmdOrCtrl+', '^')}</i>` : `${item.name}`
subs.appendChild(option)
}
main.appendChild(head)
main.appendChild(subs)
this.el.appendChild(main)
}
}
this.set = (cat, name, accelerator, downfn, upfn) => {
if (this.all[accelerator]) { console.warn('Acels', `Trying to overwrite ${this.all[accelerator].name}, with ${name}.`) }
if (this.order.indexOf(cat) < 0) { this.order.push(cat) }
this.all[accelerator] = { cat, name, downfn, upfn, accelerator }
}
this.add = (cat, role) => {
@ -51,7 +74,7 @@ function Acels (client) {
}
return accelerator
}
this.pipe = (obj) => {
this.route = (obj) => {
this.pipe = obj
}
this.onKeyDown = (e) => {
@ -80,13 +103,16 @@ function Acels (client) {
this.toString = () => {
const cats = this.sort()
let text = ''
for (const cat in cats) {
for (const cat of this.order) {
for (const item of cats[cat]) {
text += item.accelerator ? `${cat}: ${item.name} | ${item.accelerator}\n` : ''
text += item.accelerator ? `${cat.padEnd(8, ' ')} ${item.name.padEnd(16, ' ')} ${item.accelerator.replace('CmdOrCtrl+', '^')}\n` : ''
}
}
return text.trim()
}
this.toggle = () => {
this.el.className = this.el.className === 'hidden' ? '' : 'hidden'
}
}
'use strict'
function Lisp (lib = {}) {
@ -502,9 +528,13 @@ function Client () {
this.surface.install(this._wrapper)
this.el.appendChild(this._wrapper)
host.appendChild(this.el)
this.theme.install()
this.theme.install(host)
this.acels.install(host)
window.addEventListener('dragover', this.onDrag)
window.addEventListener('drop', this.onDrop)
this.acels.set('∷', 'Toggle Menubar', 'Tab', () => { this.acels.toggle() })
this.acels.set('∷', 'Open Theme', 'CmdOrCtrl+Shift+O', () => { this.theme.open() })
this.acels.set('∷', 'Reset Theme', 'CmdOrCtrl+Backspace', () => { this.theme.reset() })
this.acels.set('File', 'New', 'CmdOrCtrl+N', () => { this.source.new(); this.surface.clear(); this.commander.clear() })
this.acels.set('File', 'Save', 'CmdOrCtrl+S', () => { this.source.write('ronin', 'lisp', this.commander._input.value, 'text/plain') })
this.acels.set('File', 'Export Image', 'CmdOrCtrl+E', () => { this.source.write('ronin', 'png', this.surface.el.toDataURL('image/png', 1.0), 'image/png') })
@ -522,13 +552,13 @@ function Client () {
this.acels.set('Project', 'Reload Run', 'CmdOrCtrl+Shift+R', () => { this.source.revert(); this.commander.run() })
this.acels.set('Project', 'Re-Indent', 'CmdOrCtrl+Shift+I', () => { this.commander.reindent() })
this.acels.set('Project', 'Clean', 'Escape', () => { this.commander.cleanup() })
this.acels.install(window)
this.acels.pipe(this)
this.acels.route(this)
}
this.start = function () {
console.log('Ronin', 'Starting..')
console.info(`${this.acels}`)
this.theme.start()
this.acels.start()
this.source.start()
this.commander.start()
this.surface.start()
@ -1699,6 +1729,16 @@ body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular
#ronin.hidden #wrapper #commander { margin-left:-380px; }
#ronin #surface,#ronin #guide { left:380px; }
}
#acels { position: fixed;width: 30px;background: red;top: 0;left: 0; width: 100vw; color:black; background:white; font-size:11px; line-height: 20px; transition: margin-top 0.25s; z-index: 9999; padding-left: 25px; }
#acels.hidden { margin-top:-20px; }
#acels.hidden > li > ul > li { display: none }
#acels > li { float: left; position: relative; cursor: pointer; padding:0px 5px; display: inline-block; }
#acels > li:hover { background: black; color:white; }
#acels > li > ul { display: none; position: absolute; background:white; position: absolute; top:20px; left:0px; color:black; width: 200px}
#acels > li:hover > ul { display: block; }
#acels > li > ul > li { padding: 0px 10px; display: block }
#acels > li > ul > li:hover { background: #ccc; }
#acels > li > ul > li > i { display: inline-block; float: right; color: #aaa; }
body { background:var(--background); }
#ronin #wrapper { background: var(--background); }
#ronin #wrapper #commander { background:var(--background); }

15
links/main.css
View File

@ -40,4 +40,17 @@ body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular
#ronin #wrapper #commander { width:350px; }
#ronin.hidden #wrapper #commander { margin-left:-380px; }
#ronin #surface,#ronin #guide { left:380px; }
}
}
/* Acels */
#acels { position: fixed;width: 30px;background: red;top: 0;left: 0; width: 100vw; color:black; background:white; font-size:11px; line-height: 20px; transition: margin-top 0.25s; z-index: 9999; padding-left: 25px; }
#acels.hidden { margin-top:-20px; }
#acels.hidden > li > ul > li { display: none }
#acels > li { float: left; position: relative; cursor: pointer; padding:0px 5px; display: inline-block; }
#acels > li:hover { background: black; color:white; }
#acels > li > ul { display: none; position: absolute; background:white; position: absolute; top:20px; left:0px; color:black; width: 200px}
#acels > li:hover > ul { display: block; }
#acels > li > ul > li { padding: 0px 10px; display: block }
#acels > li > ul > li:hover { background: #ccc; }
#acels > li > ul > li > i { display: inline-block; float: right; color: #aaa; }

11
push.sh
View File

@ -1,9 +1,10 @@
#!/bin/bash
rm -r 'release'
mkdir 'release'
cp 'index.html' 'release/index.html'
cp 'README.txt' 'release/README.txt'
node scripts/lib/build
rm -r release
mkdir release
cp index.html release/index.html
cp README.txt release/README.txt
~/Applications/butler push ~/Repositories/Hundredrabbits/Ronin/release hundredrabbits/ronin:main
~/Applications/butler status hundredrabbits/ronin
rm -r 'release'
rm -r release

12
scripts/client.js
View File

@ -33,11 +33,17 @@ function Client () {
this.surface.install(this._wrapper)
this.el.appendChild(this._wrapper)
host.appendChild(this.el)
this.theme.install()
this.theme.install(host)
this.acels.install(host)
window.addEventListener('dragover', this.onDrag)
window.addEventListener('drop', this.onDrop)
this.acels.set('∷', 'Toggle Menubar', 'Tab', () => { this.acels.toggle() })
this.acels.set('∷', 'Open Theme', 'CmdOrCtrl+Shift+O', () => { this.theme.open() })
this.acels.set('∷', 'Reset Theme', 'CmdOrCtrl+Backspace', () => { this.theme.reset() })
this.acels.set('File', 'New', 'CmdOrCtrl+N', () => { this.source.new(); this.surface.clear(); this.commander.clear() })
this.acels.set('File', 'Save', 'CmdOrCtrl+S', () => { this.source.write('ronin', 'lisp', this.commander._input.value, 'text/plain') })
this.acels.set('File', 'Export Image', 'CmdOrCtrl+E', () => { this.source.write('ronin', 'png', this.surface.el.toDataURL('image/png', 1.0), 'image/png') })
@ -59,14 +65,14 @@ function Client () {
this.acels.set('Project', 'Re-Indent', 'CmdOrCtrl+Shift+I', () => { this.commander.reindent() })
this.acels.set('Project', 'Clean', 'Escape', () => { this.commander.cleanup() })
this.acels.install(window)
this.acels.pipe(this)
this.acels.route(this)
}
this.start = function () {
console.log('Ronin', 'Starting..')
console.info(`${this.acels}`)
this.theme.start()
this.acels.start()
this.source.start()
this.commander.start()
this.surface.start()

41
scripts/lib/acels.js
View File

@ -1,17 +1,42 @@
'use strict'
function Acels (client) {
this.el = document.createElement('ul')
this.el.id = 'acels'
this.order = []
this.all = {}
this.roles = {}
this.pipe = null
this.install = (host = window) => {
host.addEventListener('keydown', this.onKeyDown, false)
host.addEventListener('keyup', this.onKeyUp, false)
this.install = (host = document.body) => {
window.addEventListener('keydown', this.onKeyDown, false)
window.addEventListener('keyup', this.onKeyUp, false)
host.appendChild(this.el)
}
this.start = () => {
const cats = this.sort()
for (const cat of this.order) {
const main = document.createElement('li')
const head = document.createElement('a')
head.innerText = cat
const subs = document.createElement('ul')
for (const item of cats[cat]) {
const option = document.createElement('li')
option.onclick = item.downfn
option.innerHTML = item.accelerator ? `${item.name} <i>${item.accelerator.replace('CmdOrCtrl+', '^')}</i>` : `${item.name}`
subs.appendChild(option)
}
main.appendChild(head)
main.appendChild(subs)
this.el.appendChild(main)
}
}
this.set = (cat, name, accelerator, downfn, upfn) => {
if (this.all[accelerator]) { console.warn('Acels', `Trying to overwrite ${this.all[accelerator].name}, with ${name}.`) }
if (this.order.indexOf(cat) < 0) { this.order.push(cat) }
this.all[accelerator] = { cat, name, downfn, upfn, accelerator }
}
@ -49,7 +74,7 @@ function Acels (client) {
return accelerator
}
this.pipe = (obj) => {
this.route = (obj) => {
this.pipe = obj
}
@ -82,11 +107,15 @@ function Acels (client) {
this.toString = () => {
const cats = this.sort()
let text = ''
for (const cat in cats) {
for (const cat of this.order) {
for (const item of cats[cat]) {
text += item.accelerator ? `${cat}: ${item.name} | ${item.accelerator}\n` : ''
text += item.accelerator ? `${cat.padEnd(8, ' ')} ${item.name.padEnd(16, ' ')} ${item.accelerator.replace('CmdOrCtrl+', '^')}\n` : ''
}
}
return text.trim()
}
this.toggle = () => {
this.el.className = this.el.className === 'hidden' ? '' : 'hidden'
}
}

35
scripts/lib/build.js
View File

@ -18,7 +18,9 @@ function cleanup (txt) {
return output
}
const wrapper = `
// Create release
const release_body = `
<!DOCTYPE html>
<html lang="en">
<html>
@ -43,6 +45,33 @@ const wrapper = `
</body>
</html>`
fs.writeFileSync('index.html', cleanup(wrapper))
fs.writeFileSync('index.html', cleanup(release_body))
console.log(`Built ${id}`)
// Create debug
const debug_body = `
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>${id}</title>
${styles.reduce((acc, item) => { return `${acc}<link rel="stylesheet" type="text/css" href="./links/${item}"/>\n` }, '')}
${libs.reduce((acc, item) => { return `${acc}<script type="text/javascript" src="./scripts/lib/${item}"></script>\n` }, '')}
${scripts.reduce((acc, item) => { return `${acc}<script type="text/javascript" src="./scripts/${item}"></script>\n` }, '')}
</head>
<body>
<script>
const client = new Client()
client.install(document.body)
window.addEventListener('load', () => {
client.start()
})
</script>
</body>
</html>`
fs.writeFileSync('debug.html', debug_body)
console.log(`Built ${id}`)