add keyboard shortcut and clear flag
This commit is contained in:
@@ -70,10 +70,12 @@ export class SafeTextarea extends Component {
|
|||||||
text: window.TEXTAREA_BACKUP[props.id]||'',
|
text: window.TEXTAREA_BACKUP[props.id]||'',
|
||||||
};
|
};
|
||||||
this.on_change_bound=this.on_change.bind(this);
|
this.on_change_bound=this.on_change.bind(this);
|
||||||
|
this.on_keydown_bound=this.on_keydown.bind(this);
|
||||||
this.clear=this.clear.bind(this);
|
this.clear=this.clear.bind(this);
|
||||||
this.area_ref=React.createRef();
|
this.area_ref=React.createRef();
|
||||||
this.change_callback=props.on_change;
|
this.change_callback=props.on_change||(()=>{});
|
||||||
this.change_callback(this.state.text);
|
this.change_callback(this.state.text);
|
||||||
|
this.submit_callback=props.on_submit||(()=>{});
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
@@ -87,6 +89,12 @@ export class SafeTextarea extends Component {
|
|||||||
});
|
});
|
||||||
this.change_callback(event.target.value);
|
this.change_callback(event.target.value);
|
||||||
}
|
}
|
||||||
|
on_keydown(event) {
|
||||||
|
if(event.key==='Enter' && event.ctrlKey && !event.altKey) {
|
||||||
|
event.preventDefault();
|
||||||
|
this.submit_callback();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
clear() {
|
clear() {
|
||||||
this.setState({
|
this.setState({
|
||||||
@@ -102,10 +110,13 @@ export class SafeTextarea extends Component {
|
|||||||
get() {
|
get() {
|
||||||
return this.state.text;
|
return this.state.text;
|
||||||
}
|
}
|
||||||
|
focus() {
|
||||||
|
this.area_ref.current.focus();
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<textarea ref={this.area_ref} onChange={this.on_change_bound} value={this.state.text} />
|
<textarea ref={this.area_ref} onChange={this.on_change_bound} value={this.state.text} onKeyDown={this.on_keydown_bound} />
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
11
src/Title.js
11
src/Title.js
@@ -5,7 +5,7 @@ import {PromotionBar} from './Common';
|
|||||||
|
|
||||||
import './Title.css';
|
import './Title.css';
|
||||||
|
|
||||||
const flag_re=/^\/\/setflag ([a-zA-Z0-9_]+)=(.+)$/;
|
const flag_re=/^\/\/setflag ([a-zA-Z0-9_]+)=(.*)$/;
|
||||||
|
|
||||||
const HELP_TEXT=(
|
const HELP_TEXT=(
|
||||||
<div className="box">
|
<div className="box">
|
||||||
@@ -80,8 +80,13 @@ class ControlBar extends PureComponent {
|
|||||||
if(event.key==='Enter') {
|
if(event.key==='Enter') {
|
||||||
let flag_res=flag_re.exec(this.state.search_text);
|
let flag_res=flag_re.exec(this.state.search_text);
|
||||||
if(flag_res) {
|
if(flag_res) {
|
||||||
localStorage[flag_res[1]]=flag_res[2];
|
if(flag_res[2]) {
|
||||||
alert('Set Flag '+flag_res[1]+'='+flag_res[2]);
|
localStorage[flag_res[1]]=flag_res[2];
|
||||||
|
alert('Set Flag '+flag_res[1]+'='+flag_res[2]+'\nYou may need to refresh this webpage.');
|
||||||
|
} else {
|
||||||
|
delete localStorage[flag_res[1]];
|
||||||
|
alert('Clear Flag '+flag_res[1]+'\nYou may need to refresh this webpage.');
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -183,6 +183,17 @@ export class ReplyForm extends Component {
|
|||||||
this.area_ref=this.props.area_ref||React.createRef();
|
this.area_ref=this.props.area_ref||React.createRef();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
document.addEventListener('keypress',(e)=>{
|
||||||
|
if(e.code==='Enter' && !e.ctrlKey && !e.altKey && ['input','textarea'].indexOf(e.target.tagName.toLowerCase())===-1) {
|
||||||
|
if(this.area_ref.current) {
|
||||||
|
e.preventDefault();
|
||||||
|
this.area_ref.current.focus();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
on_change(value) {
|
on_change(value) {
|
||||||
this.setState({
|
this.setState({
|
||||||
text: value,
|
text: value,
|
||||||
@@ -190,7 +201,7 @@ export class ReplyForm extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
on_submit(event) {
|
on_submit(event) {
|
||||||
event.preventDefault();
|
if(event) event.preventDefault();
|
||||||
if(this.state.loading_status==='loading')
|
if(this.state.loading_status==='loading')
|
||||||
return;
|
return;
|
||||||
this.setState({
|
this.setState({
|
||||||
@@ -234,7 +245,7 @@ export class ReplyForm extends Component {
|
|||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<form onSubmit={this.on_submit.bind(this)} className={'reply-form box'+(this.state.text?' reply-sticky':'')}>
|
<form onSubmit={this.on_submit.bind(this)} className={'reply-form box'+(this.state.text?' reply-sticky':'')}>
|
||||||
<SafeTextarea ref={this.area_ref} id={this.props.pid} on_change={this.on_change_bound} />
|
<SafeTextarea ref={this.area_ref} id={this.props.pid} on_change={this.on_change_bound} on_submit={this.on_submit.bind(this)} />
|
||||||
{this.state.loading_status==='loading' ?
|
{this.state.loading_status==='loading' ?
|
||||||
<button disabled="disabled">
|
<button disabled="disabled">
|
||||||
<span className="icon icon-loading" />
|
<span className="icon icon-loading" />
|
||||||
@@ -260,6 +271,11 @@ export class PostForm extends Component {
|
|||||||
this.on_change_bound=this.on_change.bind(this);
|
this.on_change_bound=this.on_change.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
if(this.area_ref.current)
|
||||||
|
this.area_ref.current.focus();
|
||||||
|
}
|
||||||
|
|
||||||
on_change(value) {
|
on_change(value) {
|
||||||
this.setState({
|
this.setState({
|
||||||
text: value,
|
text: value,
|
||||||
@@ -356,7 +372,7 @@ export class PostForm extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
on_submit(event) {
|
on_submit(event) {
|
||||||
event.preventDefault();
|
if(event) event.preventDefault();
|
||||||
if(this.state.loading_status==='loading')
|
if(this.state.loading_status==='loading')
|
||||||
return;
|
return;
|
||||||
if(this.img_ref.current.files.length) {
|
if(this.img_ref.current.files.length) {
|
||||||
@@ -398,7 +414,7 @@ export class PostForm extends Component {
|
|||||||
</button>
|
</button>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
<SafeTextarea ref={this.area_ref} id="new_post" on_change={this.on_change_bound} />
|
<SafeTextarea ref={this.area_ref} id="new_post" on_change={this.on_change_bound} on_submit={this.on_submit.bind(this)} />
|
||||||
</form>
|
</form>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import {API_BASE} from './Common';
|
|||||||
|
|
||||||
export const API_VERSION_PARAM='&PKUHelperAPI=3.0';
|
export const API_VERSION_PARAM='&PKUHelperAPI=3.0';
|
||||||
export const PKUHELPER_ROOT= // don't use :10301 if we are already in the same domain
|
export const PKUHELPER_ROOT= // don't use :10301 if we are already in the same domain
|
||||||
(document.domain==='pkuhelper.com'||document.domain==='www.pkuhelper.com') ? '/' : 'http://pkuhelper.com:10301/';
|
(document.domain==='pkuhelper.com'||document.domain==='www.pkuhelper.com') ? '/' : '//pkuhelper.com/';
|
||||||
|
|
||||||
function token_param(token) {
|
function token_param(token) {
|
||||||
return API_VERSION_PARAM + (token ? ('&user_token='+token) : '');
|
return API_VERSION_PARAM + (token ? ('&user_token='+token) : '');
|
||||||
|
|||||||
Reference in New Issue
Block a user