unitylock 0.1.0

data/app/components/LockTableComponent.js

@@ -0,0 +1,59 @@
+import { basename }                    from '../utils/FileUtils'
+import React, { Component, PropTypes } from 'react'
+import { Table, TableBody, TableHeader, TableHeaderColumn, TableRow, TableRowColumn } from 'material-ui/Table'
+
+class LockTableComponent extends Component {
+  constructor(props) {
+    super(props)
+    this.handleOnCellClick = this.handleOnCellClick.bind(this);
+  }
+
+  handleOnCellClick(index) {
+    let selectedData = this.props.list[index];
+    this.props.onDataClick(this.props.user, selectedData);
+  }
+
+  render() {
+    const _data = this.props.list;
+    const _user = this.props.user;
+    this.data   = _data;
+
+    return (
+      <Table
+        multiSelectable={false}
+        onCellClick={this.handleOnCellClick}
+      >
+        <TableHeader enableSelectAll={false}>
+          <TableRow>
+            <TableHeaderColumn>User</TableHeaderColumn>
+            <TableHeaderColumn>File</TableHeaderColumn>
+            <TableHeaderColumn>Path</TableHeaderColumn>
+            <TableHeaderColumn>Time</TableHeaderColumn>
+          </TableRow>
+        </TableHeader>
+        <TableBody>
+          {_data.map( (item, index) => (
+            <TableRow key={index} selectable={item.user == null || item.user == _user}>
+              <TableRowColumn>{item.user}</TableRowColumn>
+              <TableRowColumn>{basename(item.file)}</TableRowColumn>
+              <TableRowColumn>{item.file}</TableRowColumn>
+              <TableRowColumn>{item.updated_at}</TableRowColumn>
+            </TableRow>
+          ))}
+        </TableBody>
+      </Table>
+    )
+  }
+}
+
+LockTableComponent.propTypes = {
+  user: PropTypes.string.isRequired,
+  list: PropTypes.arrayOf(PropTypes.shape({
+    user:       PropTypes.string.isDefined,
+    file:       PropTypes.string.isRequired,
+    updated_at: PropTypes.string.isRequired
+  }).isRequired).isRequired,
+  onDataClick: PropTypes.func.isRequired,
+}
+
+export default LockTableComponent

data/app/components/LoginDialogComponent.js

@@ -0,0 +1,69 @@
+import React, { Component, PropTypes } from 'react'
+import Dialog                          from 'material-ui/Dialog'
+import FlatButton                      from 'material-ui/FlatButton'
+import RaisedButton                    from 'material-ui/RaisedButton'
+import TextField                       from 'material-ui/TextField'
+
+class LoginDialogComponent extends Component {
+  constructor(props) {
+    super(props)
+    this.state = {
+      user: this.props.user,
+    }
+    this.handleOnLoginClick = this.handleOnLoginClick.bind(this)
+    this.handleOnTextChange = this.handleOnTextChange.bind(this)
+  }
+
+  handleOnLoginClick() {
+    this.props.onLoginRequest(this.state.user)
+  }
+
+  handleOnTextChange(event) {
+    this.setState({
+      user: event.target.value,
+    })
+  }
+
+  render () {
+    const actions = [
+      <FlatButton
+        label="Cancel"
+        onTouchTap={this.props.onCancelRequest}
+        />,
+      <FlatButton
+        label="Login"
+        primary={true}
+        onTouchTap={this.handleOnLoginClick}
+        />,
+    ]
+
+    return (
+        <div>
+          <Dialog
+              title='Login'
+              actions={actions}
+              modal={false}
+              open={this.props.open}
+              >
+            Input your name:
+            <br/>
+            <TextField
+              id='text-field-controlled'
+              hintText='User Name'
+              value={this.state.user}
+              onChange={this.handleOnTextChange}
+              />
+          </Dialog>
+        </div>
+    )
+  }
+}
+
+LoginDialogComponent.propTypes = {
+  open: PropTypes.bool.isRequired,
+  user: PropTypes.string.isRequired,
+  onLoginRequest: PropTypes.func.isRequired,
+  onCancelRequest: PropTypes.func.isRequired,
+}
+
+export default LoginDialogComponent

data/app/containers/App.js

@@ -0,0 +1,18 @@
+import React, { Component, PropTypes } from 'react'
+import MuiThemeProvider     from 'material-ui/styles/MuiThemeProvider'
+import LockTable            from './LockTable'
+import LockAppBar           from './LockAppBar'
+import AppSnackBar          from './AppSnackBar'
+import LoginDialog          from './LoginDialog'
+import FooterComponent      from '../components/FooterComponent'
+
+const App = () => (
+  <div>
+    <LockAppBar />
+    <LockTable />
+    <AppSnackBar />
+    <LoginDialog />
+    <FooterComponent />
+  </div>
+)
+export default App

