var text = {
  cars: {
    lamborghini: { 
      descr : 'A photo of a ~L. Nice representative for all these super ' +
                'fast and impressive high performance sports cars from Sant' +
                "'" + 'Agata Bolognese, Italy.~PDesigned by Luc ' +
                'Donckerwolke this car was introduced in 2002 as the ' +
                'successor to the famous Diablo.',
      source: '~L',
      size_e: '3x3',
      size_p: '240x240',
      links : [
        'http://en.wikipedia.org/wiki/Lamborghini_Murci%C3%A9lago Lamborghini Murciélago',
        'http://flickr.com/ flickr.com'
      ]
    },
    lada_riva: {
      descr : 'Photo of a russian ~L. As a famous successor of the Fiat 124 ' +
                'based Zhiguli this model was built in Togliatti since 1980.' +
                '~PToday wide ranged political and economic changes in ' +
                'combination with tightening safety and emission standards ' +
                'make it quite difficult to sell Ladas on the international ' +
                'market.',
      source: '~L',
      size_e: '8x6',
      size_p: '640x480',
      links : [
        'http://en.wikipedia.org/wiki/Lada_Riva Lada Riva',
        'http://flickr.com/ flickr.com'
      ]
    },
    seat_león: {
      descr : 'Photo of a hot brand new super cool ~L. Manufactured by the ' +
                'Volkswagen Group and sold under the SEAT brand it is ' +
                'based on the well known VW Golf platform.~PThe car I am ' +
                'currently driving myself is a ~L. This means I got some ' +
                'kind of special relation to this brand of spanish origin.',
      source: '~L',
      size_e: '8x5',
      size_p: '640x400',
      links : [
        'http://en.wikipedia.org/wiki/SEAT_Le%C3%B3n SEAT León',
        'http://en.wikipedia.org/wiki/SEAT_C%C3%B3rdoba SEAT Córdoba',
        'http://flickr.com/ flickr.com'
      ]
    }
  },
  models: {
    sasha_pivovarova: {
      descr : 'A photo of beautiful fashion model Sasha Pivovarova. ' +
                'To be honest I don' + "'" + 't know too much about her ' +
                'except she' + "'" + 's from Moskow, Russia as many ' +
                'supermodels are.~PYou could see her in the Prada ' +
                'and Miu Miu runway shows in Milan. She also worked for ' +
                'Louis Vuitton, Chanel and Yohji Yamamoto.',
      source: '~L',
      size_e: '4x6',
      size_p: '320x480',
      links : [
        'http://flickr.com/ flickr.com'
      ]
    },
    milla_jovovich: {
      descr : 'A photo of super cute and talented actress, supermodel, ' +
                'and musician ~L.~PAt the age of eleven Ukrainian-born ' +
                'Jovovich was spotted by Richard Avedon.' +
                '~PIn 1997 she played Leeloo in ~L and two years later she ' +
                'could be seen in The Messenger: ~L.',
      source: '~L',
      size_e: '5x8',
      size_p: '400x640',
      links : [
        'http://en.wikipedia.org/wiki/Milla_Jovovich Milla Jovovich',
        'http://en.wikipedia.org/wiki/The_Fifth_Element The Fifth Element',
        'http://en.wikipedia.org/wiki/The_Messenger:_The_Story_of_Joan_of_Arc The Story of Joan of Arc',
        'http://www.timeformovies.com/ Time For Movies'
      ]
    }
  },
  computers: {
    sun_mouse: {
      descr : 'This may not be the kind of hardware we all have in mind ' +
                'when hearing the name ~L but I think it can be seen as ' +
                'a nice photo nontheless.~PThe mouse has been connected to ' +
                'an Apple notebook located in the background.',
      source: '~L',
      size_e: '8x6',
      size_p: '640x480',
      links : [
        'http://en.wikipedia.org/wiki/Sun_Microsystems Sun Microsystems',
        'http://flickr.com/ flickr.com'
      ]
    },
    digital_pdp_1: {
      descr : 'This photo gives us a partial view on a nice ~L. First ' +
                'produced in 1960 it became famous for being the computer ' +
                'most important in the creation of hacker culture.~PThe ' +
                'machine had an 18-bit word and it addressed 4K words as ' +
                'standard main memory. Punched paper tape served as primary ' +
                'storage medium.',
      source: '~L',
      size_e: '7x5',
      size_p: '560x400',
      links : [
        'http://en.wikipedia.org/wiki/PDP-1 Digital PDP-1',
        'http://flickr.com/ flickr.com'
      ]
    },
    sgi_o2: {
      descr : 'What we have here could be the cutest computer ever built. ' +
                'The ~L is an entry-level Unix workstation ' +
                'introduced in 1996 by Silicon Graphics.~PAlthough several ' +
                'years ago it always puts a smile on my face when thinking ' +
                'back where I had the pleasure of working with this ~L ' +
                'equipped machine.',
      source: '~L',
      size_e: '8x6',
      size_p: '640x480',
      links : [
        'http://en.wikipedia.org/wiki/SGI_O2 SGI O2',
        'http://en.wikipedia.org/wiki/IRIX IRIX',
        'http://blakespot.com/sgi/ blakeSPOT.com'
      ]
    }
  }
}

