SOLR-4921: UI now supports adding documents to a collection

git-svn-id: https://svn.apache.org/repos/asf/lucene/dev/trunk@1496994 13f79535-47bb-0310-9956-ffa450edef68

solr/CHANGES.txt

@@ -116,6 +116,8 @@ New Features
   <bool name="fieldNameMatchesSchemaField">false</bool> to an update
   processor's configuration in solrconfig.xml.  (Steve Rowe, hossman)
 
+* SOLR-4921: Admin UI now supports adding documents to Solr (gsingers, steffkes)
+
 Bug Fixes
 ----------------------
 

solr/webapp/web/admin.html

@@ -35,6 +35,7 @@ limitations under the License.
   <link rel="stylesheet" type="text/css" href="css/styles/logging.css?_=${version}">
   <link rel="stylesheet" type="text/css" href="css/styles/menu.css?_=${version}">
   <link rel="stylesheet" type="text/css" href="css/styles/plugins.css?_=${version}">
+  <link rel="stylesheet" type="text/css" href="css/styles/documents.css?_=${version}">
   <link rel="stylesheet" type="text/css" href="css/styles/query.css?_=${version}">
   <link rel="stylesheet" type="text/css" href="css/styles/replication.css?_=${version}">
   <link rel="stylesheet" type="text/css" href="css/styles/schema-browser.css?_=${version}">

solr/webapp/web/css/styles/documents.css

@@ -0,0 +1,178 @@
+#content #documents
+{
+  background-image: url( ../../img/div.gif );
+  background-position: 45% 0;
+  background-repeat: repeat-y;
+}
+
+#content #documents #form
+{
+  float: left;
+  /*width: 21%;*/
+}
+
+#content #documents #form label
+{
+  cursor: pointer;
+  display: block;
+  margin-top: 5px;
+}
+
+#content #documents #form input,
+#content #documents #form select,
+#content #documents #form textarea
+{
+  margin-bottom: 2px;
+  /*width: 100%;*/
+}
+
+#content #documents #form input,
+#content #documents #form textarea
+{
+  margin-bottom: 2px;
+  /*width: 98%;*/
+}
+
+#content #documents #form #start
+{
+  float: left;
+  /*width: 45%;*/
+}
+
+#content #documents #form #rows
+{
+  float: right;
+ /* width: 45%;*/
+}
+
+#content #documents #form .checkbox input
+{
+  margin-bottom: 0;
+  width: auto;
+}
+
+#content #documents #form fieldset,
+#content #documents #form .optional.expanded
+{
+  border: 1px solid #fff;
+  border-top: 1px solid #c0c0c0;
+  margin-bottom: 5px;
+}
+
+#content #documents #form fieldset.common
+{
+  margin-top: 10px;
+}
+
+#content #documents #form fieldset legend,
+#content #documents #form .optional.expanded legend
+{
+  display: block;
+  margin-left: 10px;
+  padding: 0px 5px;
+}
+
+#content #documents #form fieldset legend label
+{
+  margin-top: 0;
+}
+
+#content #documents #form fieldset .fieldset
+{
+  border-bottom: 1px solid #f0f0f0;
+  margin-bottom: 5px;
+  padding-bottom: 10px;
+}
+
+#content #documents #form .optional
+{
+  border: 0;
+}
+
+#content #documents #form .optional .fieldset
+{
+  display: none;
+}
+
+#content #documents #form .optional legend
+{
+  margin-left: 0;
+  padding-left: 0;
+}
+
+#content #documents #form .optional.expanded .fieldset
+{
+  display: block;
+}
+
+#content #documents #file-upload{
+  display: none;
+}
+
+#content #documents #result
+{
+  display: none;
+  float: right;
+  width: 54%;
+}
+
+#content #documents #result #url
+{
+  margin-bottom: 10px;
+  background-image: url( ../../img/ico/ui-address-bar.png );
+  background-position: 5px 50%;
+  border: 1px solid #f0f0f0;
+  box-shadow: 1px 1px 0 #f0f0f0;
+  -moz-box-shadow: 1px 1px 0 #f0f0f0;
+  -webkit-box-shadow: 1px 1px 0 #f0f0f0;
+  color: #c0c0c0;
+  display: block;
+  overflow: hidden;
+  padding: 5px;
+  padding-left: 26px;
+  white-space: nowrap;
+}
+
+#content #documents #result #url:focus,
+#content #documents #result #url:hover
+{
+  border-color: #c0c0c0;
+  box-shadow: 1px 1px 0 #d8d8d8;
+  -moz-box-shadow: 1px 1px 0 #d8d8d8;
+  -webkit-box-shadow: 1px 1px 0 #d8d8d8;
+  color: #333;
+}
+
+#content #documents #result #response
+{
+}
+
+#content #documents #result #response pre
+{
+  padding-left: 20px;
+}
+
+.description{
+  font-weight: bold;
+}
+
+#upload-only{
+  display: none;
+}
+
+#document-type{
+  padding-bottom: 5px;
+}
+
+#wizard{
+  display: none;
+}
+
+#wizard-fields div{
+  padding-top: 5px;
+  padding-bottom: 5px;
+}
+
+#wiz-field-data, #wiz-field-data span{
+  vertical-align: top;
+}

