index.html

---
layout: page
title: Money Journey
tagline: Visualizing transactions with Open Bank Project data
---
{% include JB/setup %}


    <link rel="stylesheet" media="all" type="text/css" href="{{BASE_PATH}}/js/transactions/style.css" />

    <link rel="stylesheet" media="all" type="text/css" href="./js/transactions/jquery-ui.css" />
    
    <script src="{{BASE_PATH}}/js/transactions/jquery-1.8.2.js"></script>
    <script src="{{BASE_PATH}}/js/transactions/jquery-ui.js"></script>
    <script src="{{BASE_PATH}}/js/philogl/PhiloGL.js"></script>
    <script src="{{BASE_PATH}}/js/transactions/classes.js"></script>
    <script src="{{BASE_PATH}}/js/transactions/index.js"></script>
    <script src="{{BASE_PATH}}/js/transactions/mustache.js"></script>

    <div id="log-panel" style="display:none;">
      <span id="log-message"></span>
    </div>
  
    <div id="fallback" class="fallback"></div>
    
    <div id="container">
      <div class="canvas-container">
        <div id="canvas-wrapper">
          <canvas id="map-canvas" width="1024" height="1024"></canvas>
        </div>
        <div id="list-wrapper" class="list-wrapper" style="display:none;">
          <input type="text" id="search" placeholder="Search..." />
          <ul id="selected-airlines">
          </ul>
          <div class="list-container">
            <ul id="airline-list"></ul>
          </div>
        </div>
        <div style="clear:both;"></div>
      </div>
    </div>
  
  <div class="tooltip hide" id="tooltip" style="width:auto;"></div>

  <div id="transaction"></div>
  <span id="ruler"></span>
  
  <script>
    if (!PhiloGL.hasWebGL()) {
      document.body.className = 'no-webgl';
      document.getElementById('fallback').innerHTML = ''
        +  '<div style="margin:10px;margin-left:120px;" class="alert alert-error">'
        +   '<p>Uh, that was embarrassing but your browser (or hardware) does not support WebGL.</br>'
        +   'Please, go <a href="http://get.webgl.org">here</a> to find more information.</p>'
        +  '</div>'
        +   '<p style="text-align:center;"><img style="width:500px;" src="{{BASE_PATH}}/assets/pantallazo.png"/></p>';
    }
  </script>