Refactor program configuration modal: move optional position offsets to collapsible advanced options section

This commit is contained in:
tim000x3 2025-04-18 06:35:17 -04:00
parent 158a9028f8
commit 283b48b751

View File

@ -22,22 +22,6 @@
<input class="form-control form-control-sm" type="text" ng-model="program.subtitle"></input>
<label>Summary</label>
<textarea class="form-control form-control-sm" ng-model="program.summary"></textarea>
<label>Start Position Offset (optional)</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="seekPositionTime" placeholder="Min:Sec (leave blank for start of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 5:30)</small>
</div>
</div>
<label>End Position Offset (optional)
<span class="text-danger pull-right">{{error.endPosition}}</span>
</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="endPositionTime" placeholder="Min:Sec (leave blank for end of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 10:45)</small>
</div>
</div>
<label>Rating</label>
<input class="form-control form-control-sm" type="text" ng-model="program.rating"></input>
<label>Icon</label>
@ -46,6 +30,32 @@
<div class="text-center">
<img class="img" ng-src="{{program.icon}}" style="max-width: 200px;"></img>
</div>
<div class="card mt-3">
<div class="card-header" ng-click="trackAdvancedOpen = !trackAdvancedOpen" style="cursor: pointer;">
<h6 class="mb-0">Advanced Options <i class="float-right" ng-class="{'fa fa-chevron-down': !trackAdvancedOpen, 'fa fa-chevron-up': trackAdvancedOpen}"></i></h6>
</div>
<div class="collapse" ng-class="{'show': trackAdvancedOpen}">
<div class="card-body">
<label>Start Position Offset (optional)</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="seekPositionTime" placeholder="Min:Sec (leave blank for start of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 5:30)</small>
</div>
</div>
<label>End Position Offset (optional)
<span class="text-danger pull-right">{{error.endPosition}}</span>
</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="endPositionTime" placeholder="Min:Sec (leave blank for end of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 10:45)</small>
</div>
</div>
</div>
</div>
</div>
</div>
<div ng-if="program.type === 'movie'">
<label>Movie Title
@ -56,22 +66,6 @@
<input class="form-control form-control-sm" type="text" ng-model="program.subtitle"></input>
<label>Summary</label>
<textarea class="form-control form-control-sm" ng-model="program.summary"></textarea>
<label>Start Position Offset (optional)</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="seekPositionTime" placeholder="Min:Sec (leave blank for start of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 5:30)</small>
</div>
</div>
<label>End Position Offset (optional)
<span class="text-danger pull-right">{{error.endPosition}}</span>
</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="endPositionTime" placeholder="Min:Sec (leave blank for end of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 10:45)</small>
</div>
</div>
<label>Rating</label>
<input class="form-control form-control-sm" type="text" ng-model="program.rating"></input>
<label>Icon</label>
@ -80,6 +74,32 @@
<div class="text-center">
<img class="img" ng-src="{{program.icon}}" style="max-width: 200px;"></img>
</div>
<div class="card mt-3">
<div class="card-header" ng-click="movieAdvancedOpen = !movieAdvancedOpen" style="cursor: pointer;">
<h6 class="mb-0">Advanced Options <i class="float-right" ng-class="{'fa fa-chevron-down': !movieAdvancedOpen, 'fa fa-chevron-up': movieAdvancedOpen}"></i></h6>
</div>
<div class="collapse" ng-class="{'show': movieAdvancedOpen}">
<div class="card-body">
<label>Start Position Offset (optional)</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="seekPositionTime" placeholder="Min:Sec (leave blank for start of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 5:30)</small>
</div>
</div>
<label>End Position Offset (optional)
<span class="text-danger pull-right">{{error.endPosition}}</span>
</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="endPositionTime" placeholder="Min:Sec (leave blank for end of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 10:45)</small>
</div>
</div>
</div>
</div>
</div>
</div>
<div ng-if="program.type === 'episode'">
<label>Show Title
@ -100,22 +120,6 @@
<input class="form-control form-control-sm" type="number" ng-model="program.episode"></input>
<label>Summary</label>
<textarea class="form-control form-control-sm" ng-model="program.summary"></textarea>
<label>Start Position Offset (optional)</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="seekPositionTime" placeholder="Min:Sec (leave blank for start of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 5:30)</small>
</div>
</div>
<label>End Position Offset (optional)
<span class="text-danger pull-right">{{error.endPosition}}</span>
</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="endPositionTime" placeholder="Min:Sec (leave blank for end of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 10:45)</small>
</div>
</div>
<label>Rating</label>
<input class="form-control form-control-sm" type="text" ng-model="program.rating"></input>
<label>Icon</label>
@ -142,6 +146,32 @@
</div>
</div>
</div>
<div class="card mt-3">
<div class="card-header" ng-click="episodeAdvancedOpen = !episodeAdvancedOpen" style="cursor: pointer;">
<h6 class="mb-0">Advanced Options <i class="float-right" ng-class="{'fa fa-chevron-down': !episodeAdvancedOpen, 'fa fa-chevron-up': episodeAdvancedOpen}"></i></h6>
</div>
<div class="collapse" ng-class="{'show': episodeAdvancedOpen}">
<div class="card-body">
<label>Start Position Offset (optional)</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="seekPositionTime" placeholder="Min:Sec (leave blank for start of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 5:30)</small>
</div>
</div>
<label>End Position Offset (optional)
<span class="text-danger pull-right">{{error.endPosition}}</span>
</label>
<div class="form-row mb-3">
<div class="col">
<input class="form-control form-control-sm" type="text" ng-model="endPositionTime" placeholder="Min:Sec (leave blank for end of file)">
<small class="form-text text-muted">Format: minutes:seconds (e.g. 10:45)</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">