mirror of
https://github.com/turt2live/matrix-dimension.git
synced 2024-10-01 01:05:53 -04:00
9ff1443878
Creating and editing widgets is now done against the `dimension` object on a widget. This special object is used to translate the widget between the dirty and persisted states.
66 lines
3.5 KiB
HTML
66 lines
3.5 KiB
HTML
<div class="config-wrapper">
|
|
<img src="/img/close.svg" (click)="dialog.close()" class="close-icon">
|
|
<div class="config-header">
|
|
<img [src]="integration.avatar">
|
|
<h4>Configure video widgets</h4>
|
|
</div>
|
|
<div class="config-content" *ngIf="isLoading">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<p><i class="fa fa-circle-notch fa-spin"></i> Loading widgets...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="config-content" *ngIf="!isLoading">
|
|
<form (submit)="validateAndAddWidget()" novalidate name="addForm">
|
|
<div class="row">
|
|
<div class="col-md-8" style="margin-bottom: 12px;">
|
|
<div class="input-group input-group-sm">
|
|
<input type="text" class="form-control"
|
|
placeholder="YouTube, Vimeo, or DailyMotion video URL"
|
|
[(ngModel)]="newWidget.dimension.newUrl" name="newWidgetUrl"
|
|
[disabled]="isUpdating">
|
|
<span class="input-group-btn">
|
|
<button type="submit" class="btn btn-success" [disabled]="isUpdating">
|
|
<i class="fa fa-plus-circle"></i> Add Widget
|
|
</button>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12 removable widget-item" *ngFor="let widget of widgets trackById">
|
|
{{ widget.name || widget.url }} <span class="text-muted" *ngIf="widget.ownerId">(added by {{ widget.ownerId }})</span>
|
|
<button type="button" class="btn btn-outline-info btn-sm" (click)="editWidget(widget)"
|
|
style="margin-top: -5px;" [disabled]="isUpdating">
|
|
<i class="fa fa-pencil"></i> Edit Widget
|
|
</button>
|
|
<button type="button" class="btn btn-sm btn-outline-danger" (click)="removeWidget(widget)"
|
|
style="margin-top: -5px;" [disabled]="isUpdating">
|
|
<i class="fa fa-times"></i> Remove Widget
|
|
</button>
|
|
<div *ngIf="isWidgetToggled(widget)">
|
|
<label>
|
|
Widget Name
|
|
<input type="text" class="form-control"
|
|
placeholder="YouTube Widget"
|
|
[(ngModel)]="widget.dimension.newName" name="widget-name-{{widget.id}}"
|
|
[disabled]="isUpdating">
|
|
</label>
|
|
<label>
|
|
Video URL
|
|
<input type="text" class="form-control"
|
|
placeholder="YouTube, Vimeo, or DailyMotion video URL"
|
|
[(ngModel)]="widget.dimension.newUrl" name="widget-url-{{widget.id}}"
|
|
[disabled]="isUpdating">
|
|
</label>
|
|
<button type="button" class="btn btn-primary btn-sm" (click)="validateAndSaveWidget(widget)">
|
|
Save
|
|
</button>
|
|
<button type="button" class="btn btn-outline btn-sm" (click)="toggleWidget(widget)">
|
|
Cancel
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div> |