MisskeyRoom #5267

Merged
syuilo merged 97 commits from room into develop 4 years ago
syuilo commented 4 years ago (Migrated from github.com)

Summary

部屋を作れるように

TODO

難しい

  • 家具同士の当たり判定
  • esnextに戻す
  • なんかやけに重いのをどうにかする

普通

  • 家具をドラッグで移動できるようにする
  • カスタムテクスチャをCSSのcoverみたいな挙動にする
  • 部屋情報をエクスポートしたりインポートする機能

簡単

  • 設定でグラフィッククオリティを設定できるようにする
  • 設定で平行投影か近視投影か設定できるようにする
  • ナビゲーションにRoomへの導線を追加する
## Summary 部屋を作れるように ## TODO ### 難しい - [ ] 家具同士の当たり判定 - [x] esnextに戻す - [ ] なんかやけに重いのをどうにかする ### 普通 - [x] 家具をドラッグで移動できるようにする - [ ] カスタムテクスチャをCSSのcoverみたいな挙動にする - [ ] 部屋情報をエクスポートしたりインポートする機能 ### 簡単 - [x] 設定でグラフィッククオリティを設定できるようにする - [x] 設定で平行投影か近視投影か設定できるようにする - [x] ナビゲーションにRoomへの導線を追加する
AyaMorisawa (Migrated from github.com) reviewed 4 years ago
AyaMorisawa commented 4 years ago (Migrated from github.com)

src/client/app/tsconfig.json の moduleesnext から commonjs になっているのは要注意

https://misskey.m544.net/notes/716c8a8c36dc62a573d1510c

CodeSplittingがされなくなったとか、設定でプロフィールが見れなくなってる (langmapがエラー) とかがあるわ

src/client/app/tsconfig.json の `module` が `esnext` から `commonjs` になっているのは要注意 https://misskey.m544.net/notes/716c8a8c36dc62a573d1510c > CodeSplittingがされなくなったとか、設定でプロフィールが見れなくなってる (langmapがエラー) とかがあるわ
syuilo commented 4 years ago (Migrated from github.com)

commonjsだとWebpackのCodeSplittingが効かない問題があるみたいです

@syuilo CodeSplittingがされなくなったとか、設定でプロフィールが見れなくなってる (langmapがエラー) とかがあるわ

https://misskey.io/notes/7wd985i4io

commonjsだとWebpackのCodeSplittingが効かない問題があるみたいです > @syuilo CodeSplittingがされなくなったとか、設定でプロフィールが見れなくなってる (langmapがエラー) とかがあるわ https://misskey.io/notes/7wd985i4io
syuilo commented 4 years ago (Migrated from github.com)

オブジェクト同士の当たり判定をどうすればいいのかわからない

オブジェクト同士の当たり判定をどうすればいいのかわからない
syuilo commented 4 years ago (Migrated from github.com)

家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップすれば良さそうだけどThreejsにそういう機能はなさそう(レイが衝突したオブジェクトを取得する機能はあるけど座標を取得する機能はない)

家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップすれば良さそうだけどThreejsにそういう機能はなさそう(レイが衝突したオブジェクトを取得する機能はあるけど座標を取得する機能はない)
syuilo commented 4 years ago (Migrated from github.com)

オブジェクトの座標が分かっても形を考慮しないといけないしオブジェクトが回転しているかもしれないから意味ない

オブジェクトの座標が分かっても形を考慮しないといけないしオブジェクトが回転しているかもしれないから意味ない
acid-chicken (Migrated from github.com) reviewed 4 years ago
acid-chicken (Migrated from github.com) left a comment

<HTMLElement>ev.target の箇所は ev.target as HTMLElement の方が良さそうな気がしますが、いかがですか?

`<HTMLElement>ev.target` の箇所は `ev.target as HTMLElement` の方が良さそうな気がしますが、いかがですか?
AyaMorisawa commented 4 years ago (Migrated from github.com)

家具の作成ってBlenderでしか行えないんですか?(Blenderで作られたものしか受け付けないんですか?) そうであればCONTRIBUTING.mdに明記しておいた方が良さそう。

家具の作成ってBlenderでしか行えないんですか?(Blenderで作られたものしか受け付けないんですか?) そうであればCONTRIBUTING.mdに明記しておいた方が良さそう。
syuilo commented 4 years ago (Migrated from github.com)

おそらく他のソフトでも行えると思いますがBlenderしか持ってないので詳しくは分かりません><
ただ無料なのはBlenderだけだと思うので他の開発者も編集できることを考えるとBlenderが良さそう

おそらく他のソフトでも行えると思いますがBlenderしか持ってないので詳しくは分かりません>< ただ無料なのはBlenderだけだと思うので他の開発者も編集できることを考えるとBlenderが良さそう
syuilo commented 4 years ago (Migrated from github.com)

HiDPIディスプレイだと家具選択ができない模様

HiDPIディスプレイだと家具選択ができない模様
mei23 commented 4 years ago (Migrated from github.com)

