chrome/browser/resources/feedback/js/feedback.js

   1 // Copyright 2013 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 /** @type {string}
   6  * @const
   7  */
   8 var FEEDBACK_LANDING_PAGE =
   9     'https://www.google.com/support/chrome/go/feedback_confirmation';
  10 /** @type {number}
  11  * @const
  12  */
  13 var MAX_ATTACH_FILE_SIZE = 3 * 1024 * 1024;
  14
  15 /**
  16  * @type {number}
  17  * @const
  18  */
  19 var FEEDBACK_MIN_WIDTH = 500;
  20 /**
  21  * @type {number}
  22  * @const
  23  */
  24 var FEEDBACK_MIN_HEIGHT = 585;
  25
  26 /** @type {number}
  27  * @const
  28  */
  29 var CONTENT_MARGIN_HEIGHT = 40;
  30
  31 /** @type {number}
  32  * @const
  33  */
  34 var MAX_SCREENSHOT_WIDTH = 100;
  35
  36 /** @type {string}
  37  * @const
  38  */
  39 var SYSINFO_WINDOW_ID = 'sysinfo_window';
  40
  41 /** @type {string}
  42  * @const
  43  */
  44 var STATS_WINDOW_ID = 'stats_window';
  45
  46 var attachedFileBlob = null;
  47 var lastReader = null;
  48
  49 var feedbackInfo = null;
  50 var systemInfo = null;
  51
  52 /**
  53  * Reads the selected file when the user selects a file.
  54  * @param {Event} fileSelectedEvent The onChanged event for the file input box.
  55  */
  56 function onFileSelected(fileSelectedEvent) {
  57   $('attach-error').hidden = true;
  58   var file = fileSelectedEvent.target.files[0];
  59   if (!file) {
  60     // User canceled file selection.
  61     attachedFileBlob = null;
  62     return;
  63   }
  64
  65   if (file.size > MAX_ATTACH_FILE_SIZE) {
  66     $('attach-error').hidden = false;
  67
  68     // Clear our selected file.
  69     $('attach-file').value = '';
  70     attachedFileBlob = null;
  71     return;
  72   }
  73
  74   attachedFileBlob = file.slice();
  75 }
  76
  77 /**
  78  * Clears the file that was attached to the report with the initial request.
  79  * Instead we will now show the attach file button in case the user wants to
  80  * attach another file.
  81  */
  82 function clearAttachedFile() {
  83   $('custom-file-container').hidden = true;
  84   attachedFileBlob = null;
  85   feedbackInfo.attachedFile = null;
  86   $('attach-file').hidden = false;
  87 }
  88
  89 /**
  90  * Creates a closure that creates or shows a window with the given url.
  91  * @param {string} windowId A string with the ID of the window we are opening.
  92  * @param {string} url The destination URL of the new window.
  93  * @return {function()} A function to be called to open the window.
  94  */
  95 function windowOpener(windowId, url) {
  96   return function() {
  97     chrome.app.window.create(url, {id: windowId});
  98   };
  99 }
 100
 101 /**
 102  * Opens a new window with chrome://slow_trace, downloading performance data.
 103  */
 104 function openSlowTraceWindow() {
 105   chrome.app.window.create(
 106       'chrome://slow_trace/tracing.zip#' + feedbackInfo.traceId);
 107 }
 108
 109 /**
 110  * Sends the report; after the report is sent, we need to be redirected to
 111  * the landing page, but we shouldn't be able to navigate back, hence
 112  * we open the landing page in a new tab and sendReport closes this tab.
 113  * @return {boolean} True if the report was sent.
 114  */
 115 function sendReport() {
 116   if ($('description-text').value.length == 0) {
 117     var description = $('description-text');
 118     description.placeholder = loadTimeData.getString('no-description');
 119     description.focus();
 120     return false;
 121   }
 122
 123   // Prevent double clicking from sending additional reports.
 124   $('send-report-button').disabled = true;
 125   console.log('Feedback: Sending report');
 126   if (!feedbackInfo.attachedFile && attachedFileBlob) {
 127     feedbackInfo.attachedFile = { name: $('attach-file').value,
 128                                   data: attachedFileBlob };
 129   }
 130
 131   feedbackInfo.description = $('description-text').value;
 132   feedbackInfo.pageUrl = $('page-url-text').value;
 133   feedbackInfo.email = $('user-email-text').value;
 134
 135   var useSystemInfo = false;
 136   var useHistograms = false;
 137   if ($('sys-info-checkbox') != null &&
 138       $('sys-info-checkbox').checked &&
 139       systemInfo != null) {
 140     // Send histograms along with system info.
 141     useSystemInfo = useHistograms = true;
 142   }
 143 <if expr="pp_ifdef('chromeos')">
 144   if ($('performance-info-checkbox') == null ||
 145       !($('performance-info-checkbox').checked)) {
 146     feedbackInfo.traceId = null;
 147   }
 148 </if>
 149
 150   if (useSystemInfo) {
 151     if (feedbackInfo.systemInformation != null) {
 152       // Concatenate sysinfo if we had any initial system information
 153       // sent with the feedback request event.
 154       feedbackInfo.systemInformation =
 155           feedbackInfo.systemInformation.concat(systemInfo);
 156     } else {
 157       feedbackInfo.systemInformation = systemInfo;
 158     }
 159   }
 160
 161   feedbackInfo.sendHistograms = useHistograms;
 162
 163   // If the user doesn't want to send the screenshot.
 164   if (!$('screenshot-checkbox').checked)
 165     feedbackInfo.screenshot = null;
 166
 167   chrome.feedbackPrivate.sendFeedback(feedbackInfo, function(result) {
 168     window.open(FEEDBACK_LANDING_PAGE, '_blank');
 169     window.close();
 170   });
 171
 172   return true;
 173 }
 174
 175 /**
 176  * Click listener for the cancel button.
 177  * @param {Event} e The click event being handled.
 178  */
 179 function cancel(e) {
 180   e.preventDefault();
 181   window.close();
 182 }
 183
 184 /**
 185  * Converts a blob data URL to a blob object.
 186  * @param {string} url The data URL to convert.
 187  * @return {Blob} Blob object containing the data.
 188  */
 189 function dataUrlToBlob(url) {
 190   var mimeString = url.split(',')[0].split(':')[1].split(';')[0];
 191   var data = atob(url.split(',')[1]);
 192   var dataArray = [];
 193   for (var i = 0; i < data.length; ++i)
 194     dataArray.push(data.charCodeAt(i));
 195
 196   return new Blob([new Uint8Array(dataArray)], {type: mimeString});
 197 }
 198
 199 <if expr="pp_ifdef('chromeos')">
 200 /**
 201  * Update the page when performance feedback state is changed.
 202  */
 203 function performanceFeedbackChanged() {
 204   if ($('performance-info-checkbox').checked) {
 205     $('attach-file').disabled = true;
 206     $('attach-file').checked = false;
 207
 208     $('screenshot-checkbox').disabled = true;
 209     $('screenshot-checkbox').checked = false;
 210   } else {
 211     $('attach-file').disabled = false;
 212     $('screenshot-checkbox').disabled = false;
 213   }
 214 }
 215 </if>
 216
 217 function resizeAppWindow() {
 218   // We pick the width from the titlebar, which has no margins.
 219   var width = $('title-bar').scrollWidth;
 220   if (width < FEEDBACK_MIN_WIDTH)
 221     width = FEEDBACK_MIN_WIDTH;
 222
 223   // We get the height by adding the titlebar height and the content height +
 224   // margins. We can't get the margins for the content-pane here by using
 225   // style.margin - the variable seems to not exist.
 226   var height = $('title-bar').scrollHeight +
 227       $('content-pane').scrollHeight + CONTENT_MARGIN_HEIGHT;
 228   if (height < FEEDBACK_MIN_HEIGHT)
 229     height = FEEDBACK_MIN_HEIGHT;
 230
 231   chrome.app.window.current().resizeTo(width, height);
 232 }
 233
 234 /**
 235  * Initializes our page.
 236  * Flow:
 237  * .) DOMContent Loaded        -> . Request feedbackInfo object
 238  *                                . Setup page event handlers
 239  * .) Feedback Object Received -> . take screenshot
 240  *                                . request email
 241  *                                . request System info
 242  *                                . request i18n strings
 243  * .) Screenshot taken         -> . Show Feedback window.
 244  */
 245 function initialize() {
 246   // TODO(rkc):  Remove logging once crbug.com/284662 is closed.
 247   console.log('FEEDBACK_DEBUG: feedback.js: initialize()');
 248
 249   // Add listener to receive the feedback info object.
 250   chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
 251     if (request.sentFromEventPage) {
 252       // TODO(rkc):  Remove logging once crbug.com/284662 is closed.
 253       console.log('FEEDBACK_DEBUG: Received feedbackInfo.');
 254       feedbackInfo = request.data;
 255       $('description-text').textContent = feedbackInfo.description;
 256       if (feedbackInfo.pageUrl)
 257         $('page-url-text').value = feedbackInfo.pageUrl;
 258
 259       takeScreenshot(function(screenshotCanvas) {
 260         // TODO(rkc):  Remove logging once crbug.com/284662 is closed.
 261         console.log('FEEDBACK_DEBUG: Taken screenshot. Showing window.');
 262
 263         // We've taken our screenshot, show the feedback page without any
 264         // further delay.
 265         window.webkitRequestAnimationFrame(function() {
 266           resizeAppWindow();
 267         });
 268         chrome.app.window.current().show();
 269
 270         var screenshotDataUrl = screenshotCanvas.toDataURL('image/png');
 271         $('screenshot-image').src = screenshotDataUrl;
 272         $('screenshot-image').classList.toggle('wide-screen',
 273             $('screenshot-image').width > MAX_SCREENSHOT_WIDTH);
 274         feedbackInfo.screenshot = dataUrlToBlob(screenshotDataUrl);
 275       });
 276
 277       chrome.feedbackPrivate.getUserEmail(function(email) {
 278         $('user-email-text').value = email;
 279       });
 280
 281       chrome.feedbackPrivate.getSystemInformation(function(sysInfo) {
 282         systemInfo = sysInfo;
 283       });
 284
 285       // An extension called us with an attached file.
 286       if (feedbackInfo.attachedFile) {
 287         $('attached-filename-text').textContent =
 288             feedbackInfo.attachedFile.name;
 289         attachedFileBlob = feedbackInfo.attachedFile.data;
 290         $('custom-file-container').hidden = false;
 291         $('attach-file').hidden = true;
 292       }
 293
 294 <if expr="pp_ifdef('chromeos')">
 295       if (feedbackInfo.traceId && ($('performance-info-area'))) {
 296         $('performance-info-area').hidden = false;
 297         $('performance-info-checkbox').checked = true;
 298         performanceFeedbackChanged();
 299         $('performance-info-link').onclick = openSlowTraceWindow;
 300       }
 301 </if>
 302
 303       chrome.feedbackPrivate.getStrings(function(strings) {
 304         loadTimeData.data = strings;
 305         i18nTemplate.process(document, loadTimeData);
 306
 307         if ($('sys-info-url')) {
 308           // Opens a new window showing the current system info.
 309           $('sys-info-url').onclick =
 310               windowOpener(SYSINFO_WINDOW_ID, 'chrome://system');
 311         }
 312         if ($('histograms-url')) {
 313           // Opens a new window showing the histogram metrics.
 314           $('histograms-url').onclick =
 315               windowOpener(STATS_WINDOW_ID, 'chrome://histograms');
 316         }
 317       });
 318     }
 319   });
 320
 321   window.addEventListener('DOMContentLoaded', function() {
 322     // TODO(rkc):  Remove logging once crbug.com/284662 is closed.
 323     console.log('FEEDBACK_DEBUG: feedback.js: DOMContentLoaded');
 324     // Ready to receive the feedback object.
 325     chrome.runtime.sendMessage({ready: true});
 326
 327     // Setup our event handlers.
 328     $('attach-file').addEventListener('change', onFileSelected);
 329     $('send-report-button').onclick = sendReport;
 330     $('cancel-button').onclick = cancel;
 331     $('remove-attached-file').onclick = clearAttachedFile;
 332 <if expr="pp_ifdef('chromeos')">
 333     $('performance-info-checkbox').addEventListener(
 334         'change', performanceFeedbackChanged);
 335 </if>
 336   });
 337 }
 338
 339 initialize();