data/app/containers/AppSnackBar.js

@@ -0,0 +1,19 @@
+import AppSnackBarComponent from '../components/AppSnackBarComponent'
+import { connect }          from 'react-redux'
+
+const mapStateToProps = (state) => {
+  return {
+    message: state.snack_message || '',
+  }
+};
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  return {}
+};
+
+const AppSnackBar = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(AppSnackBarComponent)
+
+export default AppSnackBar

data/app/containers/LockAppBar.js

@@ -0,0 +1,30 @@
+import { connect }         from 'react-redux'
+import LockAppBarComponent from '../components/LockAppBarComponent'
+import search              from '../action_creators/Search'
+import snack_message       from '../action_creators/SnackMessage'
+import login_dialog_action from '../action_creators/LoginDialogAction'
+
+const mapStateToProps = (state) => {
+  return {}
+};
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  return {
+    onLoginClick: () => {
+      login_dialog_action(dispatch, true)
+    },
+    onSyncClick: () => {
+      search(dispatch)
+        .then((_) => {
+          snack_message(dispatch, 'synchronized');
+        })
+    },
+  }
+};
+
+const LockAppBar = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(LockAppBarComponent)
+
+export default LockAppBar

data/app/containers/LockTable.js

@@ -0,0 +1,44 @@
+import { connect }        from 'react-redux'
+import LockTableComponent from '../components/LockTableComponent'
+import search             from '../action_creators/Search'
+import lock               from '../action_creators/Lock'
+import unlock             from '../action_creators/Unlock'
+
+const mapStateToProps = (state) => {
+  return {
+    list: state['data'],
+    user: state['user'] || 'sample_user',
+  }
+};
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  return {
+    onDataClick: (user, selectedData) => {
+      if (user == null || user == '') {
+        console.warn("user not defined");
+        return;
+      }
+
+      let dataFile = selectedData['file']
+      let dataUser = selectedData['user']
+
+      // unlock
+      if (dataUser) {
+        unlock(dispatch, user, dataFile)
+          .then((it) => { search(dispatch) })
+      }
+      // lock
+      else {
+        lock(dispatch, user, dataFile)
+          .then((it) => { search(dispatch) })
+      }
+    }
+  }
+};
+
+const LockTable = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(LockTableComponent)
+
+export default LockTable

data/app/containers/LoginDialog.js

@@ -0,0 +1,32 @@
+import { connect }          from 'react-redux'
+import LoginDialogComponent from '../components/LoginDialogComponent'
+import login_dialog_action  from '../action_creators/LoginDialogAction'
+import login                from '../action_creators/Login'
+import snack_message        from '../action_creators/SnackMessage'
+
+const mapStateToProps = (state) => {
+  return {
+    open: state.login_dialog_open,
+    user: state.user,
+  }
+};
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  return {
+    onLoginRequest: (user) => {
+      login(dispatch, user)
+        .then(_ => login_dialog_action(dispatch, false))
+        .then(_ => snack_message(dispatch, 'Logined as ' + user))
+    },
+    onCancelRequest: () => {
+      login_dialog_action(dispatch, false)
+    },
+  }
+};
+
+const LoginDialog = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(LoginDialogComponent)
+
+export default LoginDialog

data/app/index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>unitylock</title>
+    <link rel="stylesheet" type="text/css" href="/static/main.css">
+    <!--
+<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
+<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
+<link rel="manifest" href="/manifest.json">
+<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
+<meta name="theme-color" content="#ffffff">
+    -->
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="/static/bundle.js"></script>
+  </body>
+</html>

data/app/index.js

@@ -0,0 +1,44 @@
+import React                from 'react'
+import ReactDOM             from 'react-dom'
+import { Provider }         from 'react-redux'
+import { compose, createStore } from 'redux'
+import persistState         from 'redux-localstorage'
+import injectTapEventPlugin from 'react-tap-event-plugin'
+import MuiThemeProvider     from 'material-ui/styles/MuiThemeProvider'
+
+import reducers             from './reducers'
+import App                  from './containers/App'
+import search               from './action_creators/Search'
+import login                from './action_creators/Login'
+import snack_message        from './action_creators/SnackMessage'
+
+injectTapEventPlugin()
+
+const enhancer = compose(persistState('user'))
+const store    = createStore(reducers, enhancer)
+const rootElement = document.getElementById('root')
+
+function render()
+{
+  ReactDOM.render(
+      <MuiThemeProvider>
+        <Provider store={store}>
+          <App />
+        </Provider>
+      </MuiThemeProvider>,
+      rootElement
+  )
+}
+
+if (store.state) {
+  console.log("logined user: " + store.state.user);
+}
+
+render()
+store.subscribe(render)
+
+// initial request
+search(store.dispatch).then((_) => 
+  snack_message(store.dispatch, 'Welcome! ' + store.getState().user)
+)
+

