Change 'Add Page' to show a simple input dialog with --use-more-webui.

chrome/browser/resources/input_window_dialog.js

 // Copyright (c) 2011 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.
 
 cr.define('inputWindowDialog', function() {
   'use strict';
 
   /**
    * Disables the controls while the dialog is busy.
    */
   function disableControls() {
     $('cancel').disabled = true;
     $('ok').disabled = true;
   }
 
   /**
    * Close the dialog and pass a result value to the dialog close handler.
    * @param {boolean} result The value to pass to the dialog close handler.
    */
   function closeWithResult(result) {
     disableControls();
-    var value = [result];
+    var values = [result];
     if (result) {
-      value.push($('name').value);
+      values.push($('name').value);
+      if ($('url-area').style.display != 'none') {

[flackr, 2011/11/02 15:38:18]

Use class to determine whether a URL is being edited so that the logic is not
dependent on the view.

[mazda, 2011/11/07 09:59:23]

Done.
I added a function to check if a URL field is shown.

+        values.push($('url').value);
+      }
     }
-    var json = JSON.stringify(value);
+    var json = JSON.stringify(values);
     chrome.send('DialogClose', [json]);
   }
 
   /**
    * Inserts translated strings on loading.
    */
   function initialize() {
     i18nTemplate.process(document, templateData);
 
     var args = JSON.parse(chrome.dialogArguments);
-    $('name-label').textContent = args.label;
-    $('name').value = args.contents;
+    $('name-label').textContent = args.nameLabel;
+    $('name').value = args.name;
+
+    if (args.urlLabel && args.url) {
+      $('url-label').textContent = args.urlLabel;
+      $('url').value = args.url;
+      $('url-area').style.display = '-webkit-box';

[flackr, 2011/11/02 15:38:18]

Use class to toggle CSS properties.

[mazda, 2011/11/07 09:59:23]

Done.

+    } else {
+      $('url-area').style.display = 'none';
+    }
 
     $('cancel').onclick = function() {
       closeWithResult(false);
     }
 
     $('ok').onclick = function() {
       if (!$('ok').disabled) {
         closeWithResult(true);
       }
     }
 
-    $('name').oninput = function() {
-      var name = $('name').value;
-      chrome.send('validate', [name]);
+    function validate() {
+      var values = [$('name').value]
+      if ($('url-area').style.display != 'none') {

[flackr, 2011/11/02 15:38:18]

Same as above, check class instead of style.

[mazda, 2011/11/07 09:59:23]

Done.

+        values.push($('url').value);
+      }
+      chrome.send('validate', values);
     }
 
+    $('name').oninput = validate;
+    $('url').oninput = $('url-area').style.display != 'none' ? validate : null;
+
     document.body.onkeydown = function(evt) {
       if (evt.keyCode == 13) {  // Enter key
         $('ok').onclick();
       } else if (evt.keyCode == 27) {  // Escape key
         $('cancel').onclick();
       }
     }
   }
 
   /**
    * Called in response to validate request.
    * @param {boolean} valid The result of validate request.
    */
   function ackValidation(valid) {
     $('ok').disabled = !valid;
   }
 
   return {
     initialize: initialize,
     ackValidation: ackValidation,
   };
 });
 
 document.addEventListener('DOMContentLoaded', inputWindowDialog.initialize);