Skip to content
This is a web app written in pure javascript/html/css that allows the user to vote for candidates and focuses and the visualization of the votes. Demo:
JavaScript HTML CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
js
.DS_Store
README.MD
app.yaml
gui_1.css
index.html
pic.png

README.MD

Marouen Helali

September 9th 2018

code developed on: Mac

approach:

I made a layout of the graphical user interface in HTML and decorated it with some css to make it more visually acceptable. Then I decided to add functionality through JavaScript and jQuery. I created two arrays. One to hold the candidates names and another to hold the number of votes the candidate gets. I used the indexes of the arrays to know which votes belong to which candidates. I made a table to hold the candidates and I would add a table row (tr - td) every time the add button is clicked. I gave every table row a unique id so I can loop through them later when I am trying to pick out which one I clicked on and decide which candidate to "vote" for (which candidate td got clicked). I made the deletion of a candidate not delete them from the arrays, but I deleted them from the view and ignored/set back to 0 their values so I can keep the votes up to date with the deletion of a candidate. I used one color to denote how full the row of the candidate is, which indicates how many votes that candidate got in a user friendly manner.

additional comments: In some places, I used: () => {} instead of: function() {} when doing a callback. it is just an abbreviation.

I didn't put semi-colon in the end of every line since I realized it compiles and works fine even without it.

Screenshot:
Screenshot

You can’t perform that action at this time.