src/third_party/WebKit/Source/devtools/front_end/resources/DatabaseQueryView.js

   1 /*
   2  * Copyright (C) 2008 Apple Inc. All Rights Reserved.
   3  *
   4  * Redistribution and use in source and binary forms, with or without
   5  * modification, are permitted provided that the following conditions
   6  * are met:
   7  * 1. Redistributions of source code must retain the above copyright
   8  *    notice, this list of conditions and the following disclaimer.
   9  * 2. Redistributions in binary form must reproduce the above copyright
  10  *    notice, this list of conditions and the following disclaimer in the
  11  *    documentation and/or other materials provided with the distribution.
  12  *
  13  * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
  14  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  15  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
  16  * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
  17  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
  18  * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
  19  * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
  20  * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
  21  * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  22  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  23  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  24  */
  25
  26 /**
  27  * @constructor
  28  * @extends {WebInspector.VBox}
  29  */
  30 WebInspector.DatabaseQueryView = function(database)
  31 {
  32     WebInspector.VBox.call(this);
  33
  34     this.database = database;
  35
  36     this.element.classList.add("storage-view");
  37     this.element.classList.add("query");
  38     this.element.classList.add("monospace");
  39     this.element.addEventListener("selectstart", this._selectStart.bind(this), false);
  40
  41     this._promptElement = createElement("div");
  42     this._promptElement.className = "database-query-prompt";
  43     this._promptElement.appendChild(createElement("br"));
  44     this._promptElement.addEventListener("keydown", this._promptKeyDown.bind(this), true);
  45     this.element.appendChild(this._promptElement);
  46
  47     this._prompt = new WebInspector.TextPromptWithHistory(this.completions.bind(this), " ");
  48     this._prompt.attach(this._promptElement);
  49
  50     this.element.addEventListener("click", this._messagesClicked.bind(this), true);
  51 }
  52
  53 WebInspector.DatabaseQueryView.Events = {
  54     SchemaUpdated: "SchemaUpdated"
  55 }
  56
  57 WebInspector.DatabaseQueryView.prototype = {
  58     _messagesClicked: function()
  59     {
  60         if (!this._prompt.isCaretInsidePrompt() && window.getSelection().isCollapsed)
  61             this._prompt.moveCaretToEndOfPrompt();
  62     },
  63
  64     /**
  65      * @param {!Element} proxyElement
  66      * @param {!Range} wordRange
  67      * @param {boolean} force
  68      * @param {function(!Array.<string>, number=)} completionsReadyCallback
  69      */
  70     completions: function(proxyElement, wordRange, force, completionsReadyCallback)
  71     {
  72         var prefix = wordRange.toString().toLowerCase();
  73         if (!prefix)
  74             return;
  75         var results = [];
  76
  77         function accumulateMatches(textArray)
  78         {
  79             for (var i = 0; i < textArray.length; ++i) {
  80                 var text = textArray[i].toLowerCase();
  81                 if (text.length < prefix.length)
  82                     continue;
  83                 if (!text.startsWith(prefix))
  84                     continue;
  85                 results.push(textArray[i]);
  86             }
  87         }
  88
  89         function tableNamesCallback(tableNames)
  90         {
  91             accumulateMatches(tableNames.map(function(name) { return name + " " }));
  92             accumulateMatches(["SELECT ", "FROM ", "WHERE ", "LIMIT ", "DELETE FROM ", "CREATE ", "DROP ", "TABLE ", "INDEX ", "UPDATE ", "INSERT INTO ", "VALUES ("]);
  93
  94             completionsReadyCallback(results);
  95         }
  96         this.database.getTableNames(tableNamesCallback);
  97     },
  98
  99     _selectStart: function(event)
 100     {
 101         if (this._selectionTimeout)
 102             clearTimeout(this._selectionTimeout);
 103
 104         this._prompt.clearAutoComplete();
 105
 106         /**
 107          * @this {WebInspector.DatabaseQueryView}
 108          */
 109         function moveBackIfOutside()
 110         {
 111             delete this._selectionTimeout;
 112             if (!this._prompt.isCaretInsidePrompt() && window.getSelection().isCollapsed)
 113                 this._prompt.moveCaretToEndOfPrompt();
 114             this._prompt.autoCompleteSoon();
 115         }
 116
 117         this._selectionTimeout = setTimeout(moveBackIfOutside.bind(this), 100);
 118     },
 119
 120     _promptKeyDown: function(event)
 121     {
 122         if (isEnterKey(event)) {
 123             this._enterKeyPressed(event);
 124             return;
 125         }
 126     },
 127
 128     _enterKeyPressed: function(event)
 129     {
 130         event.consume(true);
 131
 132         this._prompt.clearAutoComplete(true);
 133
 134         var query = this._prompt.text;
 135         if (!query.length)
 136             return;
 137
 138         this._prompt.pushHistoryItem(query);
 139         this._prompt.text = "";
 140
 141         this.database.executeSql(query, this._queryFinished.bind(this, query), this._queryError.bind(this, query));
 142     },
 143
 144     _queryFinished: function(query, columnNames, values)
 145     {
 146         var dataGrid = WebInspector.SortableDataGrid.create(columnNames, values);
 147         var trimmedQuery = query.trim();
 148
 149         if (dataGrid) {
 150             dataGrid.renderInline();
 151             this._appendViewQueryResult(trimmedQuery, dataGrid);
 152             dataGrid.autoSizeColumns(5);
 153         }
 154
 155         if (trimmedQuery.match(/^create /i) || trimmedQuery.match(/^drop table /i))
 156             this.dispatchEventToListeners(WebInspector.DatabaseQueryView.Events.SchemaUpdated, this.database);
 157     },
 158
 159     _queryError: function(query, errorMessage)
 160     {
 161         this._appendErrorQueryResult(query, errorMessage);
 162     },
 163
 164     /**
 165      * @param {string} query
 166      * @param {!WebInspector.View} view
 167      */
 168     _appendViewQueryResult: function(query, view)
 169     {
 170         var resultElement = this._appendQueryResult(query);
 171         view.show(resultElement);
 172
 173         this._promptElement.scrollIntoView(false);
 174     },
 175
 176     /**
 177      * @param {string} query
 178      * @param {string} errorText
 179      */
 180     _appendErrorQueryResult: function(query, errorText)
 181     {
 182         var resultElement = this._appendQueryResult(query);
 183         resultElement.classList.add("error")
 184         resultElement.textContent = errorText;
 185
 186         this._promptElement.scrollIntoView(false);
 187     },
 188
 189     _appendQueryResult: function(query)
 190     {
 191         var element = createElement("div");
 192         element.className = "database-user-query";
 193         this.element.insertBefore(element, this._prompt.proxyElement);
 194
 195         var commandTextElement = createElement("span");
 196         commandTextElement.className = "database-query-text";
 197         commandTextElement.textContent = query;
 198         element.appendChild(commandTextElement);
 199
 200         var resultElement = createElement("div");
 201         resultElement.className = "database-query-result";
 202         element.appendChild(resultElement);
 203         return resultElement;
 204     },
 205
 206     __proto__: WebInspector.VBox.prototype
 207 }