From 0cc882060c19c20af110616d19f9e29f772ac97b Mon Sep 17 00:00:00 2001
From: Theo Weijmer <t.weijmer@pensare.nl>
Date: Mon, 25 Dec 2017 20:23:32 +0100
Subject: [PATCH] users

---
 application/controllers/Main.php              |  18 +--
 application/controllers/Menu.php              |   4 +-
 .../controllers/beheer/RolesController.php    |  34 +++++
 .../controllers/beheer/usersController.php    |  33 ++++
 application/core/MY_Controller.php            |   9 +-
 application/models/eloquent/BaseModel.php     |  55 +++++++
 application/models/eloquent/Page.php          |  22 ++-
 application/models/eloquent/Role.php          |  46 ++++++
 application/models/eloquent/User.php          |  37 ++++-
 application/views/main_view.php               |  45 +++---
 application/views/modals/user_modal.php       | 141 ++++++++++++++++++
 application/views/pages/content.php           |   3 +
 application/views/pages/dashboard_view.php    |   1 +
 .../views/pages/login/dashboard_view.php      |   1 +
 application/views/pages/login/login_view.php  |   3 +-
 application/views/pages/projects_view.php     |   1 +
 application/views/pages/users_view.php        |  44 ++++++
 application/views/partials/_content.php       |   3 -
 application/views/partials/_css.php           |   5 +-
 application/views/partials/_js.php            |  13 +-
 application/views/partials/_modals.php        |   6 +
 application/views/partials/_navbar-left.php   |   4 +-
 public/css/correction.css                     |   4 +
 public/css/images/dbo-01-80x80.png            | Bin 0 -> 4760 bytes
 public/css/main.css                           |   9 ++
 public/js/lib/dataservices.js                 |   6 -
 public/js/lib/dataservices/pageDataservice.js |  18 +++
 .../js/lib/dataservices/rolesDataservice.js   |  23 +++
 public/js/lib/dataservices/userDataservice.js |  33 ++++
 public/js/lib/helpers.js                      |  13 ++
 public/js/lib/main.js                         |  16 +-
 public/js/lib/modules/beheer/usersModule.js   |  46 ++++++
 public/js/lib/modules/login/loginModule.js    |   2 +-
 public/js/lib/modules/menuModule.js           |  38 ++++-
 public/js/lib/modules/modals/userModal.js     | 118 +++++++++++++++
 public/js/lib/pageDataservice.js              |  13 --
 36 files changed, 781 insertions(+), 86 deletions(-)
 create mode 100644 application/controllers/beheer/RolesController.php
 create mode 100644 application/controllers/beheer/usersController.php
 create mode 100644 application/models/eloquent/BaseModel.php
 create mode 100644 application/models/eloquent/Role.php
 create mode 100644 application/views/modals/user_modal.php
 create mode 100644 application/views/pages/content.php
 create mode 100644 application/views/pages/dashboard_view.php
 create mode 100644 application/views/pages/login/dashboard_view.php
 create mode 100644 application/views/pages/projects_view.php
 create mode 100644 application/views/pages/users_view.php
 delete mode 100644 application/views/partials/_content.php
 create mode 100644 application/views/partials/_modals.php
 create mode 100644 public/css/images/dbo-01-80x80.png
 create mode 100644 public/css/main.css
 delete mode 100644 public/js/lib/dataservices.js
 create mode 100644 public/js/lib/dataservices/pageDataservice.js
 create mode 100644 public/js/lib/dataservices/rolesDataservice.js
 create mode 100644 public/js/lib/dataservices/userDataservice.js
 create mode 100644 public/js/lib/helpers.js
 create mode 100644 public/js/lib/modules/beheer/usersModule.js
 create mode 100644 public/js/lib/modules/modals/userModal.js
 delete mode 100644 public/js/lib/pageDataservice.js

diff --git a/application/controllers/Main.php b/application/controllers/Main.php
index cde34be..0299dab 100755
--- a/application/controllers/Main.php
+++ b/application/controllers/Main.php
@@ -1,5 +1,5 @@
 <?php
-defined('BASEPATH') OR exit('No direct script access allowed');
+defined( 'BASEPATH' ) OR exit( 'No direct script access allowed' );
 
 class Main extends MY_Controller {
 
@@ -8,17 +8,17 @@ class Main extends MY_Controller {
         parent::__construct();
     }
 
-	public function index()
-	{
-	    if( AUTHENTICATED == FALSE ) return $this->showLoginPage();
+    public function index()
+    {
+        if ( AUTHENTICATED == FALSE ) return $this->showLoginPage();
 
-	    $pages = Page::getPages();
+        $pages = Page::getPages( $this->user );
 
-		$this->load->view('main_view', ['pages'=>$pages]);
-	}
+        $this->load->view( 'main_view', ['pages' => $pages] );
+    }
 
     private function showLoginPage()
     {
-        $this->load->view('pages/login/login_view');
-	}
+        $this->load->view( 'pages/login/login_view' );
+    }
 }
diff --git a/application/controllers/Menu.php b/application/controllers/Menu.php
index 4b9bebf..d3c60d2 100644
--- a/application/controllers/Menu.php
+++ b/application/controllers/Menu.php
@@ -15,7 +15,9 @@ class Menu extends MY_Controller {
 
     public function getAppPages()
     {
-        $appPages = Page
+        $appPages = Page::getAppPages( $this->user );
+
+        $this->json( $appPages );
     }
 
 }
