Moved ImageAdder to its own file
To make merging easier and such
This commit is contained in:
parent
d18012b58d
commit
4ba64cc93f
2 changed files with 60 additions and 56 deletions
59
src/imageadder.tsx
Normal file
59
src/imageadder.tsx
Normal file
|
@ -0,0 +1,59 @@
|
|||
import bind from 'bind-decorator';
|
||||
import * as React from 'react';
|
||||
|
||||
interface ImageAddedProps
|
||||
{
|
||||
addImageCallback: ( url: string ) => void;
|
||||
validateUrlCallback: ( url: string ) => boolean;
|
||||
}
|
||||
|
||||
interface ImageAdderState
|
||||
{
|
||||
url: string;
|
||||
}
|
||||
|
||||
export class ImageAdder extends React.Component< ImageAddedProps, ImageAdderState >
|
||||
{
|
||||
constructor( props: any )
|
||||
{
|
||||
super( props );
|
||||
|
||||
this.state = { url: "" };
|
||||
}
|
||||
|
||||
@bind
|
||||
private handleChange( event: React.ChangeEvent<HTMLInputElement> )
|
||||
{
|
||||
this.setState( { url: event.target.value });
|
||||
}
|
||||
|
||||
@bind
|
||||
private handleSubmit(event: React.FormEvent< HTMLFormElement > )
|
||||
{
|
||||
if (this.props.validateUrlCallback(this.state.url))
|
||||
{
|
||||
this.props.addImageCallback( this.state.url );
|
||||
event.preventDefault();
|
||||
}
|
||||
else
|
||||
{
|
||||
alert("given image is invalid"); //could eventually replace this with something on the render
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
return (
|
||||
<form onSubmit={ this.handleSubmit }>
|
||||
<label>
|
||||
Image URL to add:
|
||||
<input type="text" value={this.state.url } onChange={this.handleChange} />
|
||||
</label>
|
||||
<input type="submit" value="Submit" />
|
||||
</form> );
|
||||
}
|
||||
}
|
||||
|
||||
|
57
src/main.tsx
57
src/main.tsx
|
@ -3,6 +3,7 @@ import { EAction, EHand, g_builtinModelBox, InitialInterfaceLock, Av } from '@aa
|
|||
import bind from 'bind-decorator';
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import { ImageAdder } from './imageadder';
|
||||
|
||||
class MenuItem extends React.Component< {displayImage, onClick}, {}> //class for items on the menu, basically just a button
|
||||
{
|
||||
|
@ -126,62 +127,6 @@ class ImageMenu extends React.Component< {}, ImageMenuState> //class for the who
|
|||
}
|
||||
|
||||
|
||||
interface ImageAddedProps
|
||||
{
|
||||
addImageCallback: ( url: string ) => void;
|
||||
validateUrlCallback: ( url: string ) => boolean;
|
||||
}
|
||||
|
||||
interface ImageAdderState
|
||||
{
|
||||
url: string;
|
||||
}
|
||||
|
||||
class ImageAdder extends React.Component< ImageAddedProps, ImageAdderState >
|
||||
{
|
||||
constructor( props: any )
|
||||
{
|
||||
super( props );
|
||||
|
||||
this.state = { url: "" };
|
||||
}
|
||||
|
||||
@bind
|
||||
private handleChange( event: React.ChangeEvent<HTMLInputElement> )
|
||||
{
|
||||
this.setState( { url: event.target.value });
|
||||
}
|
||||
|
||||
@bind
|
||||
private handleSubmit(event: React.FormEvent< HTMLFormElement > )
|
||||
{
|
||||
if (this.props.validateUrlCallback(this.state.url))
|
||||
{
|
||||
this.props.addImageCallback( this.state.url );
|
||||
event.preventDefault();
|
||||
}
|
||||
else
|
||||
{
|
||||
alert("given image is invalid"); //could eventually replace this with something on the render
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
render()
|
||||
{
|
||||
return (
|
||||
<form onSubmit={ this.handleSubmit }>
|
||||
<label>
|
||||
Image URL to add:
|
||||
<input type="text" value={this.state.url } onChange={this.handleChange} />
|
||||
</label>
|
||||
<input type="submit" value="Submit" />
|
||||
</form> );
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const k_popupHtml =
|
||||
`
|
||||
<!DOCTYPE html>
|
||||
|
|
Loading…
Add table
Reference in a new issue