incompl

Greg's CSS Styleguide

A fork of a CSS styleguide starting point

Terminology

/* this whole thing is a rule */
selector {
  property: value; /* this line is a declaration */

}

incompl

A Starting Point for CSS Styleguides

This is a CSS styleguide that you could fork to use for your project. Some of the rules give you multiple acceptable options. If you want to adopt this styleguide for your project, you should modify it for your project.

Here is an example styleguide made from this starting point

This styleguide follows my styleguide for styleguides. That means it follows the following rules:

• Focus on readability.
• Focus on consistency.

incompl

Thermostat Rules

Minimum Temperature: 60 Maximum Temperature: 75 Position of swtich: Always Off

What do if the room I'm in is too hot/cold:

Change the temperature such that it continues to abide by the rules.

incompl

var messageElement =
  document.querySelector('#message');

cloak.configure({
  messages: {
    waitingForAnotherPlayer: function() {
      messageElement.innerText =
        'Waiting for another player...';
    },
    gameStart: function() {

incompl

cloak.configure({

  // New users go to the lobby, a special
  // room that exists by default.
  autoJoinLobby: true,

  // Create a new room automatically when there are
  // enough users in the lobby. Users are added
  // to the new room when it's created.
  autoCreateRooms: true, 

incompl

var waiting = null;
var games = {};

io.sockets.on('connection', function(socket) {
  var id = socket.id;
  var game = games[id];

  if (game === undefined) {
    if (waiting !== null && waiting !== id) {
      game = new MyGame();

incompl

var games = {};

io.sockets.on('connection', function(socket) {
  var id = socket.id;
  var game = games[id];

  if (game === undefined) {
    game = new MyGame();
    games[id] = game;
  }

incompl

io.sockets.on('connection', function(socket) {
  var game = new MyGame();

  socket.on('move', function(data) {
    game.move(data);
  });
});

incompl

// client.js

/* global cloak */

var form = document.querySelector('#input-form');
var input = document.querySelector('#input');
var messages = document.querySelector('#messages');

cloak.configure({
  messages: {

incompl

/* global $ */

// Custom jQuery event that normalizes mousedown and touchstart
// based on http://stackoverflow.com/questions/8503453/click-event-called-twice-on-touchend-in-ipad

$.event.special.poke = {
  setup: function() {
    var isTouchSupported = "ontouchstart" in document;
    var poke = isTouchSupported ? "touchstart" : "mousedown";
    $(this).bind(poke + ".poke-event", function(event) {