in src/Explorer/Tabs/ScriptTabBase.ts [38:178]
constructor(options: ViewModels.ScriptTabOption) {
super(options);
this._partitionKey = options.partitionKey;
this.isNew = ko.observable(options.isNew);
this.resource = ko.observable(options.resource);
this.isTemplateReady = ko.observable<boolean>(false);
this.isTemplateReady.subscribe((isTemplateReady: boolean) => {
if (isTemplateReady) {
// setTimeout is needed as creating the edtior manipulates the dom directly and expects
// Knockout to have completed all of the initial bindings for the component
setTimeout(() => this._createBodyEditor(), Constants.ClientDefaults.waitForDOMElementMs);
}
});
this.editorId = `editor_${this.tabId}`;
this.ariaLabel = ko.observable<string>();
if (this.isNew()) {
this.editorState = ko.observable(ViewModels.ScriptEditorState.newInvalid);
} else {
this.editorState = ko.observable(ViewModels.ScriptEditorState.existingNoEdits);
}
this.id = editable.observable<string>();
this.id.validations([IsValidCosmosDbResourceId]);
this.editorContent = editable.observable<string>();
this.editorContent.validations([ScriptTabBase._isNotEmpty]);
this.formFields = ko.observableArray([this.id, this.editorContent]);
this._setBaselines();
this.id.editableIsValid.subscribe((isValid) => {
const currentState = this.editorState();
switch (currentState) {
case ViewModels.ScriptEditorState.newValid:
case ViewModels.ScriptEditorState.newInvalid:
if (isValid) {
this.editorState(ViewModels.ScriptEditorState.newValid);
} else {
this.editorState(ViewModels.ScriptEditorState.newInvalid);
}
break;
case ViewModels.ScriptEditorState.existingDirtyInvalid:
case ViewModels.ScriptEditorState.existingDirtyValid:
if (isValid) {
this.editorState(ViewModels.ScriptEditorState.existingDirtyValid);
} else {
this.editorState(ViewModels.ScriptEditorState.existingDirtyInvalid);
}
break;
case ViewModels.ScriptEditorState.existingDirtyValid:
default:
break;
}
});
this.editor = ko.observable<monaco.editor.IStandaloneCodeEditor>();
this.formIsValid = ko.computed<boolean>(() => {
const formIsValid: boolean = this.formFields().every((field) => {
return field.editableIsValid();
});
return formIsValid;
});
this.formIsDirty = ko.computed<boolean>(() => {
const formIsDirty: boolean = this.formFields().some((field) => {
return field.editableIsDirty();
});
return formIsDirty;
});
this.saveButton = {
enabled: ko.computed<boolean>(() => {
if (!this.formIsValid()) {
return false;
}
if (!this.formIsDirty()) {
return false;
}
return true;
}),
visible: ko.computed<boolean>(() => {
return this.isNew();
}),
};
this.updateButton = {
enabled: ko.computed<boolean>(() => {
if (!this.formIsValid()) {
return false;
}
if (!this.formIsDirty()) {
return false;
}
return true;
}),
visible: ko.computed<boolean>(() => {
return !this.isNew();
}),
};
this.discardButton = {
enabled: ko.computed<boolean>(() => {
return this.formIsDirty();
}),
visible: ko.computed<boolean>(() => {
return true;
}),
};
this.deleteButton = {
enabled: ko.computed<boolean>(() => {
return !this.isNew();
}),
visible: ko.computed<boolean>(() => {
return true;
}),
};
this.executeButton = {
enabled: ko.computed<boolean>(() => {
return !this.isNew() && !this.formIsDirty() && this.formIsValid();
}),
visible: ko.computed<boolean>(() => {
return true;
}),
};
}