langalex/app.js Secret

## app.js
var cobot = Cobot.Api(window.cobot.access_token);

(function() {

  var $app = $('#app'),
    $subdomainForm = $app.find('form[rel=subdomain]'),
    $subdomainInput = $subdomainForm.find('select[name=subdomain]'),
    $checkinForm = $app.find('form[rel=check-in]'),
    $tokenInput = $checkinForm.find('input[name=token]'),
    $results = $app.find('[rel=check-in-result]'),
    $ready = $app.find('[rel=scanning-ready]'),
    $notReady = $app.find('[rel=scanning-not-ready]');

  initSelectSpace();
  initScanToken();
  initScannerStatus();

  function initSelectSpace() {
      cobot.get('www', '/user').done(function(user) {
        var spaces = user.admin_of;
        for(var i in spaces) {
          $subdomainInput.append('<option value="' + spaces[i].space_subdomain + '">' + spaces[i].space_name + '</option>')
        }
      });

      $subdomainForm.on('submit', function(e) {
        e.preventDefault();
        $subdomainForm.hide();
        $checkinForm.show();
      });
  }

  function initScannerStatus() {
    $ready.hide();
    $notReady.show();

    $tokenInput.on('focus', function() {
      $ready.show();
      $notReady.hide();
    });
    $tokenInput.on('blur', function() {
      if(!$tokenInput.attr('disabled')) {
        $ready.hide();
        $notReady.show();
      }
    });

    $notReady.css('cursor', 'pointer');
    $notReady.on('click', function() {
      $tokenInput.val('').focus();
    });
  }

  function initScanToken() {
    $checkinForm.on('submit', function(e) {
      e.preventDefault();
      $results.text('').removeClass('alert-success')
        .removeClass('alert-error').hide();
      var token = $tokenInput.val();
      $tokenInput.attr('disabled', true);
      $ready.hide();
      cobot.get(currentSubdomain(), '/check_in', {login: token}).then(checkOut, function(xhr) {
        if(xhr.status === 404) {
          checkIn(token);
        } else {
          checkInError.apply(this, arguments);
        }
      })
    });

    function checkIn(token) {
      cobot.post(currentSubdomain(), '/check_ins', {token: token}).then(
        checkInSuccess, checkInError);
    }

    function checkOut(checkIn) {
      cobot._delete(currentSubdomain(), '/memberships/' + checkIn.membership_id + '/check_ins/current').done(checkOutSuccess);
    }

    function checkOutSuccess() {
      $results.addClass('alert-success').text('Checked out').show();
      prepareForNext();
    }

    function checkInSuccess(checkIn) {
      var formattedTime = moment(checkIn.valid_until, 'YYYY/MM/DD hh:mm:ss ZZ').format('MMM Do, hh:mm');
      $results.addClass('alert-success').text('Checked in until ' + formattedTime).show();
      prepareForNext();
    }

    function checkInError(response) {
      var errors = JSON.parse(response.responseText).errors,
        error;
      for(var i in errors) {
        error = errors[i];
      }
      $results.addClass('alert-error').text(error).show();
      prepareForNext();
    }
  }

  function prepareForNext() {
      $tokenInput.val('');
      window.setTimeout(function() {
        $tokenInput.attr('disabled', false);
        $tokenInput.focus();
        $ready.show();
        $results.fadeOut(function() {
          $results.removeClass('alert-success').text('');
        });
      }, 3000);
  }

  function currentSubdomain() {
    var subdomain = $subdomainInput.val();
    if(subdomain.length) {
      return subdomain;
    } else {
      alert('Please enter a subdomain first');
    }
  }
})();

## index.html
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Check In</title>
    <meta name="description" content="Lets members check in via swipe/RFID cards.">
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet"/>
  </head>
  <body>
    <div id="app" class="container-fluid">
      <h1>Check In</h1>
      <div class="hero-unit">
        <form rel="subdomain">
          <fieldset>
            <label>Please select your space</label>
            <div>
              <select name="subdomain"></select>
            </div>
            <div>
              <input type="submit" class="btn btn-primary" value="To Check-In"/>
            </div>
          </fieldset>
        </form>
        <form rel="check-in" style="display:none">
          <p>Please swipe your card.</p>
          <input type="text" name="token" placeholder="scan card..." autocomplete="off" autofocus/>
          <span class="help-block">
            <span class="label label-success" rel="scanning-ready">Ready for scanner</span>
            <span class="label label-warning" rel="scanning-not-ready">Click before scanning card</span>
          </span>
          <div class="alert" rel="check-in-result" style="display:none"></div>
        </form>
      </div>
    </div>
    <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.6.0/moment.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://bots.apps.cobot.me/javascripts/cobot_api.js"></script>
    <script src="app.js></script>
  </body>
</html>
	var cobot = Cobot.Api(window.cobot.access_token);

	(function() {

	var $app = $('#app'),
	$subdomainForm = $app.find('form[rel=subdomain]'),
	$subdomainInput = $subdomainForm.find('select[name=subdomain]'),
	$checkinForm = $app.find('form[rel=check-in]'),
	$tokenInput = $checkinForm.find('input[name=token]'),
	$results = $app.find('[rel=check-in-result]'),
	$ready = $app.find('[rel=scanning-ready]'),
	$notReady = $app.find('[rel=scanning-not-ready]');

	initSelectSpace();
	initScanToken();
	initScannerStatus();

	function initSelectSpace() {
	cobot.get('www', '/user').done(function(user) {
	var spaces = user.admin_of;
	for(var i in spaces) {
	$subdomainInput.append('<option value="' + spaces[i].space_subdomain + '">' + spaces[i].space_name + '</option>')
	}
	});

	$subdomainForm.on('submit', function(e) {
	e.preventDefault();
	$subdomainForm.hide();
	$checkinForm.show();
	});
	}

	function initScannerStatus() {
	$ready.hide();
	$notReady.show();

	$tokenInput.on('focus', function() {
	$ready.show();
	$notReady.hide();
	});
	$tokenInput.on('blur', function() {
	if(!$tokenInput.attr('disabled')) {
	$ready.hide();
	$notReady.show();
	}
	});

	$notReady.css('cursor', 'pointer');
	$notReady.on('click', function() {
	$tokenInput.val('').focus();
	});
	}

	function initScanToken() {
	$checkinForm.on('submit', function(e) {
	e.preventDefault();
	$results.text('').removeClass('alert-success')
	.removeClass('alert-error').hide();
	var token = $tokenInput.val();
	$tokenInput.attr('disabled', true);
	$ready.hide();
	cobot.get(currentSubdomain(), '/check_in', {login: token}).then(checkOut, function(xhr) {
	if(xhr.status === 404) {
	checkIn(token);
	} else {
	checkInError.apply(this, arguments);
	}
	})
	});

	function checkIn(token) {
	cobot.post(currentSubdomain(), '/check_ins', {token: token}).then(
	checkInSuccess, checkInError);
	}

	function checkOut(checkIn) {
	cobot._delete(currentSubdomain(), '/memberships/' + checkIn.membership_id + '/check_ins/current').done(checkOutSuccess);
	}

	function checkOutSuccess() {
	$results.addClass('alert-success').text('Checked out').show();
	prepareForNext();
	}

	function checkInSuccess(checkIn) {
	var formattedTime = moment(checkIn.valid_until, 'YYYY/MM/DD hh:mm:ss ZZ').format('MMM Do, hh:mm');
	$results.addClass('alert-success').text('Checked in until ' + formattedTime).show();
	prepareForNext();
	}

	function checkInError(response) {
	var errors = JSON.parse(response.responseText).errors,
	error;
	for(var i in errors) {
	error = errors[i];
	}
	$results.addClass('alert-error').text(error).show();
	prepareForNext();
	}
	}

	function prepareForNext() {
	$tokenInput.val('');
	window.setTimeout(function() {
	$tokenInput.attr('disabled', false);
	$tokenInput.focus();
	$ready.show();
	$results.fadeOut(function() {
	$results.removeClass('alert-success').text('');
	});
	}, 3000);
	}

	function currentSubdomain() {
	var subdomain = $subdomainInput.val();
	if(subdomain.length) {
	return subdomain;
	} else {
	alert('Please enter a subdomain first');
	}
	}
	})();
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Check In</title>
	<meta name="description" content="Lets members check in via swipe/RFID cards.">
	<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet"/>
	</head>
	<body>
	<div id="app" class="container-fluid">
	<h1>Check In</h1>
	<div class="hero-unit">
	<form rel="subdomain">
	<fieldset>
	<label>Please select your space</label>
	<div>
	<select name="subdomain"></select>
	</div>
	<div>
	<input type="submit" class="btn btn-primary" value="To Check-In"/>
	</div>
	</fieldset>
	</form>
	<form rel="check-in" style="display:none">
	<p>Please swipe your card.</p>
	<input type="text" name="token" placeholder="scan card..." autocomplete="off" autofocus/>
	<span class="help-block">
	<span class="label label-success" rel="scanning-ready">Ready for scanner</span>
	<span class="label label-warning" rel="scanning-not-ready">Click before scanning card</span>
	</span>
	<div class="alert" rel="check-in-result" style="display:none"></div>
	</form>
	</div>
	</div>
	<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.6.0/moment.min.js"></script>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script src="https://bots.apps.cobot.me/javascripts/cobot_api.js"></script>
	<script src="app.js></script>
	</body>
	</html>