1001

index.js (5035B)

---

 import lexicon from './database/lexicon.js'
 
 localStorage.debug = 'wyve'
 
 class Wyve {
 	constructor(debug = true) {
 		this._debug = debug
 		this.state = {}
 		this.bus = bus('wyve')
 		this.router = wayfarer('/404')
 		this.debug = create_debug('wyve')
 		this.lexicon = lexicon
 
 		this.node = document.getElementById('wyve')
 		this.content_node = html`<div></div>`
 		this.node.appendChild(this.content_node)
 	}
 
 	async start() {
 		await this.init()
 		this.debug('successfully started')
 		this.router(hash())
 	}
 
 	async init() {
 		// get relevant Dat archive information
 		await $is_dat(async () => {
 			this.archive = await DatArchive.load(await DatArchive.resolveName(window.location.href))
 			this.is_owner = (await this.archive.getInfo()).isOwner
 			try {
 				this.state.peers = (await experimental.datPeers.list(await DatArchive.resolveName(window.location.href))).length
 				let p = this.state.peers
 				this.debug(`right now there ${p > 1 ? 'are' : 'is'} ${this.state.peers} ${p > 1 ? 'peers' : 'peer'} connected`)
 			} catch (e) {
 				this.debug('something went wrong with the peers API')
 			}
 			if (this.is_owner) {
 				this.debug('current peer is owner')			
 			}
 		})
 
 		let sorted = _.sortBy(_.map(this.lexicon, (v,k) => {
 			v.key = k
 			return v
 		}), (o) => _.snakeCase(o.name))
 		this.categories = _.groupBy(sorted, 'under')
 
 		// Setup router
 		this.router.on('/', () => {
 			this.render(this.lexicon.home)
 		})
 
 		this.router.on('/home', () => {
 			this.render(this.lexicon.home)
 		})
 
 		this.router.on('/index', () => {
 			morph(this.content_node, html`
 				<div>
 					<nav>
 						<div id="desc">
 							<h3 id="desc">${raw(new Curlic("{Wyve(code/wyve)}'s index.").toString())}</h3>
 						</div>
 						<hr />
 					</nav>
 					<main>
 						<bpre>${raw(constructTree(this.categories))}</bpre>
 					</main>
 				</div>
 				`)		
 		})
 
 		this.router.on('/special/screenshot', () => {
 			if (this.is_owner) {
 				experimental.capturePage('dat://1001.hashbase.io/#/code/wyve', {
 					width: 19*64,
 					height: 8*64
 				}).then((png) => {
 					this.archive.writeFile('/screenshot.png', png)
 				}).then(() => {
 					this.debug('screenshot saved!')
 					window.location.hash = "#home"
 				})
 			}
 		})
 
 		this.router.on('/:slug', ({ slug }) => {
 			this.debug(`root, ${slug}`)
 			this.render( _.find(this.categories.root, ['key', $slugify(slug)]) )
 		})
 
 		this.router.on('/:category/:slug', ({ category, slug }) => {
 			this.debug(`${category}, ${slug}`)
 			this.render( _.find(this.categories[category], ['key', $slugify(slug)]) )
 		})
 
 		// Setup bus
 		addEventListener('hashchange', () => this.bus.emit('navigate'))
 
 		this.on('navigate', () => {
 			this.debug(`navigate to ${hash()}`)
 			this.router(hash())
 		})
 	}
 
 	on(event, callback) {
 		if (this._debug) {
 			this.bus.on(event, (...parameters) => {
 				this.debug(`event '${event}' called with ${!(!(parameters)) ? 'no parameters' : JSON.stringify(parameters)}`)
 				callback( ...parameters )
 			})			
 		} else {
 			this.bus.on(event, callback)
 		}
 	}
 
 	render(entry) {
 		if (entry == undefined) {
 			this.render(this.lexicon['404'])
 		}
 		// TODO: Highlight current category and page on tree.
 		// FIXME please
 		// XXX lewd
 		// README important af
 		let long = new Runic(entry.long, Curlic).toString()
 		let desc = new Curlic(entry.desc).toString()
 
 		$retitle(entry.title ? entry.title : $title(entry.key))
 		
 		morph(this.content_node, html`
 			<div>
 				<nav>
 					<div id="desc">
 						<h3 id="desc">${raw(desc)}</h3>
 					</div>
 					<hr />
 				</nav>
 				<aside>
 					<bpre>${raw(constructTree(this.categories, this, { highlight: true }))}</bpre>
 				</aside>
 				<main>
 					${raw(long)}
 				</main>
 			</div>
 			`)		
 	}	
 }
 
 function constructTree(lexicon, self) {
 	let things = lexicon	
 	let str = ''
 
 	for (let cat of Object.keys(things)) {
 		if (!self.is_owner && cat == 'special') continue;
 		let pre = '<span class="accent">├╴</span>'
 		let end = '<span class="accent">└╴</span>'
 		if (cat == 'root') { pre=''; end='' }
 		if (cat != 'root') str += '<span class="accent">' + cat + '/</span>' + '\n';
 		for (let th in things[cat]) {
 			let self = things[cat][th]
 			if (self.key == '404') continue;
 			if (th < things[cat].length-1) {
 				if (self.external) {
 					str += pre + new Curlic('{' + self.key + '('+self.link+')}').toString() + '\n'
 				} else {
 					if (cat != 'root') {
 						str += pre + new Curlic('{' + self.key + '('+cat+'/'+$slugify(self.key)+')}').toString() + '\n'
 					} else {
 						str += pre + new Curlic('{' + self.key + '('+$slugify(self.key)+')}').toString() + '\n'						
 					}
 				}
 			} else {
 				if (self.external) {
 					str += end + new Curlic('{' + self.key + '('+self.link+')}').toString() + '\n'
 				} else {
 					if (cat != 'root') {
 						str += end + new Curlic('{' + self.key + '('+cat+'/'+$slugify(self.key)+')}').toString() + '\n'
 					} else {
 						str += end + new Curlic('{' + self.key + '('+$slugify(self.key)+')}').toString() + '\n'						
 					}
 				}
 			}
 		}
 	}
 
 	return str
 }
 
 export default Wyve