Giter VIP home page Giter VIP logo

Comments (10)

allen505 avatar allen505 commented on June 12, 2024

Thank you for your interest @dhruvitahrishi ! This is surely a useful feature to have.

Implementation Details

  • I think we'll be able to make this possible by using contenteditable attribute on the button text or by changing it from a button to a link.
  • The title of each Save will a Editable text which by default is the text currently present (date,time and number of tabs), but if the user wants he can edit it by clicking on it. After clicking on it, it should be editable and user can type in his desired text and hit enter, which should save the text.
  • Since the text will be editable, we need to have a seperate button which will launch all the tabs in a new window with a logo similar to this.

Let me know if you are interested in working on this feature.

from save-for-later.

AB047 avatar AB047 commented on June 12, 2024

I think this is going to be an easy fix, I can do this.

from save-for-later.

allen505 avatar allen505 commented on June 12, 2024

Definitely @AB047 you can give a try. Please have a look at my message above implementation details. For any further clarifications please drop your questions on this thread

from save-for-later.

emecas avatar emecas commented on June 12, 2024

Experimenting with editable titles

image

Experimenting with available area keeping intact title information

image

from save-for-later.

allen505 avatar allen505 commented on June 12, 2024

This is amazing work @emecas . The first image is exactly what I had in mind as mentioned in this comment. Since the text will be editable, we need to have a seperate button which will launch all the tabs in a new window with a logo similar to this. We have to shift all the icons to the right side however as to me it looks a bit odd to have unevenly distributed icons. I will repeat the implementation details of the Editable text in the begining of this thread too for reference.

Please do let me know if you are interested to work on this. One thing I forgot in the developement setup is to create a new branch to keep your feature implementation seperate from the master branch code. To do this enter:
git checkout -b <new-branch-name>
in a terminal.

from save-for-later.

emecas avatar emecas commented on June 12, 2024

Thanks @allen505

Following your indications and priorities, I'm working on this issue first and almost done.

Progresses:

  • 1) Editing the title and controlling its length > 0 and max based on the available area to avoid the buttons move or miss-align.

  • 2) Added a new launch button with the image suggested and relocated the logic to launch all the tabs clicking it.

  • 3) Moved the icons to the right

To do

For now I was having issues with 2 things:

  • 4) Once the edition of the title is done, then while attempting replacing/updating only the title's value in the local storage object is still failing. I have tried different approaches, it's not refreshed properly, So I'm still working on it. Also, it seems like you can only replace the full object in the storage.

  • 5) Ordering the icons at the right in specific desired order, I have 3 stiles with float: right; but I am not sure what is the order followed by the browser to locate the buttons (if it is based on the order you added them, or alphabetic order, or what is the criteria). these get located like: delete, launch and expand , but i would like to see: launch, expand, delete. I think it needs an extra DIV in order to put the buttons there in the desired order.

Final Result:

image

from save-for-later.

allen505 avatar allen505 commented on June 12, 2024

Adding some changes which are to be addressed:

  • To make the changes less jarring for the end users, I'm looking to make an edit button which enables the editableContent and a click on the Title to open the Save, as it was previously. This also gives more click area for most used feature which would be to repoen the Saves
  • Space is not accepted in Chrome
  • Title String Validations Required:
    • Empty String is being accepted
    • Very long Titles are accepted

from save-for-later.

emecas avatar emecas commented on June 12, 2024

Adding some changes which are to be addressed:

* To make the changes less jarring for the end users, I'm looking to make an edit button which enables the editableContent and a click on the Title to open the Save, as it was previously. This also gives more click area for most used feature which would be to repoen the Saves

* Space is not accepted in Chrome

* Title String Validations Required:
  
  * Empty String is being accepted
  * Very long Titles are accepted

hi @allen505, are you working on this currently? I could give this another try, I just need to know where we are

from save-for-later.

allen505 avatar allen505 commented on June 12, 2024

Hey @emecas , I had started on the changes but couldn't find the time to complete it. You can pick it up some parts of this if you are available

from save-for-later.

allen505 avatar allen505 commented on June 12, 2024

Closing this issue

from save-for-later.

Related Issues (18)

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.