Giter Club home page Giter Club logo

clubs-events's Introduction

Welcome!

This is the Mozilla Clubs Event Reporting tool. It allows users to submit and browse through event reports.

How does it work?

  1. Users submit an event report using a Google Form
  1. The data from the form is then added to the Spreadsheet
  1. We access the spreadsheet using a special URL and get the data
  2. We display the data on the Dashboard

Making your own

You can make your own version of the clubs event reporter by following the steps below.

Setting up the form and spreadsheet

  1. Create your own copy of the Google Form
    • Here is the blank form - https://goo.gl/SsBlGq
    • On this form, select the 3-dot menu in the top-right corner and select Make a copy
  2. The new form should open in your browser
  3. On the new form, select the Responses Tab
  4. Click the green spreadsheet icon and click Create to make a new spreadsheet for your data
  5. Your new spreadsheet should open in the browser
  6. Open the File menu and then click Publish to the web...
  7. Ensure that Entire Document and Web Page are selected and click Publish
    • Your spreadsheet will now be accessible by the event reporter tool
  8. Submit an entry with your form and check that it made it to the spreadsheet.

Setting up your own repo

  1. Create your own version of the Event Reporter by forking this repo
  • To do so, click Fork in the top-right of the screen
  1. You can view the event reporter in two ways...
    • You can look load the index.html page in your browser
    • Or, you can start a local server on your computer and view it via localhost
      • On a mac, type python -m SimpleHTTPServer 8008 in your terminal in the same folder as the event reporter
      • Now you'll be able to access it in your browser via localhost:8008

Connecting your event reporter to your spreadsheet

To do this, we'll need to find out the ID of your spreadsheet.

  1. Open your spreadsheet and look at the URL, it might look something like this
    • https://docs.google.com/spreadsheets/d/1Nijr4qehpJ7LXuMGmQ4fNCprt2F8rCTVdOte9DXinTw/edit#gid=1720373540
  2. The ID is is the long string of numbers and letters after /d
    • In our the example above, it's 1Nijr4qehpJ7LXuMGmQ4fNCprt2F8rCTVdOte9DXinTw
  3. Copy that ID to your clipboard and open the js/config.js file
  4. Change the sheetID variable to your new ID.
  5. Now load up your event reporter, and see if your event appears.
    • If it doesn't, try using the other version of the sheetURL variable.
    • Just leave the one you want to try uncommented
    • Sometimes the URL needs to have a different syntax, so that's why we have a few options
  6. Check your event reporter again to make sure it worked.

clubs-events's People

Contributors

flukeout avatar xmatthewx avatar

Stargazers

 avatar  avatar

Watchers

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

clubs-events's Issues

Add a Review feature

Submissions should not be displayed without review. Let's add a field for staff to flag entries (followup, hold, publish). Only display entries marked as publish.

Questions

Form

  • Should we validate the links that are provided blog posts, photo albums etc
  • Should we ask what number of meeting this was for the club?
  • Decide which fields are required in the form

Reports

  • Which fields should we include in the publicly visible reports? All?
    • We might want to omit the Your Feedback question

NaN-ing out on event participant count

I'm trying to count strings as a number, so two things...

  • Validate for numbers in the form?
  • Or check that it's a number before adding to the participant count.

image

Place common country names at the top of the Country List

According to @amirad, there are Regional Coordinators in the following countries:

  • Bangaldesh
  • Brasil
  • Cape Town
  • Canada
  • China
  • India
  • Indonesia
  • Kenya
  • Philipines
  • Spain
  • UK
  • USA

We can put these, alphabetized, at the top of the Country list to make the form easier to use.

Add "Error" warning when data cannot be reached...

Very rarely the sheetsu API throttles the amount of requests and the app doesn't do anything. Could put up at least a retry / cannot be reached error. This is also an opportunity to use localstorage data if we have any, but default to trying to get real data.

Could be interesting in general to only fetch new data every minute or so, and use localstorage otherwise? Might be annoying for testing though. To be considered!

Add intro text above form

via @KGorr

Tell us about the Mozilla Clubs event you hosted! The report will be available for others to browse. Remember, by submitting information on this form, you’re giving us permission to use in newsletters, blogs, and other marketing and training materials.

cc @amirad

Adjust popup when the description text is very long.

Right now, when there is a very event description, it crowds out the rest of the info about the event. We can try a couple things:

  • Collapse the event description to a paragraph and add a "see more" link which will expand it.
  • Move more of the event info into the right-column

Create better layout for tall event cards

The one on the right is making all of the ones on that row taller, so we need to adjust the layout to accommodate that a little better (make it so the club / country info goes to teh bottom)

image

Handle missing data better...

Right now if you load a report direclty via URL like http://mozilla.github.io/clubs-events/?event=9999999 and that report doesn't exist, the popup still opens but has missing / junk data...

image

Need to handle this better.

Finalize the initial version of the form.

We need to audit all of the questions and for each field decide...

  • Is this question in the correct place in the form?
  • Is this the right question label?
  • Is helper text necessary, and if so, is this the right one?
  • Should it be a required field?
  • Should we validate this field?
    • We can do some basic validation on URLs
    • We can validate the attendance to make sure it's a number
    • We can have a minimum and maximum number of Web Literacies selected
  • For the country field, should we place certain countries near the top of the dropdown? You can't search by typing, so might be annoying to have to use the full list.
  • Some questions have (Optional) in the question, is that how we want to indicate optional responses?

We can go over this on Wednesday with @amirad

Explore ideas for showing images within the reporting tool.

Images are a powerful way to convey the feel of an event - how can we incorporate them?

One idea is to ask for a URL to an image that we can somehow use as the "cover" of a report. This will require some design work and we also need to accomodate reports without an image. We don't want things to look junky because only a few people have provided an image.

Feedback: A way to amend & edit the report.

From @soapdog

It would be cool if there was a way to amend the report later. For example, I am yet to write a blog post about this event but I will do it tonight. If there was a way to revisit the report to add links it would be great as future CCs might want the updated information.

Currently, we have a link that edits you edit the form immediately after you've submitted it, but have no way to make changes to your report later on.

If we stick with the current Google-spreadsheet-as-backend system, we could make the spreadsheet publicly editable and add a front-end for making edits. Not sure this is a good idea, as we would be putting our data at risk.

Add "Date of Event" field

And use the form submission timestamp in case it's blank, but we can make it a required field, so I think we're ok!

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.