image

posY, rotX, rotY, rotZ の方向が感覚的に逆に感じる?
posZ, rotX, rotZ, rotY の方向が感覚的に逆に感じる?

→説明中のZとY逆だったわ

![image](https://user-images.githubusercontent.com/30769358/63086730-6f4a2400-bf8b-11e9-9b68-6e52ceee33b7.png) ~~posY, rotX, rotY, rotZ の方向が感覚的に逆に感じる?~~ posZ, rotX, rotZ, rotY の方向が感覚的に逆に感じる? →説明中のZとY逆だったわ
syuilo commented 4 years ago (Migrated from github.com)

直します~

直します~
u1-liquid commented 4 years ago (Migrated from github.com)

家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップ

編集モードに限って重力を適用すれば勝手に落ちて何とかなりそう

> 家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップ 編集モードに限って重力を適用すれば勝手に落ちて何とかなりそう
AyaMorisawa commented 4 years ago (Migrated from github.com)

pinguinのblendファイルが欠けている?

pinguinのblendファイルが欠けている?
syuilo commented 4 years ago (Migrated from github.com)

pinguinはblenderじゃないみたいですね
プロジェクトファイルは「可能であれば」でも良いかも

pinguinはblenderじゃないみたいですね プロジェクトファイルは「可能であれば」でも良いかも
syuilo commented 4 years ago (Migrated from github.com)

カスタムテクスチャ(額縁とかモニターに任意の画像を表示できる機能)を使用した際に画像がはみ出す問題は修正しました
ただアスペクト比が一致しない場合(モニターの画面は横長なのに正方形の画像を表示するときなど)画像が引き伸ばされます できればCSSのcoverみたいな挙動にしたい

カスタムテクスチャ(額縁とかモニターに任意の画像を表示できる機能)を使用した際に画像がはみ出す問題は修正しました ただアスペクト比が一致しない場合(モニターの画面は横長なのに正方形の画像を表示するときなど)画像が引き伸ばされます できればCSSのcoverみたいな挙動にしたい
syuilo commented 4 years ago (Migrated from github.com)

あとカスタムテクスチャを設定したときにいったんページをリロードしないと反映されないのを直したい

あとカスタムテクスチャを設定したときにいったんページをリロードしないと反映されないのを直したい
u1-liquid commented 4 years ago (Migrated from github.com)

texture mesh に needsUpdate = true にしたらできるらしい

texture mesh に needsUpdate = true にしたらできるらしい
syuilo commented 4 years ago (Migrated from github.com)

あー、それはすでにしてるんですけど、画像のURL情報はTHREEのオブジェクト自体に保存しているわけではないので、プロパティの更新と同時にそっちのテクスチャも貼りなおさないといけない感じですね
今モデル読み込み時にやってる処理を再利用可能な形に抽出してプロパティ更新時もそれを呼ぶようにするとかでいけそう

あー、それはすでにしてるんですけど、画像のURL情報はTHREEのオブジェクト自体に保存しているわけではないので、プロパティの更新と同時にそっちのテクスチャも貼りなおさないといけない感じですね 今モデル読み込み時にやってる処理を再利用可能な形に抽出してプロパティ更新時もそれを呼ぶようにするとかでいけそう
syuilo commented 4 years ago (Migrated from github.com)

リロードしないと反映されないのを修正

リロードしないと反映されないのを修正
syuilo commented 4 years ago (Migrated from github.com)

部屋の床の色も変えられるようにしたい

部屋の床の色も変えられるようにしたい
syuilo commented 4 years ago (Migrated from github.com)

家具のドラッグでの移動は難しい
THREE標準でそういう機能あるけど使い方の説明がない
https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TransformControls.js

家具のドラッグでの移動は難しい THREE標準でそういう機能あるけど使い方の説明がない https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TransformControls.js
syuilo commented 4 years ago (Migrated from github.com)

あーなんかできた

あーなんかできた
syuilo commented 4 years ago (Migrated from github.com)

表示できたけど使い勝手が悪かった

具体的には、ハンドルを掴んで移動させようとしたときにクリックした位置の下にほかのオブジェクトがあるとそれをクリックしたものと判定されてしまう
それを防ぐために、ハンドルをクリックしたのにゃら弾く処理を追加したんだけど、にゃぜかハンドルの当たり判定がめっちゃ広く作られていて、今度はハンドルにかすらにゃい場所をクリックしてもハンドルをクリックしたものと判定されるようににゃってしまった

結論としてはやっぱり家具のドラッグ移動は無理

表示できたけど使い勝手が悪かった 具体的には、ハンドルを掴んで移動させようとしたときにクリックした位置の下にほかのオブジェクトがあるとそれをクリックしたものと判定されてしまう それを防ぐために、ハンドルをクリックしたのにゃら弾く処理を追加したんだけど、にゃぜかハンドルの当たり判定がめっちゃ広く作られていて、今度はハンドルにかすらにゃい場所をクリックしてもハンドルをクリックしたものと判定されるようににゃってしまった 結論としてはやっぱり家具のドラッグ移動は無理
syuilo commented 4 years ago (Migrated from github.com)

その過程でレイキャスターにレイの衝突した座標を格納するプロパティがあることに気づいたので家具同士の当たり判定が実装できるかもしれない

その過程でレイキャスターにレイの衝突した座標を格納するプロパティがあることに気づいたので家具同士の当たり判定が実装できるかもしれない
syuilo commented 4 years ago (Migrated from github.com)

使い勝手悪くなっちゃうけど家具の選択解除は選択解除ボタンを押さないとできないようにするしかないな

使い勝手悪くなっちゃうけど家具の選択解除は選択解除ボタンを押さないとできないようにするしかないな
syuilo commented 4 years ago (Migrated from github.com)

というより移動モードにするのと移動モード解除

というより移動モードにするのと移動モード解除
syuilo commented 4 years ago (Migrated from github.com)

家具をドラッグで移動できるようになった

家具をドラッグで移動できるようになった
syuilo commented 4 years ago (Migrated from github.com)

esnextでthreeをimportできない問題の解決策募集中

esnextでthreeをimportできない問題の解決策募集中
AyaMorisawa commented 4 years ago (Migrated from github.com)

esnextでthreeをimportできない問題の解決策募集中

  • d.tsを自前で用意する or
  • requireを使う
> esnextでthreeをimportできない問題の解決策募集中 * d.tsを自前で用意する or * requireを使う
u1-liquid commented 4 years ago (Migrated from github.com)

esnextでthreeをimportできない問題の解決策募集中

🍮 #5286
恐らくmoduleResolutionのおかげ

> esnextでthreeをimportできない問題の解決策募集中 🍮 #5286 恐らく`moduleResolution`のおかげ
AyaMorisawa commented 4 years ago (Migrated from github.com)

https://misskey.io/notes/7wjdajk73s

Misskey Room、自分のドライブのglbファイルをロードできたらどうかにゃ(コ`・ヘ・´ケ)

面白そうなアイデアなのでここに

https://misskey.io/notes/7wjdajk73s > Misskey Room、自分のドライブのglbファイルをロードできたらどうかにゃ(コ`・ヘ・´ケ) 面白そうなアイデアなのでここに
AyaMorisawa commented 4 years ago (Migrated from github.com)

https://misskey.io/notes/7wjbu50ap9

three.jsがesnextでimportできない問題さえ解決できれば今すぐにでもリリースしたいぞ

らしいので、リリース後、TODOをそれぞれIssueとして開くのが良さそう

https://misskey.io/notes/7wjbu50ap9 > three.jsがesnextでimportできない問題さえ解決できれば今すぐにでもリリースしたいぞ らしいので、リリース後、TODOをそれぞれIssueとして開くのが良さそう
u1-liquid (Migrated from github.com) reviewed 4 years ago
u1-liquid commented 4 years ago (Migrated from github.com)

TransformControls、公式のexample https://threejs.org/examples/misc_controls_transform.html では
Ctrl を押していると setTranslationSnapとsetRotationSnapで移動・回転のsnapができるので活用したいと思います

TransformControls、公式のexample https://threejs.org/examples/misc_controls_transform.html では Ctrl を押していると setTranslationSnapとsetRotationSnapで移動・回転のsnapができるので活用したいと思います
syuilo (Migrated from github.com) reviewed 4 years ago
u1-liquid (Migrated from github.com) reviewed 4 years ago
syuilo commented 4 years ago (Migrated from github.com)

パンできるようにしようと思ったけど、右クリックは視点回転だし、左クリックは家具選択なので空きがなかった

パンできるようにしようと思ったけど、右クリックは視点回転だし、左クリックは家具選択なので空きがなかった
syuilo commented 4 years ago (Migrated from github.com)

ん、なんかWebSocketに接続できなくなってる気がするけど私だけかな

ん、なんかWebSocketに接続できなくなってる気がするけど私だけかな
u1-liquid commented 4 years ago (Migrated from github.com)

パンできるようにしようと思ったけど、右クリックは視点回転だし、左クリックは家具選択なので空きがなかった

これ、公式のexampleではCtrl+dragでPan、モバイル版ではtwo-finger dragだった

> パンできるようにしようと思ったけど、右クリックは視点回転だし、左クリックは家具選択なので空きがなかった これ、公式のexampleではCtrl+dragでPan、モバイル版ではtwo-finger dragだった
The pull request has been merged as 45b972c059.
You can also view command line instructions.

Step 1:

From your project repository, check out a new branch and test the changes.
git checkout -b room develop
git pull origin room

Step 2:

Merge the changes and update on Forgejo.
git checkout develop
git merge --no-ff room
git push origin develop
Sign in to join this conversation.
No reviewers
No Milestone
No project
No Assignees
1 Participants
Notifications
Due Date
The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: calckey/calckey#5267
Loading…
There is no content yet.