git ssb - Merge pull request #66 from ssbc/mixstyle-refactor

Commit 5db5f5879a68ea7da4a9376e6e95b8ef07522e10

Merge pull request #66 from ssbc/mixstyle-refactor

Mixstyle refactor

mix irving authored on 1/1/2017, 2:06:45 AM
GitHub committed on 1/1/2017, 2:06:45 AM
Parent: 787f858837541c7b94531c9b98603402cfb7f06b
Parent: 706e99a769b070931c21d59e78030c60a37afc48

Files changed

modules_basic/about.js	changed
modules_basic/about.mcss	changed
modules_basic/message-author.js	changed
modules_basic/message-author.mcss	changed
modules_basic/message-backlinks.js	changed
modules_basic/message.js	changed
modules_basic/message.mcss	changed
modules_basic/post.js	changed
modules_basic/thread.js	changed
modules_basic/timestamp.js	changed
modules_basic/timestamp.mcss	changed
modules_basic/message-backlinks.mcss	added
modules_core/index.js	changed
modules_core/style-mixins.js	added
modules_extra/git.js	changed
package.json	changed
get-style-for-module.js	added

modules_basic/about.jsView
		@@ -1,8 +1,7 @@
1		-var fs = require('fs')
2		-var Path = require('path')
3		-var h = require('../h')
4		-var when = require('@mmckegg/mutant/when')
	1 …	+const getStyleForModule = require('../get-style-for-module')
	2 …	+const h = require('../h')
	3 …	+const when = require('@mmckegg/mutant/when')
