Fix edit widget button

This commit is contained in:
Travis Ralston 2017-12-22 21:42:43 -07:00
parent dd02c6df2c
commit 63a3b6b4c2
5 changed files with 76 additions and 66 deletions

View File

@ -1,58 +1,64 @@
<my-ibox title="Add {{ defaultName }}"> <div *ngIf="isLoading">
<div class="my-ibox-content"> <my-spinner></my-spinner>
<form (submit)="addWidget()" novalidate name="addForm"> </div>
<label class="label-block">
Widget Name
<input type="text" class="form-control"
placeholder="{{ defaultName }}"
[(ngModel)]="newWidget.dimension.newName" name="widget-name-new"
[disabled]="isUpdating"/>
</label>
<label class="label-block">
Widget URL
<input type="text" class="form-control"
placeholder="https://matrix.org"
[(ngModel)]="newWidget.dimension.newUrl" name="widget-url-new"
[disabled]="isUpdating"/>
</label>
<button type="submit" class="btn btn-sm btn-success" [disabled]="isUpdating"> <div *ngIf="!isLoading">
<i class="fa fa-plus"></i> Add Widget <my-ibox title="Add {{ defaultName }}" [isCollapsible]="true" [defaultCollapsed]="defaultExpandedWidgetId">
</button> <div class="my-ibox-content">
</form> <form (submit)="addWidget()" novalidate name="addForm">
</div> <label class="label-block">
</my-ibox> Widget Name
<input type="text" class="form-control"
placeholder="{{ defaultName }}"
[(ngModel)]="newWidget.dimension.newName" name="widget-name-new"
[disabled]="isUpdating"/>
</label>
<label class="label-block">
Widget URL
<input type="text" class="form-control"
placeholder="https://matrix.org"
[(ngModel)]="newWidget.dimension.newUrl" name="widget-url-new"
[disabled]="isUpdating"/>
</label>
<my-ibox *ngFor="let widget of widgets trackById" <button type="submit" class="btn btn-sm btn-success" [disabled]="isUpdating">
[isCollapsible]="true" [defaultCollapsed]="widget.id !== defaultExpandedWidgetId" <i class="fa fa-plus"></i> Add Widget
title="{{ widget.name || widget.url || defaultName }}"> </button>
<div class="my-ibox-content"> </form>
<form (submit)="saveWidget(widget)" novalidate name="addForm"> </div>
<label class="label-block"> </my-ibox>
Widget Name
<input type="text" class="form-control"
placeholder="{{ defaultName }}"
[(ngModel)]="widget.dimension.newName" name="widget-name-{{widget.id}}"
[disabled]="isUpdating"/>
</label>
<label class="label-block">
Widget URL
<input type="text" class="form-control"
placeholder="https://matrix.org"
[(ngModel)]="widget.dimension.newUrl" name="widget-url-{{widget.id}}"
[disabled]="isUpdating"/>
</label>
<button type="submit" class="btn btn-sm btn-primary" [disabled]="isUpdating"> <my-ibox *ngFor="let widget of widgets trackById"
<i class="fa fa-save"></i> Save Widget [isCollapsible]="true" [defaultCollapsed]="widget.id !== defaultExpandedWidgetId"
</button> title="{{ widget.name || widget.url || defaultName }}">
<button type="button" class="btn btn-sm btn-danger" [disabled]="isUpdating"> <div class="my-ibox-content">
<i class="fa fa-times"></i> Remove Widget <form (submit)="saveWidget(widget)" novalidate name="addForm">
</button> <label class="label-block">
<button type="button" class="btn btn-sm btn-white" [disabled]="isUpdating" (click)="resetWidget(widget)" Widget Name
*ngIf="hasChanges(widget)"> <input type="text" class="form-control"
<i class="fa fa-reset"></i> Undo Changes placeholder="{{ defaultName }}"
</button> [(ngModel)]="widget.dimension.newName" name="widget-name-{{widget.id}}"
</form> [disabled]="isUpdating"/>
</div> </label>
</my-ibox> <label class="label-block">
Widget URL
<input type="text" class="form-control"
placeholder="https://matrix.org"
[(ngModel)]="widget.dimension.newUrl" name="widget-url-{{widget.id}}"
[disabled]="isUpdating"/>
</label>
<button type="submit" class="btn btn-sm btn-primary" [disabled]="isUpdating">
<i class="fa fa-save"></i> Save Widget
</button>
<button type="button" class="btn btn-sm btn-danger" [disabled]="isUpdating">
<i class="fa fa-times"></i> Remove Widget
</button>
<button type="button" class="btn btn-sm btn-white" [disabled]="isUpdating" (click)="resetWidget(widget)"
*ngIf="hasChanges(widget)">
<i class="fa fa-undo"></i> Undo Changes
</button>
</form>
</div>
</my-ibox>
</div>

View File

@ -71,11 +71,12 @@ export class NewWidgetComponent {
} }
// See if we should request editing a particular widget // See if we should request editing a particular widget
if (SessionStorage.editWidgetId && SessionStorage.editsRequested === 1) { console.log(SessionStorage.editIntegrationId +" " +SessionStorage.editsRequested);
if (SessionStorage.editIntegrationId && SessionStorage.editsRequested === 1) {
let editWidget: EditableWidget = null; let editWidget: EditableWidget = null;
let otherWidgets: EditableWidget[] = []; let otherWidgets: EditableWidget[] = [];
for (let widget of this.widgets) { for (let widget of this.widgets) {
if (widget.id === SessionStorage.editWidgetId) { if (widget.id === SessionStorage.editIntegrationId) {
editWidget = widget; editWidget = widget;
} else otherWidgets.push(widget); } else otherWidgets.push(widget);
} }
@ -318,7 +319,7 @@ export class NewWidgetComponent {
* @param {EditableWidget} widget The widget to check * @param {EditableWidget} widget The widget to check
* @returns {boolean} True if the widget has been edited * @returns {boolean} True if the widget has been edited
*/ */
public hasChanges(widget: EditableWidget):boolean { public hasChanges(widget: EditableWidget): boolean {
if (widget.dimension.newUrl !== this.unwrapUrl(widget.url)) return true; if (widget.dimension.newUrl !== this.unwrapUrl(widget.url)) return true;
if (widget.dimension.newName !== widget.name) return true; if (widget.dimension.newName !== widget.name) return true;
if (widget.dimension.newTitle !== widget.data.title) return true; if (widget.dimension.newTitle !== widget.data.title) return true;

View File

@ -29,7 +29,7 @@ export class RiotHomeComponent {
private roomId: string; private roomId: string;
private userId: string; private userId: string;
private requestedScreen: string = null; private requestedScreen: string = null;
private requestedIntegration: string = null; private requestedIntegrationId: string = null;
public integrationsForCategory: { [category: string]: Integration[] } = {}; public integrationsForCategory: { [category: string]: Integration[] } = {};
private categoryMap: { [categoryName: string]: string[] } = CATEGORY_MAP; private categoryMap: { [categoryName: string]: string[] } = CATEGORY_MAP;
@ -42,7 +42,7 @@ export class RiotHomeComponent {
let params: any = this.activatedRoute.snapshot.queryParams; let params: any = this.activatedRoute.snapshot.queryParams;
this.requestedScreen = params.screen; this.requestedScreen = params.screen;
this.requestedIntegration = params.integ_id; this.requestedIntegrationId = params.integ_id;
if (SessionStorage.roomId && SessionStorage.userId) { if (SessionStorage.roomId && SessionStorage.userId) {
this.roomId = SessionStorage.roomId; this.roomId = SessionStorage.roomId;
@ -208,8 +208,9 @@ export class RiotHomeComponent {
console.log("Searching for integration for requested screen"); console.log("Searching for integration for requested screen");
for (const integration of this.getIntegrations()) { for (const integration of this.getIntegrations()) {
if (integration.category === category && integration.type === type) { if (integration.category === category && integration.type === type) {
console.log("Configuring integration " + this.requestedIntegration + " category=" + category + " type=" + type); console.log("Configuring integration " + this.requestedIntegrationId + " category=" + category + " type=" + type);
SessionStorage.editIntegration = integration; SessionStorage.editIntegration = integration;
SessionStorage.editIntegrationId = this.requestedIntegrationId;
this.modifyIntegration(integration); this.modifyIntegration(integration);
return; return;
} }

View File

@ -6,7 +6,7 @@ export class SessionStorage {
public static userId: string; public static userId: string;
public static roomId: string; public static roomId: string;
public static editIntegration: Integration; public static editIntegration: Integration;
public static editWidgetId: string; public static editIntegrationId: string;
public static editsRequested: number = 0; public static editsRequested: number = 0;
private constructor() { private constructor() {

View File

@ -53,11 +53,13 @@ export class IntegrationService {
} }
static getIntegrationForScreen(screen: string): { category: string, type: string } { static getIntegrationForScreen(screen: string): { category: string, type: string } {
for (const iType of Object.keys(IntegrationService.supportedIntegrationsMap)) { for (const category of Object.keys(IntegrationService.supportedIntegrationsMap)) {
for (const iiType of Object.keys(IntegrationService.supportedIntegrationsMap[iType])) { for (const type of Object.keys(IntegrationService.supportedIntegrationsMap[category])) {
const integrationTypes = IntegrationService.supportedIntegrationsMap[iType][iiType].types; const integrationTypes = IntegrationService.supportedIntegrationsMap[category][type].types;
if (!integrationTypes) continue;
const integrationScreens = integrationTypes.map(t => "type_" + t); const integrationScreens = integrationTypes.map(t => "type_" + t);
if (integrationScreens.includes(screen)) return {category: iType, type: iiType}; if (integrationScreens.includes(screen)) return {category: category, type: type};
} }
} }