var
  name = new Array(),
  size = new Array();
  
Node.prototype.removeChildNodes = function() {
  while (this.hasChildNodes())
    this.removeChild(this.firstChild);
}

function getSectionKey(node, pLevel) {
  for (var i = 0; i < pLevel; i++)
    node = node.parentNode;
  return node.getAttribute('id').replace('puzzle-', '');
}

function appendLinks(node, src, refCopy) {
  src = src.split('~L');
  for (var i in src) {
    node.appendChild(document.createTextNode(src[i]));
    if (i < src.length - 1) {
      node.appendChild(document.createElement('a'));
      var parts = refCopy.shift().match(/(\S+) (.+)/);
      node.lastChild.setAttribute('href', parts[1]);
      node.lastChild.appendChild(document.createTextNode(parts[2]));
    }
  }
}

function appendParas(node, src) {
  var
    sect = getSectionKey(node, 2),
    copy = text[sect][name[sect]].links.slice(0);
  src = src.split('~P');
  for (var i in src) {
    node.appendChild(document.createElement('p'));
    appendLinks(node.lastChild, src[i], copy);
  }
}

function loadSelection(caller) {
  var
    d_base = caller.parentNode.parentNode.parentNode,
    d_img  = d_base.getElementsByTagName( 'img')[0],
    d_span = d_base.getElementsByTagName('span')[0],
    d_ul   = d_base.getElementsByTagName(  'ul')[0],
    sect   = getSectionKey(d_base, 0),
    tmp;

  // initialize global vars
  name[sect] = caller.options[caller.options.selectedIndex].value;
  name[sect] = name[sect].toLowerCase().replace(/ /g, '_').replace(/-/g, '_');
  size[sect] = text[sect][name[sect]].size_p;
  
  // load preview image according to selection
  var path = 'puzzle/images/';
  d_img.setAttribute('src', path + 'tn-' + name[sect] + '.jpg');
  
  // load descriptive text into info area
  d_span.removeChildNodes();
  appendParas(d_span, text[sect][name[sect]].descr);
  d_span.firstChild.style.marginTop = 0;

  // load size and source item into info area
  d_ul.removeChildNodes();
  tmp = text[sect][name[sect]].size_e;
  tmp = document.createTextNode('puzzle size is ' + tmp);
  d_ul.appendChild(document.createElement('li'));
  d_ul.lastChild.appendChild(tmp);
  tmp = document.createTextNode('image source is ');
  d_ul.appendChild(document.createElement('li'));
  d_ul.lastChild.appendChild(tmp);
  tmp = text[sect][name[sect]].links;
  tmp = tmp.slice(tmp.length - 1);
  appendLinks(d_ul.lastChild, text[sect][name[sect]].source, tmp);
}

function initAllSections() {
  var curr;
  for (var i in text) {
    curr = document.getElementById('puzzle-' + i);
    loadSelection(curr.getElementsByTagName('select')[0]);
  }
}

function spawnGame(caller) {
  var
    sect = getSectionKey(caller, 1),
    form = 'innerHeight='    + (size[sect].split('x')[1] - 0 + 40) + 
             ', innerWidth=' + (size[sect].split('x')[0] - 0 + 20),
    url  = 'puzzle/puzzle.html?name=' + name[sect] + '&size=' + size[sect];

  // ship around a current firefox utf-8 url resolving problem
  window.open(url.replace(/seat_león/, 'seat_leon'), '_blank', form);
}