index.jade

!!!5
html
  head
    title Genetic Algorithms - Travelling Salesman Problem (CoffeeScript)
    script(type='text/javascript', src='javascripts/underscore-1.3.3.js')

    link(rel='stylesheet', href='styles/base.css')
    link(rel='stylesheet', href='styles/skeleton.css')
    link(rel='stylesheet', href='styles/layout.css')

    script(type='text/javascript', src='https://www.google.com/jsapi')
    script(type='text/javascript')
      google.load('visualization', '1', {packages:['corechart']})

  body
    a(href='https://github.com/janmonschke/Genetic-Algorithms')
      img(style='position: absolute; top: 0; right: 0; border: 0;', src='https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png', alt='Fork me on GitHub')
    
    .container

      .sixteen.columns

        h1(style='margin-top: 40px') Genetic Algorithm
        h5 Solving the Travelling Salesman Problem with a Genetic Algorithm in CoffeeScript 
          [
          a(href="presentation/") slides
          ] 
          [
          a(href="https://github.com/janmonschke/Genetic-Algorithms/") code
          ]
        hr

      .one-third.column
        h3 Genetic Algorithm and TSP
        p Since the <a href="http://en.wikipedia.org/wiki/Travelling_salesman_problem">Travelling Salesman problem</a> is a NP-hard problem, it's a good example on how to use a GA. When you're unfamiliar with GAs I recommend checking out my <a href="presentation/index.html">talk on GAs</a>.
        p In this case there are 15 cities and their distances are hard-coded in an <a href="https://github.com/janmonschke/Genetic-Algorithms/blob/gh-pages/coffeescripts/genome.coffee#L129">array in the code</a>.
        p You can change the population's size and the number of generations in the form to the right. After the maximum number of generations is reached, you will see a performance chart of the current run.
        p 

      .one-third.column
        h3 Parameters
        p
          label(for='population-size') Population Size
          input(type='text', id='population-size', value='1000')

        p
          label(for='generation-size') Number of Generations
          input(type='text', id='generation-size', value='30')

        p
          input(type='submit', value='Start', id='start-button')
          input(type='submit', value='Pause', id='pause-button')
          input(type='submit', value='Reset', id='reset-button')


      .one-third.column
        h3 Output
        ul#output-list
        #chart


  script(type='text/javascript', src='javascripts/app.js')
  script(type="text/javascript")

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-19046336-4']);
    _gaq.push(['_trackPageview']);

    (function() {
      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();