Giter VIP home page Giter VIP logo

buddyup's Introduction

buddyup-ui

Real-time Firefox OS Support

Development Workflow

First, let's install the required dependencies. From the command line, run:

$ npm install

Once the above completes, run:

$ node_modules/.bin/grunt dev

This will precompile the nunjucks templates, start up the server, and start watching for changes to either app.js or any of the templates in app/views/. If any of the templates changes, it will auto-reload them.

To reduce the amount of typing you have to do, you may consider putting the node_modules/.bin directory on your PATH. Then you can simply use grunt dev instead of specifying the full path.

To access the app via a browser, open http://127.0.0.1:8000/app/index.html. To test on an real device, use the WebIDE built into Firefox.

You still need to run grunt prior to launching the WebIDE.

Localization

Localizations are not included by default, but are pulled from Verbatim via Sumo. To download the translations, run

$ node_modules/.bin/grunt get_localization

If all goes well, you should have one js file in app/translations/ for each supported locale. For example, the French localizations would be stored in app/translations/fr.js.

Tests

Unit

To run unit tests, we use the Gaia infrastructure.

You need to fetch Gaia and run the test server:

$ ./scripts/fetch-gaia.sh
$ ./scripts/run-unit-test-server.sh

And in another shell:

$ ./scripts/run-unit-tests.sh

Integration

You need to follow the same procedure as for unit tests.

$ ./scripts/fetch-gaia.sh
$ ./scripts/run-integration-tests-server.sh

And in another shell,

$ ./scripts/run-integration-tests.sh

buddyup's People

Contributors

adamkalis avatar douglassherk avatar johanlorenzo avatar mattdeveloper avatar mrakestraw13 avatar mythmon avatar rehandalal avatar rik avatar sole avatar tofumatt avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

buddyup's Issues

As a HELPER I want to end the chat and close the issue

helper-closeissue

  1. Helper taps on the "End" option in the chat window header.
  2. Helper receives a confirmation message to confirm that she wants to end the chat and close the issue.
  3. Helper taps "End" to end the chat and close the issue.
  4. Return to the home screen issue queue. The issue should be removed from the queue. A success message should overlay for x seconds letting Helper know that the issue was closed and a survey sent.

Questions/Comments:

  • Survey will be automatically sent when Helper ends a chat.
  • The overlays are different. The first is a modal, i.e. the user must answer "End" or "Cancel" to continue. The success message is like an Android "toast"--it gives the user feedback and shows onscreen for a few seconds without the user needing to dismiss it.
  • Will probably need to send an email or notification reminder if we see that an issue was answered but not closed. Helper might have tapped the "<" back button instead of "End"

As a HELPER I want to be able to take an issue and respond to it

helper-takeissue

  1. Helper goes to homepage of app and views queue of open issues. Helper selects issue by tapping on it.
  2. Chat screen for issue opens up. Helper can read the full text of the issue.
  3. If Helper decides to answer question she taps "Take Issue" at bottom of chat window.
  4. In chat window "Take Issue" is replaced with the standard text entry field and "Send" button for Helper to start chatting with Consumer.

Questions/Comments:
*Wondering if "Take Issue" is ideal wording for if we should use "Answer Request" instead?
*Instead of Consumer's name as typical in chat apps, let's just use the time stamp and up to two-lines of the text the Consumer has inputted.

As a HELPER I want to view my number of resolved issues and the number of data credits I've received for my work

helper-viewprofile

  1. Helper taps on menu in header.
  2. Helper views menu options and taps on "Profile"
  3. Helper views his profile with avatar, first and last name, and location. Helper can view issues answered, issues satisfied, and issues resolved. Helper can also view the number of minutes she has been rewarded for her work.

Questions/Comments:

  • Should we require first name and last name for Helpers? Or usernames?
  • Require location? (Need someway of knowing what language they speak and what regions they can support).
  • I divided issues into answered (they answered the request) and satisfied/resolved based on the survey feedback. Thinking about this now, might need to tweak this design to show number of user surveys answered vs. unanswered. Helper might have done a good job but lazy Consumer didn't fill out survey.

As a HELPER I want to start/stop a demo

helper-startstopdemo

  1. Helper taps the "Start Demo" button that appears at the top of the app underneath the header.
  2. The button is a toggle so that it automatically switches to "Stop Demo" when demo is active.
  3. Helper selects "Stop Demo" when she wants to end the demo. Button returns to "Start Demo"

Questions/Comments
*Should we have some visual change when the demo is happening? For example, the edge glows blue around the border of the app? Will we have visual feedback on the phone when the user is not on the app?
*The "Start Demo" should appear persistently below the header. Not exactly inconspicuous but Michelle and I thought it was better to have it front and center rather than hiding it in a menu where people might forget it exists.

How is a live chat issue closed?

How does a live chat issue get resolved and removed from the queue? Does the user close it or the helper? How does the user or the helper know when the issue is resolved?

Related--does a helper need to formally "take" a task? Or is it sufficient enough for folks to regulate themselves and, if another person is in the chat room, know not to interfere with the chat?

