소스 검색

docs: announcing-cientos-3-2-0 (#381)

* docs: announcing-cientos-3-2-0

* fix: typos, apply feedback in announce, add medias

* docs: updates feedback alvaro

---------

Co-authored-by: Alvaro Saburido <alvaro.saburido@gmail.com>
Jaime A Torrealba C 1 년 전
부모
커밋
5ae936fc69
4개의 변경된 파일112개의 추가작업 그리고 0개의 파일을 삭제
  1. 112 0
      docs/blog/announcing-cientos-3-2-0.md
  2. BIN
      docs/public/blog/announce-leches.jpg
  3. BIN
      docs/public/blog/glass-material.gif
  4. BIN
      docs/public/blog/useVideoTexture.gif

+ 112 - 0
docs/blog/announcing-cientos-3-2-0.md

@@ -0,0 +1,112 @@
+---
+sidebar: false
+---
+
+# Announcing cientos v3.2.0 🎉
+
+There is a lot going on in the TresJs Ecosystem.
+
+But for now let's hijack this space to announce what's happening in your favorite helper library for creating 3D experience with TresJs, the Cientos package! 😊
+
+- **Cientos v3.2.0**
+
+<iframe src="https://giphy.com/embed/vmon3eAOp1WfK" width="480" height="357" frameBorder="0" class="giphy-embed" allowFullScreen></iframe><p><a href="https://giphy.com/gifs/celebration-excited-loki-vmon3eAOp1WfK">via GIPHY</a></p>
+
+## Remove TweakPane from cientos 😱
+
+Ok ok, not really. We haven't dropped [TweakPane](https://cocopon.github.io/tweakpane/) from Cientos (just yet).
+
+In Cientos, we're constantly working to improve your development experience, and we have found that the tweakPane + plugin-essentials was taking up almost a third of the Cientos bundle size, so we have taken the decision to drop it from Cientos and add it as a peerDependency.
+
+This will mean that you have to manually install it to use `useTweakPane()`.
+
+So, as you may find in the logs, this package will be deprecated soon in the future.
+
+The good news is that we're working on a built-in solution... ok no more spoilers 😊
+
+![](/blog/announce-leches.jpg)
+
+## GlassMaterial 🍷
+
+![](/blog/glass-material.gif)
+
+¡We've something shiny here!
+
+A new fancy material only available in Cientos that emulates glass.
+
+As you should expect, it couldn't be easier to use:
+
+```html
+<MeshGlassMaterial ref="glassMaterialRef" />
+```
+
+This material is an adaptation of the MeshPhysicalMaterial so you can tweak the properties to achieve incredible results in the same way
+
+More info [here](https://cientos.tresjs.org/guide/materials/glass-material.html)
+
+## UseVideoTexture 🎞️
+
+![](/blog/useVideoTexture.gif)
+
+Yes!! the new loader allows you to easily use a video as a texture.
+
+```js
+import { useVideoTexture } from '@tresjs/cientos'
+import exampleVideo from '/myVideoPath'
+
+const texture = ref()
+texture.value = await useVideoTexture(exampleVideo) // you can pass options too
+```
+
+And in the component:
+
+```html
+...
+<Sphere :position="[0, 2, 0]">
+  <TresMeshBasicMaterial :map="texture" />
+</Sphere>
+...
+```
+
+For more information, you can check the official doc [useVideoTexture](https://cientos.tresjs.org/guide/loaders/use-video-texture.html)
+
+## Camera-controls 🎥
+
+Since the last version of Cientos was released, you have been able to use the famous Camera-controls library, made by [yomotsu](https://github.com/yomotsu).
+
+In case you don't know what I'm talking about, the CameraControls is a camera controller similar to OrbitControls yet it supports smooth transitions and more features.
+
+As always in Cientos we like to make things easy for you and so we created an abstraction that you can use like this:
+
+```html
+<template>
+  <TresCanvas shadows alpha>
+    <TresPerspectiveCamera :args="[45, 1, 0.1, 1000]" />
+    <CameraControls />
+  </TresCanvas>
+</template>
+```
+
+The number of tweaks you can do here is out of this world, check it out[here](https://cientos.tresjs.org/guide/controls/camera-controls.html)
+
+Big thanks to [notarun](https://github.com/notarun) for this amazing contribution.
+
+## New Event isLocked in (PointerLockControls)
+
+A new event has been added to the `PointerLockControls`, now you can effortlessly know if the PointerLock event is active or not. Simply add a couple of lines of code:
+
+```js
+const isActive = (state: boolean) => console.log(state)
+```
+
+```html
+...
+<PointerLockControls @is-lock="state => isActive(state)" />
+...
+```
+
+---
+
+We hope you like this new release. We are working hard to bring you the best possible experience when using TresJS.
+
+- Cientos https://github.com/Tresjs/cientos/releases

BIN
docs/public/blog/announce-leches.jpg


BIN
docs/public/blog/glass-material.gif


BIN
docs/public/blog/useVideoTexture.gif