WIP: Send control commands from status dialog #265

src/ic/confirm-command.js

@@ -0,0 +1,48 @@
+/**
+ * This file is part of VILLASweb.
+ *
+ * VILLASweb is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * VILLASweb is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with VILLASweb. If not, see <http://www.gnu.org/licenses/>.
+ ******************************************************************************/
+
+import React from 'react';
+import { Button, Modal} from 'react-bootstrap';
+
+class ConfirmCommand extends React.Component {
+    onModalKeyPress = (event) => {
+        if (event.key === 'Enter') {
+            event.preventDefault();
+
+            this.props.onClose(false);
+        }
+      }
+
+    render() {
+        return <Modal keyboard show={this.props.show} onHide={() => this.props.onClose(false)} onKeyPress={this.onModalKeyPress}>
+            <Modal.Header>
+                <Modal.Title>Confirm {this.props.command}</Modal.Title>
+            </Modal.Header>
+
+            <Modal.Body>
+                Are you sure you want to {this.props.command} <strong>'{this.props.name}'</strong>?
+            </Modal.Body>
+
+            <Modal.Footer>
+                <Button onClick={() => this.props.onClose(true)}>Cancel</Button>
+                <Button onClick={() => this.props.onClose(false)}>Confirm</Button>
+            </Modal.Footer>
+        </Modal>;
+    }
+}
+
+export default ConfirmCommand;

src/ic/ic-dialog.js

@@ -3,6 +3,7 @@ import {FormLabel, Button} from 'react-bootstrap';
 import Dialog from '../common/dialogs/dialog';
 import {Collapse} from 'react-collapse';
 import Icon from "../common/icon";
+import ConfirmCommand from './confirm-command';
 
 
 
@@ -13,6 +14,8 @@ class ICDialog extends React.Component {
     super(props);
 
     this.state = {
+      confirmCommand: false,
+      command: '',
     };
   }
 
@@ -33,6 +36,15 @@ class ICDialog extends React.Component {
     console.log("graph error");
   }
 
+  closeConfirmModal(canceled){
+    if(!canceled){
+      this.props.sendControlCommand(this.state.command);
+    }
+
+    this.setState({confirmCommand: false, command: ''});
+  }
+
+  
   render() {
 
     let objectURL=''
@@ -91,7 +103,15 @@ class ICDialog extends React.Component {
               )}
           </div>
         </form>
+        
+        <div>Controls</div>
+        <Button onClick={() => this.setState({ confirmCommand: true, command: 'restart' })}>Restart</Button>
+        <Button onClick={() => this.setState({ confirmCommand: true, command: 'shutdown' })}>Shutdown</Button>
+
+        <ConfirmCommand show={this.state.confirmCommand} command={this.state.command} name={this.props.ic.name} onClose={c => this.closeConfirmModal(c)} />
+
       </Dialog>
+      
     );
   }
 }

src/ic/ics.js

@@ -365,6 +365,10 @@ class InfrastructureComponents extends Component {
     this.setState({ icModal: true, modalIC: ic, modalICStatus: icStatus, modalICGraph: icGraph, modalIndex: index })
   }
 
+  sendControlCommand(command){
+    console.log(command);
+  }
+
   render() {
     const buttonStyle = {
       marginLeft: '10px'
@@ -435,7 +439,7 @@ class InfrastructureComponents extends Component {
         <NewICDialog show={this.state.newModal} onClose={data => this.closeNewModal(data)} />
         <EditICDialog show={this.state.editModal} onClose={data => this.closeEditModal(data)} ic={this.state.modalIC} />
         <ImportICDialog show={this.state.importModal} onClose={data => this.closeImportModal(data)} />
-        <ICDialog show={this.state.icModal} onClose={data => this.closeICModal(data)} ic={this.state.modalIC} token={this.state.sessionToken} icStatus={this.state.modalICStatus} icGraph={this.state.modalICGraph} />
+        <ICDialog show={this.state.icModal} onClose={data => this.closeICModal(data)} ic={this.state.modalIC} token={this.state.sessionToken} icStatus={this.state.modalICStatus} icGraph={this.state.modalICGraph} sendControlCommand={(command) => this.sendControlCommand(command)}/>
 
         <DeleteDialog title="infrastructure-component" name={this.state.modalIC.name || 'Unknown'} show={this.state.deleteModal} onClose={(e) => this.closeDeleteModal(e)} />
       </div>