Example #1
0
File: app.js Project: arccoza/casr
module.exports = function() {
  // var user = null;
  var app = new StateManager({
    el: '#app',
    base: '/app',
    activeClass: 'here',
    beforeEach(ctx) {
      // if (ctx.state.name === 'private') {
      //   return { redirect: 'not_allowed' };
      // }
      // console.log(ctx);
      // if(ctx.state.parentState &&
      //   ctx.state.parentState.name == 'auth' &&
      //   ctx.state.name != 'auth.login' &&
      //   ctx.state.name != 'auth.register' ) {
      //   return { redirect: 'auth.login' }
      // }

      // sessions.get()
      //     .then(rep => {
      //       if(rep.userCtx.name)
      //         return rep.userCtx;
      //       else
      //         throw rep.userCtx;
      //     })
      //     .then(rep => user = rep)
      //     .catch(err => { redirect: 'auth.login' })
    }
  });
  var _go = app.go.bind(app);
  app.go = (function(dest) {
    ds.data.destination = dest;
    _go(dest);
  }).bind(app);
  var goto = app.go.bind(app);
  var root = null;
  var ds = { // DataStore
    data: {
      auth: {},
      user: null,
      docs: {
        selected: {},
        get selectedCount() {
          var count = 0;
          for(var i in this.selected) {
            count += this.selected[i] ? 1 : 0;
          }
          return count;
        }
      },
      dbSync: {},
      pageTitle: '...',
      menuItems: { register: true, login: true },
      isBusy: false,
      busyMsg: 'Working...'
    },
    user: {

    }
  };

  ds.user.check = userCheck;
  ds.user.login = userLogin;
  ds.user.logout = userLogout;

  var syncHandler;
  function dbSyncOn() {
    if(localDb && remoteDb) {
      console.log('--dbSync--')
      syncHandler = localDb.sync(remoteDb, { live: true, retry: true })
        // .on('error', err => data.dbSync.error = err)
        // .on('complete', info => data.dbSync.info = info)
        .on('active', console.log.bind(console, 'sync active: '))
        .on('denied', console.log.bind(console, 'sync denied:'))
        .on('error', console.log.bind(console, 'sync error: '))
        .on('complete', console.log.bind(console, 'sync complete: '))
    }
  }

  function dbSyncOff() {
    if(syncHandler) {
      syncHandler.cancel();
      syncHandler = null;
    }
  }

  function userCheck() {
    if(!ds.data.user) {
      return sessions.get()
        .then(rep => {
          if(rep.userCtx.name && (rep.userCtx.roles && rep.userCtx.roles.indexOf('admins') > -1))
            return rep.userCtx;
          else
            throw rep.userCtx;
        })
        .then(rep => {
          ds.data.user = rep;

          if(!syncHandler)
            dbSyncOn();

          return { redirect: ds.data.destination || 'reservations' };
        })
        .catch(err => {
          return { redirect: 'auth.login' }
        })
    }

    if(ds.data.user.roles && ds.data.user.roles.indexOf('admins') > -1) {
      if(!syncHandler)
        dbSyncOn();

      return { redirect: ds.data.destination || 'reservations' };
    }
    else {
      return { redirect: 'auth.login' };
    }
  }

  function userLogin(username, password) {
    if(!ds.data.user) {
      console.log(username, password)
      return sessions.add(username, password)
        .then(rep => {
          if(rep.roles && rep.roles.indexOf('admins') > -1) {
            delete rep.ok;
            return rep;
          }
          else
            throw { reason: 'Privilege error' }
        })
        .then(rep => {
          ds.data.user = rep;

          if(!syncHandler)
            dbSyncOn();

          return { redirect: 'reservations' };
        })
        .catch(err => {
          console.log(err);
          ds.data.auth.error = err.reason;
          return { redirect: 'auth.login' }
        })
    }
    else
      return { redirect: 'reservations' }
  }

  function userLogout() {
    // if(ds.data.user) {
      return sessions.rem()
        .then(rep => {
          ds.data.user = null;

          dbSyncOff();
          return { redirect: 'auth.login' };
        })
        .catch(err => {
          ds.data.auth.error = err.reason;
          return { redirect: 'auth.logout' }
        })
    // }
  }

  app.add('root', {
    path: '/',
    redirect: 'reservations',
    enter(ctx) {
      root = ctx;
      ctx.data = {
        data: ds.data,
        goto: goto
      }
      console.log('--root--')
      // return { redirect: 'reservations' }
    },
    component: require('./components/root/root.vue')
  });

  app.add('do', {
    parent: 'root',
    enter(ctx) {
      ds.data.isBusy = true;
      ds.data.busyMsg = 'Working...';
    }
  });

  app.add('authenticated', {
    parent: 'root',
    path: '/auth',
    // redirect: 'do.auth',
    enter(ctx) {
      ds.data.isBusy = false;
      ds.data.busyMsg = 'Working...';
      ds.data.menuItems = { accommodation: true, reservations: true, users: true, logout: true };
      console.log('--authenticated--');

      if(!ds.data.user)
        return { redirect: 'do.auth' }
    }
  });

  app.add('accommodation', {
    parent: 'authenticated',
    path: '/accommodation',
    enter(ctx) {
      ds.data.pageTitle = 'Accommodation';
    },
    component: require('./components/accommodation/accommodation.vue')
  });

  app.add('accommodation.rem', {
    parent: 'authenticated',
    path: '/accommodation/rem',
    enter(ctx) {
      ds.data.pageTitle = 'Remove Accommodation';
      ds.data.isEdit = false;
    },
    component: require('./components/accommodation/rem.vue')
  });

  app.add('accommodation.add', {
    parent: 'authenticated',
    path: '/accommodation/add',
    enter(ctx) {
      ds.data.pageTitle = 'Add Accommodation';
      ds.data.isEdit = false;
    },
    component: require('./components/accommodation/add.vue')
  });

  app.add('accommodation.edit', {
    parent: 'authenticated',
    path: '/accommodation/edit',
    enter(ctx) {
      ds.data.pageTitle = 'Edit Accommodation';
      ds.data.isEdit = true;
    },
    component: require('./components/accommodation/add.vue')
  });

  app.add('reservations', {
    parent: 'authenticated',
    path: '/reservations',
    enter(ctx) {
      ds.data.pageTitle = 'Reservations';
    }
  });

  app.add('users', {
    parent: 'authenticated',
    path: '/users',
    enter(ctx) {
      ds.data.pageTitle = 'Users';
    }
  });


  app.add('authenticate', {
    parent: 'root',
    enter(ctx) {
      ds.data.pageTitle = 'Authenticate';
      ds.data.isBusy = false;
      ds.data.busyMsg = 'Working...';
      ds.data.menuItems = { register: false, login: true };
      console.log('--authenticate--');
    }
  });

  app.add('auth.register', {
    parent: 'authenticate',
    path: '/auth/register',
    enter(ctx) {
      ctx.data.isRegister = true;
    },
    component: require('./components/auth/login.vue')
  });

  app.add('auth.login', {
    parent: 'authenticate',
    path: '/auth/login',
    enter(ctx) {
    },
    component: require('./components/auth/login.vue')
  });

  app.add('auth.logout', {
    parent: 'authenticated',
    path: '/auth/logout',
    enter(ctx) {
      ds.data.pageTitle = 'Authenticate';
    },
    component: require('./components/auth/logout.vue')
  });



  app.add('do.auth', {
    parent: 'do',
    enter(ctx) {
      var userPrm = userCheck();
      console.log('--do.auth--')
      // userPrm.catch(rep => ds.data.menuItems = { register: true, login: true })

      return userPrm;
    }
  });

  app.add('do.auth.register', {
    parent: 'do',
    enter(ctx) {
      ds.data.busyMsg = 'Registering...';
    }
  });

  app.add('do.auth.login', {
    parent: 'do',
    params: {
      username: null,
      password: null
    },
    enter(ctx) {
      ds.data.busyMsg = 'Logging in...';
      return userLogin(ds.data.auth.username, ds.data.auth.password);
    }
  });

  app.add('do.auth.logout', {
    parent: 'do',
    enter(ctx) {
      console.log('--do.auth.logout--')
      ds.data.busyMsg = 'Logging out...';
      return userLogout();
    }
  });

  return app;
}
Example #2
0
File: main.js Project: coyotevz/hrc
Vue.http.options.root = 'http://localhost:5000/api/v1'

// Install vue mdl
Vue.use(VueMdl)

// Install vue-transfer-dom, required by mdl-dialog
Vue.use(VueTransferDom)

Vue.config.debug = true

let manager = new StateManager({
  el: 'application'
})

manager.add('root', {
  component: require('components/welcome')
})

manager.add('app', {
  component: require('components/application')
})

manager.add('employees', {
  parent: 'app',
  path: '/employees',
  enter (ctx) {
    return Vue.http.get('employees')
      .then(response => { ctx.data.employees = response.data.objects })
  },
  component: require('components/employees')
})