var dom_support = (d.getElementById && d.createElement && d.createTextNode) ? true : false;
var target = d.getElementById('designer-text');
var canvas = d.getElementById('designer-canvas');
function updateText(field) {
  if (!dom_support) return;
  var text = d.createTextNode(field.value);
  var child = target.firstChild;
  if (child) target.replaceChild(text, child);
  else target.appendChild(text);
}

var logos = [];
function initLogos(ids, gifs) {
  var img_home = '/img/automarken/';
  for (var i=0;i<ids.length;i++) {
    var logo = new Image();
    logo.src = img_home + gifs[i];
    logos[ids[i]] = logo;
  }
}

var colors = [];
var colors_back = [];
function initColors(ids, cols, cols_back) {
  var img_home = '/img/automarken/';
  for (var i=0;i<ids.length;i++) {
    colors[ids[i]] = cols[i];
    colors_back[ids[i]] = cols_back[i];
  }
}

function changeLogo(field) {
  if (!dom_support) return;
  var logo = logos[field.value];
  var id = field.name == 'logo1' ? 'dlogo-1' : 'dlogo-2';
  var img = d.getElementById(id);
  img.src = logo.src;
  img.width = logo.width;
  img.height = logo.height;
}
function changeColor(field) {
  if (!dom_support) return;
  var id = field.id;
  var color = colors[id];
  var backcolor = colors_back[id];
  var hidden = d.getElementById('color');
  hidden.value = id;
  var logo1 = d.getElementById('designer-logo-1');
  var logo2 = d.getElementById('designer-logo-2');
  if (color=='000000') {
    canvas.style.color='#'+color;
    target.style.background='white';
    logo1.className='designer-logo-1';
    logo2.className='designer-logo-2';
  } else {
    canvas.style.color='#'+color;
    target.style.background='#'+backcolor;
    canvas.style.background='#'+backcolor;
    logo1.className='';
    logo2.className='';
  }
}
function initColor() {
  if (!dom_support) return;
  var hidden = d.getElementById('color');
  var id = hidden.value;
  var color = colors[id];
  var backcolor = colors_back[id];
  if (color) {
    canvas.style.color='#'+color;
    canvas.style.background='#'+backcolor;
  }  
}

function showHide(o) {
  if (!dom_support) return;
  var d = o.style.display;
  if (d && d != 'none') d = 'none';
  else d = 'block';
  o.style.display = d;
}
function showHideChildren(o, types) {
  if (!dom_support) return;
  var c = o.childNodes;
  for (var i=0;i<c.length;i++) {
    var item = c[i];
    if (item.nodeName.toLowerCase() == 'textarea') {
      showHide(item);
    }
  }
}
function initDesigner() {
  if (!dom_support) return;
  var text = d.getElementById('text-field');
  var logo_1 = d.getElementById('logo1-field');
  var logo_2 = d.getElementById('logo2-field');
  var notes = d.getElementById('ta-notes');
  var colors = d.getElementsByName('color');
  initColor();
  changeLogo(logo_1);
  changeLogo(logo_2);
  updateText(text);
  if (notes.value != '') showHide(notes);
}
addLoadEvent(initDesigner);