Add sidebar UI & a pack of services and directives

[MatiasComercio]

Summary

• Add directives: sidebar, sidebar item, backdrop, prevent scroll

• Add services: memory factory, modal factory, nav data service, window size

• Add modal controllers: inscriptions, reset password, delete user,
  delete course

• Add sidebar directive

  • Add responsive behavior
  • Add animations to each link inside it
  • Add admins section
    • Add dynamic update for enable/disable inscriptions option
  • Add students section
  • Add courses section
  • Add sub sidebar section
    • Add admin section
    • Add student section
    • Add course section

• Add sidebar item directive

  • Add shown style
  • Add animations for showing and closing content

• Add modals through angular-bootstrap

  • Add modalFactory service wrapping angular-bootstrap service
    • Use modalFactory to create modal controllers
    • Use other existant modal views as base for compatibility reasons
  • Add inscriptions modals
  • Add reset password modal
  • Add delete user modal
  • Add delete course modal

• Add prevent scroll directive

  • Prevent other parent elements to be scrolled with the mousewheel action
  • Improve background scrolling for all browsers
  • Add cross-browser support through jquery-mousewheel dependency

• Add memory factory service

  • Create multiple memory objects holding key-value pairs with two
    lines. Each memory can hold different related key-value pairs.
  • Use observer pattern to notify subscribed observers on key change

• Add window size directive

  • Detect when window resizes
  • Update values based on window's size
    • Update windowIsMobile boolean variable
    • Update bootstrapWindowSize string variable
      • Possible values: 'xs', 'sm', 'md', 'lg'

• Add navigation data service

  • Hold values related to main's app navigation

• Add backdrop directive

  • Show when window is on mobile size and sidebar is opened
  • Block the entire page and capture click events otuside the sidebar
    so as to close it

• Add style for all the new elements

  • Add custom scrollbar for Chrome and Opera
    • Firefox does not take into account these style tools
  • Add responsive style to sidebar

• Improve style for existant elements

  • Improve sandwich icon style
  • Improve content style to fit navbar and sidebar

• Add fontawesome fonts on main.scss

• Add test cases for all directives, services and controllers

  • Karma current coverage: 100%
  • Increment required front-end code coverage to 90%

• Add dependencies

  • Add angular-animate
  • Add angular-bootstrap
  • Add jquery-mousewheel
  • Add angular-material

• Add HomeCtrl simulation to fetch data

  • Add fetch admin
  • Add fetch student
  • Add fetch course
  • Update JS object where data is saved

• Move directive templates to /views/directives/*

• Remove static external resources

• Notes

  • UI tested on Chrome, Firefox and Opera
  • Modals don't have forms anymore due to there is no need to send all data
    (just hit the corresponding API endpoint with the specified data, sent
    to the modal's controller)
  • Consider making a generic modal (e.g.: reset password and delete user
    modals are the same)
  • All rootScope or scope usage has been mitigated in favour of isolated
    scopes and services managing data across different directives and
    controllers

Trello Card

https://trello.com/c/NF7Xu2Gk/5-maquetar-sidebar

[codecov-io]

Current coverage is 9.79% (diff: 100%)

No coverage report found for development at 9e8325e.

Powered by Codecov. Last update 9e8325e...fa0a8e8