5	4 …
6	5 …	exports.needs = {
7	6 …	blob_url: 'first',
8	7 …	markdown: 'first'
		@@ -17,9 +16,9 @@
17	16 …	exports.create = function (api) {
18	17 …	return {
19	18 …	message_content,
20	19 …	message_content_mini,
21		- mcss: () => fs.readFileSync(Path.join(__dirname, 'about.mcss'), 'utf8')
	20 …	+ mcss: getStyleForModule(__filename)
22	21 …	}
23	22 …
24	23 …	function message_content (msg) {
25	24 …	if (msg.value.content.type !== 'about') return

modules_basic/about.mcssView
		@@ -5,9 +5,9 @@
5	5 …	section {
6	6 …	header {
7	7 …	a {
8	8 …	-target {
9		- color: green
	9 …	+
10	10 …	}
11	11 …	-name {
12	12 …
13	13 …	}

modules_basic/message-author.jsView
		@@ -1,8 +1,7 @@
1		-var fs = require('fs')
2		-var Path = require('path')
3		-var h = require('../h')
4		-var when = require('@mmckegg/mutant/when')
	1 …	+const getStyleForModule = require('../get-style-for-module')
	2 …	+const h = require('../h')
	3 …	+const when = require('@mmckegg/mutant/when')
5	4 …
6	5 …	exports.needs = {
7	6 …	avatar_link: 'first',
8	7 …	avatar_image: 'first',
		@@ -17,9 +16,9 @@
17	16 …
18	17 …	exports.create = function (api) {
19	18 …	return {
20	19 …	message_author,
21		- mcss: () => fs.readFileSync(Path.join(__dirname, 'message-author.mcss'))
	20 …	+ mcss: getStyleForModule(__filename)
22	21 …	}
23	22 …
24	23 …	function message_author (msg, opts = {}) {
25	24 …	var { size = 'small' } = opts

modules_basic/message-author.mcssView
		@@ -1,12 +1,38 @@
1	1 …	MessageAuthor {
2	2 …	display: flex
3	3 …	flex-direction: column
4	4 …
	5 …	+ section {
	6 …	+ -image {
	7 …	+ margin-bottom: .3rem
	8 …	+ }
	9 …	+
	10 …	+ -name {
	11 …	+ max-width: 7rem
	12 …	+ a { $text-primary }
	13 …	+ }
	14 …	+
	15 …	+ -timestamp {
	16 …	+
	17 …	+ }
	18 …	+ }
	19 …	+
5	20 …	-mini {
6	21 …	flex-direction: row
7	22 …
8	23 …	section {
9		- margin-right: 1rem;
	24 …	+ margin-right: .5rem
	25 …	+
	26 …	+ -name {
	27 …	+ position: initial
	28 …	+ left: initial
	29 …	+ min-width: 6.5rem
	30 …	+ max-width: none
	31 …	+ }
	32 …	+
	33 …	+ -timestamp {
	34 …	+
	35 …	+ }
10	36 …	}
11	37 …	}
12	38 …	}

modules_basic/message-backlinks.jsView
		@@ -1,8 +1,19 @@
1		-exports.gives = 'message_backlinks'
	1 …	+const getStyleForModule = require('../get-style-for-module')
	2 …	+const h = require('../h')
2	3 …
	4 …	+exports.gives = {
	5 …	+ message_backlinks: true,
	6 …	+ mcss: true
	7 …	+}
	8 …	+
3	9 …	exports.create = function (api) {
4		- return function (msg) {
	10 …	+ return {
	11 …	+ message_backlinks,
	12 …	+ mcss: getStyleForModule(__filename)
	13 …	+ }
	14 …	+
	15 …	+ function message_backlinks (msg) {
5	16 …	var links = []
6	17 …	for(var k in CACHE) {
7	18 …	var _msg = CACHE[k]
8	19 …	if(Array.isArray(_msg.content.mentions)) {
		@@ -10,7 +21,19 @@
10	21 …	if(_msg.content.mentions[i].link == msg.key)
11	22 …	links.push(k)
12	23 …	}
13	24 …	}
14		- return links
	25 …	+
	26 …	+ if (links.length === 0) return null
	27 …	+
	28 …	+ return h('MessageBacklinks', [
	29 …	+ h('header', 'backlinks:'),
	30 …	+ h('ul', links.map(function (link) {
	31 …	+ return h('li', [
	32 …	+ h('a -backlink', {
	33 …	+ href: `#${link}`
	34 …	+ }, link)
	35 …	+ ])
	36 …	+ }))
	37 …	+ ])
15	38 …	}
16	39 …	}

modules_basic/message.jsView
		@@ -1,21 +1,20 @@
1		-var fs = require('fs')
2		-var Path = require('path')
3		-var pull = require('pull-stream')
4		-var u = require('../util')
5		-var h = require('../h')
	1 …	+const getStyleForModule = require('../get-style-for-module')
	2 …	+const pull = require('pull-stream')
	3 …	+const u = require('../util')
	4 …	+const h = require('../h')
6	5 …
7	6 …	exports.needs = {
8	7 …	avatar_name: 'first',
9	8 …	avatar_link: 'first',
10		- message_meta: 'map',
11	9 …	message_action: 'map',
12		- message_link: 'first',
	10 …	+ message_author: 'first',
13	11 …	message_backlinks: 'first',
14		- message_author: 'first',
15	12 …	message_content: 'first',
16	13 …	message_content_mini: 'first',
17		- message_footer: 'first'
	14 …	+ message_title: 'first',
	15 …	+ message_link: 'first',
	16 …	+ message_meta: 'map',
18	17 …	}
19	18 …
20	19 …	exports.gives = {
21	20 …	message_render: true,
		@@ -24,9 +23,9 @@
24	23 …
25	24 …	exports.create = function (api) {
26	25 …	return {
27	26 …	message_render,
28		- mcss: () => fs.readFileSync(Path.join(__dirname, 'message.mcss'))
	27 …	+ mcss: getStyleForModule(__filename)
29	28 …	}
30	29 …
31	30 …	function message_render (msg, sbot) {
32	31 …	var content = api.message_content_mini(msg)
		@@ -41,8 +40,9 @@
41	40 …	tabindex: '0'
42	41 …	}
43	42 …	}, [
44	43 …	h('header.author', api.message_author(msg)),
	44 …	+ h('section.title', api.message_title(msg)),
45	45 …	h('section.meta', api.message_meta(msg)),
46	46 …	h('section.content', content),
47	47 …	h('section.action', api.message_action(msg)),
48	48 …	h('footer.backlinks', api.message_backlinks(msg))

modules_basic/message.mcssView
		@@ -1,31 +1,48 @@
1	1 …	Message {
2		- padding-top: 1em
3		- padding-bottom: 1em
	2 …	+ padding: 1rem .5rem 1rem 7.5rem
4	3 …	border-top: solid 1px gainsboro
	4 …	+ min-height: 5rem
5	5 …
6		- -mini {
7		- padding-top: 0.25rem
8		- padding-bottom: 0.25rem
	6 …	+ position: relative
	7 …	+ display: flex
	8 …	+ flex-direction: row
	9 …	+ flex-wrap: wrap
	10 …	+ justify-content: flex-end
	11 …	+
	12 …	+ header.author {
	13 …	+ position: absolute
	14 …	+ left: .5rem
9	15 …	}
10	16 …
11		- header.author {
12		- float: left
13		- display: flex
14		- flex-direction: column
	17 …	+ section.title {
	18 …	+ flex-grow: 1
	19 …	+ font-size: .9rem
15	20 …	}
16	21 …
17	22 …	section.meta {
18		- float: right
	23 …	+ display: flex
	24 …	+ a {
	25 …	+ margin-left: .2rem
	26 …	+ $text-subtle
	27 …	+ }
	28 …	+
	29 …	+ input{
	30 …	+ margin-right: 0
	31 …	+ order: 99
	32 …	+ }
19	33 …	}
20	34 …
21	35 …	section.content {
	36 …	+ flex-basis: 100%
	37 …	+
22	38 …	(img) {
23	39 …	max-width: 100%
24	40 …	}
25	41 …	}
26	42 …
27	43 …	section.action {
	44 …	+ flex-basis: 100%
28	45 …	display: flex
29	46 …	justify-content: flex-end
30	47 …
31	48 …	a {
		@@ -35,5 +52,27 @@
35	52 …
36	53 …	footer.backlinks {
37	54 …
38	55 …	}
	56 …	+
	57 …	+
	58 …	+ -mini {
	59 …	+ padding: .25rem .5rem
	60 …	+ min-height: inherit
	61 …	+
	62 …	+ header.author {
	63 …	+ order: 0
	64 …	+ position: initial
	65 …	+ left: initial
	66 …	+ }
	67 …	+
	68 …	+ section.content {
	69 …	+ order: 1
	70 …	+ flex-basis: initial
	71 …	+ flex-grow: 1
	72 …	+ }
	73 …	+
	74 …	+ section.meta {
	75 …	+ order: 2
	76 …	+ }
	77 …	+ }
39	78 …	}

modules_basic/post.jsView
		@@ -11,22 +11,30 @@
11	11 …	//
12	12 …
13	13 …	exports.needs = { message_link: 'first', markdown: 'first' }
14	14 …
15		-exports.gives = 'message_content'
	15 …	+exports.gives = {
	16 …	+ message_content: true,
	17 …	+ message_title: true
	18 …	+}
16	19 …
17	20 …	exports.create = function (api) {
18		- return function (data) {
	21 …	+ return {
	22 …	+ message_content,
	23 …	+ message_title
	24 …	+ }
	25 …	+
	26 …	+ function message_content (data) {
19	27 …	if(!data.value.content \|\| !data.value.content.text) return
20	28 …
21		- var root = data.value.content.root
22		- var re = !root ? null : h('span', 're: ', api.message_link(root))
23		-
24	29 …	return h('div',
25		- re,
26	30 …	api.markdown(data.value.content)
27	31 …	)
	32 …	+ }
28	33 …
	34 …	+ function message_title (data) {
	35 …	+ var root = data.value.content && data.value.content.root
	36 …	+ return !root ? null : h('span', 're: ', api.message_link(root))
29	37 …	}
30	38 …	}
31	39 …
32	40 …

modules_basic/thread.jsView
		@@ -120,10 +120,10 @@
120	120 …	meta.root = thread[0].value.content.root \|\| thread[0].key
121	121 …	meta.channel = thread[0].value.content.channel
122	122 …
123	123 …	var recps = thread[0].value.content.recps
124		- var private = thread[0].value.private
125		- if(private) {
	124 …	+ var priv = thread[0].value['private']
	125 …	+ if(priv) {
126	126 …	if(recps)
127	127 …	meta.recps = recps
128	128 …	else
129	129 …	meta.recps = [thread[0].value.author, self_id]

modules_basic/timestamp.jsView
		@@ -1,8 +1,7 @@
1		-var fs = require('fs')
2		-var Path = require('path')
3		-var h = require('../h')
4		-var human = require('human-time')
	1 …	+const getStyleForModule = require('../get-style-for-module')
	2 …	+const h = require('../h')
	3 …	+const human = require('human-time')
5	4 …
6	5 …	exports.needs = {}
7	6 …
8	7 …	exports.gives = {
		@@ -17,14 +16,14 @@
17	16 …	}, 60e3)
18	17 …
19	18 …	return {
20	19 …	timestamp,
21		- mcss: () => fs.readFileSync(Path.join(__dirname, 'timestamp.mcss'))
	20 …	+ mcss: getStyleForModule(__filename)
22	21 …	}
23	22 …
24	23 …	function updateTimestampEl (el) {
25	24 …	var timestamp = Number(el.getAttribute('data-timestamp'))
26		- var display = human(new Date(timestamp))
	25 …	+ var display = human(new Date(timestamp)).replace(/minutes/, 'mins')
27	26 …	el.querySelector('a').firstChild.nodeValue = display
28	27 …	return el
29	28 …	}
30	29 …

modules_basic/timestamp.mcssView
		@@ -1,5 +1,7 @@
1	1 …	Timestamp {
2	2 …	a {
3		-
	3 …	+ $text-subtle
	4 …	+ font-size: .8rem
4	5 …	}
5	6 …	}
	7 …	+

modules_basic/message-backlinks.mcssView
		@@ -1,0 +1,14 @@
	1 …	+MessageBacklinks {
	2 …	+ header {
	3 …	+
	4 …	+ }
	5 …	+ ul {
	6 …	+ li {
	7 …	+ a {
	8 …	+ -backlink {
	9 …	+
	10 …	+ }
	11 …	+ }
	12 …	+ }
	13 …	+ }
	14 …	+}

modules_core/index.jsView
		@@ -7,7 +7,8 @@
7	7 …	"menu.js": require('./menu.js'),
8	8 …	"message-confirm.js": require('./message-confirm.js'),
9	9 …	"tabs.js": require('./tabs.js'),
10	10 …	"sbot.js": require('./sbot.js'),
	11 …	+ "style-mixins.js": require('./style-mixins.js'),
11	12 …	"styles.js": require('./styles.js')
12	13 …	}
13	14 …

modules_core/style-mixins.jsView
		@@ -1,0 +1,22 @@
	1 …	+
	2 …	+const mixins = `
	3 …	+ $text-primary {
	4 …	+ color: black
	5 …	+ }
	6 …	+
	7 …	+ $text-subtle {
	8 …	+ color: gray
	9 …	+ }
	10 …	+`
	11 …	+
	12 …	+module.exports = {
	13 …	+ gives: {
	14 …	+ mcss: true
	15 …	+ },
	16 …	+ create: function (api) {
	17 …	+ return {
	18 …	+ mcss: () => mixins
	19 …	+ }
	20 …	+ }
	21 …	+}
	22 …	+

modules_extra/git.jsView
		@@ -33,9 +33,10 @@
33	33 …
34	34 …	exports.gives = {
35	35 …	message_action: true,
36	36 …	message_meta: true,
37		- message_content: true
	37 …	+ message_content: true,
	38 …	+ message_title: true
38	39 …	}
39	40 …
40	41 …
41	42 …	var self_id = require('../keys').id
		@@ -301,10 +302,8 @@
301	302 …	if(c.type === 'git-repo') {
302	303 …	var branchesT, tagsT, openIssuesT, closedIssuesT, openPRsT, closedPRsT
303	304 …	var forksT
304	305 …	var div = h('div',
305		- h('p', 'git repo ', repoName(msg.key)),
306		- c.upstream ? h('p', 'fork of ', repoLink(c.upstream)) : '',
307	306 …	h('p', h('code', 'ssb://' + msg.key)),
308	307 …	h('div.git-table-wrapper', {style: {'max-height': '12em'}},
309	308 …	h('table',
310	309 …	branchesT = tableRows(h('tr',
		@@ -409,9 +408,8 @@
409	408 …	}
410	409 …
411	410 …	if(c.type === 'git-update') {
412	411 …	return [
413		- h('p', 'pushed to ', repoLink(c.repo)),
414	412 …	c.refs ? h('ul', Object.keys(c.refs).map(function (ref) {
415	413 …	var rev = c.refs[ref]
416	414 …	return h('li',
417	415 …	shortRefName(ref) + ': ',
		@@ -449,25 +447,54 @@
449	447 …	}
450	448 …
451	449 …	if(c.type === 'issue') {
452	450 …	return h('div',
453		- h('p', 'opened issue on ', repoLink(c.project)),
454	451 …	c.title ? h('h4', c.title) : '',
455	452 …	api.markdown(c)
456	453 …	)
457	454 …	}
458	455 …
459	456 …	if(c.type === 'pull-request') {
460	457 …	return h('div',
461		- h('p', 'opened pull-request ',
462		- 'to ', repoLink(c.repo), ':', c.branch, ' ',
463		- 'from ', repoLink(c.head_repo), ':', c.head_branch),
464	458 …	c.title ? h('h4', c.title) : '',
465	459 …	api.markdown(c)
466	460 …	)
467	461 …	}
468	462 …	},
469	463 …
	464 …	+ message_title: function (msg) {
	465 …	+ var c = msg.value.content
	466 …	+
	467 …	+ if(c.type === 'git-repo') {
	468 …	+ return h('div', [
	469 …	+ h('p', 'git repo ', repoName(msg.key)),
	470 …	+ c.upstream ? h('p', 'fork of ', repoLink(c.upstream)) : ''
	471 …	+ ])
	472 …	+ }
	473 …	+
	474 …	+ if(c.type === 'git-update') {
	475 …	+ return h('p', 'pushed to ', repoLink(c.repo))
	476 …	+ }
	477 …	+
	478 …	+ if(c.type === 'issue-edit' \|\| (c.type === 'post' && c.text === '')) {
	479 …	+ return h('div', [
	480 …	+ c.issue ? renderIssueEdit(c) : null,
	481 …	+ c.issues ? c.issues.map(renderIssueEdit) : null
	482 …	+ ])
	483 …	+ }
	484 …	+
	485 …	+ if(c.type === 'issue') {
	486 …	+ return h('p', 'opened issue on ', repoLink(c.project))
	487 …	+ }
	488 …	+
	489 …	+ if(c.type === 'pull-request') {
	490 …	+ return h('p', 'opened pull-request ', [
	491 …	+ 'to ', repoLink(c.repo), ':', c.branch, ' ',
	492 …	+ 'from ', repoLink(c.head_repo), ':', c.head_branch
	493 …	+ ])
	494 …	+ }
	495 …	+ },
	496 …	+
470	497 …	message_meta: function (msg, sbot) {
471	498 …	var type = msg.value.content.type
472	499 …	if (type === 'issue' \|\| type === 'pull-request') {
473	500 …	var el = h('em', '...')
		@@ -515,5 +542,4 @@
515	542 …	}
516	543 …	}
517	544 …	}
518	545 …
519		-

package.jsonView
		@@ -12,8 +12,9 @@
12	12 …	"brfs": "^1.4.3",
13	13 …	"cont": "^1.0.3",
14	14 …	"dataurl-": "^0.1.0",
15	15 …	"depject": "^3.0.0",
	16 …	+ "es2040": "^1.2.4",
16	17 …	"hjson": "^2.0.3",
17	18 …	"human-time": "0.0.1",
18	19 …	"hypercombo": "0.1.0",
19	20 …	"hypercrop": "^1.0.1",
		@@ -67,9 +68,10 @@
67	68 …	"indexhtmlify": "^1.3.1"
68	69 …	},
69	70 …	"browserify": {
70	71 …	"transform": [
71		- "brfs"
	72 …	+ "brfs",
	73 …	+ "es2040"
72	74 …	]
73	75 …	},
74	76 …	"scripts": {
75	77 …	"lite": "mkdir -p build && browserify index.js \| indexhtmlify --title patchbay > build/index.html",

get-style-for-module.jsView
		@@ -1,0 +1,8 @@
	1 …	+const fs = require('fs')
	2 …	+
	3 …	+module.exports = (filename) => () => {
	4 …	+ const mcssPath = filename.replace(/js$/, 'mcss')
	5 …	+
	6 …	+ return fs.readFileSync(mcssPath, 'utf8')
	7 …	+}
	8 …	+

Built with git-ssb-web

Dominic / patchbay

Commit 5db5f5879a68ea7da4a9376e6e95b8ef07522e10

Merge pull request #66 from ssbc/mixstyle-refactor

Files changed