GithubHelp home page GithubHelp logo

asset-packs's Introduction

Marketplace

Decentraland's Marketplace

Frontend

Coverage Status

The Marketplace is a React static site. Its code can be found under the /webapp directory.

Backend

It can be found under /indexer.

How to contribute

Contributing to the Marketplace is easy, you just need to go through the following process:

  1. Look for issues in the Issues tab or create a new one with the proposed changes. We classify issues with the “Enhancement”, “Bug” or “Good first issue” tags. Feel free to check one of those first.
  2. Contact team members via the GitHub issue or use the Code Contribution Discord channel. It’s important to at least check on the issue status before starting.
  3. Set up your GPG key and sign all commits in your branch.
  4. Read the testing standards and the coding standards to produce code that fits the project standards.
  5. Create a PR with the changes, linking the PR to the created issue. If there are visual changes in the PR, attach images.

Copyright & License

This repository is protected with a standard Apache 2 license. See the terms and conditions in the LICENSE file.

asset-packs's People

Contributors

cazala avatar cyaiox avatar gonpombo8 avatar nearnshaw avatar nicoecheza avatar

Watchers

 avatar  avatar  avatar

asset-packs's Issues

Support custom actions

For this we could provide a helper or just use the existing getActionEvents and getTriggerEvents from @dcl/asset-packs.

We would need to check if those helpers work when impoted and used from the scene. Also we need to check if the payloads provided are okay or have too much unnecessary data, if so we might want to wrap them in another helper and use that instead.

Remove entity

Add a remove_entity action that removes the entity

Change text

Add a set_text action that changes the text of the TextShape component of the entity. If it does not have a TextShape it should do nothing, and the action should not be selectable in the actions dropdown

Loop

Add a start_loop action that has a payload of action and interval. The actions must be from the entity itself. Add also a stop_loop action that can cancel the active delay action.

Also add trigger on_loop that should be emited when the loop happens, so users can listen to it and make use of trigger conditions.

Delay

Add a start_delay action that has a payload of action and timeout. The actions must be from the entity itself. Add also a stop_delay action that can cancel the active delay action.

Also add trigger on_delay that should be emited when the delay happens, so users can listen to it and make use of trigger conditions.

States component auto-creates actions

Whenever I add a States component, for each state I define, I want to implicitly have a Set State action

When I add a new state "Open"

  • check if entity has Actions compontent
  • if true, check if there’s an action with type=set_state and value=“Open”
  • if there’s not such action, add action “Set Open” of type=set_state and value=“Open”

When I add a new Action component

  • if entity has States component, loop over each state and create an action “Set {state}” with type=set_state and value={state}

(in case the user first creates the States and then adds the Action component)

With the same logic, we could do something similar with the Counter component

So that we automatically have “Increase Counter” and “Decrease counter” actions
(Set counter would still need to be defined manually bc there you can set any number you want)

Play video stream from URL

Add a play_video action with a url as payload. It will require the support for the VideoPlayer component.

Ambient sound smart item

An entity with an AudioSource component
It should also have a visible shape of a 2D speaker icon, that shouldn't be visible in preview

We could either have a single generic one
Or have a handful of options with some generic sounds

  • Crickets
  • Birds
  • River
  • Busy city

We had some sound loops already picked out like this in the old builder version

Invisible wall smart item

An entity with a colliderMesh
And a visible transparent cube as a shape, only visible in inspector

There were some variations in the old Builder that would be nice to add too

  • Cube
  • Cylinder
  • Dome
  • Ramp
  • Sphere

Show image in UI

We should add a show_image and hide_image actions. The payload should have text, hideAfterSeconds, width, height and alignment (top|topRight|right|bottomRight|bottom|bottomLeft|left|topLeft|center).

We should also tie the click on the UI image to the on_click trigger.

Teleport smart item

A smart item that takes you to another scene's coordinates

We have a 3D model from the old builder for this

Teleport player

We should add a teleport_player action with an x, y, z and an optional rotation as a payload