\ No newline at end of file
diff --git a/application/controllers/beheer/RolesController.php b/application/controllers/beheer/RolesController.php
new file mode 100644
index 0000000..db824f2
--- /dev/null
+++ b/application/controllers/beheer/RolesController.php
@@ -0,0 +1,34 @@
+<?php
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 17:06
+ */
+
+class RolesController extends MY_Controller {
+
+    public function __construct()
+    {
+        parent::__construct();
+
+        $models = [];
+        $libraries = [];
+
+        $this->load->model( $models );
+        $this->load->library( $libraries );
+    }
+
+    public function index()
+    {
+
+    }
+
+    public function getAllRoles( $archive = 'F' )
+    {
+        $roles = Role::getAllRoles( $archive );
+
+        $this->json( $roles );
+    }
+
+}
\ No newline at end of file
diff --git a/application/controllers/beheer/usersController.php b/application/controllers/beheer/usersController.php
new file mode 100644
index 0000000..706b702
--- /dev/null
+++ b/application/controllers/beheer/usersController.php
@@ -0,0 +1,33 @@
+<?php
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 10:11
+ */
+
+class usersController extends MY_Controller {
+
+    public function __construct()
+    {
+        parent::__construct();
+
+        $models = [];
+        $libraries = [];
+
+        $this->load->model( $models );
+        $this->load->library( $libraries );
+    }
+
+    public function index()
+    {
+
+    }
+
+    public function getAllUsers( $archive = 'F' )
+    {
+        $users = User::getAllUsers( $archive );
+
+        $this->json( $users );
+    }
+}
\ No newline at end of file
diff --git a/application/core/MY_Controller.php b/application/core/MY_Controller.php
index 31e6b32..11a0b8f 100644
--- a/application/core/MY_Controller.php
+++ b/application/core/MY_Controller.php
@@ -9,6 +9,7 @@
 class MY_Controller extends CI_Controller {
 
     public $authenticated;
+    public $user;
 
     public function __construct()
     {
@@ -22,20 +23,22 @@ class MY_Controller extends CI_Controller {
     private function handle()
     {
         $this->retrieveusersession->handle();
+
+        $this->user = $this->User_model->get( USERID );
     }
 
     function clean_input( $post )
     {
         $value = $this->input->input_stream( $post, TRUE );
 
-        $denulledValue = str_replace( 'null', '', $value);
+        $denulledValue = str_replace( 'null', '', $value );
 
         return $denulledValue;
     }
 
-    public function json($data)
+    public function json( $data )
     {
-        echo json_encode($data);
+        echo json_encode( $data );
     }
 
 }
\ No newline at end of file
diff --git a/application/models/eloquent/BaseModel.php b/application/models/eloquent/BaseModel.php
new file mode 100644
index 0000000..20612ea
--- /dev/null
+++ b/application/models/eloquent/BaseModel.php
@@ -0,0 +1,55 @@
+<?php
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 10:20
+ */
+
+use \Illuminate\Database\Eloquent\Model as Eloquent;
+
+class BaseModel extends Eloquent {
+
+
+    /**
+     * The name of the "created at" column.
+     *
+     * @var string
+     */
+    const CREATED_AT = 'created_by';
+
+    /**
+     * The name of the "updated at" column.
+     *
+     * @var string
+     */
+    const UPDATED_AT = 'last_update_date';
+
+    protected $guarded = [];
+
+    protected $hidden = ['creation_date', 'last_update_date', 'created_by', 'updated_by'];
+
+    protected static $oldValue;
+
+    public static function boot()
+    {
+        parent::boot();
+
+        static::creating( function ( $model ) {
+            if ( AUTHENTICATED )
+            {
+                $user = User::find(USERID);
+                $model->created_by = $user->username;
+                $model->updated_by = $user->username;
+            }
+        } );
+        static::updating( function ( $model ) {
+            if ( AUTHENTICATED )
+            {
+                $user = User::find(USERID);
+                $model->updated_by = $user->username;
+            }
+        } );
+
+    }
+}
\ No newline at end of file
diff --git a/application/models/eloquent/Page.php b/application/models/eloquent/Page.php
index a265baf..7603b45 100644
--- a/application/models/eloquent/Page.php
+++ b/application/models/eloquent/Page.php
@@ -18,20 +18,28 @@ class Page extends Eloquent {
     }
 
 
-    public static function getPages($user)
+    public static function getPages( $user )
     {
-        $pages = Page::whereRaw( 'id = page_id AND ' )
-            ->with( ['subpages' => function($q){
-                $q->whereRaw('id != page_id');
-            }] )
+        $pages = Page::whereRaw( 'id = page_id' )
+            ->with( [
+                'subpages' => function ( $q ) use ( $user ) {
+                    $q->whereRaw(
+                        "id != page_id AND ((SELECT {$user->role} & pagelevel) != 0 OR pagelevel = 0)" );
+                }] )
             ->get();
 
         return $pages;
     }
 
-    public static function getAppPages()
+    public static function getAppPages( $user )
     {
-        $appPages = Page::whereRaw
+        $appPages = Page::select( 'id', 'pageurl' )
+            ->whereAppPage( 'T' )
+            ->whereRaw(
+                "((SELECT {$user->role} & pagelevel) != 0 OR pagelevel = 0)" )
+            ->get();
+
+        return $appPages;
     }
 
 
diff --git a/application/models/eloquent/Role.php b/application/models/eloquent/Role.php
new file mode 100644
index 0000000..06e585a
--- /dev/null
+++ b/application/models/eloquent/Role.php
@@ -0,0 +1,46 @@
+<?php
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 17:07
+ */
+
+class Role extends BaseModel {
+
+    protected $table = "roles";
+
+    public function user()
+    {
+        return $this->hasOne( 'User', 'role', 'rolelevel' );
+    }
+
+    public static function getAllRoles( $archive )
+    {
+        $roleHierarchy = Role::getUserroleHierachy();
+
+        $roles = Role::orderBy( 'rolehierarchy' )
+            ->where( 'rolehierarchy', '>=', $roleHierarchy );
+
+        if ( $archive == 'F' ) $roles = $roles->whereArchive( 'F' );
+
+        $roles = $roles->get();
+
+        return $roles;
+    }
+
+    public static function getUserroleHierachy()
+    {
+        $userrole = User::getUserRoleHierarchy();
+
+        if( $userrole == 0 ) return 0;
+
+        $roleHierarchy = Role::whereRolelevel($userrole)
+            ->first()
+            ->rolehierarchy;
+
+        return $roleHierarchy;
+    }
+
+
+}
\ No newline at end of file
diff --git a/application/models/eloquent/User.php b/application/models/eloquent/User.php
index 30bea4f..af24183 100644
--- a/application/models/eloquent/User.php
+++ b/application/models/eloquent/User.php
@@ -7,12 +7,43 @@
  */
 
 
-use \Illuminate\Database\Eloquent\Model as Eloquent;
-
-class User  extends Eloquent {
+class User extends BaseModel {
 
     protected $table = "users";
 
+    public function role()
+    {
+        return $this->belongsTo( 'Role', 'level', 'rolelevel' );
+    }
+
+    public static function getAllUsers( $archive )
+    {
+        $users = User::orderBy( 'lastname' );
+
+        if ( $archive == 'F' ) $users = $users->whereArchive( 'F' );
+
+        $users = $users->get();
+
+        return $users;
+    }
+
+    public static function getUserRoleHierarchy()
+    {
+        $userrole = User::find( USERID )->role;
+
+        return $userrole;
+    }
+
+    public static function checkUsername( $username )
+    {
+        $username = strtoupper( $username );
+
+        $user = User::whereRaw( "UCASE(username) = {$username}" );
+
+        if ( $user->count() == 0 ) return FALSE;
+
+        return TRUE;
+    }
 
 
 }
\ No newline at end of file
diff --git a/application/views/main_view.php b/application/views/main_view.php
index 88f651f..9e3a022 100644
--- a/application/views/main_view.php
+++ b/application/views/main_view.php
@@ -9,6 +9,8 @@
 <meta name="description" content="bootstrap admin template">
 <meta name="author" content="">
 
+<link rel="icon" href="css/images/dbo-01-80x80.png" type="image/png">
+
 <title>** De Beleidsonderzoeker **</title>
 
 <?php $this->load->view( 'partials/_css' ); ?>
@@ -20,28 +22,33 @@
 </script>
 </head>
 <body id="dbois-app">
+<!-- ko stopBinding: true -->
+<?php $this->load->view('partials/_modals'); ?>
+<!-- /ko -->
+
 <?php $this->load->view( 'partials/_navbar-left' ); ?>
 
-<?php foreach ( $pages as $page ): ?>
-    <?php if ( count( $page->subpages ) == 0 ): ?>
-        <!-- ko stopBinding: true -->
-        <div data-bind="fadeVisible: <?= $pageurl ?>">
-            <?php $this->load->view( 'partials/_content', ['pageurl' => $page->pageurl] ); ?>
-        </div>
-        <!-- /ko -->
-    <?php else: ?>
-        <?php foreach ( $page->subpages as $subpage ): ?>
-            <!-- ko stopBinding: true -->
-            <div data-bind="fadeVisible: <?= $pageurl ?>">
-                <?php $this->load->view( 'partials/_content', ['pageurl' => $subpage->pageurl] ); ?>
+<div id="main-content" data-bind="fadeVisible:initialized" style="display:none">
+    <?php foreach ( $pages as $page ): ?>
+        <?php if ( count( $page->subpages ) == 0 ): ?>
+            <?php if($page->app_page == 'F') continue; ?>
+            <div data-bind="visible: <?= $page->pageurl ?>">
+                <!-- ko stopBinding: true -->
+                <?php $this->load->view( 'pages/content', ['pageurl' => $page->pageurl] ); ?>
+                <!-- /ko -->
             </div>
-            <!-- /ko -->
-        <?php endforeach; ?>
-    <?php endif; ?>
-<?php endforeach; ?>
+        <?php else: ?>
+            <?php foreach ( $page->subpages as $subpage ): ?>
+                <div data-bind="visible: <?= $subpage->pageurl ?>">
+                    <!-- ko stopBinding: true -->
+                    <?php $this->load->view( 'pages/content', ['pageurl' => $subpage->pageurl] ); ?>
+                    <!-- /ko -->
+                </div>
+            <?php endforeach; ?>
+        <?php endif; ?>
+    <?php endforeach; ?>
 
-
-
-<?php $this->load->view( 'partials/_js' ); ?>
+    <?php $this->load->view( 'partials/_js' ); ?>
+</div>
 </body>
 </html>
diff --git a/application/views/modals/user_modal.php b/application/views/modals/user_modal.php
new file mode 100644
index 0000000..d8549c7
--- /dev/null
+++ b/application/views/modals/user_modal.php
@@ -0,0 +1,141 @@
+<div class="modal modal-fade-in-scale-up modal-primary" tabindex="-1" id="user-modal">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">toevoegen / wijzigen gebruiker</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <div class="row">
+                    <div class="col-xl-12">
+                        <div role="form" class="form-horizontal">
+                            <div class="form-group row">
+                                <label class="col-xl-3 form-control-label">
+                                    voornaam
+                                </label>
+                                <div class="col-xl-9">
+                                    <div class="input-group input-group-icon">
+                                        <span class="input-group-addon">
+                                            <i class="icon fa-user"></i>
+                                        </span>
+                                        <input type="text"
+                                               placeholder="voornaam"
+                                               class="form-control"
+                                               data-bind="textInput:firstname,
+                                                            css:{'is-invalid':firstnameInvalid}">
+                                    </div>
+                                    <small class="invalid-feedback"
+                                           data-bind="style:{display: firstnameInvalid() ? 'block' : 'none'}">
+                                        voer een voornaam in<span data-bind="text:firstnameInvalid"></span>
+                                    </small>
+                                </div>
+                            </div>
+                            <div class="form-group row">
+                                <label class="col-xl-3 form-control-label">
+                                    tussenvoegsel
+                                </label>
+                                <div class="col-xl-9">
+                                    <div class="input-group input-group-icon">
+                                        <span class="input-group-addon">
+                                            <i class="icon fa-user"></i>
+                                        </span>
+                                        <input type="text"
+                                               placeholder="tussenvoegsel"
+                                               class="form-control"
+                                               data-bind="textInput:middlename">
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="form-group row">
+                                <label class="col-xl-3 form-control-label">
+                                    achternaam
+                                </label>
+                                <div class="col-xl-9">
+                                    <div class="input-group input-group-icon">
+                                        <span class="input-group-addon">
+                                            <i class="icon fa-user"></i>
+                                        </span>
+                                        <input type="text"
+                                               placeholder="achternaam"
+                                               class="form-control"
+                                               data-bind="textInput:lastname,
+                                                            css:{'is-invalid':lastnameInvalid}">
+                                    </div>
+                                    <small class="invalid-feedback"
+                                           data-bind="style:{display: lastnameInvalid() ? 'block' : 'none'}">
+                                        voer een achternaam in<span data-bind="text:lastnameInvalid"></span>
+                                    </small>
+                                </div>
+                            </div>
+                            <div class="form-group row">
+                                <label class="col-xl-3 form-control-label">
+                                    gebruikersnaam
+                                </label>
+                                <div class="col-xl-9">
+                                    <div class="input-group input-group-icon">
+                                        <span class="input-group-addon">
+                                            <i class="icon fa-user"></i>
+                                        </span>
+                                        <input type="text"
+                                               placeholder="gebruikersnaam"
+                                               class="form-control"
+                                               data-bind="textInput:username,
+                                                            css:{'is-invalid':usernameInvalid}">
+                                    </div>
+                                    <small class="invalid-feedback"
+                                           data-bind="style:{display: usernameInvalid() ? 'block' : 'none'}">
+                                        voer een gebruikernaam in<span data-bind="text:username"></span>
+                                    </small>
+                                </div>
+                            </div>
+                            <div class="form-group row">
+                                <label class="col-xl-3 form-control-label">
+                                    email
+                                </label>
+                                <div class="col-xl-9">
+                                    <div class="input-group input-group-icon">
+                                        <span class="input-group-addon">
+                                            <i class="icon fa-envelope"></i>
+                                        </span>
+                                        <input type="email"
+                                               placeholder="email"
+                                               class="form-control"
+                                               data-bind="textInput:email,
+                                                            css:{'is-invalid':emailInvalid}">
+                                    </div>
+                                    <small class="invalid-feedback"
+                                           data-bind="style:{display: emailInvalid() ? 'block' : 'none'}">
+                                        email ongeldig<span data-bind="text:emailInvalid"></span>
+                                    </small>
+                                </div>
+                            </div>
+                            <div class="form-group row">
+                                <div class="col-xl-3">&nbsp;</div>
+                                <!-- ko foreach:roles -->
+                                <div class="radio-inline">
+                                    <i class="icon fa-circle-o blueish"
+                                       style="cursor:pointer;"
+                                       data-bind="visible:$root.role() != rolelevel,
+                                                    click:$root.setRole"></i>
+                                    <i class="icon fa-check-circle-o greenish"
+                                       data-bind="visible:$root.role() == rolelevel"></i>
+                                    <label data-bind="text:rolename">
+                                    </label>
+                                </div>
+                                <!-- /ko -->
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button"
+                        class="btn btn-success"
+                        data-bind="visible:formValid(), click:saveUser">opslaan</button>
+                <button type="button" class="btn btn-warning" data-dismiss="modal">annuleren</button>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/application/views/pages/content.php b/application/views/pages/content.php
new file mode 100644
index 0000000..5efd6cb
--- /dev/null
+++ b/application/views/pages/content.php
@@ -0,0 +1,3 @@
+<div class="page" id="<?= $pageurl ?>">
+    <?php $this->load->view( 'pages/' . strtolower( $pageurl ) . '_view' ); ?>
+</div>
\ No newline at end of file
diff --git a/application/views/pages/dashboard_view.php b/application/views/pages/dashboard_view.php
new file mode 100644
index 0000000..9a9b30b
--- /dev/null
+++ b/application/views/pages/dashboard_view.php
@@ -0,0 +1 @@
+<h1>DASHBOARD</h1>
\ No newline at end of file
diff --git a/application/views/pages/login/dashboard_view.php b/application/views/pages/login/dashboard_view.php
new file mode 100644
index 0000000..9a9b30b
--- /dev/null
+++ b/application/views/pages/login/dashboard_view.php
@@ -0,0 +1 @@
+<h1>DASHBOARD</h1>
\ No newline at end of file
diff --git a/application/views/pages/login/login_view.php b/application/views/pages/login/login_view.php
index 9f102d6..b4943c1 100644
--- a/application/views/pages/login/login_view.php
+++ b/application/views/pages/login/login_view.php
@@ -9,8 +9,7 @@
 
     <title>Login V3 | Remark Admin Template</title>
 
-    <link rel="apple-touch-icon" href="css/images/apple-touch-icon.png">
-    <link rel="shortcut icon" href="css/images/favicon.ico">
+    <link rel="icon" href="css/images/dbo-01-80x80.png" type="image/png">
 
     <!-- Stylesheets -->
     <link rel="stylesheet" href="css/vendor/bootstrap.min.css">
diff --git a/application/views/pages/projects_view.php b/application/views/pages/projects_view.php
new file mode 100644
index 0000000..2c10887
--- /dev/null
+++ b/application/views/pages/projects_view.php
@@ -0,0 +1 @@
+<h1>projects</h1>
\ No newline at end of file
diff --git a/application/views/pages/users_view.php b/application/views/pages/users_view.php
new file mode 100644
index 0000000..5122fde
--- /dev/null
+++ b/application/views/pages/users_view.php
@@ -0,0 +1,44 @@
+<div class="container">
+    <div class="row">
+        <div class="col-xl-8">
+            <table class="table table-sm">
+                <thead>
+                <tr>
+                    <th>voornaam</th>
+                    <th>achternaam</th>
+                    <th>tussenvoegsel</th>
+                    <th>gebruikersnaam</th>
+                    <th>email</th>
+                    <th>rol</th>
+                    <th>&nbsp;</th>
+                </tr>
+                </thead>
+                <tbody>
+                <tr data-bind="foreach:users">
+                    <td><span data-bind="text:lastname"></span></td>
+                    <td><span data-bind="text:firstname"></span></td>
+                    <td><span data-bind="text:middlename"></span></td>
+                    <td><span data-bind="text:username"</td>
+                    <td><span data-bind="text:email"></span></td>
+                    <td><span data-bind=""></span></td>
+                    <td>
+                        <i class="icon fa-edit greenish" title="wijzig"></i>
+                        <i class="icon fa-archive blueish" title="archiveer"></i>
+                        <i class="icon fa-trash redish" title="verwijder"></i>
+                    </td>
+                </tr>
+                </tbody>
+                <tfoot>
+                <tr>
+                    <td colspan="7">
+                        <button class="btn btn-primary btn-round btn-sm" data-bind="click:newUser">
+                            nieuwe gebruiker
+                        </button>
+                    </td>
+                </tr>
+                </tfoot>
+
+            </table>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/application/views/partials/_content.php b/application/views/partials/_content.php
deleted file mode 100644
index cf355f2..0000000
--- a/application/views/partials/_content.php
+++ /dev/null
@@ -1,3 +0,0 @@
-<div class="page" id="<?= $pageurl?>">
-    <h1><?= $pageurl?></h1>
-</div>
\ No newline at end of file
diff --git a/application/views/partials/_css.php b/application/views/partials/_css.php
index ea3b354..efe51c1 100644
--- a/application/views/partials/_css.php
+++ b/application/views/partials/_css.php
@@ -3,7 +3,9 @@
 
 <!-- Stylesheets VENDOR -->
 <link rel="stylesheet" href="css/vendor/bootstrap.min.css">
-<link rel="stylesheet" href="css/vendor/bootstrap-extend.min.css">
+<link rel="stylesheet" href="css/vendor/bootstrap-extend.css">
+<link rel="stylesheet" href="fonts/font-awesome/font-awesome.min.css">
+
 <link rel="stylesheet" href="css/vendor/site.min.css">
 
 <link rel="stylesheet" href="vendor/plugins/animsition/animsition.css">
@@ -15,6 +17,7 @@
 
 <!-- Stylesheets Pensare -->
 <link rel="stylesheet" href="css/correction.css">
+<link rel="stylesheet" href="css/main.css">
 
 <!-- End Stylesheets Pensare -->
     
\ No newline at end of file
diff --git a/application/views/partials/_js.php b/application/views/partials/_js.php
index f6c1cf8..78ee7a4 100644
--- a/application/views/partials/_js.php
+++ b/application/views/partials/_js.php
@@ -49,4 +49,15 @@
 
 <!-- DBOIS -->
 
-<script src="js/lib/main.js"></script>
\ No newline at end of file
+<script src="js/vendor/Knockout.min.js"></script>
+
+<script src="js/lib/main.js"></script>
+<script src="js/lib/modules/menuModule.js"></script>
+<script src="js/lib/modules/beheer/usersModule.js"></script>
+<script src="js/lib/modules/modals/userModal.js"></script>
+
+
+<script src="js/lib/dataservices/pageDataservice.js"></script>
+<script src="js/lib/dataservices/userDataservice.js"></script>
+<script src="js/lib/dataservices/rolesDataservice.js"></script>
+<script src="js/lib/helpers.js"></script>
\ No newline at end of file
diff --git a/application/views/partials/_modals.php b/application/views/partials/_modals.php
new file mode 100644
index 0000000..039d929
--- /dev/null
+++ b/application/views/partials/_modals.php
@@ -0,0 +1,6 @@
+<?php
+
+$this->load->view('modals/user_modal');
+
+?>
+
diff --git a/application/views/partials/_navbar-left.php b/application/views/partials/_navbar-left.php
index 291923e..af72c85 100644
--- a/application/views/partials/_navbar-left.php
+++ b/application/views/partials/_navbar-left.php
@@ -6,7 +6,7 @@
 
         <?php foreach ( $pages as $page ): ?>
             <?php if ( count( $page->subpages ) == 0 ): ?>
-                <li class="site-menu-item" data-bind="click:setPage.bind($data, <?= $page->pageurl ?>)">
+                <li class="site-menu-item" data-bind="click:setPage.bind($data, '<?= $page->pageurl ?>')">
                     <a href="#"><?= $page->pagename ?></a>
                 </li>
             <?php else: ?>
@@ -14,7 +14,7 @@
                     <a href="#"><?= $page->pagename ?></a>
                     <ul class="site-menu-sub">
                         <?php foreach ( $page->subpages as $subpage ): ?>
-                            <li data-bind="click:setPage.bind($data, <?= $subpage->pageurl ?>)">
+                            <li data-bind="click:setPage.bind($data, '<?= $subpage->pageurl ?>')">
                                 <a><?= $subpage->pagename ?></a>
                             </li>
                         <?php endforeach; ?>
diff --git a/public/css/correction.css b/public/css/correction.css
index c95986e..177a7dc 100644
--- a/public/css/correction.css
+++ b/public/css/correction.css
@@ -1,5 +1,9 @@
 body{
     padding-top:0;
+    /*font-size:12px;*/
+}
+.page{
+    background-color: #fff;
 }
 .site-menubar{
     top:0;
diff --git a/public/css/images/dbo-01-80x80.png b/public/css/images/dbo-01-80x80.png
new file mode 100644
index 0000000000000000000000000000000000000000..48320b7c4c46d0bedafe6909527004e685bff5ec
GIT binary patch
literal 4760
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

literal 0
HcmV?d00001

diff --git a/public/css/main.css b/public/css/main.css
new file mode 100644
index 0000000..b3a8391
--- /dev/null
+++ b/public/css/main.css
@@ -0,0 +1,9 @@
+.redish{
+    color:#F2353C;
+}
+.blueish{
+    color:#247CF0;
+}
+.greenish{
+    color:#5A9101;
+}
\ No newline at end of file
diff --git a/public/js/lib/dataservices.js b/public/js/lib/dataservices.js
deleted file mode 100644
index dcbb105..0000000
--- a/public/js/lib/dataservices.js
+++ /dev/null
@@ -1,6 +0,0 @@
-/**
- * Created by Pensare Software.
- * User: Theo Weijmer
- * Date: 22/12/2017
- * Time: 13:32
- */
\ No newline at end of file
diff --git a/public/js/lib/dataservices/pageDataservice.js b/public/js/lib/dataservices/pageDataservice.js
new file mode 100644
index 0000000..d449343
--- /dev/null
+++ b/public/js/lib/dataservices/pageDataservice.js
@@ -0,0 +1,18 @@
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 22/12/2017
+ * Time: 13:32
+ */
+
+dbo.pageDataservice = {
+
+    getAppPages : function(callback){
+        $.getJSON('index.php/menu/getAppPages')
+            .done(function(data){
+                callback(data);
+            });
+    }
+
+};
+
diff --git a/public/js/lib/dataservices/rolesDataservice.js b/public/js/lib/dataservices/rolesDataservice.js
new file mode 100644
index 0000000..51f1f3b
--- /dev/null
+++ b/public/js/lib/dataservices/rolesDataservice.js
@@ -0,0 +1,23 @@
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 17:11
+ */
+
+dbo.rolesDataservice = {
+
+    roles: false,
+
+    getAllRoles: function ( archive, callback ) {
+        var ds = dbo.rolesDataservice
+        if ( ds.roles ) callback( ds.roles );
+
+        $.getJSON( 'index.php/beheer/rolesController/getAllRoles/' + archive )
+            .done( function ( data ) {
+                ds.roles = data;
+                callback( data );
+            } );
+    }
+
+}
diff --git a/public/js/lib/dataservices/userDataservice.js b/public/js/lib/dataservices/userDataservice.js
new file mode 100644
index 0000000..b423c9e
--- /dev/null
+++ b/public/js/lib/dataservices/userDataservice.js
@@ -0,0 +1,33 @@
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 09:50
+ */
+
+dbo.userDataService = {
+
+    getAllUsers: function ( archive = 'F', callback ) {
+        $.getJSON( 'index.php/beheer/usersController/getAllUsers/' + archive )
+            .done( function ( data ) {
+                callback( data );
+            } );
+    },
+
+    getUser: function ( userID, callback ) {
+        $.getJSON( 'index.php/beheer/usersController/getUser/' + userID )
+            .done( function ( data ) {
+                callback( data );
+            } );
+    },
+
+    checkUsername: function ( username, callback ) {
+        $.post( 'index.php/beheer/userController/checkUsername', 'json' )
+            .done( function ( data ) {
+                console.log( data );
+                callback( data );
+            } )
+    }
+
+
+}
\ No newline at end of file
diff --git a/public/js/lib/helpers.js b/public/js/lib/helpers.js
new file mode 100644
index 0000000..03d6190
--- /dev/null
+++ b/public/js/lib/helpers.js
@@ -0,0 +1,13 @@
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 19:01
+ */
+
+dbo.helpers = {
+    validateEmail: function ( email ) {
+        var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        return re.test( email.toLowerCase() );
+    }
+}
\ No newline at end of file
diff --git a/public/js/lib/main.js b/public/js/lib/main.js
index ee68d7e..faaabe4 100644
--- a/public/js/lib/main.js
+++ b/public/js/lib/main.js
@@ -20,16 +20,14 @@ $(function(){
 
 
     ko.bindingHandlers.fadeVisible = {
-        init  : function ( element, valueAccessor ) {
-
-            // Initially set the element to be instantly visible/hidden depending on the value
-            var value = valueAccessor();
-            $( element ).toggle( ko.unwrap( value ) ); // Use "unwrapObservable" so we can handle values that may or may not be observable
+        init: function(element, valueAccessor) {
+            var shouldDisplay = valueAccessor();
+            $(element).toggle(shouldDisplay);
         },
-        update: function ( element, valueAccessor ) {
-            // Whenever the value subsequently changes, slowly fade the element in or out
-            var value = valueAccessor();
-            ko.unwrap( value ) ? $( element ).fadeIn( 500 ) : $( element ).fadeOut( 500 );
+        update: function(element, valueAccessor) {
+            // On update, fade in/out
+            var shouldDisplay = valueAccessor();
+            shouldDisplay ? $(element).fadeIn(750) : $(element).fadeOut(750);
         }
     };
 
diff --git a/public/js/lib/modules/beheer/usersModule.js b/public/js/lib/modules/beheer/usersModule.js
new file mode 100644
index 0000000..699bb29
--- /dev/null
+++ b/public/js/lib/modules/beheer/usersModule.js
@@ -0,0 +1,46 @@
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 09:49
+ */
+
+
+dbo.usersInit = function () {
+
+    if ( dbo.usersModel !== undefined ) {
+
+    } else {
+        dbo.usersModel = {
+
+            users: ko.observableArray( [] ),
+            user : ko.observable(),
+            roles: ko.observableArray( [] ),
+
+            init: function () {
+                var vm = dbo.usersModel;
+
+                dbo.userDataService.getAllUsers( 'F', function ( data ) {
+                    vm.users( data );
+                } );
+
+                dbo.rolesDataservice.getAllRoles( 'F', function ( data ) {
+                    vm.roles( data );
+                } );
+            },
+
+            newUser: function () {
+                $( "#user-modal" ).modal( 'show' );
+
+                dbo.editUserModal.newUser();
+            }
+
+
+        };
+
+        dbo.usersModel.init();
+
+        ko.applyBindings( dbo.usersModel, document.getElementById( 'USERS' ) );
+    }
+
+}
\ No newline at end of file
diff --git a/public/js/lib/modules/login/loginModule.js b/public/js/lib/modules/login/loginModule.js
index 0af2c8d..043ac6d 100644
--- a/public/js/lib/modules/login/loginModule.js
+++ b/public/js/lib/modules/login/loginModule.js
@@ -17,7 +17,7 @@ $( function () {
             dbo.loginService.login();
         }
     }
-console.log( 'text' );
+
     ko.applyBindings( dbo.loginModel, document.getElementById( "login-form" ) );
 } );
 
diff --git a/public/js/lib/modules/menuModule.js b/public/js/lib/modules/menuModule.js
index 598d17b..28051ac 100644
--- a/public/js/lib/modules/menuModule.js
+++ b/public/js/lib/modules/menuModule.js
@@ -10,15 +10,41 @@ $( function () {
 
     dbo.menuModel = {
 
-        init : function(){
+        pages      : ko.observable(),
+        initialized: ko.observable( false ),
 
+
+        init: function () {
+            var vm = dbo.menuModel;
+            dbo.pageDataservice.getAppPages( function ( data ) {
+                vm.pages = data;
+                //create for each page an observable
+                $.each( data, function ( i, p ) {
+                    vm[p.pageurl] = ko.observable( false );
+                } );
+
+                // first page will be visible
+                vm[data[0].pageurl]( true );
+
+                ko.applyBindings( dbo.menuModel, document.getElementById( "dbois-app" ) );
+
+                vm.initialized( true );
+            } );
+        },
+
+        setPage: function ( page ) {
+            var vm = dbo.menuModel;
+
+            $.each( vm.pages, function ( i, p ) {
+                vm[p.pageurl]( false );
+            } );
+            vm[page]( true );
+
+            var func = page.toLowerCase() + 'Init';
+            window.dbo[func]();
         }
-
-
     }
 
     dbo.menuModel.init();
-
-    ko.applyBindings(dbo.menuModel, document.getElementById("dbois-app"));
-
 } );
+
diff --git a/public/js/lib/modules/modals/userModal.js b/public/js/lib/modules/modals/userModal.js
new file mode 100644
index 0000000..e9327db
--- /dev/null
+++ b/public/js/lib/modules/modals/userModal.js
@@ -0,0 +1,118 @@
+/**
+ * Created by Pensare Software.
+ * User: Theo Weijmer
+ * Date: 25/12/2017
+ * Time: 17:32
+ */
+
+$( function () {
+    dbo.editUserModal = {
+
+        id        : null,
+        roles     : ko.observableArray( [] ),
+        firstname : ko.observable(),
+        lastname  : ko.observable(),
+        middlename: ko.observable(),
+        username  : ko.observable(),
+        email     : ko.observable(),
+        role      : ko.observable(),
+
+        init: function () {
+            var vm = dbo.editUserModal;
+
+            dbo.rolesDataservice.getAllRoles( 'F', function ( data ) {
+                vm.roles( data );
+            } );
+        },
+
+        newUser: function () {
+            var vm = dbo.editUserModal;
+
+            vm.setUser();
+        },
+
+        setRole: function () {
+            var vm = dbo.editUserModal;
+
+            vm.role( this.rolelevel );
+        },
+
+        saveUser: function () {
+            var vm = dbo.editUserModal;
+
+            if ( vm.formValid == false ) return;
+
+            dbo.userDataService.checkUsername()
+
+            var submitDATA = {
+                firstname : vm.firstname(),
+                middlename: vm.middlename(),
+                lastname  : vm.lastname(),
+                username  : vm.username(),
+                email     : vm.email(),
+                role      : vm.role()
+            }
+
+
+
+
+        },
+
+        setUser: function ( user = false ) {
+            var vm = dbo.editUserModal;
+
+            vm.id = user.id || 0;
+            vm.vm.firstname( user.firstname || '' );
+            vm.lastname( user.firstname || '' );
+            vm.middlename( user.firstname || '' );
+            vm.username( user.username || '' );
+            vm.email( user.email || '' );
+            vm.role( user.role || null );
+        }
+    };
+
+    dbo.editUserModal.init();
+
+    dbo.editUserModal.lastnameInvalid = ko.pureComputed( function () {
+        if ( !this.lastname() ) return true;
+        console.log( this.lastname() );
+
+        if ( this.lastname().length < 2 ) return true;
+
+        return false;
+    }, dbo.editUserModal );
+
+    dbo.editUserModal.firstnameInvalid = ko.pureComputed( function () {
+        if ( !this.firstname() ) return true;
+
+        if ( this.firstname().length < 2 ) return true;
+
+        return false;
+    }, dbo.editUserModal );
+
+    dbo.editUserModal.usernameInvalid = ko.pureComputed( function () {
+        if ( !this.username() ) return true;
+
+        if ( this.username().length < 4 ) return true;
+
+        return false;
+    }, dbo.editUserModal );
+
+    dbo.editUserModal.emailInvalid = ko.pureComputed( function () {
+        if ( !this.email() ) return true;
+
+        return !dbo.helpers.validateEmail( this.email() );
+    }, dbo.editUserModal );
+
+    dbo.editUserModal.formValid = ko.pureComputed( function () {
+        if ( this.firstnameInvalid() ) return false;
+        if ( this.lastnameInvalid() ) return false;
+        if ( this.usernameInvalid() ) return false;
+        if ( this.emailInvalid() ) return false;
+
+        return true;
+    }, dbo.editUserModal )
+
+    ko.applyBindings( dbo.editUserModal, document.getElementById( 'user-modal' ) );
+
+} );
\ No newline at end of file
diff --git a/public/js/lib/pageDataservice.js b/public/js/lib/pageDataservice.js
deleted file mode 100644
index 1eb2f1a..0000000
--- a/public/js/lib/pageDataservice.js
+++ /dev/null
@@ -1,13 +0,0 @@
-/**
- * Created by Pensare Software.
- * User: Theo Weijmer
- * Date: 22/12/2017
- * Time: 13:32
- */
-
-dbo.pageDataservice = {
-
-    $.getJSON('index.php/')
-
-};
-