Gateway Game

styleguide

Style guides are enforced by lint checkers configured to check complete adherence to the below styleguides

for python please follow the PEP 8 styleguide We have an autoformatter, please make sure autopep8 is installed, then run the autoPython.sh in gateway to format.

for javascript please follow the JS Hint styleguide We also have an autoformatter for javascript now, make sure you install jsbeautifier from pip and run the autoJS.sh from terminal

for templates please follow valid HTML 5 standards and follow django best practices

for stylesheets please use bootstrap for modifying bootstrap follow the SMACSS styleguide

testing code

###creating unit tests ####django basic contraints

• page is accessible
• page is secure

####javascript test core logic

testing of events, or of dependant libraries is a non-goal

###running unit tests ####django

./manage.py test gateway.tests

####javascript game

karma start karma.conf.js

modifying bootstrap

to customize bootstap styles please visit the bootstrap folder. in the folder run

sudo npm install
cd boostrap
sudo npm install

to edit the style visit the less folder. please make all edits to custom-bootstrap and custom-variables. (if you make edits to additional modules please copy prefix with custom-modulename and update the custom-bootstrap to import the custom module)

to compile the less to css, then move it to the static folder

cd bootstrap
grunt dist
cd ..
./manage.py collectstatic

naming convensions

bootstrap mixins should use the class naming system

example bootstrap panel

<div class="panel panel-default">
  <div class="panel-heading">Panel heading without title</div>
  <div class="panel-body">
    Panel content
  </div>
</div>

in django the variables would be

<section class="panel panel-default">
  <div class="panel-heading">
    {{ header }}
  </div>
  <div class="panel-body">
    {{ body }}
  </div>
</section>