room
develop
部屋を作れるように
src/client/app/tsconfig.json の module が esnext から commonjs になっているのは要注意
module
esnext
commonjs
https://misskey.m544.net/notes/716c8a8c36dc62a573d1510c
CodeSplittingがされなくなったとか、設定でプロフィールが見れなくなってる (langmapがエラー) とかがあるわ
commonjsだとWebpackのCodeSplittingが効かない問題があるみたいです
@syuilo CodeSplittingがされなくなったとか、設定でプロフィールが見れなくなってる (langmapがエラー) とかがあるわ
https://misskey.io/notes/7wd985i4io
オブジェクト同士の当たり判定をどうすればいいのかわからない
家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップすれば良さそうだけどThreejsにそういう機能はなさそう(レイが衝突したオブジェクトを取得する機能はあるけど座標を取得する機能はない)
オブジェクトの座標が分かっても形を考慮しないといけないしオブジェクトが回転しているかもしれないから意味ない
<HTMLElement>ev.target の箇所は ev.target as HTMLElement の方が良さそうな気がしますが、いかがですか？
<HTMLElement>ev.target
ev.target as HTMLElement
家具の作成ってBlenderでしか行えないんですか？(Blenderで作られたものしか受け付けないんですか？) そうであればCONTRIBUTING.mdに明記しておいた方が良さそう。
おそらく他のソフトでも行えると思いますがBlenderしか持ってないので詳しくは分かりません＞＜ ただ無料なのはBlenderだけだと思うので他の開発者も編集できることを考えるとBlenderが良さそう
HiDPIディスプレイだと家具選択ができない模様
posY, rotX, rotY, rotZ の方向が感覚的に逆に感じる？ posZ, rotX, rotZ, rotY の方向が感覚的に逆に感じる？
→説明中のZとY逆だったわ
直します～
家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップ
編集モードに限って重力を適用すれば勝手に落ちて何とかなりそう
pinguinのblendファイルが欠けている？
pinguinはblenderじゃないみたいですね プロジェクトファイルは「可能であれば」でも良いかも
カスタムテクスチャ(額縁とかモニターに任意の画像を表示できる機能)を使用した際に画像がはみ出す問題は修正しました ただアスペクト比が一致しない場合(モニターの画面は横長なのに正方形の画像を表示するときなど)画像が引き伸ばされます できればCSSのcoverみたいな挙動にしたい
あとカスタムテクスチャを設定したときにいったんページをリロードしないと反映されないのを直したい
texture mesh に needsUpdate = true にしたらできるらしい
あー、それはすでにしてるんですけど、画像のURL情報はTHREEのオブジェクト自体に保存しているわけではないので、プロパティの更新と同時にそっちのテクスチャも貼りなおさないといけない感じですね 今モデル読み込み時にやってる処理を再利用可能な形に抽出してプロパティ更新時もそれを呼ぶようにするとかでいけそう
リロードしないと反映されないのを修正
部屋の床の色も変えられるようにしたい
家具のドラッグでの移動は難しい THREE標準でそういう機能あるけど使い方の説明がない https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TransformControls.js
あーなんかできた
表示できたけど使い勝手が悪かった
具体的には、ハンドルを掴んで移動させようとしたときにクリックした位置の下にほかのオブジェクトがあるとそれをクリックしたものと判定されてしまう それを防ぐために、ハンドルをクリックしたのにゃら弾く処理を追加したんだけど、にゃぜかハンドルの当たり判定がめっちゃ広く作られていて、今度はハンドルにかすらにゃい場所をクリックしてもハンドルをクリックしたものと判定されるようににゃってしまった
結論としてはやっぱり家具のドラッグ移動は無理
その過程でレイキャスターにレイの衝突した座標を格納するプロパティがあることに気づいたので家具同士の当たり判定が実装できるかもしれない
使い勝手悪くなっちゃうけど家具の選択解除は選択解除ボタンを押さないとできないようにするしかないな
というより移動モードにするのと移動モード解除
家具をドラッグで移動できるようになった
esnextでthreeをimportできない問題の解決策募集中
🍮 #5286 恐らくmoduleResolutionのおかげ
moduleResolution
https://misskey.io/notes/7wjdajk73s
Misskey Room、自分のドライブのglbファイルをロードできたらどうかにゃ（ｺ｀・ﾍ・´ｹ）
面白そうなアイデアなのでここに
https://misskey.io/notes/7wjbu50ap9
three.jsがesnextでimportできない問題さえ解決できれば今すぐにでもリリースしたいぞ
らしいので、リリース後、TODOをそれぞれIssueとして開くのが良さそう
TransformControls、公式のexample https://threejs.org/examples/misc_controls_transform.html では Ctrl を押していると setTranslationSnapとsetRotationSnapで移動・回転のsnapができるので活用したいと思います
パンできるようにしようと思ったけど、右クリックは視点回転だし、左クリックは家具選択なので空きがなかった
ん、なんかWebSocketに接続できなくなってる気がするけど私だけかな
これ、公式のexampleではCtrl+dragでPan、モバイル版ではtwo-finger dragだった
45b972c059
No due date set.
No dependencies set.
Deleting a branch is permanent. It CANNOT be undone. Continue?
Summary
部屋を作れるように
TODO
難しい
普通
簡単
src/client/app/tsconfig.json の
moduleがesnextからcommonjsになっているのは要注意https://misskey.m544.net/notes/716c8a8c36dc62a573d1510c
commonjsだとWebpackのCodeSplittingが効かない問題があるみたいです
https://misskey.io/notes/7wd985i4io
オブジェクト同士の当たり判定をどうすればいいのかわからない
家具の底面からレイを床の方向に飛ばして、レイが衝突した座標にスナップすれば良さそうだけどThreejsにそういう機能はなさそう(レイが衝突したオブジェクトを取得する機能はあるけど座標を取得する機能はない)
オブジェクトの座標が分かっても形を考慮しないといけないしオブジェクトが回転しているかもしれないから意味ない
<HTMLElement>ev.targetの箇所はev.target as HTMLElementの方が良さそうな気がしますが、いかがですか？家具の作成ってBlenderでしか行えないんですか？(Blenderで作られたものしか受け付けないんですか？) そうであればCONTRIBUTING.mdに明記しておいた方が良さそう。
おそらく他のソフトでも行えると思いますがBlenderしか持ってないので詳しくは分かりません＞＜
ただ無料なのはBlenderだけだと思うので他の開発者も編集できることを考えるとBlenderが良さそう
HiDPIディスプレイだと家具選択ができない模様
posY, rotX, rotY, rotZ の方向が感覚的に逆に感じる？posZ, rotX, rotZ, rotY の方向が感覚的に逆に感じる？
→説明中のZとY逆だったわ
直します～
編集モードに限って重力を適用すれば勝手に落ちて何とかなりそう
pinguinのblendファイルが欠けている？
pinguinはblenderじゃないみたいですね
プロジェクトファイルは「可能であれば」でも良いかも
カスタムテクスチャ(額縁とかモニターに任意の画像を表示できる機能)を使用した際に画像がはみ出す問題は修正しました
ただアスペクト比が一致しない場合(モニターの画面は横長なのに正方形の画像を表示するときなど)画像が引き伸ばされます できればCSSのcoverみたいな挙動にしたい
あとカスタムテクスチャを設定したときにいったんページをリロードしないと反映されないのを直したい
texture mesh に needsUpdate = true にしたらできるらしい
あー、それはすでにしてるんですけど、画像のURL情報はTHREEのオブジェクト自体に保存しているわけではないので、プロパティの更新と同時にそっちのテクスチャも貼りなおさないといけない感じですね
今モデル読み込み時にやってる処理を再利用可能な形に抽出してプロパティ更新時もそれを呼ぶようにするとかでいけそう
リロードしないと反映されないのを修正
部屋の床の色も変えられるようにしたい
家具のドラッグでの移動は難しい
THREE標準でそういう機能あるけど使い方の説明がない
https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TransformControls.js
あーなんかできた
表示できたけど使い勝手が悪かった
具体的には、ハンドルを掴んで移動させようとしたときにクリックした位置の下にほかのオブジェクトがあるとそれをクリックしたものと判定されてしまう
それを防ぐために、ハンドルをクリックしたのにゃら弾く処理を追加したんだけど、にゃぜかハンドルの当たり判定がめっちゃ広く作られていて、今度はハンドルにかすらにゃい場所をクリックしてもハンドルをクリックしたものと判定されるようににゃってしまった
結論としてはやっぱり家具のドラッグ移動は無理
その過程でレイキャスターにレイの衝突した座標を格納するプロパティがあることに気づいたので家具同士の当たり判定が実装できるかもしれない
使い勝手悪くなっちゃうけど家具の選択解除は選択解除ボタンを押さないとできないようにするしかないな
というより移動モードにするのと移動モード解除
家具をドラッグで移動できるようになった
esnextでthreeをimportできない問題の解決策募集中
🍮 #5286
恐らく
moduleResolutionのおかげhttps://misskey.io/notes/7wjdajk73s
面白そうなアイデアなのでここに
https://misskey.io/notes/7wjbu50ap9
らしいので、リリース後、TODOをそれぞれIssueとして開くのが良さそう
TransformControls、公式のexample https://threejs.org/examples/misc_controls_transform.html では
Ctrl を押していると setTranslationSnapとsetRotationSnapで移動・回転のsnapができるので活用したいと思います
パンできるようにしようと思ったけど、右クリックは視点回転だし、左クリックは家具選択なので空きがなかった
ん、なんかWebSocketに接続できなくなってる気がするけど私だけかな
これ、公式のexampleではCtrl+dragでPan、モバイル版ではtwo-finger dragだった
45b972c059.