shawn/op-pedal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web ui Update feature complete.

Browse Source
This commit is contained in:
Robin Davies
2024-08-25 18:36:50 -04:00
parent b989ac5c92
commit 6280d415ed
25 changed files with 517 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files
react/src/AboutDialog.tsx
+1 -1
View File
@@ -156,7 +156,7 @@ const AboutDialog = withStyles(styles, { withTheme: true })(
})
.catch((err) => {
// ok in debug builds. File doesn't get placed until install time.
console.log("Failed to fetch open-source notices. " + err);
console.log("Failed to fetch open-source notices. " + err.toString());
});
}
}
react/src/AppThemed.tsx
+4 -9
View File
@@ -358,7 +358,7 @@ const AppThemed = withStyles(appStyles)(class extends ResizeResponsiveComponent<
onOpenBank(bankId: number) {
this.model_.openBank(bankId)
.catch((error) => this.model_.showAlert(error));
.catch((error) => this.model_.showAlert(error.toString()));
}
@@ -383,7 +383,7 @@ const AppThemed = withStyles(appStyles)(class extends ResizeResponsiveComponent<
});
this.model_.saveBankAs(this.model_.banks.get().selectedBank, newName)
.catch((error) => {
this.model_.showAlert(error);
this.model_.showAlert(error.toString());
});
}
@@ -407,7 +407,7 @@ const AppThemed = withStyles(appStyles)(class extends ResizeResponsiveComponent<
});
this.model_.renameBank(this.model_.banks.get().selectedBank, newName)
.catch((error) => {
this.model_.showAlert(error);
this.model_.showAlert(error.toString());
});
}
@@ -896,12 +896,7 @@ const AppThemed = withStyles(appStyles)(class extends ResizeResponsiveComponent<
onDialogClosed={() => { this.model_.zoomedUiControl.set(undefined); }
}
/>
{
(this.state.updateDialogOpen)
&& (
<UpdateDialog open={true} />
)
}
<UpdateDialog open={this.state.updateDialogOpen} />
{this.state.showStatusMonitor && (<JackStatusView />)}
react/src/BankDialog.tsx
+3 -3
View File
@@ -182,7 +182,7 @@ const BankDialog = withStyles(styles, { withTheme: true })(
})
.catch(err => {
e.target.value = ""; // clear the file list so we can get another change notice.
this.model.showAlert(err);
this.model.showAlert(err.toString());
});
}
handleUploadBank() {
@@ -266,7 +266,7 @@ const BankDialog = withStyles(styles, { withTheme: true })(
});
})
.catch((error) => {
this.model.showAlert(error);
this.model.showAlert(error.toString());
});
}
}
@@ -324,7 +324,7 @@ const BankDialog = withStyles(styles, { withTheme: true })(
});
this.model.moveBank(from, to)
.catch((error) => {
this.model.showAlert(error);
this.model.showAlert(error.toString());
});
}
react/src/FilePropertyDialog.tsx
+1 -1
View File
@@ -349,7 +349,7 @@ export default withStyles(styles, { withTheme: true })(
}
).catch(
(e: any) => {
this.model.showAlert(e + "");
this.model.showAlert(e.toString());
}
);
}
react/src/PiPedalModel.tsx
+52 -53
View File
@@ -20,7 +20,7 @@
import { UiPlugin, UiControl, PluginType, UiFileProperty } from './Lv2Plugin';
import { PiPedalArgumentError, PiPedalStateError } from './PiPedalError';
import { UpdateStatus, UpdatePolicyT} from './Updater';
import { UpdateStatus, UpdatePolicyT } from './Updater';
import { ObservableProperty } from './ObservableProperty';
import { Pedalboard, PedalboardItem, ControlValue } from './Pedalboard'
import PluginClass from './PluginClass';
@@ -54,8 +54,7 @@ export enum State {
InstallingUpdate,
};
export function wantsLoadingScreen(state: State)
{
export function wantsLoadingScreen(state: State) {
return state >= State.Reconnecting;
}
@@ -442,8 +441,7 @@ export class PiPedalModel //implements PiPedalModel
this.onSocketConnectionLost = this.onSocketConnectionLost.bind(this);
}
expectDisconnect(reason: ReconnectReason)
{
expectDisconnect(reason: ReconnectReason) {
this.reconnectReason = reason;
}
@@ -647,38 +645,36 @@ export class PiPedalModel //implements PiPedalModel
private updateLaterTimeout?: NodeJS.Timeout = undefined;
private clearPromptForUpdateTimer()
{
if (this.updateLaterTimeout)
{
private clearPromptForUpdateTimer() {
if (this.updateLaterTimeout) {
clearTimeout(this.updateLaterTimeout);
this.updateLaterTimeout = undefined;
}
}
private setPromptForUpdateTimer(when: Date)
{
let ms = when.getTime()-Date.now();
private setPromptForUpdateTimer(when: Date) {
let ms = when.getTime() - Date.now();
this.updateLaterTimeout = setTimeout(
()=>{
() => {
this.updateLaterTimeout = undefined;
// make the server do a fresh check
this.getUpdateStatus()
.then(
()=>{
this.updatePromptForUpdate();
})
.catch((e)=>{
.then(
() => {
this.updatePromptForUpdate();
})
.catch((e) => {
});
});
},
ms);
}
private lastCanUpdateNow: boolean = false;
private updatePromptForUpdate() {
this.clearPromptForUpdateTimer();
let stateEnabled = true; // must be present to accept alerts. this.state.get() === State.Ready;
let timeEnabled = false;
@@ -689,36 +685,36 @@ export class PiPedalModel //implements PiPedalModel
let nDate = Date.now();
let now: Date = new Date(nDate);
let tomorrow: Date = new Date(nDate + 86400000);
let maxDate: Date = new Date(nDate + 86400000*2); // sanity check for systems with unstable system clock
timeEnabled = (updateLaterTime < now || updateLaterTime >= tomorrow)
if (!timeEnabled)
{
this.setPromptForUpdateTimer(updateLaterTime);
}
timeEnabled = (updateLaterTime < now || updateLaterTime >= maxDate)
}
let updateStatus = this.updateStatus.get();
let statusEnabled = updateStatus.isOnline && updateStatus.isValid && updateStatus.getActiveRelease().updateAvailable;
if (stateEnabled && timeEnabled && statusEnabled)
let canUpdateNow: boolean = (stateEnabled && timeEnabled && statusEnabled);
if (updateStatus.updatePolicy === UpdatePolicyT.Disable)
{
this.showUpdateDialogValue = true;
canUpdateNow = false;
}
this.promptForUpdate.set(this.showUpdateDialogValue);
if (stateEnabled && statusEnabled && !timeEnabled && updateLaterTime)
if (canUpdateNow && canUpdateNow !== this.lastCanUpdateNow)
{
this.showUpdateDialogValue = true; // make the dialog sticky so it can show OK button
}
this.lastCanUpdateNow = canUpdateNow;
this.promptForUpdate.set(this.showUpdateDialogValue || canUpdateNow);
if (stateEnabled && statusEnabled && !timeEnabled && updateLaterTime) {
this.setPromptForUpdateTimer(updateLaterTime);
}
}
private showUpdateDialogValue: boolean = false;
showUpdateDialog(show: boolean = true) {
if (this.showUpdateDialogValue !== show)
{
if (this.showUpdateDialogValue !== show) {
this.showUpdateDialogValue = show;
if (show)
{
if (show) {
this.forceUpdateCheck();
}
this.updatePromptForUpdate();
@@ -732,6 +728,7 @@ export class PiPedalModel //implements PiPedalModel
if (current.currentVersion.length !== 0 && current.currentVersion !== updateStatus.currentVersion) {
// !! Server has been updated!!!
this.reloadPage();
throw new Error("Reloading...");
}
if (updateStatus.getActiveRelease().updateAvailable) {
this.promptForUpdate.set(true);
@@ -755,7 +752,6 @@ export class PiPedalModel //implements PiPedalModel
setState(state: State) {
if (this.state.get() !== state) {
this.state.set(state);
this.updatePromptForUpdate();
}
}
@@ -809,7 +805,7 @@ export class PiPedalModel //implements PiPedalModel
return this.getUpdateStatus(); // detects whether server has been upgraded.
})
.then((updateStatus) => {
return this.getWebSocket().request<any>("plugins");
})
.then(data => {
@@ -884,7 +880,7 @@ export class PiPedalModel //implements PiPedalModel
this.setState(State.Ready);
})
.catch((what) => {
this.onError(what);
this.onError(what.toString());
})
}
makeSocketServerUrl(hostName: string, port: number): string {
@@ -971,7 +967,7 @@ export class PiPedalModel //implements PiPedalModel
return true;
})
.catch((error) => {
this.setError("Failed to connect to server. " + error);
this.setError("Failed to connect to server. " + error.toString());
return false;
})
.then((succeeded) => {
@@ -1066,7 +1062,7 @@ export class PiPedalModel //implements PiPedalModel
return true;
})
.catch((error) => {
this.setError("Failed to fetch server state.\n\n" + error);
this.setError("Failed to fetch server state.\n\n" + error.toString());
return false;
});
@@ -1150,7 +1146,7 @@ export class PiPedalModel //implements PiPedalModel
}
})
.catch((error) => {
this.setError("Failed to get server state. \n\n" + error);
this.setError("Failed to get server state. \n\n" + error.toString());
});
let t = this.onVisibilityChanged;
@@ -1789,28 +1785,31 @@ export class PiPedalModel //implements PiPedalModel
updateNow(): Promise<void> {
return new Promise<void>(
(accept,reject) => {
(accept, reject) => {
let updateStatus = this.updateStatus.get();
if (updateStatus.isOnline && updateStatus.isValid && updateStatus.getActiveRelease().updateAvailable)
{
if (updateStatus.isOnline && updateStatus.isValid && updateStatus.getActiveRelease().updateAvailable) {
this.setState(State.DownloadingUpdate);
this.expectDisconnect(ReconnectReason.Updating);
let url = updateStatus.getActiveRelease().updateUrl;
nullCast(this.webSocket)
.request<void>('updateNow', url)
.then(()=> {
.then(() => {
this.setState(State.InstallingUpdate);
accept();
})
.catch(
(e: any)=>{
(e: any) => {
this.expectDisconnect(ReconnectReason.Disconnected);
this.setState(State.Ready); // TODO: hopefully we haven't had an intermediate disconnect.
reject(e);
});
} else {
reject(new Error("Invalid update request."));
}
}
}
);
}
@@ -1896,8 +1895,9 @@ export class PiPedalModel //implements PiPedalModel
return this.copyPreset(instanceId, -1);
}
showAlert(message: string): void {
this.alertMessage.set(message);
showAlert(message: string| Error): void {
let m = message.toString();
this.alertMessage.set(m);
}
@@ -2009,8 +2009,7 @@ export class PiPedalModel //implements PiPedalModel
}
private isClosed = false;
close() {
if (!this.isClosed)
{
if (!this.isClosed) {
this.isClosed = true;
this.webSocket?.close();
this.webSocket = undefined;
@@ -2385,7 +2384,7 @@ export class PiPedalModel //implements PiPedalModel
resolve(json as number);
})
.catch((error) => {
reject("Upload failed. " + error);
reject("Upload failed. " + error.toString());
})
;
} catch (error) {
@@ -2775,7 +2774,7 @@ export class PiPedalModel //implements PiPedalModel
}
setUpdatePolicy(updatePolicy: UpdatePolicyT) : void {
setUpdatePolicy(updatePolicy: UpdatePolicyT): void {
let iPolicy = updatePolicy as number;
if (this.webSocket) {
this.webSocket.send("setUpdatePolicy", iPolicy);
react/src/UpdateDialog.tsx
+32 -32
View File
@@ -30,15 +30,14 @@ import DialogEx from './DialogEx';
import DialogTitle from '@mui/material/DialogTitle';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import { UpdateStatus, UpdateRelease, UpdatePolicyT,intToUpdatePolicyT } from './Updater';
import { UpdateStatus, UpdateRelease, UpdatePolicyT, intToUpdatePolicyT } from './Updater';
import { PiPedalModelFactory, PiPedalModel } from './PiPedalModel';
import Select from '@mui/material/Select';
import MenuItem from '@mui/material/MenuItem';
//const UPDATE_CHECK_DELAY = 86400000; // one day in ms.
const UPDATE_CHECK_DELAY = 30 * 1000; // testing
const CLOSE_DELAY = 100; // ms.
const UPDATE_CHECK_DELAY = 86400000; // one day in ms.
// const UPDATE_CHECK_DELAY = 30 * 1000; // testing
@@ -69,11 +68,9 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
this.onUpdateStatusChanged = this.onUpdateStatusChanged.bind(this);
}
onUpdateStatusChanged(newValue: UpdateStatus)
{
if (!newValue.equals(this.state.updateStatus))
{
this.setState({updateStatus: newValue});
onUpdateStatusChanged(newValue: UpdateStatus) {
if (!newValue.equals(this.state.updateStatus)) {
this.setState({ updateStatus: newValue });
}
}
@@ -90,8 +87,8 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
}
private handleOk() {
private handleOK() {
this.model.showUpdateDialog(false);
}
private handleUpdateNow() {
this.model.updateNow()
@@ -100,9 +97,7 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
this.showAlert(e.toString());
});
}
private updatingLater: boolean = false;
private handleUpdateLater() {
this.updatingLater = true;
this.model.updateLater(UPDATE_CHECK_DELAY);
this.model.showUpdateDialog(false); // allow close if launched from the settings window.
}
@@ -110,10 +105,9 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
private handleClose() {
// ideally, we'd like to not close at all, but it screws up the nav backstack if we dont.
// so, close, but do so very briefly
if (!this.updatingLater) {
this.model.updateLater(CLOSE_DELAY); // close and re-open immediately.
if (this.canUpgrade()) {
this.model.updateLater(UPDATE_CHECK_DELAY); // close and re-open immediately.
}
this.updatingLater = false;
this.model.showUpdateDialog(false);
}
@@ -136,6 +130,12 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
}
canUpgrade(): boolean {
let updateStatus = this.state.updateStatus;
if (updateStatus.updatePolicy === UpdatePolicyT.Disable) {
return false;
}
if (updateStatus.errorMessage !== "") {
return false;
}
let updateRelease = updateStatus.getActiveRelease();
return updateStatus.isValid && updateStatus.isOnline && updateRelease.updateAvailable;
@@ -143,7 +143,7 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
private onPolicySelected(newValue: string | number): void {
if (newValue.toString() === "") return;
let updatePolicy = intToUpdatePolicyT(newValue as number);
let updatePolicy = intToUpdatePolicyT(newValue as number);
this.model.setUpdatePolicy(updatePolicy);
}
@@ -155,7 +155,7 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
let compact = this.state.compactLandscape;
return (
<DialogEx tag="update" open={this.props.open} onClose={() => { this.handleClose(); }}
style={{ userSelect: "none" }}
style={{ userSelect: "none" }}
>
{
(!compact) &&
@@ -163,10 +163,11 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
<DialogTitle>
<div style={{ display: "flex", flexFlow: "row noWrap", alignItems: "center" }} >
<Typography style={{ flexGrow: 1, flexShrink: 1, marginRight: 20 }} noWrap>PiPedal Updates</Typography>
<Select style={{opacity: 0.6}} variant="standard" value={updateStatus.updatePolicy as number} onChange={(ev) => { this.onPolicySelected(ev.target.value); }}>
<MenuItem value={UpdatePolicyT.ReleaseOnly as number}>Release only</MenuItem>
<MenuItem value={UpdatePolicyT.ReleaseOrBeta as number}>Release or Beta</MenuItem>
<MenuItem value={UpdatePolicyT.Development as number}>Development</MenuItem>
<Select style={{ opacity: 0.6 }} variant="standard" value={updateStatus.updatePolicy} onChange={(ev) => { this.onPolicySelected(ev.target.value); }}>
<MenuItem value={UpdatePolicyT.ReleaseOnly}>Release only</MenuItem>
<MenuItem value={UpdatePolicyT.ReleaseOrBeta}>Release or Beta</MenuItem>
<MenuItem value={UpdatePolicyT.Development}>Development</MenuItem>
<MenuItem value={UpdatePolicyT.Disable}>Disable</MenuItem>
</Select>
</div>
@@ -181,12 +182,11 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
}
<DialogContent>
{
(upToDate) && (
<Typography variant="body2" color="textSecondary" style={{ marginBottom: 12 }}>
PiPedal is up to date.
</Typography>
)
{(upToDate) && (
<Typography variant="body2" color="textSecondary" style={{ marginBottom: 12 }}>
PiPedal is up to date.
</Typography>
)
}
{(canUpgrade) && (
<Typography variant="body2" color="textSecondary" style={{ marginBottom: 12 }}>
@@ -202,7 +202,7 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
<Typography noWrap variant="body2" color="textSecondary" >
Current version:
</Typography>
{(canUpgrade) && (
{(!upToDate) && (
<Typography noWrap variant="body2" color="textSecondary" style={{ marginTop: 4 }} >
Update version:
</Typography>
@@ -213,7 +213,7 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
<Typography noWrap variant="body2" color="textSecondary" >
{updateStatus.currentVersionDisplayName}
</Typography>
{(canUpgrade) && (
{(!upToDate) && (
<Typography noWrap variant="body2" color="textSecondary" style={{ marginTop: 4 }} >
{updateRelease.upgradeVersionDisplayName}
</Typography>
@@ -249,10 +249,10 @@ export default class UpdateDialog extends React.Component<UpdateDialogProps, Upd
) : (
<div style={{ display: "flex", flexFlow: "row noWrap", alignItems: "center" }}
onClick={()=>{ this.model.showUpdateDialog(false); }}
>
<div style={{ flexGrow: 1, flexShrink: 1 }} />
<Button variant="dialogPrimary">OK</Button>
<Button onClick={() => { this.handleOK(); }} variant="dialogPrimary">OK</Button>
</div>
)
}
react/src/Updater.tsx
+2
View File
@@ -22,6 +22,7 @@ export enum UpdatePolicyT {
ReleaseOnly = 0,
ReleaseOrBeta = 1,
Development = 2,
Disable = 3,
};
export function intToUpdatePolicyT(intValue: number): UpdatePolicyT {
@@ -90,6 +91,7 @@ export class UpdateStatus {
}
getActiveRelease(): UpdateRelease {
switch (this.updatePolicy) {
case UpdatePolicyT.Disable: // show available updates in the settings dialog.
case UpdatePolicyT.ReleaseOnly:
return this.releaseOnlyRelease;
case UpdatePolicyT.ReleaseOrBeta: