added refresh to chatwindow

client/actions/testActions.js

@@ -1,6 +1,6 @@
 import axios from 'axios';
 import { browserHistory } from 'react-router'; 
-import { SET_CURRENT_REPLY } from './types';
+import { SET_CURRENT_REPLY, CLEAR_WINDOW } from './types';
 import { config } from '../config';
 
 export function setCurrentReply(json,message){
@@ -11,6 +11,11 @@ export function setCurrentReply(json,message){
     }
 }
 
+export function clearChatWindow(){
+	return{
+		type: CLEAR_WINDOW
+	}
+}
 
 export function sendMessage(payload) {
    return dispatch => {
@@ -20,4 +25,10 @@ export function sendMessage(payload) {
            dispatch(setCurrentReply(json, message));
        })
    } 
-}
+}
+
+export function clearBox(){
+    return dispatch => {
+		dispatch(clearChatWindow());
+	}
+}

client/actions/types.js

@@ -42,5 +42,6 @@ export const ADD_SYNONYM = 'ADD_SYNONYM';
 export const REMOVE_SYNONYM = 'REMOVE_SYNONYM';
 
 export const SET_CURRENT_REPLY = 'SET_CURRENT_REPLY';
+export const CLEAR_WINDOW = 'SET_WINDOW_CLEAR';
 
 export const SET_CURRENT_LOGS  = 'SET_CURRENT_LOGS';

client/components/navbar/Navbar.js

@@ -5,7 +5,7 @@ import { browserHistory, Link } from 'react-router';
 import { connect } from 'react-redux';
 import { logout } from '../../actions/loginActions';
 import { beginTraining } from '../../actions/trainActions';
-import { sendMessage } from '../../actions/testActions';
+import { sendMessage, clearBox } from '../../actions/testActions';
 
 import Ozz from '../widget/Ozz';
 import { config } from '../../config';
@@ -28,6 +28,7 @@ class Navbar extends React.Component{
         this.sendMessage = this.sendMessage.bind(this);
         this.logout = this.logout.bind(this);
         this.startTrain = this.startTrain.bind(this);
+        this.clearBox = this.clearBox.bind(this);
     }
 
 
@@ -61,6 +62,11 @@ class Navbar extends React.Component{
         })
     }
 
+    clearBox(){
+        this.props.clearBox();
+        this.setState({"json":{},"messages":[]})
+    }
+
     startTrain(e){
         var $toastContent = $('<span>Training   <i class="fa fa-gear fa-spin" style="font-size:24px;margin-top:4%"></i></span>');
         Materialize.toast($toastContent, 30000);
@@ -233,7 +239,7 @@ class Navbar extends React.Component{
                         </ul>
                         <a href="#" data-activates="slide-out" className="button-collapse hide-on-large-only"><i className="material-icons">menu</i></a>
                     </nav>
-                    <Ozz config={config} messages={this.state.messages} sendMessage={this.sendMessage} json={this.state.json}></Ozz>
+                    <Ozz config={config} messages={this.state.messages} clearBox={this.clearBox} sendMessage={this.sendMessage} json={this.state.json}></Ozz>
             </header>
         );
     }
@@ -255,4 +261,4 @@ function mapStateToProps(state){
     }
 }
 
-export default connect(mapStateToProps, { logout, beginTraining, sendMessage })(Navbar);
+export default connect(mapStateToProps, { logout, beginTraining, sendMessage, clearBox })(Navbar);

client/components/widget/Ozz.js

@@ -48,7 +48,7 @@ class Ozz extends React.Component{
 
         return(
             <div className="ozz" id="ozz">
-                {active ? <OzzBase active={active} config={config} messages={this.props.messages} sendMessage={this.props.sendMessage} json={this.props.json} isDemo={false}/> : false}
+                {active ? <OzzBase active={active} config={config} messages={this.props.messages} clearBox={this.props.clearBox} sendMessage={this.props.sendMessage} json={this.props.json} isDemo={false}/> : false}
 
                 <Button 
                     active={active}
@@ -60,4 +60,4 @@ class Ozz extends React.Component{
     }
 }
 
-export default Ozz;
+export default Ozz;

client/components/widget/OzzBase.js

@@ -72,7 +72,7 @@ class OzzBase extends React.Component{
                 transform: `translateY(${interpolatingStyles.y}px)`
                 }}
             >
-                <OzzHeader active={active} rest={stable} config={config}/>
+                <OzzHeader active={active} rest={stable} config={config} clearBox={this.props.clearBox}/>
                 <div style={{"height":"100%","width":"100%"}} className="row">
                     <div className="col s6" style={{"height":"100%","padding":"0"}}>
                         <ChatList color={config.color} messages={this.props.messages}/>
@@ -92,4 +92,4 @@ class OzzBase extends React.Component{
   }
 }
 
-export default OzzBase;
+export default OzzBase;

client/components/widget/OzzHeader.js

@@ -1,36 +1,50 @@
 import React from 'react';
 import {Motion, spring} from 'react-motion';
 
-const presets = {
-  default: { stiffness: 330, damping: 20 },
-};
 
-const OzzHeader = ({ active, rest, config }) => (
-  <Motion
-    defaultStyle={{
-      y: 60,
-    }}
-    style={{
-      y: spring(active && rest ? 60 : 60, presets.default),
-    }}
-  >
-    {interpolatingStyles =>
-      <header
-        className="ozz-header"
-        style={{
-          height: interpolatingStyles.y,
-          transform: `translate(${interpolatingStyles.height}px)`,
-          textAlign: 'center',
-          color:'white',
-          background:config.color
-        }}
-      >
-      <br/>
-      <span style={{"marginBottom":"2%"}}>{config.name} - Test</span>
-      <br/>
-      </header>
-    }
-  </Motion>
-);
+class OzzHeader extends React.Component{
+	constructor(props){
+		super(props);
+	}
 
-export default OzzHeader;
+	clearWindow(){
+		this.props.clearBox();
+	}
+
+	render(){
+	   const presets = {
+  	     default: { stiffness: 330, damping: 20 },
+           };
+
+	   return(
+		<Motion
+		  defaultStyle={{
+			  y:60,
+		  }}
+		  style={{
+			  y: spring(this.props.active && this.props.rest ? 60 : 60, presets.default)
+		  }}
+		>
+		{interpolatingStyles => 
+			<header
+			   className="ozz-header"
+			   style={{
+				height: interpolatingStyles.y,
+				transform: `translate(${interpolatingStyles.height}px)`,
+				textAlign: 'center',
+				color:'white',
+				background:this.props.config.color
+			   }}
+			>
+			<br/>
+				<span style={{"marginBottom":"2%"}}>{this.props.config.name} - Test</span>
+				<i className="material-icons right"  onClick={this.clearWindow.bind(this)} style={{"cursor":"pointer"}}>refresh</i> 
+			<br/>
+			</header>
+		}
+		</Motion>
+	   )
+	}
+}
+
+export default OzzHeader;

client/config.js

@@ -2,4 +2,4 @@
 //export const config = {"url":"http://localhost:5000/api"};
 
 // Production Config
-export const config = {"url":"/api"};
+export const config = {"url":"/api"};

client/reducers/test.js

@@ -1,4 +1,4 @@
-import { SET_CURRENT_REPLY } from '../actions/types';
+import { SET_CURRENT_REPLY, CLEAR_WINDOW } from '../actions/types';
 import isEmpty from 'lodash/isEmpty';
 
 const initialState = {
@@ -20,6 +20,11 @@ export default (state = initialState, action = {}) => {
         json: action.json,
         messages:state.messages.concat(new_messages)
       };
+    case CLEAR_WINDOW:
+	return {
+		json:{},
+		messages:[]
+	}
     default: return state;
   }
-}
+}

client/rootReducer.js

@@ -24,4 +24,4 @@ export default combineReducers({
     examples,
     test,
     analytics
-})
+})

releases/release.json

@@ -1,3 +1,3 @@
 {
-    "version" : "0.8.3"
-}
+    "version" : "0.8.4"
+}

releases/v0.8.4/css/custom.css

@@ -0,0 +1,95 @@
+html, body {
+    max-width: 100%;
+    height:100%;
+    overflow-x: hidden;
+}
+
+#app{
+    height:100%
+}
+
+a {
+    color: inherit;
+}
+
+a:hover {
+    color: inherit;
+    text-decoration: none;
+}
+
+.ctas-button:hover{
+    color:black;
+    text-decoration: none;
+}
+
+/* label focus color */
+.input-field input[type=text]:focus + label {
+    color: #000;
+}
+
+.input-field input[type=email]:focus + label {
+    color: #000;
+}
+
+.input-field input[type=password]:focus + label {
+    color: #000;
+}
+
+textarea.materialize-textarea:focus:not([readonly]) + label {
+    color: #000;
+}
+
+/* label underline focus color */
+.input-field input[type=text]:focus {
+    border-bottom: 1px solid #ABA0CB;
+    box-shadow: 0 1px 0 0 #ABA0CB;
+}
+
+.input-field input[type=email]:focus {
+    border-bottom: 1px solid #ABA0CB;
+    box-shadow: 0 1px 0 0 #ABA0CB;
+}
+
+.input-field input[type=password]:focus {
+    border-bottom: 1px solid #ABA0CB;
+    box-shadow: 0 1px 0 0 #ABA0CB;
+}
+
+textarea.materialize-textarea:focus:not([readonly]) {
+    border-bottom: 1px solid #ABA0CB;
+    box-shadow: 0 1px 0 0 #ABA0CB;
+}
+
+header, main, footer {
+    padding-left: 240px;
+}
+
+@media only screen and (max-width : 992px) {
+    header, main, footer {
+    padding-left: 0;
+    }
+}
+
+.side-nav a:hover{
+    color:#ABA0CB
+}
+
+.side-nav .collapsible-body>ul:not(.collapsible)>li.active, .side-nav.fixed .collapsible-body>ul:not(.collapsible)>li.active {
+    background-color: #ABA0CB;
+}
+
+.dropdown-content li > a, .dropdown-content li > span {
+    color: #ABA0CB;
+}
+
+main{
+    height: 100%
+}
+
+.full{
+    height: 100%
+}
+
+.ozz_color{
+    background: #ABA0CB;
+}