Git Product home page Git Product logo

Comments (5)

danielmutis avatar danielmutis commented on June 1, 2024 1

WG: in order to have this in Vanilla there is a lot of work that is required. Exploring similar solutions in other products, detail the way in which we want to do expand and collapse behaviour (including the side nav). For now, this will be implemented as designed in Anbox, but in order to include it in Vanilla there needs to be more detailed explorations.

from vanilla-framework.

bartaz avatar bartaz commented on June 1, 2024

Currently panels can be opened/closed fully. A button that triggers it could be in the main panel.

panel

Is there any benefit of having the panel constantly there, but in collapsed state? It doesn't seem to show any information in collapsed mode, apart from the button to open it.

from vanilla-framework.

acarege avatar acarege commented on June 1, 2024

Thank you for the quick reply @bartaz ☺️

I believe that having the collapsed state instead of a button trigger creates a more integrated experience. With the collapsed state, the fact that "controls are an integrated part of the AOOS streaming" is conveyed better IMO. I also think that native state actions for a design element should live inside that element whenever possible. In our example:

  • Element : side panel
  • Native actions: expand/collapse, widen/shrink (the buttons next to expand/collapse on the screen record)

When you consider this, it makes sense that expand/collapse is together with widen/shrink inside the panel itself, as both actions are related to the panel state.

While reflecting on my choice and considering your button proposal these were my additional thoughts:

  • As you can see we have the possible actions for the stream page under a contextual menu. One of those actions (show statistics) opens its side panel. So one argument can be why don't we put it there in a similar fashion then? The answer to that is putting AAOS controls as a button in the contextual menu isn't viable because it defeats the purpose of quick and easy access. To open the panel the user has to perform 2 clicks, but what is worse is that if they close the panel they have to perform two clicks again just to reopen it. That is too much hassle.
  • The second argument could be putting a button next to the actions contextual menu which would solve the quick and easy problem. However, that is hierarchically wrong to me because the purpose of a contextual menu is to gather all the button actions in one place. It doesn't sit right if we have a contextual menu and a single button next to it.

Lmk what you think!

from vanilla-framework.

bartaz avatar bartaz commented on June 1, 2024

Thanks @acarege for more context.

My suggestion was just to show a similar functionality may currently work with what's in Vanilla.

If there are reasons to extend it to have collapsible panels (and you clearly show that there are) I think the next step would be to bring this up on next Vanilla Working Group, to decide if that's something that should go to Vanilla directly, or should that be developed in your project only for now.

from vanilla-framework.

acarege avatar acarege commented on June 1, 2024

Thank you for the suggestion, I find them very helpful because they might point to a more feasible direction that we haven't thought of, or they might not be suitable but still allow us to reflect on our decision and push us to provide logical reasons for them πŸ€“

I will attend the next Vanilla WG meeting to extend the discussion as you mentioned. Looking forward!

from vanilla-framework.

Related Issues (20)

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.