External link smart items

A set of smart items with clickable actions to open external links.

We should reuse the models we have in the "Social Links" asset pack from the old builder, that include logos for

  • Twitter
  • Youtube
  • Discord
  • Facebook
  • Instagram
  • Telegram
  • Wechat
  • GitHub

The default action should take you to the social media's landing page

Smart items, custom components and systems

This conversation has been moved over here: decentraland/sdk#933

Background

Items used to be only a GLB + Transform, but that would only allow us to create static scenes. In the legacy Builder we had the concept of "smart items" that had some interactivity baked in and enabled users to create some flows and simple game logic.

Now items can have more components than only GltfContainer, like Triggers and Actions, but when using those, they need specialized systems to be running, and custom components to be added to the engine.

The original plan to support this was the following:

  • Each items would list its dependencies (ie @dcl/[email protected])
  • When an item is dropped into the scene, if it has dependencies and they are not already tracked in the project, they are added (ie. added to the package.json), and the necessary components are created with their values (exposed by the item data.json)
  • Once the dependencies are installed/downloaded (ie. from an npm registry or cdn like unpkg), we need to:
    • re-create the bin/index.js on the web editor, on the vscode editor we would need to add the imports to the entrypoint
    • in runtime, we need to add the new components to the @dcl/inspector's engine

Some of the problems found:

  • The packages would need to export a static representation of the components instead of the actual component itself (created with engine.defineComponent) because the we need to run this not only on the deployed scene, but also on the @dcl/inspector engine itself, and also we need to namespace the name of the component with the package name and version otherwise they could clash
  • We would need to compile the javascript file on the browser, we tried using @swc/wasm but we could not manage to make it work with our current build system in esbuild.
  • Even if we would have made the compiler to work, we still couldn't figure out a way to make it also compile dependencies of the packages themself, we wanted to be able to use @dcl-sdk/utils.
  • How should we handle two items with the same dependency on different versions?

What we ended up doing:

  • We created a single package that contains all the systems for the items to work in this repo @dcl/asset-packs. It can have its own dependencies like @dcl-sdk/utils.
  • The CI compiles the bin/index.js file and publishes in the npm package along with the components needed by the @dcl/inspector engine
  • The @dcl/inspector installs the @dcl/asset-packs dependency and it uses those components on its own engine, and it publishes the bin/index.js from that dependency along with the other static assets in its own @dcl/inspector npm package
  • Whover uses the @dcl/inspector (ie. the Builder) can pass a binIndexJsUrl param that tells the inspector from where to get the bin/index.js, since the builder serves the static assets from the @dcl/inspector (html, css, etc) it also serves the bin/index.js, so it passes the public url of that bin/index.js as the binIndexJsUrl.
  • In the future, if we wanted to generate the bin/index.js elsewhere (ie. a server that compiles the js) we could simply change this url to the service that will return the compiled js.
  • We can add new smart items to the asset-packs repo using the available components without having to release a new @dcl/inspector but if we want to add new functionality or new components/systems, we need to add them to the @dcl/asset-packs repo, and then upgrade the depdency (and might need to create UI components for them) in ther @dcl/inspector.

Clone entity

Add a clone_entity action with a x, y, z payload that clones the entity and places it in the desired coords

Generic shape smart items

A collection of items with MeshShape, MeshCollider and Material
By default with a plain color

  • A Cube
  • A Plane
  • A Cylinder
  • A Cone
  • A Sphere

Show text in UI

We should add a show_text and hide_text actions. The payload should have text, hideAfterSeconds, font, size and alignment (top|topRight|right|bottomRight|bottom|bottomLeft|left|topLeft|center)

Text from action doesn't appear in the same place

I have a scene with two triggers that display text with the Show Text action

Even though they're both configured to have the text centered, the second one appears more to the right.
If I open them in a different order, the one that appears second is still always more to the right.

Screen.Recording.2023-12-07.at.17.48.58.mov

Add keys

Add keys and access card smart items

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.