data/app/reducers/index.js

@@ -0,0 +1,33 @@
+export default function list(
+    state = {},
+    action
+)
+{
+  var newState = Object.assign({
+      data: [],
+      user: 'guest',
+      snack_message: '',
+      login_dialog_open: false,
+  }, state)
+
+  switch (action.type) {
+    case 'search':
+      newState['data'] = action['data']
+      break;
+    case 'login':
+      newState['user'] = action['user']
+      break;
+    case 'snack_message':
+      newState['snack_message'] = action['snack_message']
+      break;
+    case 'login_dialog_open':
+      newState['login_dialog_open'] = action.login_dialog_open
+      break;
+    default:
+      break;
+  }
+
+  console.log("reduced: " + action.type);
+
+  return newState;
+}

data/app/server.js

@@ -0,0 +1,2 @@
+require('./src/server.js')
+require('./src/socket.js')

data/app/src/client.js

@@ -0,0 +1,35 @@
+var WebSocketClient = require('websocket').client;
+var port            = 8080
+var client          = new WebSocketClient();
+ 
+client.on('connectFailed', function(error) {
+    console.log('Connect Error: ' + error.toString());
+});
+ 
+client.on('connect', function(connection) {
+    console.log('WebSocket Client Connected');
+    connection.on('error', function(error) {
+        console.log("Connection Error: " + error.toString());
+    });
+    connection.on('close', function() {
+        console.log('echo-protocol Connection Closed');
+    });
+
+
+    connection.on('message', function(message) {
+        if (message.type === 'utf8') {
+            console.log("Received: '" + message.utf8Data + "'");
+        }
+    });
+    
+    function sendNumber() {
+        if (connection.connected) {
+            var number = Math.round(Math.random() * 0xFFFFFF);
+            connection.sendUTF(number.toString());
+            setTimeout(sendNumber, 1000);
+        }
+    }
+    sendNumber();
+});
+ 
+client.connect('ws://localhost:' + port, 'echo-protocol');

data/app/src/helper.js

@@ -0,0 +1,85 @@
+var fs = require('fs')
+
+// { path: { path:"", owner:"", updated_at: 0 } }
+// TODO: synchronize
+// TODO: mysql support
+class Helper {
+  constructor(file) {
+    this.file = file
+  }
+
+  raw() {
+    return new Promise((resolve, reject) => {
+      fs.readFile(this.file, (err, text) => {
+        if (err) {
+          // reject(err)
+          resolve({})
+          return
+        }
+        resolve(JSON.parse(text))
+      })
+    })
+  }
+
+  search() {
+    return this.raw()
+      .then(hash => {
+        return hash.values || []
+      })
+  }
+
+  fetch_by_path(path) {
+    return this.raw()
+      .then(hash => {
+        return hash[path]
+      })
+  }
+
+  update_user_by_row(row) {
+    this.row()
+      .then(hash => {
+        let hashkeys = hash.keys || []
+        hash[row.path]
+
+      })
+  }
+
+  create_or_update_by_pathes(pathes) {
+    return new Promise((resolve, reject) => {
+      this.raw()
+        .then(hash => {
+          let hashkeys = hash.keys || []
+          pathes.forEach(path => {
+            if (!hashkeys.includes(path)) {
+              hash[path] = { path: path, updated_at: Date.now() }
+            } else {
+              hash[path]["updated_at"] = Date.now()
+            }
+          })
+          return hash
+        })
+        .then(hash => {
+          var writeData = JSON.stringify(hash)
+          fs.writeFile(this.file, writeData, (err) => {
+            if (err != null) { reject(err) }
+            let hashvalues = (Object.keys(hash) || []).map(it => hash[it])
+            let result     = hashvalues.filter(it => pathes.includes(it.path)) || []
+            resolve(result)
+          })
+        })
+    })
+  }
+
+  delete_by_path(path) {
+    return raw()
+      .then(hash => {
+        delete hash[path]
+        return hash
+      })
+      .then(hash => {
+        fs.writeFile(this.file, JSON.stringify(hash))
+      })
+  }
+}
+
+export default Helper