/*
 *  these functions mostly maintain 
 *  a global 'ratings' object
 *
 *   each ratings[i] possibly has these fields:
 *     'active'     => whether or not to display it (if not, push it to common list)
 *      0,1,2       => title, left, right labels, resp.
 *     'edit'       => whether or not to display labels in input fields.  
 *     'cantdelete' => whether or not delete button is hidden for certain ratings.
 */

/*
 *
 * serialize state function
 *
 */

// maximum size of ratings label
var MAX_LEN = 20;

function serialize_state() {
  if (!ratings) return '';
  n = ratings.length;
  if ( !n || n < 1 ) return '';
  str = '';
  for (var i=0;i<n;i++)
    if ( ratings[i]['active'] ) {
      str += label_clean(ratings[i][0]) + '__EFR__';
      str += label_clean(ratings[i][1]) + '__EFR__';
      str += ratings[i][2] + '__EFR__' + '__ENDR__';      
    }
  if ( str == '' && n > 0 ) str = 'clearrating';
  return str;
}

function label_clean( str ) {
  str = str.replace(/\&quot;/g,'"');
  str = str.replace(/[^\w\s'"]/g,'');

  // in case maxlength doesn't work in input field
  if ( str.length > MAX_LEN ) str = str.substring(0,MAX_LEN-3) + "...";
  return str;
}

function rewrite_state() {
  //  if ( grab('all_ratings').value )
  //  grab('all_ratings').value = serialize_state();
  // else 
    grab('all_ratings').innerHTML = serialize_state();
}

/*
 *
 * rendering & updating of ratings widgets
 *
 */
function render_rater_head( rateindex , label ) {
  selected_index = label[2];
  side_on = N2 - selected_index;
  lt = endstyle_nm;
  rt = endstyle_nm;  
  if ( side_on > 0 ) lt = endstyle_em;
  else if ( side_on < 0 ) rt = endstyle_em;

  nC = N + 1;
  hnC = nC / 2;
  edit = ratings[rateindex-1]['edit'];

  label0 = label[0]; label1 = label[1];

  if ( !edit ) {
    label0 = '<b>' + label0 + '</b>';
    label1 = '<b>' + label1 + '</b>';
    var n = selected_index - N2; if ( n < 0 ) n = -n;
    if ( selected_index < N2 )
      label0 += '&nbsp;<a style="' + numstyle + '">' + n + '</a><a style="' + denomstyle + '">/' + N2 + '</a>';
    else if ( selected_index > N2 )
      label1 += '&nbsp;<a style="' + numstyle + '">' + n + '</a><a style="' + denomstyle + '">/' + N2 + '</a>';
    left = "<div id='l" + rateindex + "_left' style='" + lt + "'>" + label0 + "</a>";
    right = "<div id='l" + rateindex + "_right' style='" + rt + "'>" + label1 + "</a>";
  } else {
    label0 = label0.replace( /"/g, "&quot;" );
    label1 = label1.replace( /"/g, "&quot;" );
    oku = "onkeyup='update_object_model(" + rateindex + ")' onfocus=\"this.value='';\"";
    left = "<input maxlength=" + MAX_LEN + " size=14 "+oku+" type='text' id='l" + rateindex + "_left' style='" + editadjstyle + "' value=\"" + label0 + "\"></input>";
    right = "<input maxlength=" + MAX_LEN + " size=14 "+oku+" type='text' id='l" + rateindex + "_right' style='" + editadjstyle + "' value=\"" + label1 + "\"></input>";
  }

  str = "<table cellpadding=0 cellspacing=0 border=0>";
  str += "<tr>"; 
  str += "<td colspan=\"" + hnC + "\" style=\"text-align:left\">";
  str += left; 
  str += "</td>";
  str += "<td colspan=\"" + hnC + "\" style=\"text-align:right\">"; 
  str += right; 
  str += "</td>";
  str += "</tr>";
  return str;
}

function render_rating( rateindex , gradpref ) {  
  var str = render_rater_head( rateindex+1 , ratings[rateindex] );
  ii = getImageIndex( ratings[rateindex][2] );
  isOn = ii[0]; middleOn = ii[1];  
  str += "<tr>";
  for (var i=0;i<N;i++) {
    extra = "onclick='change_rating(" + (rateindex+1) + "," + i + ",\"" + gradpref + "\")' style='cursor: pointer'";
    if ( i!=N2 ) {
      imgi = dir;
      imgi += isOn[i] ? gradpref : graygrad;
      imgi += "_" + (i+1) + ".jpg";      
      id = "rate_" + (rateindex+1) + "_" + i;
      str += "<td><img id='" + id + "' src='" + imgi + "' " + extra + "></td>\n";
    } else {
      for (var j=0;j<2;j++) {
	imgi = dir;
	imgi += middleOn[j] ? gradpref : graygrad;
	imgi += "_" + (i+1) + "_" + (j+1) + ".jpg";
	id = "rate_" + (rateindex+1) + "_" + i + "_" + j;
	str += "<td><img id='" + id + "' src='" + imgi + "' " + extra + "></td>\n";	
      }
    }
  }
	
  // delete button
  exdel = ratings[rateindex]['cantdelete'] ? 'visibility: hidden;' : '';
  str += "<tr>";
  str += "<td colspan=\"" + (N+1) + "\" style=\"" + removetdstyle + "\">";
  str += "<a style='" + delstyle + " " + exdel + "' onclick='delete_rating(" + (rateindex+1) + ")'>" + removetext + "</a>";
  str += "</td>";
  str += "</tr>";

  // vertical spacer
  str += "<tr>";
  str += "<td colspan=\"" + (N+1) + "\" style=\"" + spacertdstyle + ";\">";
  str += "<a style=\"" + spacertxtstyle + "\">|</a>";
  str += "</td>";
  str += "</tr>";

  str += "</table>";
  return str;
}

function render_ratings() {
  rewrite_state();
  str = '';
  for (var i=0;i<ratings.length;i++) {
    if ( ratings[i]['active'] ) {
      str += render_rating( i , ratings[i]['specialgrad'] ? ratings[i]['specialgrad'] : 'grad' );
    }
  }
  grab('rating_widgets').innerHTML = str;
}

function getImageIndex( idx ) {
  var isOn = new Array();
  var middleOn = new Array();
  var i;
  if ( idx < N2 ) {
    for (i=0;i<N2;i++) isOn[i] = i>=idx;
    for (i=N2+1;i<N;i++) isOn[i] = 0;
    middleOn[0] = 1; middleOn[1] = 0;
  } else if ( idx > N2 ) {
    for (i=0;i<N2;i++) isOn[i] = 0;
    for (i=N2+1;i<N;i++) isOn[i] = i<=idx;
    middleOn[0] = 0; middleOn[1] = 1;
  } else {
    for (i=0;i<N;i++) isOn[i] = 0;
    middleOn[0] = 1; middleOn[1] = 1;
  }
  return new Array(isOn, middleOn);
}

function change_rating( ratei , idx , gradprefix ) { 

  ii = getImageIndex( idx );
  isOn = ii[0]; middleOn = ii[1];
  
  // record rating 
  ratings[ratei-1][2] = idx;
  rewrite_state();

  var lsc = ''; var rsc = ''; 
  var lt = '<b>' + ratings[ratei-1][0] + '</b>';
  var rt = '<b>' + ratings[ratei-1][1] + '</b>';

  var n = idx - N2; if ( n < 0 ) n = -n;

  // change adjective + score
  if ( idx < N2 ) {
    lsc = endstyle_em_col;
    rsc = endstyle_nm_col;    
    lt += '&nbsp;<a style="' + numstyle + '">' + n + '</a><a style="' + denomstyle + '">/' + N2 + '</a>';
  } else if ( idx > N2 ) {
    lsc = endstyle_nm_col;
    rsc = endstyle_em_col;
    rt += '&nbsp;<a style="' + numstyle + '">' + n + '</a><a style="' + denomstyle + '">/' + N2 + '</a>';
  } else {
    lsc = endstyle_nm_col;
    rsc = endstyle_nm_col;
  }

  grab('l' + ratei + '_left').style.color = lsc;
  grab('l' + ratei + '_right').style.color = rsc;
  if ( !ratings[ratei-1]['edit'] ) {
    grab('l' + ratei + '_left').innerHTML = lt;
    grab('l' + ratei + '_right').innerHTML = rt;
  }    

  // render images as quickly as possible
  for (i=0;i<N;i++) {
    if ( i != N2 ) {
      pref = isOn[i] ? gradprefix : graygrad;
      j = i + 1;
      src = dir + pref + '_' + j + '.jpg';
      grab('rate_' + ratei + '_' + i).src = src;
    } else {
      for (k=0;k<2;k++) {
	pref = middleOn[k] ? gradprefix : graygrad;
	j = i + 1;n = k + 1;
	src = dir + pref + '_' + j + '_' + n + '.jpg';
	grab('rate_' + ratei + '_' + i + '_' + k).src = src;
      }
    }
  }
}


/*
 *
 * object model updates 
 *  (label changes, adding widget, deleting widet, etc)
 *
 */

function update_object_model( rateindex ) {
  ratings[ rateindex-1 ][0] = grab( 'l' + rateindex + '_left' ).value;
  ratings[ rateindex-1 ][1] = grab( 'l' + rateindex + '_right' ).value;
  rewrite_state();
}

function add_rating() {
  len = ratings.length;
  ratings[ len ] = new Array('Adjective', 'Adjective', N2);
  ratings[ len ]['active'] = true;
  ratings[ len ]['edit'] = true;
  ratings[ len ]['viewstate'] = 'small';
  render_ratings();
}

function delete_rating( ri ) {
  ratings[ri-1]['active'] = false;
  render_ratings();
  render_extra_list();  
}

function activate_unused_rating( ind ) {
  ratings[ind]['active'] = true;
  render_ratings();
  render_extra_list();
}

/*
 * 
 * rendering of list containing new possibilities for ratings widgets
 *
 */

function render_extra_list() {
  str = '';  
  if ( exists_unused_rating() ) {
    str = '<a style="' + ratingliststyle + '">Common Ratings</a>';
    for (var i=0;i<ratings.length;i++)
      if ( !ratings[i]['active'] ) {
	var onclickstr = 'activate_unused_rating(' + i + ')';
	str += "<a style='" + rating_summary_style + "; cursor: pointer' onclick='" + onclickstr + ";'>" + summarize(i) + '</a><br>';
      }
  }
  grab('extraRatingsList').innerHTML = str;  
}

function summarize( i ) {
  return ratings[i][0] + " to " + ratings[i][1];
}

function exists_unused_rating() {
  if ( !ratings ) return false;
  if ( !ratings.length ) return false;
  for (var i=0;i<ratings.length;i++)
    if ( !ratings[i]['active'] ) return true;
  return false;
}