Add postinstall message to app view

This commit is contained in:
Johannes Zellner
2019-09-19 22:49:21 +02:00
parent 7825d10f18
commit ab5edbdd41
2 changed files with 62 additions and 12 deletions

View File

@@ -31,6 +31,38 @@
}
</script>
<!-- Modal postinstall confirm -->
<div class="modal fade" id="postInstallConfirmModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<img ng-src="{{app.iconUrl}}" onerror="this.onerror=null;this.src='img/appicon_fallback.png'" class="app-info-icon"/>
<h5 class="app-info-title">
{{ app.manifest.title }}
<span class="app-info-meta text-small">Package <a ng-href="/#/appstore/{{ app.manifest.id }}?version={{ app.manifest.version }}">v{{ app.manifest.version }}</a> </span>
<br/>
<span ng-show="app.manifest.documentationUrl"><a target="_blank" ng-href="{{ app.manifest.documentationUrl }}">Documentation</a> </span>
<br/>
</h5>
</div>
<div class="modal-body">
<div ng-bind-html="app.manifest.postInstallMessage | postInstallMessage:app | markdown2html"></div>
<div ng-show="app.manifest.documentationUrl">
Please see the <a target="_blank" ng-href="{{ app.manifest.documentationUrl }}">documentation</a> for more information.
</div>
</div>
<div class="modal-footer">
<div class="form-group pull-left">
<input type="checkbox" id="postInstallConfirmCheckbox" ng-model="postInstallConfirm.confirmed">
<label class="control-label" for="postInstallConfirmCheckbox">Acknowledge instructions</label>
</div>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<a class="btn btn-success" ng-href="{{ postInstallConfirm.confirmed ? ('https://' + app.fqdn) : '' }}" target="_blank" ng-disabled="!postInstallConfirm.confirmed" ng-click="postInstallConfirm.submit()"><i class="fas fa-external-link-alt"></i> Open App</a>
</div>
</div>
</div>
</div>
<!-- Modal uninstall app -->
<div class="modal fade" id="uninstallModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
@@ -149,7 +181,7 @@
<div class="col-md-8">
<h1 style="line-height: 0.7;">
{{ app.label || app.fqdn }}
<a class="btn btn-sm btn-outline btn-primary pull-right" ng-href="{{ app | applicationLink }}" target="_blank" ng-disabled="!(app | appIsInstalledAndHealthy)"><i class="fas fa-external-link-alt"></i> Open App</a>
<a class="btn btn-sm btn-outline btn-primary pull-right" ng-href="{{ app | applicationLink }}" target="_blank" ng-disabled="!(app | appIsInstalledAndHealthy)" ng-click="user.admin && ((app | installError) === true && setView('debug')) || ((app | appIsInstalledAndHealthy) && app.pendingPostInstallConfirmation && postInstallConfirm.show())"><i class="fas fa-external-link-alt"></i> Open App</a>
<a class="btn btn-sm btn-outline btn-primary pull-right" ng-href="{{ app.manifest.documentationUrl }}" target="_blank">Documentation</a>
<br/>
<span class="text-small">
@@ -518,6 +550,12 @@
<label class="control-label">Create Backup</label>
<p>This creates a snapshot of the app. You can use this snapshot to restore or clone this app.</p>
<button type="button" class="btn btn-primary pull-right" ng-click="backups.createBackup()" ng-disabled="app.taskId"><i class="fa fa-circle-notch fa-spin" ng-show="app.installationState === 'pending_backup'"></i> Create Backup</button>
<div ng-show="app.installationState === 'pending_backup'">
<div class="progress progress-striped active animateMe" style="margin-bottom: 10px;">
<div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ app.progress }}%"></div>
</div>
<div><center>{{ app.message }}</center></div>
</div>
</div>
</div>
<hr/>
@@ -567,17 +605,6 @@
<button class="btn btn-primary pull-right" ng-class="{ 'btn-danger': backups.enableBackup }" ng-click="backups.toggleAutomaticBackups()" ng-disabled="backups.busy"><i class="fa fa-circle-notch fa-spin" ng-show="backups.busy"></i> {{ backups.enableBackup ? 'Disable' : 'Enable' }} Automatic Daily Backups</button>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<div ng-show="app.installationState === 'pending_backup'">
<div class="progress progress-striped active animateMe" style="margin-bottom: 10px;">
<div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ app.progress }}%"></div>
</div>
<div><center>{{ app.message }}</center></div>
</div>
</div>
</div>
</div>
<div class="card" ng-show="view === 'debug'">