CCM NG: Code cleanup
git-svn-id: https://svn.libreccm.org/ccm/ccm_ng@5631 8810af33-2d31-482b-a856-94f89814c4df
Former-commit-id: 68285da10b
pull/2/head
jensp
parent
98208c26a2
commit
3fa53aa347
|
|
@ -2,21 +2,18 @@ import * as React from "react";
|
|||
import { render } from "react-dom";
|
||||
|
||||
import {
|
||||
// AbstractComponentModelEditor,
|
||||
ComponentModel,
|
||||
BasicComponentModelEditorDialog,
|
||||
BasicComponentModelEditorDialogProps,
|
||||
BasicComponentModelEditorDialogState,
|
||||
BasicComponentModelPropertiesList,
|
||||
BasicComponentModelPropertiesListProps,
|
||||
ComponentModelEditor,
|
||||
ComponentModelEditorProps,
|
||||
ComponentModelEditorDialogProps,
|
||||
ComponentInfo,
|
||||
ComponentModel,
|
||||
ComponentModelEditor,
|
||||
ComponentModelEditorDialogProps,
|
||||
ComponentModelEditorProps,
|
||||
EditorComponents,
|
||||
// ComponentModelEditorProps,
|
||||
// ComponentModelEditorState,
|
||||
PageModelEditor,
|
||||
PageModelEditor,
|
||||
} from "ccm-pagemodelseditor";
|
||||
|
||||
class CategoryTreeComponentPropertiesList
|
||||
|
|
@ -35,7 +32,7 @@ class CategoryTreeComponentPropertiesList
|
|||
component={this.props.component}>
|
||||
<dt>showFullTree</dt>
|
||||
<dd>{this.props.component.showFullTree}</dd>
|
||||
</BasicComponentModelPropertiesList>
|
||||
</BasicComponentModelPropertiesList>;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -81,7 +78,7 @@ class CategoryTreeComponentEditorDialog
|
|||
id={`${idPrefix}showFullTree`}
|
||||
onChange={this.handleChange}
|
||||
type="checkbox" />
|
||||
</BasicComponentModelEditorDialog>
|
||||
</BasicComponentModelEditorDialog>;
|
||||
}
|
||||
|
||||
private getComponentModelProperties(): {[name: string]: any} {
|
||||
|
|
@ -97,7 +94,7 @@ class CategoryTreeComponentEditorDialog
|
|||
const idPrefix: string
|
||||
= `${this.props.containerKey}_${this.props.component.key}_`;
|
||||
|
||||
switch(target.id) {
|
||||
switch (target.id) {
|
||||
case `${idPrefix}showFullTree`: {
|
||||
this.setState({
|
||||
...this.state,
|
||||
|
|
@ -132,15 +129,15 @@ class ItemListComponentPropertiesList extends React.Component<
|
|||
<dd>
|
||||
{Array.isArray(this.props.component.listOrder) ?
|
||||
(
|
||||
this.props.component.listOrder.map((order) => {
|
||||
this.props.component.listOrder.map((order) =>
|
||||
<li>
|
||||
{order}
|
||||
</li>
|
||||
})
|
||||
</li>,
|
||||
)
|
||||
) : ("No order set")
|
||||
}
|
||||
</dd>
|
||||
</BasicComponentModelPropertiesList>
|
||||
</BasicComponentModelPropertiesList>;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -166,8 +163,8 @@ class ItemListComponentEditorDialog extends React.Component<
|
|||
...this.state,
|
||||
descending: this.props.component.descending,
|
||||
limitToType: this.props.component.limitToType,
|
||||
pageSize: this.props.component.pageSize,
|
||||
listOrder: this.props.component.listOrder,
|
||||
pageSize: this.props.component.pageSize,
|
||||
};
|
||||
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
|
|
@ -234,8 +231,8 @@ class ItemListComponentEditorDialog extends React.Component<
|
|||
return {
|
||||
descending: this.state.descending,
|
||||
limitToType: this.state.limitToType,
|
||||
pageSize: this.state.pageSize,
|
||||
listOrder: this.state.listOrder,
|
||||
pageSize: this.state.pageSize,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -245,7 +242,7 @@ class ItemListComponentEditorDialog extends React.Component<
|
|||
const idPrefix: string
|
||||
= `${this.props.containerKey}_${this.props.component.key}_`;
|
||||
|
||||
switch(target.id) {
|
||||
switch (target.id) {
|
||||
case `${idPrefix}descending`: {
|
||||
this.setState({
|
||||
...this.state,
|
||||
|
|
@ -287,29 +284,6 @@ class ItemListComponentEditorDialog extends React.Component<
|
|||
|
||||
}
|
||||
|
||||
// PageModelEditor.registerComponentModelEditor(
|
||||
// "org.librecms.pagemodel.CategoryTreeComponent",
|
||||
// (props: ComponentModelEditorProps<ComponentModel>) => {
|
||||
// return <CategoryTreeComponentEditor
|
||||
// ccmApplication={props.ccmApplication}
|
||||
// component={props.component as CategoryTreeComponent}
|
||||
// containerKey={props.containerKey}
|
||||
// dispatcherPrefix={props.dispatcherPrefix}
|
||||
// pageModelName={props.pageModelName} />
|
||||
// }
|
||||
// );
|
||||
// PageModelEditor.registerComponentModelEditor(
|
||||
// "org.librecms.pagemodel.ItemListComponent",
|
||||
// (props: ComponentModelEditorProps<ComponentModel>) => {
|
||||
// return <ItemListComponentEditor
|
||||
// ccmApplication={props.ccmApplication}
|
||||
// component={props.component as ItemListComponent}
|
||||
// containerKey={props.containerKey}
|
||||
// dispatcherPrefix={props.dispatcherPrefix}
|
||||
// pageModelName={props.pageModelName} />
|
||||
// }
|
||||
// );
|
||||
|
||||
render(
|
||||
<PageModelEditor />,
|
||||
document.getElementById("cms-content"),
|
||||
|
|
@ -320,54 +294,12 @@ interface CategoryTreeComponent extends ComponentModel {
|
|||
showFullTree: boolean;
|
||||
}
|
||||
|
||||
// interface CategoryTreeComponentEditorProps
|
||||
// extends ComponentModelEditorProps<CategoryTreeComponent> {
|
||||
//
|
||||
// }
|
||||
//
|
||||
// interface CategoryTreeComponentEditorState
|
||||
// extends ComponentModelEditorState {
|
||||
//
|
||||
// showFullTree: boolean;
|
||||
// }
|
||||
//
|
||||
//
|
||||
// class CategoryTreeComponentEditor
|
||||
// extends AbstractComponentModelEditor<CategoryTreeComponent,
|
||||
// CategoryTreeComponentEditorProps,
|
||||
// CategoryTreeComponentEditorState> {
|
||||
//
|
||||
// public constructor(props: CategoryTreeComponentEditorProps) {
|
||||
//
|
||||
// super(props);
|
||||
//
|
||||
// this.setState({
|
||||
// ...this.state as any,
|
||||
// dialogExpanded: "dialogClosed",
|
||||
// showFullTree: false,
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// public renderPropertyList(): React.ReactFragment {
|
||||
//
|
||||
// return <React.Fragment>
|
||||
// <dt>Show full tree</dt>
|
||||
// <dd>{this.props.component.showFullTree}</dd>
|
||||
// </React.Fragment>;
|
||||
// }
|
||||
//
|
||||
// public renderEditorDialog(): React.ReactFragment {
|
||||
//
|
||||
// return <React.Fragment />;
|
||||
// }
|
||||
// }
|
||||
|
||||
interface ItemListComponent extends ComponentModel {
|
||||
|
||||
descending: boolean;
|
||||
limitToType: string;
|
||||
listOrder: string[];
|
||||
pageSize: number;
|
||||
listOrder: string[],
|
||||
}
|
||||
|
||||
ComponentModelEditor.registerEditorComponents(
|
||||
|
|
@ -377,7 +309,7 @@ ComponentModelEditor.registerEditorComponents(
|
|||
CategoryTreeComponentEditorDialog as typeof React.Component,
|
||||
propertiesList:
|
||||
CategoryTreeComponentPropertiesList as typeof React.Component,
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
ComponentModelEditor.registerEditorComponents(
|
||||
|
|
@ -387,98 +319,5 @@ ComponentModelEditor.registerEditorComponents(
|
|||
ItemListComponentEditorDialog as typeof React.Component,
|
||||
propertiesList:
|
||||
ItemListComponentPropertiesList as typeof React.Component,
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
|
||||
// interface ItemListComponentEditorProps
|
||||
// extends ComponentModelEditorProps<ItemListComponent> {
|
||||
//
|
||||
// }
|
||||
//
|
||||
// interface ItemListComponentEditorState
|
||||
// extends ComponentModelEditorState {
|
||||
//
|
||||
// descending: boolean;
|
||||
// limitToType: string;
|
||||
// pageSize: number;
|
||||
// listOrder: string[];
|
||||
// }
|
||||
//
|
||||
// class ItemListComponentEditor
|
||||
// extends AbstractComponentModelEditor<ItemListComponent,
|
||||
// ItemListComponentEditorProps,
|
||||
// ItemListComponentEditorState> {
|
||||
//
|
||||
// public constructor(props: ItemListComponentEditorProps) {
|
||||
//
|
||||
// super(props as any);
|
||||
//
|
||||
// this.setState({
|
||||
// ...this.state,
|
||||
// dialogExpanded: "dialogClosed",
|
||||
// descending: false,
|
||||
// limitToType: "",
|
||||
// pageSize: 30,
|
||||
// listOrder: [],
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// public renderPropertyList(): React.ReactFragment {
|
||||
//
|
||||
// console.log("Rendering properties list for ItemListComponent...");
|
||||
// console.log(`listOrder = ${this.props.component.listOrder}`);
|
||||
//
|
||||
// return <React.Fragment>
|
||||
// <dt>descending</dt>
|
||||
// <dd>{this.props.component.descending}</dd>
|
||||
// <dt>limitToType</dt>
|
||||
// <dd>{this.props.component.limitToType}</dd>
|
||||
// <dt>pageSize</dt>
|
||||
// <dd>{this.props.component.pageSize}</dd>
|
||||
// <dt>listOrder</dt>
|
||||
// <dd>
|
||||
// {Array.isArray(this.props.component.listOrder) ?
|
||||
// (
|
||||
// this.props.component.listOrder.map((order) => {
|
||||
// <li>
|
||||
// {order}
|
||||
// </li>
|
||||
// })
|
||||
// ) : ("No order set")
|
||||
// }
|
||||
// </dd>
|
||||
// </React.Fragment>
|
||||
// }
|
||||
//
|
||||
// public renderEditorDialog(): React.ReactFragment {
|
||||
//
|
||||
// return <React.Fragment>
|
||||
// <label htmlFor="descending">
|
||||
// Descending?
|
||||
// </label>
|
||||
// <input checked={this.props.component.descending}
|
||||
// id="descending"
|
||||
// type="checkbox" />
|
||||
// <label htmlFor="limitToType">Limit to type</label>
|
||||
// <input id="limitToType"
|
||||
// maxLength={1024}
|
||||
// size={64}
|
||||
// type="text"
|
||||
// value={this.props.component.limitToType}/>
|
||||
// <label htmlFor="pageSize">Page size</label>
|
||||
// <input id="pageSize"
|
||||
// min="1"
|
||||
// type="number"
|
||||
// value={this.props.component.pageSize}/>
|
||||
// <label htmlFor="listOrder">List Order</label>
|
||||
// <textarea cols={40} id="listOrder" rows={5}>
|
||||
// {Array.isArray(this.props.component.listOrder) ? (
|
||||
// this.props.component.listOrder.join(", ")
|
||||
// ) : (
|
||||
// ""
|
||||
// )}
|
||||
// </textarea>
|
||||
// </React.Fragment>;
|
||||
// }
|
||||
// }
|
||||
|
|
|
|||
|
|
@ -821,7 +821,7 @@ class ContainerModelComponent
|
|||
containerKey={this.props.container.key}
|
||||
dispatcherPrefix={this.props.dispatcherPrefix}
|
||||
key={component.componentModelId}
|
||||
pageModelName={this.props.pageModelName} />
|
||||
pageModelName={this.props.pageModelName} />,
|
||||
// this.getComponentModelEditor(component),
|
||||
)}
|
||||
</ul>
|
||||
|
|
@ -892,40 +892,8 @@ class ContainerModelComponent
|
|||
});
|
||||
});
|
||||
}
|
||||
//
|
||||
// private getComponentModelEditor(
|
||||
// component: ComponentModel): React.ReactNode {
|
||||
//
|
||||
// console.log(`Trying to find editor for ${component.type}`);
|
||||
// // console.log("Available editors:");
|
||||
// // for(let key of Object.keys(PageModelEditor.getAvailableComponents())) {
|
||||
// //
|
||||
// // console.log(`${key} -> ${PageModelEditor.getAvailableComponents()[key]}`);
|
||||
// // }
|
||||
//
|
||||
// if (PageModelEditor.getAvailableComponents()[component.type]) {
|
||||
// console.log(`Found a editor generator for ${component.type} `);
|
||||
// return PageModelEditor
|
||||
// .getAvailableComponents()[component.type]({
|
||||
// ccmApplication: this.props.ccmApplication,
|
||||
// component,
|
||||
// containerKey: this.props.container.key,
|
||||
// dispatcherPrefix: this.props.dispatcherPrefix,
|
||||
// pageModelName: this.props.pageModelName,
|
||||
// });
|
||||
// } else {
|
||||
// console.warn(`No editor for type ${component.type} found. `
|
||||
// + `Using default editor.`);
|
||||
// return <OldDefaultComponentModelEditor
|
||||
// ccmApplication={this.props.ccmApplication}
|
||||
// component={component}
|
||||
// containerKey={this.props.container.key}
|
||||
// dispatcherPrefix={this.props.dispatcherPrefix}
|
||||
// pageModelName={this.props.pageModelName} />;
|
||||
// }
|
||||
// }
|
||||
|
||||
private deleteContainer(
|
||||
private deleteContainer(
|
||||
event: React.MouseEvent<HTMLButtonElement>,
|
||||
containerKey: string): void {
|
||||
|
||||
|
|
@ -962,17 +930,10 @@ interface BasicComponentModelEditorDialogState {
|
|||
errorMsg: string | null;
|
||||
}
|
||||
|
||||
|
||||
|
||||
class BasicComponentModelPropertiesList
|
||||
extends React.Component<
|
||||
BasicComponentModelPropertiesListProps<ComponentModel>, {}> {
|
||||
|
||||
// constructor(props: BasicComponentModelPropertiesListProps<ComponentModel>) {
|
||||
//
|
||||
// super(props);
|
||||
// }
|
||||
|
||||
public render(): React.ReactNode {
|
||||
|
||||
return <dl>
|
||||
|
|
@ -981,7 +942,7 @@ class BasicComponentModelPropertiesList
|
|||
<dt>Type</dt>
|
||||
<dd>{this.props.component.type}</dd>
|
||||
{this.props.children}
|
||||
</dl>
|
||||
</dl>;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1011,7 +972,7 @@ class BasicComponentModelEditorDialog
|
|||
const idPrefix: string
|
||||
= `${this.props.containerKey}_${this.props.component.key}_`;
|
||||
|
||||
switch(target.id) {
|
||||
switch (target.id) {
|
||||
case `${idPrefix}componentKey`: {
|
||||
|
||||
const componentKey: string = target.value;
|
||||
|
|
@ -1069,7 +1030,7 @@ class BasicComponentModelEditorDialog
|
|||
...this.state as any,
|
||||
errorMsg: `Failed to update/create ComponentModel: `
|
||||
+ `${error.message}`,
|
||||
})
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -1115,7 +1076,8 @@ class BasicComponentModelEditorDialog
|
|||
|
||||
<div className="dialogButtonBar">
|
||||
<button type="submit">Save</button>
|
||||
<button onClick={(event) => this.openCloseOnButton(event)}>
|
||||
<button
|
||||
onClick={(event) => this.openCloseOnButton(event)}>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -1158,47 +1120,24 @@ interface ComponentModelEditorProps {
|
|||
class ComponentModelEditor
|
||||
extends React.Component<ComponentModelEditorProps, {}> {
|
||||
|
||||
private static editorComponents: Map<string, EditorComponents>
|
||||
= new Map<string, EditorComponents>();
|
||||
//{[type: string]: EditorComponents} = {};
|
||||
// private propertiesListComponents: {[type: string]: typeof React.Component};
|
||||
// private editorDialogComponents: {[type: string]: typeof React.Component};
|
||||
|
||||
constructor(props: ComponentModelEditorProps) {
|
||||
|
||||
super(props);
|
||||
|
||||
// this.editorComponents = {};
|
||||
// this.propertiesListComponents = {};
|
||||
// this.editorDialogComponents = {};
|
||||
}
|
||||
|
||||
public static registerEditorComponents(type: string,
|
||||
components: EditorComponents) {
|
||||
|
||||
ComponentModelEditor.editorComponents.set(type, components);
|
||||
}
|
||||
|
||||
// ComponentModelEditor.editorComponents = {
|
||||
// ...ComponentModelEditor.editorComponents,
|
||||
// type: components,
|
||||
// };
|
||||
private static editorComponents: Map<string, EditorComponents>
|
||||
= new Map<string, EditorComponents>();
|
||||
|
||||
// this.propertiesListComponents = {
|
||||
// ...this.propertiesListComponents,
|
||||
// type: components.propertiesList,
|
||||
// };
|
||||
//
|
||||
// this.editorDialogComponents = {
|
||||
// ...this.editorDialogComponents,
|
||||
// type: components.editorDialog,
|
||||
// }
|
||||
constructor(props: ComponentModelEditorProps) {
|
||||
|
||||
super(props);
|
||||
}
|
||||
|
||||
public render(): React.ReactNode {
|
||||
|
||||
const components: EditorComponents
|
||||
= this.getEditorComponents(this.props.component.type);
|
||||
//= ComponentModelEditor.editorComponents[this.props.component.type];
|
||||
const PropertiesList: typeof React.Component
|
||||
= components.propertiesList;
|
||||
const EditorDialog: typeof React.Component
|
||||
|
|
@ -1213,7 +1152,7 @@ class ComponentModelEditor
|
|||
containerKey={this.props.containerKey}
|
||||
dispatcherPrefix={this.props.dispatcherPrefix}
|
||||
pageModelName={this.props.pageModelName} />
|
||||
</li>
|
||||
</li>;
|
||||
}
|
||||
|
||||
private getEditorComponents(type: string): EditorComponents {
|
||||
|
|
@ -1223,10 +1162,10 @@ class ComponentModelEditor
|
|||
.editorComponents.get(type) as EditorComponents;
|
||||
} else {
|
||||
const basicComponents: EditorComponents = {
|
||||
propertiesList:
|
||||
BasicComponentModelPropertiesList as typeof React.Component,
|
||||
editorDialog:
|
||||
BasicComponentModelEditorDialog as typeof React.Component,
|
||||
propertiesList:
|
||||
BasicComponentModelPropertiesList as typeof React.Component,
|
||||
};
|
||||
|
||||
return basicComponents;
|
||||
|
|
@ -1234,235 +1173,6 @@ class ComponentModelEditor
|
|||
}
|
||||
}
|
||||
|
||||
// interface OldComponentModelEditorProps<C extends ComponentModel> {
|
||||
//
|
||||
// ccmApplication: string;
|
||||
// component: C;
|
||||
// containerKey: string;
|
||||
// dispatcherPrefix: string;
|
||||
// pageModelName: string;
|
||||
// }
|
||||
//
|
||||
// interface OldComponentModelEditorState {
|
||||
//
|
||||
// componentKey: string;
|
||||
// dialogExpanded: string;
|
||||
// dialogOpened: boolean | undefined;
|
||||
// errorMsg: string;
|
||||
// }
|
||||
//
|
||||
// abstract class OldAbstractComponentModelEditor<
|
||||
// C extends ComponentModel,
|
||||
// P extends OldComponentModelEditorProps<C>,
|
||||
// S extends OldComponentModelEditorState>
|
||||
//
|
||||
// extends React.Component<P, S> {
|
||||
//
|
||||
// constructor(props: OldComponentModelEditorProps<C>) {
|
||||
//
|
||||
// super(props as any);
|
||||
//
|
||||
// this.state = {
|
||||
// ...this.state as any,
|
||||
// dialogExpanded: "dialogClosed",
|
||||
// dialogOpened: false,
|
||||
// errorMsg: null,
|
||||
// };
|
||||
//
|
||||
// this.handleChange = this.handleChange.bind(this);
|
||||
// this.handleSubmit = this.handleSubmit.bind(this);
|
||||
// }
|
||||
//
|
||||
// public handleChange(event: React.ChangeEvent<HTMLElement>): void {
|
||||
//
|
||||
// if (event.currentTarget.id === this.props.component.key + "_componentKey") {
|
||||
//
|
||||
// const target: HTMLInputElement
|
||||
// = event.currentTarget as HTMLInputElement;
|
||||
//
|
||||
// this.setState({
|
||||
// ...this.state as any,
|
||||
// componentKey: target.value,
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// }
|
||||
//
|
||||
// public handleSubmit(event: React.FormEvent<HTMLFormElement>): void {
|
||||
//
|
||||
// const componentData: any = this.getComponentData();
|
||||
//
|
||||
// const headers: Headers = new Headers();
|
||||
// headers.append("Content-Type", "application/json");
|
||||
//
|
||||
// const init: RequestInit = {
|
||||
// body: JSON.stringify(componentData),
|
||||
// credentials: "same-origin",
|
||||
// headers,
|
||||
// method: "PUT",
|
||||
// };
|
||||
//
|
||||
// const componentUrl = `${this.props.dispatcherPrefix}`
|
||||
// + `/page-models/${this.props.ccmApplication}`
|
||||
// + `/${this.props.pageModelName}`
|
||||
// + `/containers/${this.props.containerKey}`
|
||||
// + `/components/${this.state.componentKey}`;
|
||||
//
|
||||
// fetch(componentUrl, init)
|
||||
// .then((response: Response) => {
|
||||
// if (response.ok) {
|
||||
// this.toggleEditorDialog();
|
||||
// } else {
|
||||
// this.setState({
|
||||
// ...this.state as any,
|
||||
// errorMsg: `Failed to update/create ComponentModel: `
|
||||
// + ` ${response.status} ${response.statusText}`,
|
||||
// });
|
||||
// }
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// this.setState({
|
||||
// ...this.state as any,
|
||||
// errorMsg: `Failed to update/create ComponentModel: `
|
||||
// + `${error.message}`,
|
||||
// })
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// public getComponentData(): any {
|
||||
//
|
||||
// return {
|
||||
// key: this.state.componentKey,
|
||||
// };
|
||||
// }
|
||||
//
|
||||
// public abstract renderPropertyList(): React.ReactFragment;
|
||||
//
|
||||
// public abstract renderEditorDialog(): React.ReactFragment;
|
||||
//
|
||||
// public render(): React.ReactNode {
|
||||
//
|
||||
// return <li className="componentModelEditor">
|
||||
// <dl>
|
||||
// <dt>Key</dt>
|
||||
// <dd>{this.props.component.key}</dd>
|
||||
// <dt>Type</dt>
|
||||
// <dd>{this.props.component.type}</dd>
|
||||
// {this.renderPropertyList()}
|
||||
// </dl>
|
||||
// <button onClick={(event) => this.closeOnButton(event)}>
|
||||
// Edit
|
||||
// </button>
|
||||
// <dialog aria-labelledby={this.props.component.key
|
||||
// + "_editDialogHeading"}
|
||||
// className={this.state.dialogExpanded}
|
||||
// onKeyPress={(event) => this.closeOnEsc(event)}
|
||||
// open={this.state.dialogOpened}
|
||||
// tabIndex={0}>
|
||||
// <button className="closeButton"
|
||||
// onClick={(event) => this.closeOnButton(event)}>
|
||||
// <span className="screenreader">Close</span>
|
||||
// <span className="fa fa-times-circle"></span>
|
||||
// </button>
|
||||
// <h1 id={this.props.component.key + "_editDialogHeading"}>
|
||||
// Edit component {this.props.component.key}
|
||||
// </h1>
|
||||
// <form onSubmit={this.handleSubmit}>
|
||||
// <label htmlFor={this.props.component.key + "_componentKey"}>
|
||||
// Key
|
||||
// </label>
|
||||
// <input id={this.props.component.key + "_componentKey"}
|
||||
// onChange={this.handleChange}
|
||||
// required={true}
|
||||
// type="text"
|
||||
// value={this.state.componentKey} />
|
||||
// {this.renderEditorDialog()}
|
||||
//
|
||||
// {this.state.errorMsg !== null &&
|
||||
// <div className="errorPanel">
|
||||
// {this.state.errorMsg}
|
||||
// </div>
|
||||
// }
|
||||
// <div className="dialogButtonBar">
|
||||
// <button type="submit">Save</button>
|
||||
// <button onClick={(event) => this.closeOnButton(event)}>
|
||||
// Cancel
|
||||
// </button>
|
||||
// </div>
|
||||
// </form>
|
||||
// </dialog>
|
||||
// </li>;
|
||||
// }
|
||||
//
|
||||
// private closeOnButton(event: React.MouseEvent<HTMLButtonElement>): void {
|
||||
//
|
||||
// event.preventDefault();
|
||||
//
|
||||
// this.toggleEditorDialog();
|
||||
// }
|
||||
//
|
||||
// private closeOnEsc(event: React.KeyboardEvent<HTMLElement>): void {
|
||||
//
|
||||
// console.log(`Key press detected: ${event.key}`);
|
||||
//
|
||||
// if (event.key === "27") {
|
||||
// this.toggleEditorDialog();
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// private toggleEditorDialog(): void {
|
||||
//
|
||||
// if (this.state.dialogExpanded === "dialogExpanded") {
|
||||
// this.setState({
|
||||
// ...this.state as any,
|
||||
// dialogExpanded: "dialogClosed",
|
||||
// dialogOpened: false,
|
||||
// });
|
||||
// } else {
|
||||
// this.setState({
|
||||
// ...this.state as any,
|
||||
// dialogExpanded: "dialogExpanded",
|
||||
// dialogOpened: true,
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// class OldDefaultComponentModelEditor
|
||||
// extends OldAbstractComponentModelEditor<
|
||||
// ComponentModel,
|
||||
// OldComponentModelEditorProps<ComponentModel>,
|
||||
// OldComponentModelEditorState> {
|
||||
//
|
||||
// constructor(props: OldComponentModelEditorProps<ComponentModel>) {
|
||||
//
|
||||
// super(props);
|
||||
//
|
||||
// this.setState({
|
||||
// dialogExpanded: "dialogClosed",
|
||||
// });
|
||||
// }
|
||||
//
|
||||
// public renderPropertyList(): React.ReactFragment {
|
||||
//
|
||||
// return <React.Fragment />;
|
||||
// }
|
||||
//
|
||||
// public renderEditorDialog(): React.ReactFragment {
|
||||
//
|
||||
// return <React.Fragment />;
|
||||
// }
|
||||
//
|
||||
// public render(): React.ReactNode {
|
||||
// return super.render();
|
||||
// }
|
||||
//
|
||||
// }
|
||||
|
||||
// interface PageModelEditorProps {
|
||||
//
|
||||
// }
|
||||
//
|
||||
interface PageModelEditorState {
|
||||
|
||||
selectedPageModel: PageModel | null;
|
||||
|
|
@ -1486,48 +1196,6 @@ interface ComponentInfo {
|
|||
class PageModelEditor
|
||||
extends React.Component<{}, PageModelEditorState> {
|
||||
|
||||
// public static getAvailableComponents(): {
|
||||
// [type: string]: (props: OldComponentModelEditorProps<ComponentModel>)
|
||||
// => React.ReactFragment} {
|
||||
//
|
||||
// console.log("Available editors:");
|
||||
// for(let key of Object.keys(PageModelEditor.componentModelEditors)) {
|
||||
//
|
||||
// console.log(`${key} -> ${PageModelEditor.componentModelEditors}`);
|
||||
// }
|
||||
//
|
||||
// return {
|
||||
// ...PageModelEditor.componentModelEditors,
|
||||
// };
|
||||
// }
|
||||
|
||||
// public static registerComponentModelEditor(
|
||||
// type: string,
|
||||
// generator: ((props: OldComponentModelEditorProps<ComponentModel>)
|
||||
// => React.ReactFragment)): void {
|
||||
//
|
||||
// console.log(`Registering editor for type ${type}...`);
|
||||
//
|
||||
// const editors = {
|
||||
// ...PageModelEditor.componentModelEditors,
|
||||
// };
|
||||
//
|
||||
// editors[type] = generator;
|
||||
// PageModelEditor.componentModelEditors = editors;
|
||||
//
|
||||
// console.log("The following editors are now available:");
|
||||
// for(let key of Object.keys(PageModelEditor.componentModelEditors)) {
|
||||
//
|
||||
// console.log(`${key} -> ${PageModelEditor.componentModelEditors}`);
|
||||
// }
|
||||
// console.log("-----------------------");
|
||||
// }
|
||||
//
|
||||
// private static componentModelEditors: {
|
||||
// [type: string]: <C extends ComponentModel>(
|
||||
// props: OldComponentModelEditorProps<C>) => React.ReactFragment;
|
||||
// };
|
||||
|
||||
private static getDispatcherPrefix(): string {
|
||||
|
||||
const dataElem: HTMLElement | null = document
|
||||
|
|
@ -1568,13 +1236,6 @@ class PageModelEditor
|
|||
|
||||
super(props);
|
||||
|
||||
// this.state = {
|
||||
// // selectedPageModel: newPageModel,
|
||||
// context: {
|
||||
// pageModelSelected: false,
|
||||
// selectedPageModel: newPageModel,
|
||||
// },
|
||||
// };
|
||||
this.state = {
|
||||
errorMessages: [],
|
||||
pageModels: [],
|
||||
|
|
@ -1745,10 +1406,6 @@ class PageModelEditor
|
|||
private reload(): void {
|
||||
|
||||
this.fetchPageModels();
|
||||
// this.setState({
|
||||
// ...this.state,
|
||||
// selectedPageModel: null,
|
||||
// });
|
||||
}
|
||||
|
||||
private selectPageModel(selectedPageModel: PageModel): void {
|
||||
|
|
@ -1761,14 +1418,4 @@ class PageModelEditor
|
|||
};
|
||||
});
|
||||
}
|
||||
|
||||
// private setSelectedPageModel(selectedPageModel: PageModel): void {
|
||||
//
|
||||
// this.setState((state: any) => {
|
||||
// return {
|
||||
// ...state,
|
||||
// selectedPageModel,
|
||||
// };
|
||||
// });
|
||||
// }
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue