var placeholder; // For automatic syntax highlighting


// ********************** Main **********************
var preSelectedText = '';
var selectedText = '';
var postSelectedText = '';

// Put empty box to html
  var emptyBox = '<div class="untypo_gardine" id="untypo_gardine" style="top: 0px; left: 0px; width: 100%; height: 100%; position: fixed; background-image: url(untypo/transparent.png); background-repeat: repeat; z-index: 1; visibility: hidden;"></div>' +
      '<div class="untypo_inlineBox" id="untypo_inlineBox" style="top: 100px; left: 100px; width: 500px; position: fixed; background-color: #dddddd; padding: 10px; z-index: 2; visibility: hidden;">' +
      '</div>';
  document.write(emptyBox);




// ********************** Functions **********************
function untypo_setBoxContents() {

  var boxContents = '  <table style="width: 100%; padding: 5px;">' +
      '    <tr><td colspan="2">...' + preSelectedText + '<span style="color: #ff2222; font-size: 15px; font-family: Arial, Verdana;">' + selectedText + '</span>' + postSelectedText + '...</td></tr>' +
      '    <tr>' +
      '      <td style="width: 35%;"><br>Korrektur (optional):</td><td><br><input type="text" name="untypo_suggestion" id="untypo_suggestion" style="width: 100%;"></td>' +
      '    </tr>' +
      '    <tr>' +
      '      <td>Kommentar (optional):</td><td><input type="text" name="untypo_comment" id="untypo_comment" style="width: 100%;"></td>' +
      '    </tr>' +
      '    <tr>' +
      '      <td></td><td><br><div style="text-align: right;"><input type="button" value="Senden" style="width: 50%; padding: 3px;" onClick="javascript:untypo_sendRequest();"> <input type="button" value="Schließen" style="width: 49%; padding: 3px;" onClick="javascript:untypo_hideBox();"></div></td>' +
      '    </tr>' +
      '    <tr>' +
      '    <td colspan="2"><br><div id="report" style="width: 100%; height: 75px;"></div></td>' +
      '    </tr>' +
      '  </table>';
  
  
  document.getElementById('untypo_inlineBox').innerHTML = boxContents;
}

function untypo_startAction() {
/*  untypo_extractTypo() && { // Do not execute commands if previous failed
    untypo_setBoxContents(); 
    untypo_showBox();
  }*/
  
  if (untypo_extractTypo()) {
    untypo_setBoxContents(); 
    untypo_showBox();
  }
}

function untypo_sendRequest() {
  
  var vars='?url=' + escape(window.location) + '&pre=' + escape(preSelectedText) + '&typo=' + escape(selectedText) +    '&post=' + escape(postSelectedText) + '&shouldBe=' + escape(document.getElementById('untypo_suggestion').value) + '&comment=' + escape(document.getElementById('untypo_comment').value);
document.getElementById("report").innerHTML = '<iframe src="untypo/untypo.php' + vars + '" name="report" style="border: none;" width="100%" height="100%">iframe-Unterstützung muss aktiviert sein!</iframe>';

  // TODO implement this
}

function untypo_showBox() {
  document.getElementById('untypo_gardine').style.visibility = 'visible';
  document.getElementById('untypo_inlineBox').style.visibility = 'visible';
}

function untypo_hideBox() {
  document.getElementById('untypo_gardine').style.visibility = 'hidden';
  document.getElementById('untypo_inlineBox').style.visibility = 'hidden';
}

function untypo_extractTypo() {
  var ret = false;
  var leftOffset = 10; // Length of preSelectedText
  var rightOffset = 10; // Length of postSelectedText
  var gotSelection = null;

  if (window.getSelection) {
    gotSelection = window.getSelection();
  } else {
    if (document.getSelection) { // was window.document.getSelection
      gotSelection = document.getSelection(); // was window.document.getSelection()
    } else if (document.selection) {
      gotSelection = document.selection; // was window.document.selection;
    }
  }

  if (gotSelection != null) {
    if (gotSelection.getRangeAt) {  // FF, Opera, Safari
      var gotRange = gotSelection.getRangeAt(0);
      selectedText = gotRange.toString();

      if (selectedText.length > 0) {
        var preRange = gotRange.cloneRange();
        if (gotRange.startOffset-leftOffset < 0) {
          // If out of bounds -> calculate correct offset
          leftOffset = gotRange.startOffset;
        }
        preRange.setStart(gotRange.startContainer, gotRange.startOffset-leftOffset);
        preRange.setEnd(gotRange.startContainer, gotRange.startOffset);
        preSelectedText = preRange.toString();

        var postRange = gotRange.cloneRange();
        postRange.setStart(gotRange.endContainer, gotRange.endOffset);
        try {
          postRange.setEnd(gotRange.endContainer, gotRange.endOffset+rightOffset);
        } catch(e) { // If out of bounds
          postRange.setEndAfter(gotRange.endContainer);
        }
        postSelectedText = postRange.toString();
        
        ret = true;
      } else {
        alert('Please select typo with mouse and then click on the button.');
      }
    } else {
      if (gotSelection.createRange) { // IE
        var gotRange = gotSelection.createRange();
        selectedText = gotRange.text;

        if (selectedText.length > 0) { // TODO check bound-errors
          gotRange.moveStart('character', -leftOffset);
          gotRange.moveEnd('character', 0);
          preSelectedText = gotRange.text;

          gotRange.moveStart('character', 0);
          gotRange.moveEnd('character', rightOffset);
          postSelectedText = gotRange.text;

          ret = true;
        } else {
          alert('Please select typo with mouse and then click on the button.');
        }
      } else {
        alert('Your browser is not supported, works fine with FF, IE, Opera and Safari.');
      }
    }
  } else {
    alert('Your browser is not supported, works fine with FF, IE, Opera and Safari.');
  }
  
  return ret;
}