RandomSec/extensions/database/module/scripts/index/database-import-form.html
Antoine Beaubien 356c7636d8
Only show the database login fields when necessary (#2615)
* DB login fields visibility controled by CSS

The database login field’s visibility is now controled by CSS styling.

* Change field name from Database to Database file.

Change field name from Database to Database file.

* Use full db name as CSS classes

Use full db name instead of diminutives for the CSS classes.

* Added translation to placeholders

Added translation to the Input placeholders.

* Undo a change, remerge Database field & File

remerge Database field and DatabaseFile Field like before.

* Created DatabaseSourceUI._updateDatabaseType(dbType)

Created Refine.DatabaseSourceUI.prototype._updateDatabaseType(databaseType)

* Make MySQL the default database

<option value="mysql" selected="selected"">MySQL</option>

* Update database-import-form.html

Fixed typo. (<option value="mysql" selected="selected">MySQL</option>)

* New default connection name value

New default connection name value, translation of it, changing cssClassName from options to dbtype-options, adding the prefix "dbt-" to the db types and fix the changing of placeholder databaseName/databaseFileName when neccessary.

* Fix issue with « saved connections »

Fix issue with « saved connections » and added 2 defaults values for dbHost and dbType.

* Default DB back to MySQL.

<option value="mysql" selected="selected">MySQL</option>

* Update extensions/database/module/langs/translation-en.json

Co-authored-by: Thad Guidry <thadguidry@gmail.com>

* Better default with « mysql »

* Fix sqlite #databaseHost before calling self._updateDatabaseType()

Fix $( "#databaseHost" ).val(self._defaultDatabaseHost) to be set before calling self._updateDatabaseType(self._defaultDatabaseType) that may change it.

* Removed field name & fixed default connection name

Removed field name text since it's populated from i18n and fixed the default connection name so that it has no space in it.

* Little update to placeholder text

Co-authored-by: Thad Guidry <thadguidry@gmail.com>
2020-05-30 09:20:05 +01:00

144 lines
10 KiB
HTML

<div bind="databasePanel" class="database-container">
<div id = "databaseLayoutDiv" class="grid-layout layout-div">
<div class="pure-g">
<div class="pure-u-1-5">
<div class="pure-u-1"><button type="button" id="newConnectionButtonDiv" bind="newConnectionButton" class="pure-button pure-button-primary">New Connection</button></div>
<div class="pure-u-1-2" style="border-bottom: 1px dashed; border-color:lightgrey; margin-top:1px; padding-right:1px;"></div>
<div class="pure-u-1 sidebarDiv" bind="sidebarDiv">
<div class="pure-menu pure-menu-scrollable custom-restricted">
<span class="pure-menu-heading" id="savedConnectionSpan">Saved Connections</span>
<ul class="pure-menu-list" bind="menuListUl" id="menuListUl"></ul>
</div>
</div>
</div>
<div class="connection-div-layout pure-u-4-5">
<div id = "newConnectionDiv" class="new-connection-div " bind="newConnectionDiv">
<!-- <div class="panel panel-info"> -->
<form class="pure-form pure-form-aligned">
<fieldset class="new-connection-fieldset">
<!-- <div class="pure-control-group" style="border-bottom: 1px solid gray;">New Connection Editor </div> -->
<legend class="new-connection-legend pure-input-1-2">New Connection Editor</legend>
<div class="pure-control-group">
<label id="connectionNameLabel" for="name"></label>
<input bind="connectionNameInput" id="connectionName" type="text" placeholder="" value="" class="pure-input-1-3" required>
</div>
<div class="pure-control-group">
<label id="databaseTypeLabel" for="databaseType"></label>
<select name="selection" id="databaseTypeSelect" bind="databaseTypeSelect" class="pure-input-1-3" required>
<option value="postgresql">PostgreSQL</option>
<option value="mysql" selected="selected">MySQL</option>
<option value="mariadb">MariaDB</option>
<option value="sqlite">SQLite</option>
</select>
</div>
<div class="pure-control-group dbtype-options dbt-postgresql dbt-mysql dbt-mariadb">
<label id="databaseHostLabel" for="databaseHost"></label>
<input bind="databaseHostInput" id="databaseHost" type="text" placeholder="" value="localhost" class="pure-input-1-3" required>
</div>
<div class="pure-control-group dbtype-options dbt-postgresql dbt-mysql dbt-mariadb">
<label id="databasePortLabel" for="databasePort"></label>
<input bind="databasePortInput" id="databasePort" type="text" placeholder="" value="5432" class="pure-input-1-3" required>
</div>
<div class="pure-control-group dbtype-options dbt-postgresql dbt-mysql dbt-mariadb">
<label id="databaseUserLabel" for="databaseUser"></label>
<input bind="databaseUserInput" id="databaseUser" type="text" placeholder="" value="postgres" class="pure-input-1-3" required>
</div>
<div class="pure-control-group dbtype-options dbt-postgresql dbt-mysql dbt-mariadb">
<label id="databasePasswordLabel" for="databasePassword"></label>
<input bind="databasePasswordInput" id="databasePassword" type="password" placeholder="" class="pure-input-1-3" required>
</div>
<div class="pure-control-group dbtype-options dbt-postgresql dbt-mysql dbt-mariadb dbt-sqlite">
<label id="databaseNameLabel" for="initialDatabase"></label>
<input bind="initialDatabaseInput" id="initialDatabase" type="text" placeholder="" class="pure-input-1-3" required>
</div>
<div class="pure-control-group dbtype-options">
<label id="databaseSchemaLabel" for="initialSchema"></label>
<input bind="initialSchemaInput" id="initialSchema" type="text" placeholder="" class="pure-input-1-3" required>
</div>
<div class="pure-controls" id="newConnectionControlDiv">
<button type="button" id="databaseTestButton" bind="testDatabaseButton" class="pure-button pure-button-primary"><span>Test</span></button>
<button type="button" id="databaseSaveButton" bind="saveConnectionButton" class="button-success pure-button">Save</button>
<button type="button" id="databaseConnectButton" bind="databaseConnectButton" class="button-secondary pure-button">Connect</button>
</div>
<div class="pure-controls" id="editConnectionControlDiv" style="display: none;">
<button type="button" id="connectionEditButton" bind="editConnectionButton" class="pure-button pure-button-primary"><span>Edit</span></button>
<button type="button" id="connectionEditCancelButton" bind="cancelEditConnectionButton" class="pure-button">Cancel</button>
</div>
</fieldset>
</form>
<!-- </div> --> <!--End Panel Div -->
</div><!--End NewConnectionDiv -->
<div class="sql-editor-div grid-layout" bind="sqlEditorDiv" id="sqlEditorDiv" style="display: none;" >
<form class="pure-form pure-form-stacked">
<input type="hidden" id="currentConnectionNameInput" name="currentConnectionName">
<input type="hidden" id="currentDatabaseTypeInput" name="currentDatabaseType">
<input type="hidden" id="currentDatabaseUserInput" name="currentDatabaseUser">
<input type="hidden" id="currentDatabasePasswordInput" name="currentDatabasePassword">
<input type="hidden" id="currentDatabaseHostInput" name="currentDatabaseHost">
<input type="hidden" id="currentDatabasePortInput" name="currentDatabasePort">
<input type="hidden" id="currentInitialDatabaseInput" name="currentInitialDatabase">
<div class="panel panel-info pure-input-3-4">
<div class="panel-heading">Query Editor </div>
<div class="panel-body">
<fieldset style="padding:2px; margin-top:5px;">
<textarea id="queryTextArea" bind="queryTextArea" class="pure-input-1 no-resize" placeholder="Enter your query" rows="10" >SELECT * FROM</textarea>
</fieldset>
<div class="alert alert-info" id="connectionParameterSpan"></div>
<!-- <select name="querySelect" id="queryHistorySelect" bind="queryHistorySelect" class="pure-input-1" style="padding-bottom:2px;">
<option value="1">Query History</option>
</select> -->
</div>
<div class="panel-footer">
<div class="pure-controls pure-input-1-2">
<button type="button" id="executeQueryBtn" bind="executeQueryButton" class="button-secondary pure-button">Preview Query Result</button>
<!-- <button type="button" bind="saveQueryButton" class="button-success pure-button">Save Query</button> -->
</div>
</div>
</div>
<!--
<div class="panel panel-info pure-input-1-2">
<div class="panel-heading">Saved Queries</div>
<div class="panel-body">
<div class="queryResultDiv pure-input-1 scrollable" bind="queryResultDiv" id="queryResultDiv" style="<!padding:2px; margin-top:5px;"> </div>
</div>
</div>
-->
</form>
</div><!-- End Sql Editor Div-->
</div>
</div> <!-- End pure-g -->
</div> <!-- End databaseLayoutDiv -->
</div><!-- End databaseContainer -->