チャンネルサイドバー #223

ryoha000 · 2020-04-05T03:26:30Z

WIPですが色々確認が必要だと思ったので寝る前にあげます。
現状画像のような感じです。
子チャンネルにはとべます。
アイコンが3つ並んだところは、今wsの実装ができてないのでこんな感じになる予定という表示です。
まだ全然進んでいないので答えていただくのは後ででもいいんですが質問があります。
ピン止めされている状態のfigmaが見当たらなかったのですがどんな感じでイメージしていますか？
トピックは設定しているとき文字色が変わったりしますか？

よろしくお願いします。

追記：　今日キーボードが壊れて注文したので今日明日は進捗があんまり生まれないかもです

spaspa · 2020-04-05T07:05:01Z

figma側がわかりづらくなってて申し訳ないんですが、ChannelSideBarHeaderのところ現在のチャンネル名が入ります:bow:

spaspa · 2020-04-05T07:12:36Z

ピン留めは現在のアクティビティのように、カードで表示するイメージです
アクティビティもですが高さの制限はかけます (別PRでいいかと)

spaspa · 2020-04-05T07:14:03Z

トピックは、

設定していない時 -> ui.secondaryのopacity 50%
設定している時 -> ui.primaryのopacity 100%

でお願いします (figmaの~~右の方~~ 左の方にサイドバー関連作りました)

ryoha000 · 2020-04-07T01:57:39Z

寝るのでWIPをあげます
表示中の見た目については大体完成のつもりです
把握している追加、修正すべき点は

閲覧中のユーザーが取れてない(~~たまに~~結構うまくいく、調査中)
スクロールバーなんとかする
開くときとか閉じるときのアニメーション
~~閉じた後の表示~~done

です。
質問なのです

figmaの右の方に関連について書いたって書いてますがちょっとどこかわかんなかったです
figmaの関連チャンネルが消えてるんですが消しましたか？
ピン止め辺りは完全に別タスクでいいですか？
メンバーは購読者だという認識なのですがあってますか？
下の編集ボタンって何を意図していますか？
トピック、ピン留め、メンバーはおそらく参照されることはサイドバー内のみだとおもうのですが、storeにおいちゃっていいですか？(現在はそうなってる)

よろしくお願いいたします。

spaspa · 2020-04-07T04:21:40Z

figmaの右の方に

左でした……
今サイドバーとその中身がおいてあるところです、デザインとかはそこ基準でお願いします

figmaの関連チャンネルが消えてるんですが消しましたか？

消した覚えはないけどなんでだろう:thinking:
最近いろんなところ消えてたりするのでバグかも

ピン止め辺りは完全に別タスクでいいですか？

OKです、余裕あればピン留め数だけ表示しておいてください

編集ボタン

おそらくサイドバーに何を表示するかと並び替えですね
今は考えなくてOKです

トピック、ピン留め、メンバーはおそらく参照されることはサイドバー内のみだとおもうのですが、storeにおいちゃっていいですか？

これらは全てサーバーからフェッチする必要がある情報なので、storeで良いかと
現在のチャンネルに関する情報を扱うストアモジュールをdomainの下に作ってそこで持ちますか

src/components/Main/MainView/ChannelSideBar/ChannelSideBar.vue

src/assets/mdi.ts

src/components/Main/MainView/ChannelSideBar/ChannelSideBarTopic.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarTopicContent.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarMemberIcons.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarMember.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarViewers.vue

ryoha000 · 2020-04-07T21:11:34Z

ピン留めしためっさーじを閲覧するところを書きました
上の「ピン止め部分は別タスクでいいか」という質問はモーダル作ったりするところの話でした
多分モーダルが開くと思うんですがその辺は手を加えていません

ryoha000 · 2020-04-07T23:29:14Z

閲覧者の数は数字だけじゃ何を表してるかわかりにくいと思ったので「＋」をつけました。
微妙ならかえます。
スクショは下にまとめますが僕的には/team/SysAd/traQ/Clientで聞いた件とこの件を除けば完成のつもりです。
意図と違う場所があればよろしくお願いします:pray:

src/components/Main/MainView/ChannelSideBar/ChannelSideBarTopic.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarTopicContent.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBar.vue

ryoha000 · 2020-04-11T00:44:53Z

自分としては完成のつもりです
よろしくお願いします

src/components/Main/MainView/ChannelSideBar/ChannelSideBarRelation.vue