solr/webapp/web/css/styles/menu.css

@@ -239,6 +239,7 @@
 #core-menu .schema a { background-image: url( ../../img/ico/table.png ); }
 #core-menu .config a { background-image: url( ../../img/ico/gear.png ); }
 #core-menu .analysis a { background-image: url( ../../img/ico/funnel.png ); }
+#core-menu .documents a { background-image: url( ../../img/ico/documents-stack.png ); }
 #core-menu .schema-browser a { background-image: url( ../../img/ico/book-open-text.png ); }
 #core-menu .replication a { background-image: url( ../../img/ico/node.png ); }
 #core-menu .distribution a { background-image: url( ../../img/ico/node-select.png ); }

solr/webapp/web/js/lib/jquery.ajaxfileupload.js

@@ -0,0 +1,182 @@
+/*
+* Copyright (c) 2011 Jordan Feldstein
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+// Original code from: https://github.com/jfeldstein/jQuery.AjaxFileUpload.js https://github.com/jfeldstein/jQuery.AjaxFileUpload.js/commit/9dd56b4161cbed138287d3ae29a476bb59eb5fc4
+// All modifications are BSD licensed
+// GSI: Modifications made to support immediate upload
+/*
+ //
+ //  - Ajaxifies an individual <input type="file">
+ //  - Files are sandboxed. Doesn't matter how many, or where they are, on the page.
+ //  - Allows for extra parameters to be included with the file
+ //  - onStart callback can cancel the upload by returning false
+ */
+
+
+(function ($) {
+  $.fn.ajaxfileupload = function (options) {
+    var settings = {
+      params: {},
+      action: '',
+      onStart: function () {
+        console.log('starting upload');
+        console.log(this);
+      },
+      onComplete: function (response) {
+        console.log('got response: ');
+        console.log(response);
+        console.log(this);
+      },
+      onCancel: function () {
+        console.log('cancelling: ');
+        console.log(this);
+      },
+      validate_extensions: true,
+      valid_extensions: ['gif', 'png', 'jpg', 'jpeg'],
+      submit_button: null,
+      upload_now: false
+    };
+
+    var uploading_file = false;
+
+    if (options) {
+      $.extend(settings, options);
+    }
+
+
+    // 'this' is a jQuery collection of one or more (hopefully)
+    //  file elements, but doesn't check for this yet
+    return this.each(function () {
+      var $element = $(this);
+      /*
+       // Internal handler that tries to parse the response
+       //  and clean up after ourselves.
+       */
+      var handleResponse = function (loadedFrame, element) {
+        var response, responseStr = loadedFrame.contentWindow.document.body.innerHTML;
+        try {
+          //response = $.parseJSON($.trim(responseStr));
+          response = JSON.parse(responseStr);
+        } catch (e) {
+          response = responseStr;
+        }
+
+        // Tear-down the wrapper form
+        element.siblings().remove();
+        element.unwrap();
+
+        uploading_file = false;
+
+        // Pass back to the user
+        settings.onComplete.apply(element, [response, settings.params]);
+      };
+      /*
+       // Wraps element in a <form> tag, and inserts hidden inputs for each
+       //  key:value pair in settings.params so they can be sent along with
+       //  the upload. Then, creates an iframe that the whole thing is
+       //  uploaded through.
+       */
+      var wrapElement = function (element) {
+        // Create an iframe to submit through, using a semi-unique ID
+        var frame_id = 'ajaxUploader-iframe-' + Math.round(new Date().getTime() / 1000)
+        $('body').after('<iframe width="0" height="0" style="display:none;" name="' + frame_id + '" id="' + frame_id + '"/>');
+        $('#' + frame_id).load(function () {
+          handleResponse(this, element);
+        });
+        console.log("settings.action: " + settings.action);
+        // Wrap it in a form
+        element.wrap(function () {
+          return '<form action="' + settings.action + '" method="POST" enctype="multipart/form-data" target="' + frame_id + '" />'
+        })
+          // Insert <input type='hidden'>'s for each param
+            .before(function () {
+              var key, html = '';
+              for (key in settings.params) {
+                var paramVal = settings.params[key];
+                if (typeof paramVal === 'function') {
+                  paramVal = paramVal();
+                }
+                html += '<input type="hidden" name="' + key + '" value="' + paramVal + '" />';
+              }
+              return html;
+            });
+      }
+
+      var upload_file = function () {
+        if ($element.val() == '') return settings.onCancel.apply($element, [settings.params]);
+
+        // make sure extension is valid
+        var ext = $element.val().split('.').pop().toLowerCase();
+        if (true === settings.validate_extensions && $.inArray(ext, settings.valid_extensions) == -1) {
+          // Pass back to the user
+          settings.onComplete.apply($element, [
+            {status: false, message: 'The select file type is invalid. File must be ' + settings.valid_extensions.join(', ') + '.'},
+            settings.params
+          ]);
+        } else {
+          uploading_file = true;
+
+          // Creates the form, extra inputs and iframe used to
+          //  submit / upload the file
+          wrapElement($element);
+
+          // Call user-supplied (or default) onStart(), setting
+          //  it's this context to the file DOM element
+          var ret = settings.onStart.apply($element, [settings.params]);
+
+          // let onStart have the option to cancel the upload
+          if (ret !== false) {
+            $element.parent('form').submit(function (e) {
+              e.stopPropagation();
+            }).submit();
+          }
+        }
+      };
+      if (settings.upload_now) {
+        if (!uploading_file) {
+          console.log("uploading now");
+          upload_file();
+        }
+      }
+      // Skip elements that are already setup. May replace this
+      //  with uninit() later, to allow updating that settings
+      if ($element.data('ajaxUploader-setup') === true) return;
+
+      $element.change(function () {
+        // since a new image was selected, reset the marker
+        uploading_file = false;
+
+        // only update the file from here if we haven't assigned a submit button
+        if (settings.submit_button == null) {
+          console.log("uploading");
+          upload_file();
+        }
+      });
+
+      if (settings.submit_button == null) {
+        // do nothing
+      } else {
+        settings.submit_button.click(function () {
+          console.log("uploading: " + uploading_file);
+          // only attempt to upload file if we're not uploading
+          if (!uploading_file) {
+            upload_file();
+          }
+        });
+      }
+
+
+      // Mark this element as setup
+      $element.data('ajaxUploader-setup', true);
+
+
+    });
+  }
+})(jQuery)

