mirror of
https://github.com/turt2live/matrix-dimension.git
synced 2024-10-01 05:05:53 +00:00
Support custom Etherpad servers
This commit is contained in:
Travis Ralston
parent
1be87b51b4
commit
a45232998a
@ -5,3 +5,7 @@ enabled: true
|
||||
name: "Etherpad"
|
||||
about: "Etherpad is a collaborative text editor. With this widget you can embed Etherpad directly in to your Matrix chat rooms so that you can securely collaborate on documents."
|
||||
avatar: "img/avatars/etherpad.png"
|
||||
|
||||
# This is the URL people will be provided when adding a new Etherpad widget. The supported variables
|
||||
# are $roomId and $padName. Both will end up being URL encoded.
|
||||
defaultUrl: "https://demo.riot.im/etherpad/p/$roomId_$padName"
|
||||
@ -14,45 +14,20 @@
|
||||
<div class="config-content" *ngIf="!isLoading">
|
||||
<form (submit)="validateAndAddWidget()" novalidate name="addForm">
|
||||
<div class="row">
|
||||
<div class="col" style="margin-bottom: 12px;">
|
||||
<div class="form-group row">
|
||||
<label for="padNameInput" class="col col-form-label">Etherpad Name</label>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" id="padNameInput"
|
||||
placeholder="Pad Name"
|
||||
[(ngModel)]="newWidgetUrl" name="newWidgetUrl"
|
||||
[disabled]="isUpdating">
|
||||
</div>
|
||||
<div class="col-md-8" style="margin-bottom: 12px;">
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="text" class="form-control"
|
||||
placeholder="Etherpad name or URL"
|
||||
[(ngModel)]="newWidgetUrl" 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 class="form-group row">
|
||||
<div class="form-check col">
|
||||
<label class="form-check-label">
|
||||
<input type="checkbox" class="form-check-input" [(ngModel)]="useCustomServer" name="useCustomServer">
|
||||
Use Custom Etherpad Server
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row" *ngIf="useCustomServer">
|
||||
<label for="padServerInput" class="col col-form-label">Etherpad Custom Server</label>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" id="padServerInput"
|
||||
placeholder="https://demo.riot.im/etherpad/p/"
|
||||
[(ngModel)]="newEtherpadServerUrl" name="newEtherpadServerUrl"
|
||||
[disabled]="isUpdating">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label for="padURL" class="col col-form-label">Etherpad URL</label>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" id="padURL" [value]="getPadURL()" readonly>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-success" [disabled]="isUpdating">
|
||||
<i class="fa fa-plus-circle"></i> Add Widget
|
||||
</button>
|
||||
</div>
|
||||
<div class="w-100"></div>
|
||||
<div class="col removable widget-item" *ngFor="let widget of widgets trackById">
|
||||
<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">
|
||||
@ -62,54 +37,26 @@
|
||||
style="margin-top: -5px;" [disabled]="isUpdating">
|
||||
<i class="fa fa-times"></i> Remove Widget
|
||||
</button>
|
||||
<div class="col" *ngIf="isWidgetToggled(widget)" style="margin-top: 12px;">
|
||||
<div class="form-group row">
|
||||
<div class="form-check col">
|
||||
<label class="form-check-label">
|
||||
<input type="checkbox" class="form-check-input" [(ngModel)]="editUseCustomServer" name="widget-useCustomServer-{{widget.id}}">
|
||||
Use Custom Etherpad Server
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="form-group col">
|
||||
<label for="widget-name-{{widget.id}}">Widget Name</label>
|
||||
<input type="text" class="form-control" id="widget-name-{{widget.id}}"
|
||||
placeholder="Etherpad Widget"
|
||||
[(ngModel)]="widget.newName" name="widget-name-{{widget.id}}"
|
||||
[disabled]="isUpdating">
|
||||
</div>
|
||||
<div class="form-group col">
|
||||
<label for="widget-padName-{{widget.id}}">Etherpad Name</label>
|
||||
<input type="text" class="form-control" id="widget-padName-{{widget.id}}"
|
||||
placeholder="Etherpad Name"
|
||||
[(ngModel)]="widget.data.newPadName" name="widget-padName-{{widget.id}}"
|
||||
[disabled]="isUpdating">
|
||||
</div>
|
||||
<div class="form-group col" *ngIf="editUseCustomServer">
|
||||
<label for="widget-padServer-{{widget.id}}">Etherpad Server URL</label>
|
||||
<input type="text" class="form-control"
|
||||
placeholder="Etherpad Server URL"
|
||||
[(ngModel)]="widget.data.newPadServer" name="widget-padServer-{{widget.id}}"
|
||||
[disabled]="isUpdating">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label for="padURL" class="col col-form-label">Etherpad URL</label>
|
||||
<div class="col">
|
||||
<input type="text" class="form-control" id="padURL" [value]="getPadURL(widget)" readonly>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="btn-group">
|
||||
<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 *ngIf="isWidgetToggled(widget)">
|
||||
<label>
|
||||
Pad Name
|
||||
<input type="text" class="form-control"
|
||||
placeholder="Etherpad Widget"
|
||||
[(ngModel)]="widget.newName" name="widget-name-{{widget.id}}"
|
||||
[disabled]="isUpdating">
|
||||
</label>
|
||||
<label>
|
||||
Pad URL
|
||||
<input type="text" class="form-control"
|
||||
placeholder="https://your-pad-url"
|
||||
[(ngModel)]="widget.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>
|
||||
|
||||
@ -1,10 +1,11 @@
|
||||
import { Component } from "@angular/core";
|
||||
import { ModalComponent, DialogRef } from "ngx-modialog";
|
||||
import { DialogRef, ModalComponent } from "ngx-modialog";
|
||||
import { WidgetComponent } from "../widget.component";
|
||||
import { ScalarService } from "../../../shared/scalar.service";
|
||||
import { ConfigModalContext } from "../../../integration/integration.component";
|
||||
import { ToasterService } from "angular2-toaster";
|
||||
import { Widget, WIDGET_DIM_ETHERPAD, WIDGET_SCALAR_ETHERPAD } from "../../../shared/models/widget";
|
||||
import { EtherpadWidgetIntegration } from "../../../shared/models/integration";
|
||||
|
||||
@Component({
|
||||
selector: "my-etherpadwidget-config",
|
||||
@ -13,9 +14,7 @@ import { Widget, WIDGET_DIM_ETHERPAD, WIDGET_SCALAR_ETHERPAD } from "../../../sh
|
||||
})
|
||||
export class EtherpadWidgetConfigComponent extends WidgetComponent implements ModalComponent<ConfigModalContext> {
|
||||
|
||||
public newEtherpadServerUrl: string = "";
|
||||
public useCustomServer = false;
|
||||
public editUseCustomServer = false;
|
||||
private widgetOpts: EtherpadWidgetIntegration;
|
||||
|
||||
constructor(public dialog: DialogRef<ConfigModalContext>,
|
||||
toaster: ToasterService,
|
||||
@ -33,92 +32,36 @@ export class EtherpadWidgetConfigComponent extends WidgetComponent implements Mo
|
||||
"generic", // wrapper
|
||||
"etherpad" // scalar wrapper
|
||||
);
|
||||
}
|
||||
|
||||
getPadURL(widget?: Widget): string {
|
||||
let url: string;
|
||||
if (widget) {
|
||||
if (this.editUseCustomServer) {
|
||||
url = widget.data.newPadServer + this.roomId + "_" + widget.data.newPadName;
|
||||
} else {
|
||||
url = "https://demo.riot.im/etherpad/p/" + this.roomId + "_" + widget.data.newPadName;
|
||||
}
|
||||
} else {
|
||||
if (this.useCustomServer) {
|
||||
url = this.newEtherpadServerUrl + this.roomId + "_" + this.newWidgetUrl;
|
||||
} else {
|
||||
url = "https://demo.riot.im/etherpad/p/" + this.roomId + "_" + this.newWidgetUrl;
|
||||
}
|
||||
}
|
||||
return url;
|
||||
}
|
||||
|
||||
private checkPadURL(url: string, widget?: Widget): boolean {
|
||||
if (widget) {
|
||||
if (this.editUseCustomServer) {
|
||||
return Boolean(url === widget.data.newPadServer);
|
||||
} else {
|
||||
return Boolean(url === "https://demo.riot.im/etherpad/p/");
|
||||
}
|
||||
} else {
|
||||
if (this.useCustomServer) {
|
||||
return Boolean(url === this.newEtherpadServerUrl);
|
||||
} else {
|
||||
return Boolean(url === "https://demo.riot.im/etherpad/p/");
|
||||
}
|
||||
}
|
||||
this.widgetOpts = <EtherpadWidgetIntegration>dialog.context.integration;
|
||||
}
|
||||
|
||||
public validateAndAddWidget() {
|
||||
const url = this.getPadURL() + "?userName=$matrix_user_id";
|
||||
|
||||
if (this.checkPadURL(url)) {
|
||||
this.toaster.pop("warning", "Please enter a Pad Name");
|
||||
return;
|
||||
}
|
||||
|
||||
const originalUrl = this.roomId + "_" + this.newWidgetUrl;
|
||||
this.newWidgetUrl = url;
|
||||
|
||||
if (this.useCustomServer) {
|
||||
this.addWidget({padName: originalUrl, padSuffix: originalUrl, padServer: this.newEtherpadServerUrl});
|
||||
if (this.newWidgetUrl.startsWith("http://") || this.newWidgetUrl.startsWith("https://")) {
|
||||
this.newWidgetName = "Etherpad";
|
||||
} else {
|
||||
this.addWidget({padName: originalUrl, padSuffix: originalUrl, padServer: "https://demo.riot.im/etherpad/p/"});
|
||||
this.newWidgetName = this.newWidgetUrl;
|
||||
this.newWidgetUrl = this.generatePadUrl(this.newWidgetName);
|
||||
}
|
||||
|
||||
this.addWidget({dimOriginalUrl: this.newWidgetUrl});
|
||||
}
|
||||
|
||||
public validateAndSaveWidget(widget: Widget) {
|
||||
const url = this.getPadURL(widget) + "?userName=$matrix_user_id";
|
||||
|
||||
if (this.checkPadURL(url, widget)) {
|
||||
this.toaster.pop("warning", "Please enter a Pad Name");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!widget.data) widget.data = {};
|
||||
|
||||
widget.newUrl = url;
|
||||
widget.data.padName = widget.data.newPadName;
|
||||
widget.data.padSuffix = this.roomId + "_" + widget.data.newPadName;
|
||||
if (this.editUseCustomServer) {
|
||||
widget.data.padServer = widget.data.newPadServer;
|
||||
} else {
|
||||
widget.data.padServer = "https://demo.riot.im/etherpad/p/"
|
||||
}
|
||||
|
||||
delete widget.data.newPadServer;
|
||||
delete widget.data.newPadName;
|
||||
|
||||
widget.data.dimOriginalUrl = widget.newUrl;
|
||||
this.saveWidget(widget);
|
||||
}
|
||||
|
||||
editWidget(widget: Widget) {
|
||||
widget.data.newPadName = widget.data.padName;
|
||||
widget.data.newPadServer = widget.data.padServer;
|
||||
if (widget.data.newPadServer !== "https://demo.riot.im/etherpad/p/") {
|
||||
this.editUseCustomServer = true
|
||||
private generatePadUrl(forName: string): string {
|
||||
let template = "https://demo.riot.im/etherpad/p/$roomId_$padName";
|
||||
if (this.widgetOpts && this.widgetOpts.defaultUrl) {
|
||||
template = this.widgetOpts.defaultUrl;
|
||||
}
|
||||
super.editWidget(widget);
|
||||
}
|
||||
|
||||
template = template.replace("$roomId", encodeURIComponent(this.roomId));
|
||||
template = template.replace("$padName", encodeURIComponent(forName));
|
||||
|
||||
return template;
|
||||
}
|
||||
}
|
||||
|
||||
@ -26,4 +26,8 @@ export interface TravisCiIntegration extends Integration {
|
||||
export interface IRCIntegration extends Integration {
|
||||
availableNetworks: {name: string, id: string}[];
|
||||
channels: {[networkId: string]: string[]};
|
||||
}
|
||||
}
|
||||
|
||||
export interface EtherpadWidgetIntegration extends Integration {
|
||||
defaultUrl: string;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user