chrome/browser/resources/chromeos/salsa.js

// Copyright 2013 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

// Redefine '$' here rather than including 'cr.js', since this is
// the only function needed.  This allows this file to be loaded
// in a browser directly for layout and some testing purposes.
var $ = function(id) { return document.getElementById(id); };

var currentTreatment = 0;
var treatments = [];

/**
 * Take a string of hex like '74657374' and return the ascii version 'test'.
 * @param {string} str The string of hex characters to convert to ascii
 * @return {string} The ASCII values of those hex encoded characters
 */
function hexToChars(str) {
  var decoded = '';
  if (str.length % 2 == 0) {
    for (var pos = str.length; pos > 0; pos = pos - 2) {
      var c = String.fromCharCode(parseInt(str.substring(pos - 2, pos), 16));
      decoded = c + decoded;
    }
  }
  return decoded;
}

/**
 * Extract the experiment information out of the encoded URL string.
 * The format is as follows:
 * chrome://salsa/#HEX_ENCODED_EXPERIMENT
 * Experiments are encoded as:
 *    treatment1+treatment2+...+treatmentn
 * Each treatment is of the form:
 *    preference1,preference2,...,preferencen
 * Each preference is of the form:
 *    name:value
 * This function returns an object storing all the parsed data.
 * @param {string} url The URL to parse the experiment from
 * @return {list} a list of objects, each representing a single treatment
 *     and consisting of a set of preference name -> value pairs
 */
function parseURL(url) {
  var match = url.match('#([0-9ABCDEFabcdef]*)');
  var experimentString = match ? match[1] : '';
  experimentString = hexToChars(experimentString);

  var treatmentsFound = [];
  if (experimentString == '')
    return treatmentsFound;

  var treatmentStrings = experimentString.split('+');
  for (var i = 0; i < treatmentStrings.length; i++) {
    var prefStrings = treatmentStrings[i].split(',');
    treatment = [];
    for (var j = 0; j < prefStrings.length; j++) {
      var key = prefStrings[j].split(':')[0];
      var value = prefStrings[j].split(':')[1];
      treatment.push({'key': key, 'value': value});
    }
    treatmentsFound.push(treatment);
  }

  return treatmentsFound;
}

function setPreferenceValue(key, value) {
  chrome.send('salsaSetPreferenceValue', [key, parseFloat(value)]);
}

function backupPreferenceValue(key) {
  chrome.send('salsaBackupPreferenceValue', [key]);
}

function handleKeyPress(e) {
  e = e || window.event;
  var selectedTreatment = currentTreatment;

  if (e.keyCode == '37' || e.keyCode == '38') {
    selectedTreatment = currentTreatment - 1;
    if (selectedTreatment < 0)
      selectedTreatment = 0;
  } else if (e.keyCode == '39' || e.keyCode == '40') {
    selectedTreatment = currentTreatment + 1;
    if (selectedTreatment >= treatments.length)
      selectedTreatment = treatments.length - 1;
  }

  if (selectedTreatment != currentTreatment)
    applyTreatment(selectedTreatment);
}

function applyTreatment(treatment_number) {
  if (treatment_number < 0)
    treatment_number = 0;
  if (treatment_number >= treatments.length)
    treatment_number = treatments.length;

  $('treatment' + currentTreatment).className = 'treatment';
  currentTreatment = treatment_number;
  $('treatment' + currentTreatment).className = 'selected treatment';

  for (var i = 0; i < treatments[treatment_number].length; i++) {
    var key = treatments[treatment_number][i].key;
    var value = treatments[treatment_number][i].value;
    setPreferenceValue(key, value);
  }
}

function initialize() {
  // Parse the experiment string in the URL.
  treatments = parseURL(document.URL);

  // Update the available treatments list.
  for (var i = 0; i < treatments.length; i++) {
    var newTreatment = $('treatment-template').cloneNode(true);
    newTreatment.id = 'treatment' + i.toString();
    newTreatment.removeAttribute('hidden');
    newTreatment.onclick = function() {
      applyTreatment(parseInt(this.textContent));
    };
    newTreatment.textContent = i.toString();
    $('treatment-list').appendChild(newTreatment);
  }

  if (treatments.length > 0) {
    // Store a copy of the settings right now so you can reset them afterwards.
    for (var i = 0; i < treatments[0].length; i++)
      backupPreferenceValue(treatments[0][i].key);

    // Select Treatment 0 to start
    applyTreatment(0);
  } else {
    // Make the error message visible and hide everything else
    $('invalid_treatment_info').removeAttribute('hidden');
    var div = $('valid_treatment_info');
    div.parentNode.removeChild(div);
  }
}

/**
 * A key handler so the user can use the arrow keys to select their treatments.
 * This should fire any time they press a key
 */
document.onkeydown = handleKeyPress;
document.addEventListener('DOMContentLoaded', initialize);