Giter VIP home page Giter VIP logo

Comments (9)

vedmack avatar vedmack commented on August 30, 2024

I was thinking (and already implemented) about the following:

Successful scenario: click on "Send" -> "Send" will be replaced with "Sending..." (for a 1500 milliseconds) and then will be feedback will be closed

Failed scenario: click on "Send" -> "send" will be replaced with "Sending failed." and feedback wont be closed (maybe after 1500 milliseconds replace "Sending failed." with "Send" <-- this is not implemented yet)

What do you think? I don't want to force the user to click again on the form to close it after a successful sending of the feedback. Link to partial Implementation

from feedback_me.

ArturGabrys avatar ArturGabrys commented on August 30, 2024

I think that "if failed" works good and this could stay like this.

But in case "if OK" and message was send i think that form could hide (slide back) like it does from the beginning and just leave some kind of message in case if user would not understand that message was send and he want to slide out form and send again. Example:

message-ok

I also think that forcing user to close the form after send it's a bad idea. I just want to leave him some kind of tip that everything was ok.

It would be great if i could write my own messages (like in other places of form) because I use multilanguage website and depending of location I show different content.

Thank you :)

from feedback_me.

barrust avatar barrust commented on August 30, 2024

Perhaps, then, it could be an option to change the success and failure text? Or perhaps make it a call back that the user can set?

from feedback_me.

vedmack avatar vedmack commented on August 30, 2024

Regarding the customization, every string in my plugins is customizable
I'm still thinking about a proper way to inform the user about a successful feedback send...

I think I'm going to do the following : in case of success I will slide the widget back and show a small dialog / div in the center of the screen with some success message and it will fade away after a second and a half (customizable), User must know for sure that the feedback was sent, If he got doubts and think about opening the widget back in search of a clue "Message sent / etc'" that mean that Its not designed right. Take a look at it in action http://feedback-me.appspot.com/example_clean_lab.html (wok in progress + ignore the grey dialog color on top of the gray)

Additional ideas are welcome

from feedback_me.

ArturGabrys avatar ArturGabrys commented on August 30, 2024

If only it will be cross-browser I think it will be ok :) but in case of full hd resolution and 24-27 inch monitors user will be focus at form in left corner and the dialog will show up in the middle of screen.

Maybe you could just do something like this;
if message send correctly, background of form will change to green, the input and submit will be hidden and message will be shown and after couple of second the form will slide back and hide like usually does.

from feedback_me.

ArturGabrys avatar ArturGabrys commented on August 30, 2024

I've closed issue by mistake. Sorry ;)

from feedback_me.

vedmack avatar vedmack commented on August 30, 2024

Took me a while, but I'm almost done with this one
I decided on the following flow
Click on send
"send" button text changes into "sending"
Then:
"sending" button text changes back into "send"
if success: green thick bordered dialog with success text will appear and fade away
if fail: red thick bordered dialog with fail text will appear and fade away

  • all is customizable even the delays
            delayed_options : {
                delay_success_milliseconds : 2000,
                delay_fail_milliseconds : 2000,
                sending : "Sending...",
                send_fail : "Sending failed.",
                send_success : "Feedack sent."
            }

Other proposed solution would take much time, in future you can open new issues for maybe asking a support for setting callbacks to the flow so you will be able to control the behaviour of the feedback in case of success / fail, feel free to fork and send pull requests :)

from feedback_me.

ArturGabrys avatar ArturGabrys commented on August 30, 2024

I think that your final solution will be good :)

Please let me know when you release the final version.

Thank you!

from feedback_me.

vedmack avatar vedmack commented on August 30, 2024

Done, finally (0.5.5 version) :)
Go over the docs (delayed_close and delayed_options properties) and the showcase and see it in action, I got plans to improve the growl alike dialog in the future (e.g improve the appearance of "X" in the growl dialog)

from feedback_me.

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.