diff --git a/static/js/shop.jsx b/static/js/shop.jsx index 1b812c0..ce4c4ab 100644 --- a/static/js/shop.jsx +++ b/static/js/shop.jsx @@ -712,6 +712,7 @@ class ProductCartItem extends React.PureComponent { key={"processed_options" + index} id={"processed_options" + index} target={((outvar, value) => { + console.log(outvar, value); options_data[outvar] = value; this.setState(options_data); })} diff --git a/static/js/shop_components.jsx b/static/js/shop_components.jsx index be43d9f..4e94edd 100644 --- a/static/js/shop_components.jsx +++ b/static/js/shop_components.jsx @@ -143,6 +143,69 @@ function LineWrapper(target, id, data, {title, fallback, outvar}) { return ; } +class SwitchLine extends Component { + constructor(props) { + super(props); + // Initialize the state object with the initial values from the props + this.state = { + text: props.outvar in props.data ? props.data[props.outvar].text : (props.fallback ? props.fallback.text : ""), + checked: props.outvar in props.data ? props.data[props.outvar].checked : (props.fallback ? props.fallback.checked : false) + }; + // Bind the event handler to this + this.handleText = this.handleText.bind(this); + this.handleCheck = this.handleCheck.bind(this); + this.props.target(this.props.outvar, this.state); + } + + handleText(element) { + let new_state = { + ...this.state, + text: element.target.value + } + this.setState(new_state); + this.props.target(this.props.outvar, new_state); + } + + handleCheck() { + // Update the state object with the new value for outvar + let new_state = { + text: !this.state.checked ? this.state.text : "", + checked: !this.state.checked + } + this.setState(new_state); + this.props.target(this.props.outvar, new_state); + } + + render() { + let key = this.props.id + this.props.outvar; + return ( +
+ +
+ + +
+ +
+ ); + } +} + +function SwitchLineWrapper(target, id, data, {title, fallback, outvar}) { + return ; +} + + function UnimplementedComponent(type, id) { //console.error("Missing component with type:", type) @@ -153,6 +216,7 @@ const componentsList = { "Radio": RadioWrapper, "Switch": SwitchWrapper, "Line": LineWrapper, + "SwitchLine": SwitchLineWrapper, "Default": UnimplementedComponent, };