jsMath.Controls.TimerButton = function () {
  var button = jsMath.Setup.DIV("timerbutton",{});
  button.title = ' Open jsMath Timer Panel ';
  button.innerHTML =
    '<span onclick="jsMath.Controls.TimerPanel()">Timer</span>';
  if (button.offsetWidth < 30) {button.style.width = "auto"}
  if (!this.cookie.button) {button.style.display = "none"}
}

  /*
   *  Load the timer panel
   */
jsMath.Controls.TimerPanel = function () {
  alert("Please log in to use the timer");
};

jsMath.Controls.OldInit = jsMath.Controls.Init;
jsMath.Controls.Init = function () {
    jsMath.Controls.OldInit();
    this.timerpanel = jsMath.Setup.DIV("timerpanel",{display:'none'});
    if (!jsMath.Browser.msieButtonBug) {this.TimerButton();}
        else {setTimeout("jsMath.Controls.TimerButton()",500);}
};

// Styles for the Timer button:
jsMath.Add(jsMath.styles,{
  '#jsMath_timerbutton':          'position:fixed; top:1px; right:2px; background-color:white; '
    + 'border:solid 1px #959595; margin:0px; padding:0px 3px 1px 3px; '
    + 'z-index:102; color:black; text-decoration:none; font-size:x-small; '
    + 'width:auto; cursor:hand; cursor:pointer;',
  '#jsMath_timerbutton *':        'padding:0px; border:0px; margin:0px; line-height:normal; '
    + 'font-size:inherit; font-style:inherit; font-family:inherit',

   // Styles for the revealable solution.
   // This one applies to the outer div so that everything starts hidden:
  '.typeset .solution': 'visibility:hidden'
});

jsMath.Parser.prototype.environments['solution'] = ['Array',null,null,'rcll',[1/3,1/3,6],5,'D'];
jsMath.Parser.prototype.environments['question'] = ['Array',null,null,'l',[],2,'D'];

// Comment out unused macro. jsMath has a better way of dealing with spacing between lines now
// jsMath.Macro('=','=\\rule 0pt 2em 0pt');

var displayMethod = 1; // default to old display method
var myscale=1.2;
var mycolor="ff0066";
var baseurl="/blueprintimages/";
var startImg=baseurl+'Start.png';

function NextStep() {
  solution.RevealRow();
}

var question = {
  Init: function () {
    var question  = document.getElementById('question');
    question.style.visibility = "hidden"; // hide it while jsMath works on it
    question.innerHTML =
      "<DIV CLASS='math'>" +
        "\\begin{question}\n" +
          this.array.join("\\\\\n") +
        "\\end{question}\n" +
      "</DIV>\n";
    jsMath.ProcessBeforeShowing(question);
    jsMath.Synchronize(function () {question.style.visibility = ""});
  }
};

var solution = {
  Init: function () {
    this.array = [["\\text{Please log in to see the solution}"]];
    this.ShowingRow = 0; this.MaxRow = 0; this.RowCells = [];
    if (typeof this.array[0][0] == 'string') {this.array = [this.array]}
    var solution = [];
    for (var rowCount = 0; rowCount < this.array.length; rowCount++) {
      solution[rowCount] = this.SolutionAlignment(this.array[rowCount]);
    }
    var div = document.getElementById("solution");
    div.style.visibility = "hidden"; // hide it while jsMath works on it
    div.innerHTML = solution.join("<p><br>");
    jsMath.ProcessBeforeShowing(div);
    jsMath.Synchronize(function () {div.style.visibility = ""});
  },

  /*
   *  Form one alignment from the given rows, using the solution environment
   *  in a DIV of class "math" so that jsMath can proces it.
   */
  SolutionAlignment: function (rowsArray) {
    var solution = [];
    for (var rowCount = 0; rowCount < rowsArray.length; rowCount++) {
      solution[rowCount] = this.SolutionRow(rowsArray[rowCount]);
    }
    return "<DIV CLASS='math'>" +
             "\\begin{solution}\n" +
                solution.join("\\\\\n") +
             "\\end{solution}" +
           "</DIV>\n";
  },

  /*
   *  Create an alignment row from the given data.
   *    Increase the MaxRows counter, and enclose
   *    each cell in \cssId and \class macros to 
   *    mark them hidden but allow them to be
   *    revealed later.  Finally, record the number
   *    of cells for the row and return the row.
   */
  SolutionRow: function (row) {
    var ROW = []; this.MaxRow++; 
/*
    var ID = "C"+this.MaxRow+"-";
    for (var cellsCount = 1; cellsCount <= row.length; cellsCount++) {
      ROW[cellsCount] = row[cellsCount-1];
      if (ROW[cellsCount] !== "") {
        ROW[cellsCount] = "\\cssId{"+ID+cellsCount+"}{\\class{solution}{"+ROW[cellsCount]+"}}";
      }
    }
*/
    var cells = 0; var ID = "C"+this.MaxRow+"-";
    for (var i = 0; i < row.length; i++) {
      ROW[i] = row[i];
      if (ROW[i] !== "") {
        cells++;
        ROW[i] = "\\cssId{"+ID+cells+"}{\\class{solution}{"+ROW[i]+"}}";
      }
    }
    this.RowCells[this.MaxRow] = cells;
    return ROW.join("&");
  },

  /*
   *  Go on to the next row in the solution table,
   *  and reveal all the cells in that row.
   *  If it is the last row, disable the "Next" button.
   */
  RevealRow: function () {
    this.ShowingRow++;
    var cells = this.RowCells[this.ShowingRow];
    var ID = "C"+this.ShowingRow+"-";

    for (var i = 1; i <= cells; i++) {
      var cell = document.getElementById(ID+i).firstChild;
      cell.style.visibility="visible";
    }
    if (this.ShowingRow == this.MaxRow) {
      var postscriptElt = document.getElementById('postscript');
      postscriptElt.style.visibility="visible"; 
    }
    else if (this.ShowingRow > this.MaxRow) {
// The 'Restart' button was clicked. Re-init the solution:
      solution.Init();
    }
  }
}

function NextStep1() {
  if (++curStep > theSolution.length) {
    curStep = 0;
    var postscriptElt = document.getElementById('postscript');
    postscriptElt.style.visibility="hidden"; 
  }
  TeX = '\\begin{solution}\n' +
           theSolution.slice(0,curStep).join('') +
        '\\end{solution}';
  var solutionHTML = '<span class="math">\\displaystyle{'+TeX+'}</span>';
  solution.innerHTML = solutionHTML;
  jsMath.ProcessBeforeShowing(solution);
  if (curStep == theSolution.length) {
    var postscriptElt = document.getElementById('postscript');
    postscriptElt.innerHTML = "Email us for assistance.";
    postscriptElt.style.visibility="visible"; 
  }
}

function ScaleFont(scale) {
  var sizes = document.getElementById('jsMathSizes').sheet;
  if (!sizes) {sizes = document.styleSheets.jsMathSizes} // for IE
  if (sizes && sizes.cssRules) {sizes = sizes.cssRules}
    else if (sizes) {sizes = sizes.rules}                // for IE

  if (!sizes) {
     alert("Can't change sizes in this browser");
  } else {
    var size;
    for (i = 0; i < sizes.length; i++) {
      size = sizes[i].style.fontSize;
      if (size != "") {
        size = Math.floor(size.replace('%','')*scale) + "%";
        sizes[i].style.fontSize = size;
      }
    }
    jsMath.Init(); // reinitialize jsMath with the new sizes
  }
}
function ColorFont(mycol) {
  var sizes = document.getElementById('jsMathSizes').sheet;
  if (!sizes) {sizes = document.styleSheets.jsMathSizes} // for IE
  if (sizes && sizes.cssRules) {sizes = sizes.cssRules}
    else if (sizes) {sizes = sizes.rules}                // for IE

  if (!sizes) {
     alert("Can't change colors in this browser");
  } else {
    var coll;
    for (i = 0; i < sizes.length; i++) {
      coll = sizes[i].style.color;
      if (coll != "") {
        coll = mycol;
        sizes[i].style.color = coll;
      }
    }
  }
}