Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-10-27 11:02:16 +01:00
Code Issues Projects Releases Wiki Activity

56 Clean up input form for feature toggles

Browse Source
This commit is contained in:
ivaosthu 2014-11-29 11:43:41 +01:00 committed by Ivar Conradi Østhus
parent 63b3c56cc5
commit bc4b80c661
4 changed files with 63 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
public/js/components/feature/Feature.jsx
View File

@ -68,9 +68,19 @@ var Feature = React.createClass({
{this.props.feature.strategy}
</td>
<td>
<input className="mrs mbs" type='button' value='Edit' onClick={this.toggleEditMode}/>
<input type='button' value='History' onClick={this.toggleHistory} />
<td width="100">
<div className="line">
<div className="unit size1of2">
<button className="mrs mbs" type='button' title='Edit' onClick={this.toggleEditMode}>
<span className="icon-redigere" />
</button>
</div>
<div className="unit size1of2">
<button type='button' title='History' onClick={this.toggleHistory}>
<span className="icon-visning_liste" />
</button>
</div>
</div>
</td>
</tr>
{this.state.showHistory ? this.renderHistory() : this.renderEmptyRow()}

87
public/js/components/feature/FeatureForm.jsx
View File

@ -1,4 +1,5 @@
var React = require('react');
var TextInput = require('../form/TextInput');
var strategyStore = require('../../stores/StrategyStore');
var FeatureForm = React.createClass({
@ -22,51 +23,59 @@ var FeatureForm = React.createClass({
enabled: false
};
var title = this.props.feature ? "Edit '" + this.props.feature.name + "'" : "Create new toggle";
return (
<form ref="form" className="bg-blue-xlt">
<div className="line mal ptl pbl">
<div className="bg-lilac-xlt r-pam">
<form ref="form" className="r-size1of2">
<div className="unit prl r-size1of6">
<input ref="enabled" type="checkbox" defaultChecked={feature.enabled} />
</div>
<fieldset>
<legend>{title}</legend>
<div className="unit r-size2of5">
<input
type="text"
className="mbs"
id="name"
ref="name"
disabled={feature.name.length}
defaultValue={feature.name}
placeholder="Enter name" />
<TextInput
id="name"
name="name"
label="Name"
value={feature.name}
disabled={feature.name.length}
ref="name"
placeholder="Toggle name" />
<input className=""
type="text"
ref="description"
defaultValue={feature.description}
placeholder="Enter description" />
</div>
<TextInput
id="description"
name="description"
label="Description"
value={feature.description}
ref="description"
placeholder="Enter description" />
<div className="unit r-size2of6 plm">
<select id="strategy"
ref="strategy"
className=""
defaultValue={feature.strategy}>
{this.renderStrategyOptions()}
</select>
</div>
<div className="formelement">
<label htmlFor="strategy">Strategy</label>
<div class="input select">
<select id="strategy" ref="strategy" defaultValue={feature.strategy}>
{this.renderStrategyOptions()}
</select>
</div>
</div>
<div className="unit r-size1of6 rightify">
<button className="primary mrs" onClick={this.saveFeature}>
Save
</button>
<div className="formelement">
<div className="input">
<ul className="inputs-list">
<li>
<input id="active" ref="enabled" type="checkbox" defaultChecked={feature.enabled} />
<label htmlFor="active">Active</label>
</li>
</ul>
</div>
</div>
</fieldset>
<button className="" onClick={this.cancelFeature}>
Cancel
</button>
</div>
<div className="actions">
<button className="primary mrs" onClick={this.saveFeature}>Save</button>
<button className="" onClick={this.cancelFeature}>Cancel</button>
</div>
</form>
</div>
</form>
);
},
@ -86,8 +95,8 @@ var FeatureForm = React.createClass({
e.preventDefault();
var feature = {
name: this.refs.name.getDOMNode().value,
description: this.refs.description.getDOMNode().value,
name: this.refs.name.getValue(),
description: this.refs.description.getValue(),
strategy: this.refs.strategy.getDOMNode().value,
enabled: this.refs.enabled.getDOMNode().checked
};

1
public/js/components/form/TextInput.jsx
View File

@ -35,6 +35,7 @@ var TextInput = React.createClass({
name={this.props.name}
defaultValue={this.props.value}
placeholder={this.props.placeholder}
disabled={this.props.disabled}
ref="input" />
</div>
</div>

2
public/js/components/strategy/StrategyForm.jsx
View File

@ -58,7 +58,7 @@ var StrategyForm = React.createClass({
render: function() {
return (
<div className="line pam bg-blue-xlt">
<div className="line r-pam bg-lilac-xlt">
<div className="unit r-size1of2">
<form onSubmit={this.onSubmit}>
<fieldset>