Wondering if there is any precedent for any of this in SUMO for responding to forum posts and the like.

As a CONSUMER I want live help with my phone

consumer-startchat

  1. Consumer taps on "Help" in the Settings menu and sees the Help screen with options for receiving software, hardware and billing support. Consumer sees an option for "Live Help" with a pithy explanation of what it is and that you can use data to use the app for free!
  2. Consumer taps on "Live Help" opening up the Live Help web app in the mobile browser. Live Help app includes text welcoming the user and asking the Consumer to type in their question.
  3. Consumer types question using the chat entry at bottom of app.
  4. App acknowledges that the user has entered in question and let's Consumer know that Helper is on the way.

Questions/Comments (lots of questions for @ednapiranha here :)

  • For prototype can we alter the Help screen in the Settings app on Firefox OS so that we can show option for Live Help?
  • In pilot we will probably need to add access to app on SUMO web app ('cause we won't be able to alter Settings app).
  • Hard question: how are we going to be able to detect user is on data when using BuddyUp so that we don't charge the user for data when using the app.
  • I would like any text that is a robot (like the Welcome message) to look visually different than text coming from user. That's why the robo text isn't in a bubble.
  • Need to detect when user has stopped texting so we can show you the message that community member is on the way
  • Will it be possible to give the user a wait time? Or tell them whether or not there are Helpers currently available?

As a CONSUMER I want to give feedback about my Live Chat experience

consumer-surveyendchat

  1. Helper let's Consumer know chat is over and to please fill out survey.
  2. Consumer sees modal with survey. Consumer gives feedback and taps "Submit"
  3. Consumer views "Thank you..." message that the chat has ended.

Questions/Concerns:

  • Made survey a super annoying modal so that we get Consumer to fill it out.
  • I show a friendly "Your chat has ended."
  • Can we keep the chat open so Consumer can keep page open and start a new chat session if they choose?
  • If Consumer opens up "Live Help" from Settings > Help screen a few days later will they see the previous session (that would be nice!)
  • How can we uniquely identify and track the Helper, Consumer, and chat session so we can associate survey data with all three?
  • Should Helper be notified when Consumer submits survey? Should Helper be able to resend the survey to the Consumer ('cause their data credits will depend on it!)

Create list of BuddyUp user stories

Here are a list of user stories I came up with. I will probably file individual issues for each these next week. @HerminaC let me know if you have any feedback on these or can think of any that I'm missing.

As a HELPER I want to be able to sign up for the service so that I may receive credits on my mobile phone bill.
As a HELPER I want to be able to view a queue of open issues.
As a HELPER I want to be able to see an indication in the queue if an open issue is being responded to.
As a HELPER I want to be able to take an issue and respond to it.
As a HELPER I want to start a demo.
As a HELPER I want to stop a demo.
As a HELPER I want to upload a screenshot to the chat
As a HELPER I want to end the chat and close the issue
As a HELPER I want to view all the issues I've resolved.
As a HELPER I want to view all the issues that have been resolved.
As a HELPER I want to be able to view all the issues that were closed but not resolved (timed out, for example)
As a HELPER I want to edit my username and password
As a HELPER I want to add a picture to my profile so people so the people I help see my lovely face and know I am not a psycho
As a HELPER I want to view my number of resolved issues and the number of data credits I've received for my work
As a HELPER I do not want to see items in the queue that are over 15 minutes old.
As a HELPER I want to receive a notification if I have responded to an issue and not closed it.
As a CONSUMER I do not want to have sign in to ask a question.
As a CONSUMER I want to be able to start Live Chat from an obvious place on the phone.
As a CONSUMER I want to be able to chat.
As a CONSUMER I want to be able to upload a screenshot
As a CONSUMER I want to be able to start a demo.
As a CONSUMER I want to be able to stop a demo.
As a CONSUMER I want to be able to give my feedback at the end of a session.
As a CONSUMER I want to be able to know when a chat session is over.
As a CONSUMER I want to see how long I will have to wait to get a response from a helper.

As a CONSUMER I want to be able to get demo from HELPER

consumer-startstopdemo1
consumer-startstopdemo2

  1. Helper tells Consumer about demo and asks them to tap the "Start Demo" button when they see the prompt in the app.
  2. "Start Demo" prompt animates down from the header of the app.
  3. Consumer taps "Start Demo"
  4. "Start Demo" button toggles to "Stop Demo" button.
  5. Consumer taps "Stop Demo" button.
  6. Start/Stop Demo app disappears up into the header.

Questions/Concerns:

  • Start/Stop button is a simple toggle. Shows up in the same place in the UI for Consumers and Helpers (for the win!) Helper "Start Demo" is persistent, for Consumer "Start Demo" only appears after Helper has tapped "Start Demo" (oops...might need to rethink Helper UI 'cause Helper could tap "Start Demo" but Consumer might not tap it back!)
  • Need to give Helpers good boilerplate text to introduce demo/screen sharing option to Consumer. @HerminaC any ideas for text?

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.