307 lines
13 KiB
HTML
307 lines
13 KiB
HTML
<div id="padding-container">
|
|
<div>
|
|
<div class="cor-loader" ng-show="currentStep == States.LOADING"></div>
|
|
<div class="page-content" ng-show="currentStep == States.CONFIG">
|
|
<div class="cor-title">
|
|
<span class="cor-title-link"></span>
|
|
<span class="cor-title-content">Red Hat Quay Setup</span>
|
|
</div>
|
|
|
|
<div class="co-main-content-panel" style="padding: 20px;">
|
|
<div class="co-alert alert alert-info">
|
|
<span class="cor-step-bar" progress="stepProgress">
|
|
<span class="cor-step" title="Configure Database" text="1"></span>
|
|
<span class="cor-step" title="Setup Database" icon="database"></span>
|
|
<span class="cor-step" title="Create Superuser" text="2"></span>
|
|
<span class="cor-step" title="Configure Registry" text="3"></span>
|
|
<span class="cor-step" title="Validate Configuration" text="4"></span>
|
|
<span class="cor-step" title="Setup Complete" icon="download"></span>
|
|
</span>
|
|
|
|
<div><strong>Almost done!</strong></div>
|
|
<div>Configure your Redis database and other settings below</div>
|
|
</div>
|
|
|
|
<div class="config-setup-tool" is-active="isStep(currentStep, States.CONFIG)"
|
|
configuration-saved="configurationSaved(config)"
|
|
setup-completed="setupCompleted()"
|
|
></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal message dialog -->
|
|
<div class="co-dialog modal fade initial-setup-modal" id="setupModal">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<!-- Header -->
|
|
<div class="modal-header">
|
|
<span class="cor-step-bar" progress="stepProgress">
|
|
<span class="cor-step" title="Configure Database" text="1"></span>
|
|
<span class="cor-step" title="Setup Database" icon="database"></span>
|
|
<span class="cor-step" title="Create Superuser" text="2"></span>
|
|
<span class="cor-step" title="Configure Registry" text="3"></span>
|
|
<span class="cor-step" title="Validate Configuration" text="4"></span>
|
|
<span class="cor-step" title="Setup Complete" icon="download"></span>
|
|
</span>
|
|
<h4 class="modal-title">Setup</h4>
|
|
</div>
|
|
|
|
<form id="superuserForm" name="superuserForm" ng-submit="createSuperUser()">
|
|
<!-- Content: CREATE_SUPERUSER or SUPERUSER_ERROR or CREATING_SUPERUSER -->
|
|
<div class="modal-body config-setup-tool-element" style="padding: 20px"
|
|
ng-show="isStep(currentStep, States.CREATE_SUPERUSER, States.SUPERUSER_ERROR, States.CREATING_SUPERUSER)">
|
|
<p>A superuser is the main administrator of your <span class="registry-name" is-short="true"></span>. Only superusers can edit configuration settings.</p>
|
|
|
|
<div class="form-group">
|
|
<label>Username</label>
|
|
<input class="form-control" type="text" ng-model="superUser.username"
|
|
ng-pattern="/^[a-z0-9_]{4,30}$/" required>
|
|
<div class="help-text">Minimum 4 characters in length</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Email address</label>
|
|
<input class="form-control" type="email" ng-model="superUser.email" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Password</label>
|
|
<input class="form-control" type="password" ng-model="superUser.password"
|
|
ng-pattern="/^[^\s]+$/"
|
|
ng-minlength="8" required>
|
|
<div class="help-text">Minimum 8 characters in length</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Repeat Password</label>
|
|
<input class="form-control" type="password" ng-model="superUser.repeatPassword"
|
|
match="superUser.password" required>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer: CREATE_SUPERUSER or SUPERUSER_ERROR -->
|
|
<div class="modal-footer"
|
|
ng-show="isStep(currentStep, States.CREATE_SUPERUSER, States.SUPERUSER_ERROR)">
|
|
<button type="submit" class="btn btn-primary" ng-disabled="!superuserForm.$valid">
|
|
Create Super User
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<!-- Content: DB_RESTARTING or CONFIG_RESTARTING -->
|
|
<div class="modal-body" style="padding: 20px;"
|
|
ng-show="isStep(currentStep, States.DB_RESTARTING, States.CONFIG_RESTARTING)">
|
|
<h4 style="margin-bottom: 20px;">
|
|
<i class="fa fa-lg fa-sync" style="margin-right: 10px;"></i>
|
|
<span class="registry-name"></span> is currently being restarted
|
|
</h4>
|
|
This can take several minutes. If the container does not restart on its own,
|
|
please re-execute the <code>docker run</code> command.
|
|
</div>
|
|
|
|
<!-- Content: READY -->
|
|
<div class="modal-body" style="padding: 20px;"
|
|
ng-show="isStep(currentStep, States.READY)">
|
|
<h4>Installation and setup of <span class="registry-name"></span> is complete</h4>
|
|
You can now invite users to join, create organizations and start pushing and pulling
|
|
repositories.
|
|
|
|
<strong ng-if="hasSSL" style="margin-top: 20px;">
|
|
Note: SSL is enabled. Please make sure to visit with
|
|
an <u>https</u> prefix
|
|
</strong>
|
|
</div>
|
|
|
|
<!-- Content: VALID_CONFIG -->
|
|
<div class="modal-body" style="padding: 20px;"
|
|
ng-show="isStep(currentStep, States.VALID_CONFIG)">
|
|
<h4>All configuration has been validated and saved</h4>
|
|
The container must be restarted to apply the configuration changes.
|
|
</div>
|
|
|
|
<!-- Content: DB_SETUP_SUCCESS -->
|
|
<div class="modal-body" style="padding: 20px;"
|
|
ng-show="isStep(currentStep, States.DB_SETUP_SUCCESS)">
|
|
<h4>The database has been setup and is ready</h4>
|
|
The container must be restarted to apply the configuration changes.
|
|
</div>
|
|
|
|
<!-- Content: DB_SETUP or DB_SETUP_ERROR -->
|
|
<div class="modal-body" style="padding: 20px;"
|
|
ng-show="isStep(currentStep, States.DB_SETUP, States.DB_SETUP_ERROR)">
|
|
<h4>
|
|
<i class="fa fa-lg fa-database" style="margin-right: 10px;"></i>
|
|
<span class="registry-name"></span> is currently setting up its database
|
|
schema
|
|
</h4>
|
|
This can take several minutes.
|
|
</div>
|
|
|
|
<!-- Content: CONFIG_DB or DB_ERROR or VALIDATING_DB or SAVING_DB -->
|
|
<div class="modal-body validate-database config-setup-tool-element"
|
|
ng-show="isStep(currentStep, States.CONFIG_DB, States.DB_ERROR, States.VALIDATING_DB, States.SAVING_DB)">
|
|
<p>
|
|
Please enter the connection details for your <strong>empty</strong> database. The schema will be created in the following step.</p>
|
|
</p>
|
|
|
|
<div class="config-parsed-field" binding="databaseUri"
|
|
parser="parseDbUri(value)"
|
|
serializer="serializeDbUri(fields)">
|
|
<table class="config-table">
|
|
<tr>
|
|
<td class="non-input">Database Type:</td>
|
|
<td>
|
|
<select ng-model="fields.kind">
|
|
<option value="mysql+pymysql">MySQL</option>
|
|
<option value="postgresql">Postgres</option>
|
|
</select>
|
|
</td>
|
|
</tr>
|
|
<tr ng-show="fields.kind">
|
|
<td>Database Server:</td>
|
|
<td>
|
|
<span class="config-string-field" binding="fields.server"
|
|
placeholder="dbserverhost"
|
|
pattern="{{ HOSTNAME_REGEX }}"
|
|
validator="validateHostname(value)">></span>
|
|
<div class="help-text">
|
|
The server (and optionally, custom port) where the database lives
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr ng-show="fields.kind">
|
|
<td>Username:</td>
|
|
<td>
|
|
<span class="config-string-field" binding="fields.username"
|
|
placeholder="someuser"></span>
|
|
<div class="help-text">This user must have <strong>full access</strong> to the database</div>
|
|
</td>
|
|
</tr>
|
|
<tr ng-show="fields.kind">
|
|
<td>Password:</td>
|
|
<td>
|
|
<input class="form-control" type="password" ng-model="fields.password"></span>
|
|
</td>
|
|
</tr>
|
|
<tr ng-show="fields.kind">
|
|
<td>Database Name:</td>
|
|
<td>
|
|
<span class="config-string-field" binding="fields.database"
|
|
placeholder="registry-database"></span>
|
|
</td>
|
|
</tr>
|
|
<tr ng-show="fields.kind">
|
|
<td>SSL Certificate:</td>
|
|
<td>
|
|
<span class="config-file-field" filename="database.pem"
|
|
skip-check-file="true" has-file="currentState.hasDatabaseSSLCert"></span>
|
|
<div class="help-text">Optional SSL certicate (in PEM format) to use to connect to the database</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer: CREATING_SUPERUSER -->
|
|
<div class="modal-footer working" ng-show="isStep(currentStep, States.CREATING_SUPERUSER)">
|
|
<span class="cor-loader-inline"></span> Creating superuser...
|
|
</div>
|
|
|
|
<!-- Footer: SUPERUSER_ERROR -->
|
|
<div class="modal-footer alert alert-danger"
|
|
ng-show="isStep(currentStep, States.SUPERUSER_ERROR)">
|
|
{{ errors.SuperuserCreationError }}
|
|
</div>
|
|
|
|
<!-- Footer: DB_SETUP_ERROR -->
|
|
<div class="modal-footer alert alert-danger"
|
|
ng-show="isStep(currentStep, States.DB_SETUP_ERROR)">
|
|
Database Setup Failed: {{ errors.DatabaseSetupError }}
|
|
</div>
|
|
|
|
<!-- Footer: DB_ERROR -->
|
|
<div class="modal-footer alert alert-danger" ng-show="isStep(currentStep, States.DB_ERROR)">
|
|
Database Validation Issue: {{ errors.DatabaseValidationError }}
|
|
</div>
|
|
|
|
<!-- Footer: CONFIG_DB or DB_ERROR -->
|
|
<div class="modal-footer"
|
|
ng-show="isStep(currentStep, States.CONFIG_DB, States.DB_ERROR)">
|
|
<span class="left-align" ng-show="isStep(currentStep, States.DB_ERROR)">
|
|
<i class="fa fa-warning"></i>
|
|
Problem Detected
|
|
</span>
|
|
|
|
<button type="submit" class="btn btn-primary"
|
|
ng-disabled="!databaseUri"
|
|
ng-click="validateDatabase()">
|
|
Validate Database Settings
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Footer: READY -->
|
|
<div class="modal-footer"
|
|
ng-show="isStep(currentStep, States.READY)">
|
|
<span class="left-align">
|
|
<i class="fa fa-check"></i>
|
|
Installation Complete!
|
|
</span>
|
|
|
|
<a ng-click="showSuperuserPanel()" class="btn btn-primary">
|
|
View Superuser Panel
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Footer: VALID_CONFIG -->
|
|
<div class="modal-footer"
|
|
ng-show="isStep(currentStep, States.VALID_CONFIG)">
|
|
<span class="left-align">
|
|
<i class="fa fa-check"></i>
|
|
Configuration Validated and Saved
|
|
</span>
|
|
|
|
<button type="submit" class="btn btn-primary"
|
|
ng-click="restartContainer(States.CONFIG_RESTARTING)">
|
|
Restart Container
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Footer: DB_SETUP_SUCCESS -->
|
|
<div class="modal-footer"
|
|
ng-show="isStep(currentStep, States.DB_SETUP_SUCCESS)">
|
|
<span class="left-align">
|
|
<i class="fa fa-check"></i>
|
|
Database Setup and Ready
|
|
</span>
|
|
|
|
<button type="submit" class="btn btn-primary"
|
|
ng-click="restartContainer(States.DB_RESTARTING)">
|
|
Restart Container
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Footer: DB_SETUP -->
|
|
<div class="modal-footer working" ng-show="isStep(currentStep, States.DB_SETUP)">
|
|
<span class="cor-loader-inline"></span> Setting up database...
|
|
</div>
|
|
|
|
<!-- Footer: SAVING_DB -->
|
|
<div class="modal-footer working" ng-show="isStep(currentStep, States.SAVING_DB)">
|
|
<span class="cor-loader-inline"></span> Saving database configuration...
|
|
</div>
|
|
|
|
<!-- Footer: VALIDATING_DB -->
|
|
<div class="modal-footer working" ng-show="isStep(currentStep, States.VALIDATING_DB)">
|
|
<span class="cor-loader-inline"></span> Testing database settings...
|
|
</div>
|
|
|
|
<!-- Footer: DB_RESTARTING or CONFIG_RESTARTING-->
|
|
<div class="modal-footer working"
|
|
ng-show="isStep(currentStep, States.DB_RESTARTING, States.CONFIG_RESTARTING)">
|
|
<span class="cor-loader-inline"></span> Waiting for container to restart...
|
|
</div>
|
|
</div><!-- /.modal-content -->
|
|
</div><!-- /.modal-dialog -->
|
|
</div><!-- /.modal -->
|
|
</div>
|