Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

convert some React fields to ES6

Browse Source 
- renamed empty label to placeholder
This commit is contained in:
Jonathan Labreuille
2016-05-19 15:19:31 +02:00
parent 6074aa927b
commit 4c265d1339
4 changed files with 93 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
assets/js/src/form/fields/date.jsx
View File

@@ -10,9 +10,9 @@ define([
const yearsRange = 100;
const years = [];
if (this.props.empty_value_label !== undefined) {
if (this.props.placeholder !== undefined) {
years.push((
<option value="" key={ 0 }>{ this.props.empty_value_label }</option>
<option value="" key={ 0 }>{ this.props.placeholder }</option>
));
}
@@ -41,9 +41,9 @@ define([
render() {
const months = [];
if (this.props.empty_value_label !== undefined) {
if (this.props.placeholder !== undefined) {
months.push((
<option value="" key={ 0 }>{ this.props.empty_value_label }</option>
<option value="" key={ 0 }>{ this.props.placeholder }</option>
));
}
@@ -71,9 +71,9 @@ define([
render() {
const days = [];
if (this.props.empty_value_label !== undefined) {
if (this.props.placeholder !== undefined) {
days.push((
<option value="" key={ 0 }>{ this.props.empty_value_label }</option>
<option value="" key={ 0 }>{ this.props.placeholder }</option>
));
}
@@ -178,7 +178,7 @@ define([
key={ 'year' }
name={ this.props.field.name }
year={ this.state.year }
empty_value_label={ this.props.field.empty_year_label }
placeholder={ this.props.field.year_placeholder }
/>);
break;
@@ -190,7 +190,7 @@ define([
name={ this.props.field.name }
month={ this.state.month }
monthNames={ monthNames }
empty_value_label={ this.props.field.empty_month_label }
placeholder={ this.props.field.month_placeholder }
/>);
break;
@@ -201,7 +201,7 @@ define([
key={ 'day' }
name={ this.props.field.name }
day={ this.state.day }
empty_value_label={ this.props.field.empty_day_label }
placeholder={ this.props.field.day_placeholder }
/>);
break;
}

102
assets/js/src/form/fields/select.jsx
View File

@@ -1,60 +1,54 @@
define([
'react'
],
function(
React
) {
const FormFieldSelect = React.createClass({
render: function() {
if (this.props.field.values === undefined) {
return false;
}
import React from 'react'
let values = this.props.field.values;
let filter = false;
let empty_option = false;
const FormFieldSelect = React.createClass({
render() {
if (this.props.field.values === undefined) {
return false;
}
if (this.props.field.empty_value_label !== undefined) {
empty_option = (
<option value="">{ this.props.field.empty_value_label }</option>
);
}
let filter = false;
let placeholder = false;
if (this.props.field['filter'] !== undefined) {
filter = this.props.field.filter;
}
const options = Object.keys(values).map(
(value, index) => {
if (filter !== false && filter(this.props.item, value) === false) {
return;
}
return (
<option
key={ 'option-' + index }
value={ value }>
{ this.props.field.values[value] }
</option>
);
}
);
return (
<select
name={ this.props.field.name }
id={ 'field_'+this.props.field.name }
value={ this.props.item[this.props.field.name] }
onChange={ this.props.onValueChange }
{...this.props.field.validation}
>
{empty_option}
{options}
</select>
if (this.props.field.placeholder !== undefined) {
placeholder = (
<option value="">{ this.props.field.placeholder }</option>
);
}
});
return FormFieldSelect;
});
if (this.props.field['filter'] !== undefined) {
filter = this.props.field.filter;
}
const options = Object.keys(this.props.field.values).map(
(value, index) => {
if (filter !== false && filter(this.props.item, value) === false) {
return;
}
return (
<option
key={ 'option-' + index }
value={ value }>
{ this.props.field.values[value] }
</option>
);
}
);
return (
<select
name={ this.props.field.name }
id={ 'field_'+this.props.field.name }
value={ this.props.item[this.props.field.name] }
onChange={ this.props.onValueChange }
{...this.props.field.validation}
>
{placeholder}
{options}
</select>
);
}
});
module.exports = FormFieldSelect;

67
assets/js/src/form/fields/text.jsx
View File

@@ -1,40 +1,35 @@
define([
'react'
],
function(
React
) {
const FormFieldText = React.createClass({
render: function() {
let value = this.props.item[this.props.field.name];
if(value === undefined) {
value = this.props.field.defaultValue || '';
}
import React from 'react'
return (
<input
type="text"
disabled={
(this.props.field['disabled'] !== undefined)
? this.props.field.disabled(this.props.item)
: false
}
className={ (this.props.field.size) ? '' : 'regular-text' }
size={
(this.props.field.size !== 'auto' && this.props.field.size > 0)
? this.props.field.size
: false
}
name={ this.props.field.name }
id={ 'field_'+this.props.field.name }
value={ value }
placeholder={ this.props.field.placeholder }
onChange={ this.props.onValueChange }
{...this.props.field.validation}
/>
);
const FormFieldText = React.createClass({
render() {
let value = this.props.item[this.props.field.name];
if (value === undefined) {
value = this.props.field.defaultValue || '';
}
});
return FormFieldText;
return (
<input
type="text"
disabled={
(this.props.field['disabled'] !== undefined)
? this.props.field.disabled(this.props.item)
: false
}
className={ (this.props.field.size) ? '' : 'regular-text' }
size={
(this.props.field.size !== 'auto' && this.props.field.size > 0)
? this.props.field.size
: false
}
name={ this.props.field.name }
id={ 'field_'+this.props.field.name }
value={ value }
placeholder={ this.props.field.placeholder }
onChange={ this.props.onValueChange }
{...this.props.field.validation}
/>
);
}
});
module.exports = FormFieldText;