solr/webapp/web/js/main.js

@@ -26,6 +26,7 @@ require
     'lib/order!lib/jquery.jstree',
     'lib/order!lib/jquery.sammy',
     'lib/order!lib/jquery.timeago',
+    'lib/order!lib/jquery.ajaxfileupload',
     'lib/order!lib/jquery.blockUI',
     'lib/order!lib/highlight',
     'lib/order!lib/linker',
@@ -37,6 +38,7 @@ require
     'lib/order!scripts/analysis',
     'lib/order!scripts/cloud',
     'lib/order!scripts/cores',
+    'lib/order!scripts/documents',
     'lib/order!scripts/dataimport',
     'lib/order!scripts/dashboard',
     'lib/order!scripts/file',

solr/webapp/web/js/scripts/app.js

@@ -351,23 +351,25 @@ var solr_admin = function( app_config )
               {
                 var core_name = $( 'option:selected', this ).text();
 
-                if( core_name )
-                {
                 that.core_menu
                     .html
-                    (
+                    (//Keep this in alphabetical order after the overview
                         '<li class="overview"><a href="#/' + core_name + '"><span>Overview</span></a></li>' + "\n" +
-                      '<li class="ping"><a rel="' + that.config.solr_path + '/' + core_name + '/admin/ping"><span>Ping</span></a></li>' + "\n" +
-                      '<li class="query"><a href="#/' + core_name + '/query"><span>Query</span></a></li>' + "\n" +
-                      '<li class="schema"><a href="#/' + core_name + '/schema"><span>Schema</span></a></li>' + "\n" +
-                      '<li class="config"><a href="#/' + core_name + '/config"><span>Config</span></a></li>' + "\n" +
-                      '<li class="replication"><a href="#/' + core_name + '/replication"><span>Replication</span></a></li>' + "\n" +
                             '<li class="analysis"><a href="#/' + core_name + '/analysis"><span>Analysis</span></a></li>' + "\n" +
-                      '<li class="schema-browser"><a href="#/' + core_name + '/schema-browser"><span>Schema Browser</span></a></li>' + "\n" + 
+                            '<li class="config"><a href="#/' + core_name + '/config"><span>Config</span></a></li>' + "\n" +
+                            '<li class="dataimport"><a href="#/' + core_name + '/dataimport"><span>Dataimport</span></a></li>' + "\n" +
+                            '<li class="documents"><a href="#/' + core_name + '/documents"><span>Documents</span></a></li>' + "\n" +
+                            '<li class="ping"><a rel="' + that.config.solr_path + '/' + core_name + '/admin/ping"><span>Ping</span></a></li>' + "\n" +
                             '<li class="plugins"><a href="#/' + core_name + '/plugins"><span>Plugins / Stats</span></a></li>' + "\n" +
-                      '<li class="dataimport"><a href="#/' + core_name + '/dataimport"><span>Dataimport</span></a></li>' + "\n"
+                            '<li class="query"><a href="#/' + core_name + '/query"><span>Query</span></a></li>' + "\n" +
+                            '<li class="replication"><a href="#/' + core_name + '/replication"><span>Replication</span></a></li>' + "\n" +
+                            '<li class="schema"><a href="#/' + core_name + '/schema"><span>Schema</span></a></li>' + "\n" +
+                            '<li class="schema-browser"><a href="#/' + core_name + '/schema-browser"><span>Schema Browser</span></a></li>' + "\n"
+
                     )
                     .show();
+                if( core_name )
+                {
                 }
                 else
                 {

solr/webapp/web/js/scripts/documents.js

@@ -0,0 +1,370 @@
+/*
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements.  See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License.  You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
+//helper for formatting JSON and others
+var content_generator = {
+
+  _default: function (toEsc) {
+    return toEsc.esc();
+  },
+
+  json: function (toEsc) {
+    return app.format_json(toEsc);
+  }
+
+};
+
+//Utiltity function for turning on/off various elements
+function toggles(documents_form, show_json, show_file, show_doc, doc_text, show_wizard) {
+  var json_only = $('#json-only');
+  var the_document = $('#document', documents_form);
+  if (show_doc) {
+    //console.log("doc: " + doc_text);
+    the_document.val(doc_text);
+    the_document.show();
+  } else {
+    the_document.hide();
+  }
+  if (show_json) {
+    json_only.show();
+  } else {
+    json_only.hide();
+  }
+  var file_upload = $('#file-upload', documents_form);
+  var upload_only = $('#upload-only', documents_form);
+  if (show_file) {
+    file_upload.show();
+    upload_only.show();
+  } else {
+    file_upload.hide();
+    upload_only.hide();
+  }
+  var wizard = $('#wizard', documents_form);
+  if (show_wizard) {
+    wizard.show();
+  } else {
+    wizard.hide();
+  }
+}
+// #/:core/documents
+
+//Utiltity function for setting up the wizard fields
+function addWizardFields(active_core, wizard) {
+  var core_basepath = active_core.attr('data-basepath');
+  var select_options = "";
+  //Populate the select options based off the Fields REST API
+  $.getJSON(window.location.protocol + '//' + window.location.host
+          + core_basepath + "/schema/fields").done(
+      //TODO: handle dynamic fields
+      //TODO: get the unique key, too
+      function (data) {
+        var field_select = $("#wiz-field-select", wizard);
+        field_select.empty();
+        $.each(data.fields,
+            function (i, item) {
+              //console.log("i[" + i + "]=" + item.name);
+              if (item.name != "_version_"){
+                select_options += '<option name="' + item.name + '">'
+                  + item.name + '</option>';
+              }
+            });
+        //console.log("select_options: " + select_options);
+        //fill in the select options
+        field_select.append(select_options);
+      });
+  var wizard_doc = $("#wizard-doc", wizard);
+  wizard_doc.die('focusin')
+      .live('focusin', function (event) {
+        $("#wizard-doc", wizard).text("");
+      }
+  );
+  //Add the click handler for the "Add Field" target, which
+  //takes the field content and moves it into the document target
+  var add_field = $("#add-field-href", wizard);
+  add_field.die("click")
+      .live("click",
+      function (event) {
+        //take the field and the contents and append it to the document
+        var wiz_select = $("#wiz-field-select", wizard);
+        var selected = $("option:selected", wiz_select);
+        console.log("selected field: " + selected);
+        var wiz_doc = $("#wizard-doc", wizard);
+        var the_document = $("#document");
+        var current_doc = the_document.val();
+        console.log("current_text: " + current_doc + " wiz_doc: " + wiz_doc.val());
+        var index = current_doc.lastIndexOf("}");
+        var new_entry = '"' + selected.val() + '":"' + wiz_doc.val() + '"';
+        if (index >= 0) {
+          current_doc = current_doc.substring(0, index) + ', ' + new_entry + "}";
+        } else {
+          //we don't have a doc at all
+          current_doc = "{" + new_entry + "}";
+        }
+        current_doc = content_generator['json'](current_doc);
+        the_document.val(current_doc);
+        //clear the wiz doc window
+        wiz_doc.val("");
+        return false;
+      }
+  );
+
+  //console.log("adding " + i + " child: " + child);
+
+}
+
+//The main program for adding the docs
+sammy.get
+(
+    new RegExp(app.core_regex_base + '\\/(documents)$'),
+    function (context) {
+      var active_core = this.active_core;
+      var core_basepath = active_core.attr('data-basepath');
+      var content_element = $('#content');
+
+
+      $.post
+      (
+          'tpl/documents.html',
+          function (template) {
+
+            content_element
+                .html(template);
+            var documents_element = $('#documents', content_element);
+            var documents_form = $('#form form', documents_element);
+            var url_element = $('#url', documents_element);
+            var result_element = $('#result', documents_element);
+            var response_element = $('#response', documents_element);
+            var doc_type_select = $('#document-type', documents_form);
+            //Since we are showing "example" docs, when the area receives the focus
+            // remove the example content.
+            $('#document', documents_form).die('focusin')
+                .live('focusin',
+                function (event) {
+                  var document_type = $('#document-type', documents_form).val();
+                  if (document_type != "wizard"){
+                    //Don't clear the document when in wizard mode.
+                    var the_document = $('#document', documents_form);
+                    the_document.text("");
+                  }
+                }
+            );
+
+            /*response_element.html("");*/
+            //Setup the handlers for toggling the various display options for the "Document Type" select
+            doc_type_select
+                .die('change')
+                .live
+            (
+                'change',
+                function (event) {
+                  var document_type = $('#document-type', documents_form).val();
+                  var file_upload = $('#file-upload', documents_form);
+
+                  //need to clear out any old file upload by forcing a redraw so that
+                  //we don't try to upload an old file
+                  file_upload.html(file_upload.html());
+                  if (document_type == "json") {
+                    toggles(documents_form, true, false, true, '{"id":"change.me","title":"change.me"}', false);
+                    $("#attribs").show();
+                  } else if (document_type == "upload") {
+                    toggles(documents_form, false, true, false, "", false);
+                    $("#attribs").show();
+                  } else if (document_type == "csv") {
+                    toggles(documents_form, false, false, true, "id,title\nchange.me,change.me", false);
+                    $("#attribs").show();
+                  } else if (document_type == "solr") {
+                    toggles(documents_form, false, false, true, '<add>\n' +
+                        '<doc>\n' +
+                        '<field name="id">change.me</field>\n' +
+                        '<field name="title" >chang.me</field>\n' +
+                        '</doc>\n' +
+                        '</add>\n', false);
+                    $("#attribs").hide();
+                  } else if (document_type == "wizard") {
+                    var wizard = $('#wizard', documents_form);
+                    addWizardFields(active_core, wizard);
+                    //$("#wizard-doc", wizard).text('Enter your field text here and then click "Add Field" to add the field to the document.');
+                    toggles(documents_form, false, false, true, "", true);
+                    $("#attribs").show();
+                  } else if (document_type == "xml") {
+                    toggles(documents_form, false, false, true, '<doc>\n' +
+                        '<field name="id">change.me</field>' +
+                        '<field name="title">change.me</field>' +
+                        '</doc>', false);
+                    $("#attribs").show();
+                  }
+                  return false;
+                }
+            );
+            doc_type_select.chosen().trigger('change');
+            //Setup the submit option handling.
+            documents_form
+                .die('submit')
+                .live
+            (
+                'submit',
+                function (event) {
+                  var form_values = [];
+                  var handler_path = $('#qt', documents_form).val();
+                  if ('/' !== handler_path[0]) {
+                    form_values.push({ name: 'qt', value: handler_path.esc() });
+                    handler_path = '/update';
+                  }
+
+                  var document_url = window.location.protocol + '//' + window.location.host
+                      + core_basepath + handler_path + '?wt=json';
+
+                  url_element
+                      .attr('href', document_url)
+                      .text(document_url)
+                      .trigger('change');
+                  var the_document = $('#document', documents_form).val();
+                  var commit_within = $('#commitWithin', documents_form).val();
+                  var boost = $('#boost', documents_form).val();
+                  var overwrite = $('#overwrite', documents_form).val();
+                  var the_command = "";
+                  var content_type = "";
+                  var document_type = $('#document-type', documents_form).val();
+                  var doingFileUpload = false;
+                  //Both JSON and Wizard use the same pathway for submission
+                  //New entries primarily need to fill the_command and set the content_type
+                  if (document_type == "json" || document_type == "wizard") {
+                    //create a JSON command
+                    the_command = "{"
+                        + '"add":{ "doc":' + the_document + ","
+                        + '"boost":' + boost + ","
+                        + '"overwrite":' + overwrite + ","
+                        + '"commitWithin":' + commit_within
+                        + "}}";
+                    content_type = "application/json";
+                  } else if (document_type == "csv") {
+                    the_command = the_document;
+                    document_url += "&commitWithin=" + commit_within + "&overwrite=" + overwrite;
+                    content_type = "application/csv";
+                  } else if (document_type == "xml") {
+                    the_command = '<add commitWithin="' + commit_within
+                        + '" overwrite="' + overwrite + '"'
+                        + ">"
+                        + the_document + "</add>";
+                    content_type = "text/xml";
+                  } else if (document_type == "upload") {
+                    doingFileUpload = true;
+                  } else if (document_type == "solr") {
+                    //guess content_type
+                    the_command = the_document;
+                    if (the_document.indexOf("<") >= 0) {
+                      //XML
+                      content_type = "text/xml";
+                    } else if (the_document.indexOf("{") >= 0) {
+                      //JSON
+                      content_type = "application/json";
+                    } //TODO: do we need to handle others?
+                  } else {
+                    //How to handle other?
+                  }
+
+                  //Handle the submission of the form in the case where we are not uploading a file
+                  if (doingFileUpload == false) {
+                    $.ajax(
+                        {
+                          url: document_url,
+                          //dataType : 'json',
+                          processData: false,
+                          type: 'POST',
+                          contentType: content_type,
+                          data: the_command,
+                          context: response_element,
+                          beforeSend: function (xhr, settings) {
+                            console.log("beforeSend: Vals: " + document_url + " content-type: " + document_type + " the cmd: " + the_command);
+
+                          },
+                          success: function (response, text_status, xhr) {
+                            console.log("success:  " + response + " status: " + text_status + " xhr: " + xhr.responseText);
+                            this.html('<div><span class="description">Status</span>: ' + text_status + '</div>'
+                                + '<div><span class="description">Response:</span>' + '<pre class="syntax language-json"><code>' + content_generator['json'](xhr.responseText) + "</code></pre></div>");
+                            result_element.show();
+                          },
+                          error: function (xhr, text_status, error_thrown) {
+                            console.log("error: " + text_status + " thrown: " + error_thrown);
+                            this.html('<div><span class="description">Status</span>: ' + text_status + '</div><div><span class="description">Error:</span> '
+                                + '' + error_thrown
+                                + '</div>'
+                                + '<div><span class="description">Error</span>:' + '<pre class="syntax language-json"><code>'
+                                + content_generator['json'](xhr.responseText) +
+                                '</code></pre></div>');
+                            result_element.show();
+                          },
+                          complete: function (xhr, text_status) {
+                            //console.log("complete: " + text_status + " xhr: " + xhr.responseText + " doc type: " + document_type);
+
+                            //alert(text_status + ": " + xhr.responseText);
+                            /*this
+                             .removeClass( 'loader' );*/
+                          }
+                        }
+                    );
+                  } else {
+                    //upload the file
+                    var the_file = $('#the-file', documents_form);
+                    var erh_params = $('#erh-params', documents_form).val();
+                    if (erh_params != "") {
+                      if (erh_params.substring(0,1) != "&"){
+                        erh_params = "&" + erh_params;
+                      }
+                      document_url = document_url + erh_params;
+                    }
+                    console.log("uploading file to: " + document_url);
+                    the_file.ajaxfileupload({
+                      'action': document_url,
+                      'validate_extensions': false,
+                      'upload_now': true,
+                      'params': {
+                        'extra': 'info'
+                      },
+                      'onComplete': function (response) {
+                        response = response.replace('<pre style="word-wrap: break-word; white-space: pre-wrap;">', "");
+                        response = response.replace("</pre>", "");
+                        console.log('completed upload: ' + response);
+                        response_element.html('<div><span class="description">Response:</span>' + '<pre class="syntax language-json"><code>' + content_generator['json'](response) + "</code></pre></div>");
+                        result_element.show();
+
+                      },
+                      'onStart': function () {
+                        console.log("starting file upload");
+                        //if (weWantedTo) return false; // cancels upload
+                      },
+                      'onCancel': function () {
+                        console.log('no file selected');
+                      }
+                    });
+                  }
+                  return false;
+                }
+            );
+          }
+      )
+    }
+)
+/*
+ Sample docs:
+ <doc boost="2.5">
+ <field name="id">05991</field>
+ <field name="title" boost="2.0">Bridgewater</field>
+ </doc>
+
+ {"id":"foo","title":"blah"}
+
+ */

solr/webapp/web/tpl/documents.html

@@ -0,0 +1,107 @@
+<!--
+/*
+* Licensed to the Apache Software Foundation (ASF) under one or more
+* contributor license agreements.  See the NOTICE file distributed with
+* this work for additional information regarding copyright ownership.
+* The ASF licenses this file to You under the Apache License, Version 2.0
+* (the "License"); you may not use this file except in compliance with
+* the License.  You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+-->
+
+<div id="documents" class="clearfix">
+  <div id="form">
+    <form action="#" method="post">
+      <label for="qt">
+        <a rel="help">Request-Handler (qt)</a>
+      </label>
+      <input type="text" id="qt" value="/update" title="Request handler in solrconfig.xml.">
+      <!-- TODO: Add support for uploading docs and a doc wizard -->
+      <label for="document-type">
+        <a rel="help">Document Type</a>
+      </label>
+
+      <div><select name="document-type" id="document-type" title="The type of the document field">
+        <!-- TODO: support the Builder -->
+        <option value="csv">CSV</option>
+        <option value="wizard">Document Builder</option>
+        <option value="upload">File Upload</option>
+        <option selected="true" value="json">JSON</option>
+        <option value="solr">Solr Command (raw XML or JSON)</option>
+        <option value="xml">XML</option>
+        <!-- TODO: If other, then, show a text box -->
+        <!--<option>Other</option>-->
+      </select></div>
+
+      <div id="document-container">
+        <div id="wizard">
+          <div id="wizard-fields">
+            <div><span class="description">Field</span>: <select id="wiz-field-select" name="wiz-field-select"></select>
+            </div>
+            <div><span id="wiz-field-data"><span class="description">Field Data</span>:</span> <textarea id="wizard-doc"
+                                                                                                         name="wizard-doc"
+                                                                                                         rows="10"
+                                                                                                         cols="40">Enter your field text here and then click "Add Field" to add the field to the document.</textarea></div>
+          </div>
+          <div id="wizard-add"><a id="add-field-href" href="#"><img border="0" src="./img/ico/plus-button.png"/>Add
+            Field</a></div>
+        </div>
+        <label for="document">
+          <a rel="help">Document(s)</a>
+        </label>
+        <textarea name="document" id="document" title="The Document" rows="10"
+                  cols="70">{"id":"change.me","title":"change.me"}</textarea>
+
+        <div id="file-upload">
+          <input type="file" id="the-file" name="the-file"/>
+        </div>
+      </div>
+
+      <div id="advanced">
+        <!-- TODO: only show for JSON/XML-->
+        <div id="attribs">
+          <div id="upload-only">
+            <label for="erh-params"><!-- TODO: cleaner way to do this? -->
+              <a rel="help">Extracting Req. Handler Params</a>
+            </label>
+            <input type="text" id="erh-params" value="&literal.id=change.me"
+                   title="Extracting Request Handler Parameters" size="50">
+          </div>
+          <div id="general-attribs">
+            <label for="commitWithin">
+              <a rel="help">Commit Within</a>
+            </label>
+            <input type="text" id="commitWithin" value="1000" title="Commit Within (ms)">
+            <label for="overwrite">
+              <a rel="help">Overwrite</a>
+            </label>
+            <input type="text" id="overwrite" value="true" title="Overwrite">
+          </div>
+          <!-- Boost is json only, since the XML has it embedded -->
+          <div id="json-only">
+            <label for="boost">
+              <a rel="help">Boost</a>
+            </label>
+            <input type="text" id="boost" value="1.0" title="Document Boost">
+          </div>
+        </div>
+      </div>
+
+      <button type="submit" id="submit">Submit Document</button>
+    </form>
+  </div>
+  <div id="result">
+    <div id="response">
+      <!--<iframe src="about:blank"></iframe>-->
+    </div>
+
+  </div>
+</div>