function follow_link(uri) {
  window.location=uri;
}

function hide_on_esc(e) {
  var keynum=e.keyCode;
  var esc=27;

  if(keynum==esc)
  {
    hide_full();
    return false;
  }

  return true;
}

function hide_full() {
  var show = document.getElementById('show');
  if( show == null || show.childNodes == null || show.childNodes.length == 0 )
    return;

  show.removeChild(show.childNodes[0]);
}

function show_preview(event, img_uri, link_uri) {
  try {
    var x=5;
    var y=10;

    var a = document.createElement('a');
    a.href = link_uri;

    var img = document.createElement('img');
    img.src = img_uri;

    a.appendChild(img);

    var show = document.getElementById('show');
    var style = 'display: inline; position: fixed; top: ' + y + 'px; left: ' + x + '%; ';
    $(show).setStyle(style);
    $A(show.childNodes).each(function(elem){show.removeChild(elem);});
    show.appendChild(a);
    $(img).setStyle('border: 2px solid black;');
  }
  catch(ex) {
    alert(ex.message);
  }

  return false;
}

//first a helper method
var $CE = function(tagName, attributes, styles){ //short for create element
      var el = document.createElement(tagName);
      if (attributes)
            $H(attributes).each(function(pair){
                  eval("el." + pair.key + "='" + pair.value + "'");
            });
      if (styles)
            $H(styles).each(function(pair){
                  el.style[pair.key] = pair.value;
            });

      return $(el);
};

//adding he new methods
Element.addMethods({
  //removes any child noes from the element
  //example: <div id="myDiv"><b>hello</b></div>
  //         $('myDiv').clearChildren();
  //     ==> <div id="myDiv"></div>
  clearChildren: function(element) {
    element = $(element);
    $A(element.childNodes).each(function(e){
        e.parentNode.removeChild(e);
    });
    return element;
  },
  //method that creates a new element and appends to the current element
  // example: <div id="myDiv">Please</div>
  //          $('myDiv').append('A',{href:'otherpage.html', className:'red'}).update('Continue...');
  //     ==>  <div id="myDiv">Please<a href="otherpage.html" class="red">Continue...</a></div>
  append: function(element, tagName, attributes, styles) {
    element = $(element);
    var newEl = $CE(tagName, attributes, styles);
    element.appendChild(newEl);
    return newEl;//<-- this one returns the new element
  },
  //appends a text node to the element
  // example: <div id="myDiv"><b>hello</b></div>
  //          $('myDiv').appendText(', John');
  //      ==> <div id="myDiv"><b>hello</b>, John</div>
  appendText: function(element, text){
    element = $(element);
    var t = document.createTextNode(text);
    element.appendChild(t);
    return element;
    }
});

var CreatePage = Class.create({
  applyLayout: function(layoutSelector) {
    var ar = layoutSelector.value.split('x');
    var columns = ar[0];
    var rows = ar[1];
    var n=0;


    var elem = $('snapshot_urls');
    elem.clearChildren();
    for( var i=0;i<columns;++i )
    {
      for( var j=0;j<rows;++j, ++n )
      {
        var p = document.createElement('p');
        var label = document.createElement('label');
        p.appendChild(label);
        label.setAttribute('for', 'page_snapshots_' + n + '__uri');
        label.innerHTML = 'Uri: ';

        p.appendChild( this.createInput(n) );

        elem.appendChild(p);
      }
    }
  },

  createInput: function(n) {
    var input = document.createElement('input')

    input.setAttribute('id', 'page_snapshots_' + n + '__uri');
    input.setAttribute('name', 'page[snapshots[' + n + ']][uri]');
    input.setAttribute('size', '60');
    input.setAttribute('type', 'text');

    return input;
  }
});

function init_tags() {
  $$('div.tags ul').first().empty();

  var tags = $$('span#tags_0').first().innerHTML;
  var tagArray = tags.split(",");
  tagArray.each( function(item, i){
        item = item.trim();
        if (item.length > 0)
        {
          var uri = "/snapshots/tags/" + encodeURIComponent(item);
            $$('div.tags ul').first().append('li').append('a',{href:uri}).update(item);
        }
      });

  var input = $$('form#tags_form input.textbox').first();
  input.observe('keypress', function(e){
      if (e.which==13)
      {
        this.form.action = document.location + '/add_tags';
        this.form.submit();
      }
    });
}

Event.observe(window, 'load', function() {
  $('show').hide();

  Event.observe(document, 'keydown', function (event) { 
    return hide_on_esc(event);
  } );
} );


/*-----------------------------------------------------------
    Toggles element's display value
    Input: any number of element id's
    Output: none 
    ---------------------------------------------------------*/
function toggleDisp() {
    for (var i=0;i<arguments.length;i++){
        var d = $(arguments[i]);
        if (d.style.display == 'none')
            d.style.display = 'block';
        else
            d.style.display = 'none';
    }
}
/*-----------------------------------------------------------
    Toggles tabs - Closes any open tabs, and then opens current tab
    Input:     1.The number of the current tab
                    2.The number of tabs
                    3.(optional)The number of the tab to leave open
                    4.(optional)Pass in true or false whether or not to animate the open/close of the tabs
    Output: none 
    ---------------------------------------------------------*/
function toggleTab(num,numelems,opennum,animate) {
  var display = $('tabContent'+num).style.display;
    if (display=='' || display == 'none'){
        for (var i=1;i<=numelems;i++){
            if ((opennum == null) || (opennum != i)){
                var temph = 'tabHeader'+i;
                var h = $(temph);
                if (!h){
                    var h = $('tabHeaderActive');
                    h.id = temph;
                }
                var tempc = 'tabContent'+i;
                var c = $(tempc);
                if(c.style.display != 'none'){
                    if (animate || typeof animate == 'undefined')
                        Effect.toggle(tempc,'blind',{duration:0.5, queue:{scope:'menus', limit: 3}});
                    else
                        toggleDisp(tempc);
                }
            }
        }
        var h = $('tabHeader'+num);
        if (h)
            h.id = 'tabHeaderActive';
        h.blur();
        var c = $('tabContent'+num);
        c.style.marginTop = '2px';
        if (animate || typeof animate == 'undefined'){
            Effect.toggle('tabContent'+num,'blind',{duration:0.5, queue:{scope:'menus', position:'end', limit: 3}});
        }else{
            toggleDisp('tabContent'+num);
        }
    }
}