git ssb

2+

mixmix / ticktack



Commit 354bcc491180e33154ea042ff61d5912ae2d95ab

Browse Files

add scroller to userShow (removes unread count from here)

mix irving committed on 12/6/2017, 11:54:34 AM
Parent: 878a75b5b09e6272b0bdbb499735531d4e9864e9

Files changed

app/html/context.jschanged
app/page/userShow.jschanged
app/page/userShow.mcsschanged
app/html/context.jsView
@@ -70,9 +70,9 @@
7070 ])
7171
7272 function LevelOneContext () {
7373 function isDiscoverContext (loc) {
74- const PAGES_UNDER_DISCOVER = ['blogIndex', 'blogShow']
74+ const PAGES_UNDER_DISCOVER = ['blogIndex', 'blogShow', 'userShow']
7575
7676 return PAGES_UNDER_DISCOVER.includes(location.page)
7777 || get(location, 'value.private') === undefined
7878 }
@@ -180,8 +180,9 @@
180180 function LevelTwoContext () {
181181 const { key, value, feed: targetUser, page } = location
182182 const root = get(value, 'content.root', key)
183183 if (!targetUser) return
184+ if (page === 'userShow') return
184185
185186
186187 const prepend = Option({
187188 selected: page === 'threadNew',
app/page/userShow.jsView
@@ -8,14 +8,17 @@
88 exports.needs = nest({
99 'about.html.avatar': 'first',
1010 'about.obs.name': 'first',
1111 'about.obs.description': 'first',
12+ 'app.html.context': 'first',
1213 'app.html.link': 'first',
1314 'app.html.blogCard': 'first',
15+ 'app.html.blogNav': 'first',
16+ 'app.html.scroller': 'first',
1417 'contact.html.follow': 'first',
18+ 'feed.pull.profile': 'first',
1519 'feed.pull.rollup': 'first',
1620 'message.html.markdown': 'first',
17- 'sbot.pull.userFeed': 'first',
1821 'keys.sync.id': 'first',
1922 'translations.sync.strings': 'first',
2023 'unread.sync.isUnread': 'first'
2124 })
@@ -24,76 +27,62 @@
2427 var isUnread = api.unread.sync.isUnread
2528 return nest('app.page.userShow', userShow)
2629
2730 function userShow (location) {
28-
2931 const { feed } = location
3032 const myId = api.keys.sync.id()
31- const name = api.about.obs.name(feed)
32- const description = computed(api.about.obs.description(feed), d => api.message.html.markdown(d || ''))
3333
3434 const strings = api.translations.sync.strings()
3535
36- // const { followers } = api.contact.obs
37-
38- // const youFollowThem = computed(followers(feed), followers => followers.includes(myId))
39- // const theyFollowYou = computed(followers(myId), followers => followers.includes(feed))
40- // const youAreFriends = computed([youFollowThem, theyFollowYou], (a, b) => a && b)
41-
42- // const ourRelationship = computed(
43- // [youAreFriends, youFollowThem, theyFollowYou],
44- // (youAreFriends, youFollowThem, theyFollowYou) => {
45- // if (youAreFriends) return strings.userShow.state.friends
46- // if (theyFollowYou) return strings.userShow.state.theyFollow
47- // if (youFollowThem) return strings.userShow.state.youFollow
48- // }
49- // )
50-
5136 const Link = api.app.html.link
5237 const userEditButton = Link({ page: 'userEdit', feed }, h('i.fa.fa-pencil'))
5338 const directMessageButton = Link({ page: 'threadNew', feed }, h('Button', strings.userShow.action.directMessage))
5439
5540 const BLOG_TYPES = ['blog', 'post']
56- const blogs = MutantArray()
57- pull(
58- api.sbot.pull.userFeed({id: feed, reverse: true, live: false}),
59- pull.filter(msg => msg.value && msg.value.content && !msg.value.content.root),
60- pull.filter(msg => BLOG_TYPES.includes(get(msg, 'value.content.type'))),
61- // pull.filter(msg => get(msg, 'value.content.root') === undefined),
62- api.feed.pull.rollup(),
63- //unread state should not be in this file...
64- pull.through(function (blog) {
65- if(isUnread(blog))
66- blog.unread = true
67- blog.replies.forEach(function (data) {
68- if(isUnread(data))
69- blog.unread = data.unread = true
70- })
71- }),
72- pull.drain(blogs.push)
73- // TODO - new Scroller ?
74- )
7541
76- return h('Page -userShow', {title: name}, [
77- h('div.content', [
78- h('section.about', [
79- api.about.html.avatar(feed, 'large'),
80- h('h1', [
81- name,
82- feed === myId // Only expose own profile editing right now
83- ? userEditButton
84- : ''
85- ]),
86- h('div.introduction', description),
87- feed !== myId
88- ? h('div.actions', [
89- api.contact.html.follow(feed),
90- h('div.directMessage', directMessageButton)
91- ])
92- : '',
42+ // TODO return some of this ?
43+ // but maybe this shouldn't be done here ?
44+ // pull.through(function (blog) {
45+ // if(isUnread(blog))
46+ // blog.unread = true
47+ // blog.replies.forEach(function (data) { // this was fed rollups
48+ // if(isUnread(data))
49+ // blog.unread = data.unread = true
50+ // })
51+ // }),
52+
53+ const prepend = [
54+ api.app.html.blogNav(location),
55+ h('section.about', [
56+ api.about.html.avatar(feed, 'large'),
57+ h('h1', [
58+ api.about.obs.name(feed),
59+ feed === myId // Only expose own profile editing right now
60+ ? userEditButton
61+ : ''
9362 ]),
94- h('section.blogs', map(blogs, api.app.html.blogCard))
95- ])
63+ h('div.introduction', computed(api.about.obs.description(feed), d => api.message.html.markdown(d || ''))),
64+ feed !== myId
65+ ? h('div.actions', [
66+ api.contact.html.follow(feed),
67+ h('div.directMessage', directMessageButton)
68+ ])
69+ : '',
70+ ]),
71+ ]
72+
73+ return h('Page -userShow', [
74+ api.app.html.context(location),
75+ api.app.html.scroller({
76+ classList: ['content'],
77+ prepend,
78+ stream: api.feed.pull.profile(feed),
79+ filter: () => pull(
80+ pull.filter(msg => get(msg, 'value.content.root') === undefined),
81+ pull.filter(msg => BLOG_TYPES.includes(get(msg, 'value.content.type')))
82+ ),
83+ render: api.app.html.blogCard
84+ })
9685 ])
9786 }
9887 }
9988
app/page/userShow.mcssView
@@ -1,42 +1,59 @@
11 Page -userShow {
2- div.content {
3- section.about {
4- margin-top: 4rem
5- margin-bottom: 4rem
2+ div.content { padding: 0 }
63
7- display: flex
8- flex-direction: column
9- align-items: center
4+ div.Scroller.content {
5+ section.top {
6+ section.about {
7+ margin-top: 4rem
8+ margin-bottom: 4rem
109
11- img.Avatar {
12- }
10+ display: flex
11+ flex-direction: column
12+ align-items: center
1313
14- h1 {
15- font-weight: 300
16- font-size: 1rem
17-
18- display: flex
19- div.Link {
20- margin-left: .5rem
14+ img.Avatar {
2115 }
22- }
16+ div.introduction {
17+ $maxWidthSmaller
18+ }
2319
24- div.actions {
25- display: flex
26-
27- div.Follow {
28- margin-right: 1rem
20+ h1 {
21+ font-weight: 300
22+ font-size: 1rem
23+
24+ display: flex
25+ div.Link {
26+ margin-left: .5rem
27+ }
2928 }
3029
31- div.directMessage {
30+ div.actions {
31+ display: flex
32+
33+ div.Follow {
34+ margin-right: 1rem
35+ }
36+
37+ div.directMessage {
38+ }
3239 }
3340 }
3441 }
3542
36- section.blogs {
43+ section.content {
44+ background-color: #fff
45+ $maxWidth
46+ margin: .8rem auto
47+ padding: .5rem 2rem
48+
49+ display: flex
50+ flex-wrap: wrap
51+
3752 div.BlogCard {
38- margin-bottom: .5rem
53+ flex-basis: 100%
54+ border-bottom: 1px solid rgba(0,0,0, .1)
55+ /* margin-bottom: .5rem */
3956
4057 div.context {
4158 div.Link { display: none }
4259 div.name { display: none }

Built with git-ssb-web