ryoha000 · 2020-04-11T00:49:49Z

issueみてて思ったんですがトピックの編集もやった方がいいですか？

sapphi-red

masterブランチをマージするかrebaseするかした後にlint走らせてほしい 🙇

src/components/Main/MainView/ChannelSideBar/ChannelSideBar.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarEdit.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarHeader.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarMember.vue

src/components/Main/MainView/ChannelSideBar/UserIconEllipsisList.vue

src/components/Main/Modal/SettingModal/CloseButton.vue

src/lib/websocket/events.ts

src/store/entities/getters.ts

spaspa

スタイル周りについてです
これらを入れると見た目的にはこうなるはずです

src/components/Main/MainView/ChannelSideBar/ChannelSideBarRelationElement.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarContent.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarTopicContent.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarHeaderName.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarPinnedListHeader.vue

spaspa · 2020-04-12T05:13:20Z

実装段階ではfigmaの文字サイズ(を16で割ってremにしたもの)、AutoLayoutに設定されているmargin、paddingをそのまま使ってくれると助かります！:pray::pray:

src/components/Main/MainView/ChannelSideBar/ChannelSideBarRelation.vue

ryoha000 · 2020-04-13T04:00:58Z

ありがとうございます。修正しました！
よろしくお願いします:pray:

sapphi-red

あとnpm run lintし忘れてる気がする

src/components/Main/MainView/ChannelSideBar/ChannelSideBarHidden.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarMember.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarMemberIcons.vue

src/components/Main/Modal/SettingModal/CloseButton.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarHidden.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBar.vue

src/components/Main/MainView/ChannelSideBar/ChannelSideBarHidden.vue

src/lib/websocket/events.ts

sapphi-red

トピックの編集は別でよさそう #278

src/components/Main/MainView/ChannelSideBar/ChannelSideBar.vue

sapphi-red · 2020-04-15T04:27:12Z

src/components/Main/MainView/ChannelSideBar/ChannelSideBar.vue

+  display: flex;
+  flex-direction: column;


よく考えたら開いた状態と閉じた状態でメッセージ部分の幅が変わるの微妙だしスクロールバーの位置が微妙だからposition: absoluteでやるべきなきがしてきた
@spa どうしましょうあとで変えるとかにしますか？

うーん、確かにそんな気もします
とりあえずこれで入れてみて使い勝手的によくなければabsoluteにしますか

関係ない人にメンション飛ばしてて草

ryoha000 · 2020-04-16T01:23:57Z

ChannelSideBarをabsoluteで管理するのは使い勝手で判断してもらう感じでお願いします:pray:
僕はPCでtraQ-Rを使ってるときに、せっかく広い画面なのにSideBar開けながらinputできないの若干不便だなと思っていたので。(というか横に長いと右の方が寂しい)
mobileだけabsolute指定、ということなら僕はそっちの方がいいと思いましたが、手元でやったら若干違和感ありました

spaspa

LGTM 👍🎉
メッセージへのリンクとか細かいスタイルの調整とかはまた別のPRでいいかなという気持ちです

sapphi-red

LGTM 🎉

ryoha000 force-pushed the channel-side-bar branch 2 times, most recently from 8fe93b2 to 423588a Compare April 7, 2020 01:30

sapphi-red reviewed Apr 7, 2020

View reviewed changes

spaspa reviewed Apr 8, 2020

View reviewed changes

ryoha000 commented Apr 11, 2020

View reviewed changes

src/components/Main/MainView/ChannelSideBar/ChannelSideBarRelation.vue Outdated Show resolved Hide resolved

sapphi-red reviewed Apr 11, 2020

View reviewed changes

ryoha000 and others added 14 commits April 11, 2020 18:21

wip

48c7c2e

ノートからデスクトップへの移行

c64516d

daitai add VisibleSideBar

7143600

fix

502642b

add invisible bar

a63d33d

add pinned Mode

22b994a

add expand viewer

75bcbc4

fix

cd08e6b

fix

33cf22a

#wip

8d912f3

kansei??

eb0671d

fix

4144bd6

fix

a3cd8bb

fix

6ba0e64

ryoha000 marked this pull request as draft April 11, 2020 14:43

ryoha000 changed the title ~~[WIP]チャンネルサイドバー~~ チャンネルサイドバー Apr 11, 2020

ryoha000 force-pushed the channel-side-bar branch from 93455c6 to 6ba0e64 Compare April 11, 2020 18:26

spaspa reviewed Apr 12, 2020

View reviewed changes

src/components/Main/MainView/ChannelSideBar/ChannelSideBarRelation.vue Outdated Show resolved Hide resolved

src/components/Main/MainView/ChannelSideBar/ChannelSideBarRelation.vue Outdated Show resolved Hide resolved

fix moromoro

88d648d

sapphi-red reviewed Apr 13, 2020

View reviewed changes

src/lib/websocket/events.ts Outdated Show resolved Hide resolved

ryoha000 added 2 commits April 14, 2020 00:40

fix

8a6822e

change ChannelViewerState to ChannelViewer

77abb67

sapphi-red reviewed Apr 15, 2020

View reviewed changes

kan?

7807ce1

ryoha000 marked this pull request as ready for review April 16, 2020 01:26

ryoha000 added 4 commits April 16, 2020 12:58

Merge remote-tracking branch 'origin' into channel-side-bar

091d58f

fix

c0a58f1

fix

ab46691

fix

c18b2a0

sapphi-red linked an issue Apr 16, 2020 that may be closed by this pull request

チャンネルサイドバー #195

Closed

4 tasks

spaspa approved these changes Apr 16, 2020

View reviewed changes

sapphi-red approved these changes Apr 16, 2020

View reviewed changes

sapphi-red merged commit 0e002b3 into master Apr 16, 2020

sapphi-red deleted the channel-side-bar branch April 16, 2020 13:50

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

チャンネルサイドバー #223

チャンネルサイドバー #223

ryoha000 commented Apr 5, 2020 •

edited

Loading

spaspa commented Apr 5, 2020

spaspa commented Apr 5, 2020 •

edited

Loading

spaspa commented Apr 5, 2020 •

edited

Loading

ryoha000 commented Apr 7, 2020 •

edited

Loading

spaspa commented Apr 7, 2020 •

edited

Loading

ryoha000 commented Apr 7, 2020

ryoha000 commented Apr 7, 2020

ryoha000 commented Apr 11, 2020

ryoha000 commented Apr 11, 2020

sapphi-red left a comment

spaspa left a comment •

edited

Loading

spaspa commented Apr 12, 2020

ryoha000 commented Apr 13, 2020

sapphi-red left a comment

sapphi-red left a comment

sapphi-red Apr 15, 2020

spaspa Apr 15, 2020

ryoha000 Apr 15, 2020

ryoha000 commented Apr 16, 2020

spaspa left a comment

sapphi-red left a comment •

edited

Loading

チャンネルサイドバー #223

チャンネルサイドバー #223

Conversation

ryoha000 commented Apr 5, 2020 • edited Loading

spaspa commented Apr 5, 2020

spaspa commented Apr 5, 2020 • edited Loading

spaspa commented Apr 5, 2020 • edited Loading

ryoha000 commented Apr 7, 2020 • edited Loading

spaspa commented Apr 7, 2020 • edited Loading

ryoha000 commented Apr 7, 2020

ryoha000 commented Apr 7, 2020

ryoha000 commented Apr 11, 2020

ryoha000 commented Apr 11, 2020

sapphi-red left a comment

Choose a reason for hiding this comment

spaspa left a comment • edited Loading

Choose a reason for hiding this comment

spaspa commented Apr 12, 2020

ryoha000 commented Apr 13, 2020

sapphi-red left a comment

Choose a reason for hiding this comment

sapphi-red left a comment

Choose a reason for hiding this comment

sapphi-red Apr 15, 2020

Choose a reason for hiding this comment

spaspa Apr 15, 2020

Choose a reason for hiding this comment

ryoha000 Apr 15, 2020

Choose a reason for hiding this comment

ryoha000 commented Apr 16, 2020

spaspa left a comment

Choose a reason for hiding this comment

sapphi-red left a comment • edited Loading

Choose a reason for hiding this comment

ryoha000 commented Apr 5, 2020 •

edited

Loading

spaspa commented Apr 5, 2020 •

edited

Loading

spaspa commented Apr 5, 2020 •

edited

Loading

ryoha000 commented Apr 7, 2020 •

edited

Loading

spaspa commented Apr 7, 2020 •

edited

Loading

spaspa left a comment •

edited

Loading

sapphi-red left a comment •

edited

Loading