* Added jScrollPane on some of the admin pages.

* Selected backend menu item is now active.
* The logged in user can see his name on the footer. 
* Completed previleges checks for secretaries.

src/application/controllers/backend.php

@@ -27,8 +27,12 @@ class Backend extends CI_Controller {
         $this->load->model('customers_model');
         $this->load->model('settings_model');
         $this->load->model('roles_model');
+        $this->load->model('user_model');
+        $this->load->model('secretaries_model');
         
         $view['base_url'] = $this->config->item('base_url');
+        $view['user_display_name'] = $this->user_model->get_user_display_name($this->session->userdata('user_id'));
+        $view['active_menu'] = PRIV_APPOINTMENTS;
         $view['book_advance_timeout'] = $this->settings_model->get_setting('book_advance_timeout');
         $view['company_name'] = $this->settings_model->get_setting('company_name');
         $view['available_providers'] = $this->providers_model->get_available_providers();
@@ -36,6 +40,13 @@ class Backend extends CI_Controller {
         $view['customers'] = $this->customers_model->get_batch();
         $this->setUserData($view);
         
+        if ($this->session->userdata('role_slug') == DB_SLUG_SECRETARY) {
+            $secretary = $this->secretaries_model->get_row($this->session->userdata('user_id'));
+            $view['secretary_providers'] = $secretary['providers'];
+        } else {
+            $view['secretary_providers'] = array();
+        }
+        
         if ($appointment_hash != '') {
             $results = $this->appointments_model->get_batch(array('hash' => $appointment_hash));
             $appointment = $results[0];
@@ -63,8 +74,11 @@ class Backend extends CI_Controller {
         $this->load->model('customers_model');
         $this->load->model('services_model');
         $this->load->model('settings_model');
+        $this->load->model('user_model');
         
         $view['base_url'] = $this->config->item('base_url');
+        $view['user_display_name'] = $this->user_model->get_user_display_name($this->session->userdata('user_id'));
+        $view['active_menu'] = PRIV_CUSTOMERS;
         $view['company_name'] = $this->settings_model->get_setting('company_name');
         $view['customers'] = $this->customers_model->get_batch();
         $view['available_providers'] = $this->providers_model->get_available_providers();
@@ -92,8 +106,11 @@ class Backend extends CI_Controller {
         $this->load->model('customers_model');
         $this->load->model('services_model');
         $this->load->model('settings_model');
+        $this->load->model('user_model');
         
         $view['base_url'] = $this->config->item('base_url');
+        $view['user_display_name'] = $this->user_model->get_user_display_name($this->session->userdata('user_id'));
+        $view['active_menu'] = PRIV_SERVICES;
         $view['company_name'] = $this->settings_model->get_setting('company_name');
         $view['services'] = $this->services_model->get_batch();
         $view['categories'] = $this->services_model->get_all_categories();
@@ -120,8 +137,11 @@ class Backend extends CI_Controller {
         $this->load->model('admins_model');
         $this->load->model('services_model');
         $this->load->model('settings_model');
+        $this->load->model('user_model');
         
         $view['base_url'] = $this->config->item('base_url');
+        $view['user_display_name'] = $this->user_model->get_user_display_name($this->session->userdata('user_id'));
+        $view['active_menu'] = PRIV_USERS;
         $view['company_name'] = $this->settings_model->get_setting('company_name');
         $view['admins'] = $this->admins_model->get_batch();
         $view['providers'] = $this->providers_model->get_batch();
@@ -154,6 +174,8 @@ class Backend extends CI_Controller {
         $user_id = $this->session->userdata('user_id'); 
         
         $view['base_url'] = $this->config->item('base_url');
+        $view['user_display_name'] = $this->user_model->get_user_display_name($this->session->userdata('user_id'));
+        $view['active_menu'] = PRIV_SYSTEM_SETTINGS;
         $view['company_name'] = $this->settings_model->get_setting('company_name');
         $view['role_slug'] = $this->session->userdata('role_slug');
         $view['system_settings'] = $this->settings_model->get_settings();

src/application/models/roles_model.php

@@ -39,10 +39,10 @@ class Roles_Model extends CI_Model {
             $privileges_number = $value; 
             
             $value = array(
-                'view' => false,
+                'view' => FALSE,
-                'add' => false,
+                'add' => FALSE,
-                'edit' => false,
+                'edit' => FALSE,
-                'delete' => false
+                'delete' => FALSE
             );
             
             if ($privileges_number > 0) {

src/application/models/user_model.php

@@ -89,6 +89,19 @@ class User_Model extends CI_Model {
         
         return ($user_data) ? $user_data : NULL;
     }
+    
+    /**
+     * Get the given user's display name (first + last name).
+     * 
+     * @param numeric $user_id The given user record id.
+     * @return string Returns the user display name.
+     */
+    public function get_user_display_name($user_id) {
+        if (!is_numeric($user_id))
+            throw new Exception ('Invalid argument given ($user_id = "' . $user_id . '").');
+        $user = $this->db->get_where('ea_users', array('id' => $user_id))->row_array();
+        return $user['first_name'] . ' ' . $user['last_name'];
+    }
 }
 
 /* End of file user_model.php */

src/application/views/appointments/book.php

@@ -272,8 +272,8 @@
                     
                     <div class="frame-content" style="width:600px">
                         <div class="span3">
-                            <label for="first-name">First Name</label>
+                            <label for="first-name">First Name *</label>
-                            <input type="text" id="first-name" maxlength="100" />
+                            <input type="text" id="first-name" class="required" maxlength="100" />
                             
                             <label for="last-name">Last Name *</label>
                             <input type="text" id="last-name" class="required" maxlength="250" />

src/application/views/backend/calendar.php

@@ -18,6 +18,7 @@
         'bookAdvanceTimeout'    : <?php echo $book_advance_timeout; ?>,
         'editAppointment'       : <?php echo json_encode($edit_appointment); ?>,
         'customers'             : <?php echo json_encode($customers); ?>,
+        'secretaryProviders'    : <?php echo json_encode($secretary_providers); ?>,
         'user'                  : {
             'id'        : <?php echo $user_id; ?>,
             'email'     : <?php echo '"' . $user_email . '"'; ?>,
@@ -142,9 +143,9 @@
                 
                 <div class="span5">
                     <div class="control-group">
-                        <label for="first-name" class="control-label">First Name</label>
+                        <label for="first-name" class="control-label">First Name *</label>
                         <div class="controls">
-                            <input type="text" id="first-name" />
+                            <input type="text" id="first-name" class="required" />
                         </div>
                     </div>
 

src/application/views/backend/customers.php

@@ -45,8 +45,8 @@
         <div class="btn-toolbar">
             <div id="add-edit-delete-group" class="btn-group">
                 <?php if ($privileges[PRIV_CUSTOMERS]['add'] == TRUE) { ?>
-                <button id="add-customer" class="btn">
+                <button id="add-customer" class="btn btn-primary">
-                    <i class="icon-plus"></i>
+                    <i class="icon-plus icon-white"></i>
                     Add</button>
                 <?php } ?>
                 
@@ -79,8 +79,8 @@
             <h2>Details</h2>
             <div id="form-message" class="alert" style="display:none;"></div>
             
-            <label for="first-name">First Name</label>
+            <label for="first-name">First Name *</label>
-            <input type="text" id="first-name" class="span11" />
+            <input type="text" id="first-name" class="span11 required" />
 
             <label for="last-name">Last Name *</label>
             <input type="text" id="last-name" class="span11 required" />

src/application/views/backend/footer.php

@@ -5,6 +5,10 @@
         <a href="http://alextselegidis.com">Alex Tselegidis</a> | 
         Licensed Under GPLv3
     </div>
+    
+    <div id="footer-user-display-name">
+        Hello, <?php echo $user_display_name; ?>!
+    </div>
 </div>
 </body>
 </html>

src/application/views/backend/header.php

@@ -35,6 +35,10 @@
         rel="stylesheet" 
         type="text/css" 
         href="<?php echo $base_url; ?>assets/css/general.css">
+    <link 
+        rel="stylesheet" 
+        type="text/css" 
+        href="<?php echo $base_url; ?>assets/css/libs/jquery/jquery.jscrollpane.css">
     
     <?php
         // ------------------------------------------------------------
@@ -61,6 +65,12 @@
     <script 
         type="text/javascript" 
         src="<?php echo $base_url; ?>assets/js/backend.js"></script>
+    <script 
+        type="text/javascript" 
+        src="<?php echo $base_url; ?>assets/js/libs/jquery/jquery.jscrollpane.min.js"></script>
+    <script 
+        type="text/javascript" 
+        src="<?php echo $base_url; ?>assets/js/libs/jquery/jquery.mousewheel.js"></script>
 </head>
 
 <body>
@@ -74,28 +84,32 @@
         <?php // CALENDAR MENU ITEM 
               // ------------------------------------------------------ ?>
         <?php $hidden = ($privileges[PRIV_APPOINTMENTS]['view'] == TRUE) ? '' : 'hidden'; ?>
-        <a href="<?php echo $base_url; ?>backend" class="menu-item <?php echo $hidden; ?>">
+        <?php $active = ($active_menu == PRIV_APPOINTMENTS) ? 'active' : ''; ?>
+        <a href="<?php echo $base_url; ?>backend" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>">
             Calendar
         </a>
         
         <?php // CUSTOMERS MENU ITEM 
               // ------------------------------------------------------ ?>
         <?php $hidden = ($privileges[PRIV_CUSTOMERS]['view'] == TRUE) ? '' : 'hidden'; ?>
-        <a href="<?php echo $base_url; ?>backend/customers" class="menu-item <?php echo $hidden; ?>">
+        <?php $active = ($active_menu == PRIV_CUSTOMERS) ? 'active' : ''; ?>
+        <a href="<?php echo $base_url; ?>backend/customers" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>">
             Customers
         </a>
         
         <?php // SERVICES MENU ITEM 
               // ------------------------------------------------------ ?>
         <?php $hidden = ($privileges[PRIV_SERVICES]['view'] == TRUE) ? '' : 'hidden'; ?>
-        <a href="<?php echo $base_url; ?>backend/services" class="menu-item <?php echo $hidden; ?>">
+        <?php $active = ($active_menu == PRIV_SERVICES) ? 'active' : ''; ?>
+        <a href="<?php echo $base_url; ?>backend/services" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>">
             Services
         </a>
         
         <?php // USERS MENU ITEM 
               // ------------------------------------------------------ ?>
         <?php $hidden = ($privileges[PRIV_USERS]['view'] ==  TRUE) ? '' : 'hidden'; ?>
-        <a href="<?php echo $base_url; ?>backend/users" class="menu-item <?php echo $hidden; ?>">
+        <?php $active = ($active_menu == PRIV_USERS) ? 'active' : ''; ?>
+        <a href="<?php echo $base_url; ?>backend/users" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>">
             Users
         </a>
         
@@ -103,7 +117,8 @@
               // ------------------------------------------------------ ?>
         <?php $hidden = ($privileges[PRIV_SYSTEM_SETTINGS]['view'] == TRUE 
                 || $privileges[PRIV_USER_SETTINGS]['view'] == TRUE) ? '' : 'hidden'; ?>
-        <a href="<?php echo $base_url; ?>backend/settings" class="menu-item <?php echo $hidden; ?>">
+        <?php $active = ($active_menu == PRIV_SYSTEM_SETTINGS) ? 'active' : ''; ?>
+        <a href="<?php echo $base_url; ?>backend/settings" class="menu-item <?php echo $hidden; ?><?php echo $active; ?>">
             Settings
         </a>
         

src/application/views/backend/services.php

@@ -54,8 +54,8 @@
         <div class="details column span7">
             <div class="btn-toolbar">
                 <div class="add-edit-delete-group btn-group">
-                    <button id="add-service" class="btn">
+                    <button id="add-service" class="btn btn-primary">
-                        <i class="icon-plus"></i>
+                        <i class="icon-plus icon-white"></i>
                         Add</button>
                     <button id="edit-service" class="btn" disabled="disabled">
                         <i class="icon-pencil"></i>
@@ -131,8 +131,8 @@
         <div class="details span7">
             <div class="btn-toolbar">
                 <div class="add-edit-delete-group btn-group">
-                    <button id="add-category" class="btn">
+                    <button id="add-category" class="btn btn-primary">
-                        <i class="icon-plus"></i>
+                        <i class="icon-plus icon-white"></i>
                         Add</button>
                     <button id="edit-category" class="btn" disabled="disabled">
                         <i class="icon-pencil"></i>

src/application/views/backend/settings.php

@@ -80,11 +80,11 @@
                 <span class="help-block">Company link should point to the official website of 
                     the company (optional).</span>
                 
-                <br><br>
+                <br>
                 
-                <a href="<?php echo $this->config->base_url(); ?>" class="btn btn-primary btn-large">
+                <a href="<?php echo $this->config->base_url(); ?>" target="blank" class="btn btn-primary">
                     <i class="icon-calendar icon-white"></i>
-                    Book Appointment Page
+                    Go To Booking Page
                 </a>
             </fieldset>
         </form>
@@ -234,8 +234,8 @@
                 
                 <input type="hidden" id="user-id" />
                 
-                <label for="first-name">First Name</label>
+                <label for="first-name">First Name *</label>
-                <input type="text" id="first-name" class="span9" />
+                <input type="text" id="first-name" class="span9 required" />
                 
                 <label for="last-name">Last Name *</label>
                 <input type="text" id="last-name" class="span9 required" />

src/application/views/backend/users.php

@@ -80,8 +80,8 @@
         <div class="details column span7">
             <div class="btn-toolbar">
                 <div class="add-edit-delete-group btn-group">
-                    <button id="add-admin" class="btn">
+                    <button id="add-admin" class="btn btn-primary">
-                        <i class="icon-plus"></i>
+                        <i class="icon-plus icon-white"></i>
                         Add</button>
                     <button id="edit-admin" class="btn" disabled="disabled">
                         <i class="icon-pencil"></i>
@@ -109,8 +109,8 @@
             
             <div class="row-fluid">
                 <div class="admin-details span6">
-                    <label for="first-name">First Name</label>
+                    <label for="first-name">First Name *</label>
-                    <input type="text" id="admin-first-name" class="span11" />
+                    <input type="text" id="admin-first-name" class="span11 required" />
 
                     <label for="admin-last-name">Last Name *</label>
                     <input type="text" id="admin-last-name" class="span11 required" />
@@ -188,8 +188,8 @@
         <div class="details column span7">
             <div class="btn-toolbar span5">
                 <div class="add-edit-delete-group btn-group">
-                    <button id="add-provider" class="btn">
+                    <button id="add-provider" class="btn btn-primary">
-                        <i class="icon-plus"></i>
+                        <i class="icon-plus icon-white"></i>
                         Add</button>
                     <button id="edit-provider" class="btn" disabled="disabled">
                         <i class="icon-pencil"></i>
@@ -226,8 +226,8 @@
 
                 <div class="row-fluid">
                     <div class="provider-details span6">
-                        <label for="provider-first-name">First Name</label>
+                        <label for="provider-first-name">First Name *</label>
-                        <input type="text" id="provider-first-name" class="span11" />
+                        <input type="text" id="provider-first-name" class="span11 required" />
 
                         <label for="provider-last-name">Last Name *</label>
                         <input type="text" id="provider-last-name" class="span11 required" />
@@ -392,8 +392,8 @@
         <div class="details column span7">
             <div class="btn-toolbar">
                 <div class="add-edit-delete-group btn-group">
-                    <button id="add-secretary" class="btn">
+                    <button id="add-secretary" class="btn btn-primary">
-                        <i class="icon-plus"></i>
+                        <i class="icon-plus icon-white"></i>
                         Add</button>
                     <button id="edit-secretary" class="btn" disabled="disabled">
                         <i class="icon-pencil"></i>
@@ -421,8 +421,8 @@
             
             <div class="row-fluid">
                 <div class="secretary-details span6">
-                    <label for="secretary-first-name">First Name</label>
+                    <label for="secretary-first-name">First Name *</label>
-                    <input type="text" id="secretary-first-name" class="span11" />
+                    <input type="text" id="secretary-first-name" class="span11 required" />
 
                     <label for="secretary-last-name">Last Name *</label>
                     <input type="text" id="secretary-last-name" class="span11 required" />

src/assets/css/backend.css

@@ -57,13 +57,28 @@ root {
     background-color: #247A4B; 
 }
 
+#header #header-menu .active { 
+    color: #D6FF80;
+}
+
 #footer {
     background-color: #F7F7F7;
     border-top: 1px solid #DDD;
     font-size: 11px;
+    overflow: auto;
 }
+
 #footer #footer-content { 
     padding: 10px 15px; 
+    display: inline-block;
+    float: left;
+}
+
+#footer #footer-user-display-name { 
+    display: inline-block;
+    float: right;
+    padding: 10px 15px;
+    font-weight: bold;
 }
 
 #notification strong { 
@@ -104,6 +119,14 @@ body .modal-header h3 {
     font-size: 20px;
 }
 
+body .jspDrag {
+    background: #D3D3D3;
+}
+
+body .jspTrack {
+    background: #EBEBEB;
+}
+
 /* BACKEND CALENDAR PAGE
    -------------------------------------------------------------------- */
 #calendar-page #calendar-toolbar { 
@@ -234,6 +257,7 @@ body .modal-header h3 {
 #customers-page .filter-records .results { 
     overflow-y: auto; 
     max-height: 650px;
+    outline: none;
 }
 
 #customers-page #filter-customers .results .customer-row { 
@@ -307,6 +331,7 @@ body .modal-header h3 {
 #services-page .filter-records .results {
     overflow-y: auto;
     max-height: 650px;
+    outline: none;
 }
 
 #services-page .service-row { 
@@ -323,6 +348,10 @@ body .modal-header h3 {
     background-color: #EFFDF7; 
 }
 
+#services-page .filter-records .results hr { 
+    margin: 5px 0; 
+}
+
 #services-page .details .ui-spinner { 
     border: none; 
     margin-bottom: 10px; 
@@ -353,8 +382,6 @@ body .modal-header h3 {
     cursor: pointer; 
 }
 
-
-
 /* BACKEND USERS PAGE
    -------------------------------------------------------------------- */
 #users-page .tab-content { 
@@ -372,6 +399,7 @@ body .modal-header h3 {
 #users-page .filter-records .results {
     overflow-y: auto;
     max-height: 650px;
+    outline: none;
 }
 
 #users-page .secretary-row,
@@ -465,6 +493,10 @@ margin-right: 5px;
 padding: 4px 7px;
 }
 
+
+#users-page .filter-records .results hr { 
+    margin: 5px 0; 
+}
 /* BACKEND SETTINGS PAGE
    -------------------------------------------------------------------- */
 #settings-page .tab-content {

src/assets/css/frontend.css

@@ -149,10 +149,11 @@ body {
 
 #book-appointment-wizard #service-description {
     margin-top: 10px;
-    padding: 25px 10px;
+    padding: 10px;
     background: #F5F5F5;
     border: 1px solid #EEE;
     border-radius: 5px;
+    min-height: 80px;
 }
 
 #book-appointment-wizard #wizard-frame-1 label {

src/assets/css/libs/jquery/jquery.jscrollpane.css

@@ -0,0 +1,120 @@
+/*
+ * CSS Styles that are needed by jScrollPane for it to operate correctly.
+ *
+ * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
+ * may not operate correctly without them.
+ */
+
+.jspContainer
+{
+	overflow: hidden;
+	position: relative;
+}
+
+.jspPane
+{
+	position: absolute;
+}
+
+.jspVerticalBar
+{
+	position: absolute;
+	top: 0;
+	right: 0;
+	width: 16px;
+	height: 100%;
+	background: red;
+}
+
+.jspHorizontalBar
+{
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	width: 100%;
+	height: 16px;
+	background: red;
+}
+
+.jspVerticalBar *,
+.jspHorizontalBar *
+{
+	margin: 0;
+	padding: 0;
+}
+
+.jspCap
+{
+	display: none;
+}
+
+.jspHorizontalBar .jspCap
+{
+	float: left;
+}
+
+.jspTrack
+{
+	background: #dde;
+	position: relative;
+}
+
+.jspDrag
+{
+	background: #bbd;
+	position: relative;
+	top: 0;
+	left: 0;
+	cursor: pointer;
+}
+
+.jspHorizontalBar .jspTrack,
+.jspHorizontalBar .jspDrag
+{
+	float: left;
+	height: 100%;
+}
+
+.jspArrow
+{
+	background: #50506d;
+	text-indent: -20000px;
+	display: block;
+	cursor: pointer;
+}
+
+.jspArrow.jspDisabled
+{
+	cursor: default;
+	background: #80808d;
+}
+
+.jspVerticalBar .jspArrow
+{
+	height: 16px;
+}
+
+.jspHorizontalBar .jspArrow
+{
+	width: 16px;
+	float: left;
+	height: 100%;
+}
+
+.jspVerticalBar .jspArrow:focus
+{
+	outline: none;
+}
+
+.jspCorner
+{
+	background: #eeeef4;
+	float: left;
+	height: 100%;
+}
+
+/* Yuk! CSS Hack for IE6 3 pixel bug :( */
+* html .jspCorner
+{
+	margin: 0 -3px 0 0;
+}

src/assets/js/backend_calendar.js

@@ -67,7 +67,7 @@ var BackendCalendar = {
         BackendCalendar.calendarWindowResize(); 
         
         // Fill the select listboxes of the page.
-        var optgroupHtml = '<optgroup label="Providers">';
+        var optgroupHtml = '<optgroup label="Providers" type="providers-group">';
         $.each(GlobalVariables.availableProviders, function(index, provider) {
             var hasGoogleSync = (provider['settings']['google_sync'] === '1') 
                     ? 'true' : 'false';
@@ -81,7 +81,7 @@ var BackendCalendar = {
         optgroupHtml += '</optgroup>';
         $('#select-filter-item').append(optgroupHtml);
         
-        optgroupHtml = '<optgroup label="Services">';
+        optgroupHtml = '<optgroup label="Services" type="services-group">';
         $.each(GlobalVariables.availableServices, function(index, service) {
             optgroupHtml += '<option value="' + service['id'] + '" ' + 
                     'type="' + BackendCalendar.FILTER_TYPE_SERVICE + '">' + 
@@ -90,11 +90,32 @@ var BackendCalendar = {
         optgroupHtml += '</optgroup>';
         $('#select-filter-item').append(optgroupHtml);
         
+        // Privileges Checks
         if (GlobalVariables.user.role_slug == Backend.DB_SLUG_PROVIDER) {
             $('#select-filter-item optgroup:eq(0)').val(GlobalVariables.user.id);
             $('#select-filter-item').prop('disabled', true);
         }
         
+        if (GlobalVariables.user.role_slug == Backend.DB_SLUG_SECRETARY) {
+            // Remove the providers that are not connected to the secretary.
+            $('#select-filter-item option[type="provider"]').each(function(index, option) {
+                var found = false;
+                $.each(GlobalVariables.secretaryProviders, function(index, id) {
+                    if ($(option).val() == id) {
+                        found = true;
+                        return false;
+                    }
+                });
+                
+                if (!found) 
+                    $(option).remove();
+            });
+            
+            if ($('#select-filter-item option[type="provider"]').length == 0) {
+                $('#select-filter-item optgroup[type="providers-group"]').remove();
+            }
+        }
+        
         // :: BIND THE DEFAULT EVENT HANDLERS (IF NEEDED)
         if (defaultEventHandlers === true) {
             BackendCalendar.bindEventHandlers();

src/assets/js/backend_customers.js

@@ -28,6 +28,9 @@ var BackendCustomers = {
 		BackendCustomers.helper.resetForm();
 		BackendCustomers.helper.filter('');
         
+        $('#filter-customers .results').jScrollPane();
+        $('#customer-appointments').jScrollPane();
+        
 		if (defaultEventHandlers) {
 			BackendCustomers.bindEventHandlers();
 		}
@@ -326,6 +329,7 @@ CustomersHelper.prototype.display = function(customer) {
     $('#zip-code').val(customer.zip_code);
     $('#notes').val(customer.notes);
 
+    $('#customer-appointments').data('jsp').destroy();
     $('#customer-appointments').empty();
     $.each(customer.appointments, function(index, appointment) {
         var start = Date.parse(appointment.start_datetime).toString('dd/MM/yyyy HH:mm');
@@ -338,6 +342,7 @@ CustomersHelper.prototype.display = function(customer) {
                 '</div>';   
         $('#customer-appointments').append(html);
     });
+    $('#customer-appointments').jScrollPane();
 };
 
 /**
@@ -364,12 +369,15 @@ CustomersHelper.prototype.filter = function(key, selectId, display) {
         
         BackendCustomers.helper.filterResults = response;
         
+        $('#filter-customers .results').data('jsp').destroy(); 
         $('#filter-customers .results').html('');
         $.each(response, function(index, customer) {
            var html = BackendCustomers.helper.getFilterHtml(customer);
            $('#filter-customers .results').append(html);
         });
         
+        $('#filter-customers .results').jScrollPane();
+        
         if (response.length == 0) {
             $('#filter-customers .results').html('<em>No records found...</em>');
         }

src/assets/js/backend_services.js

@@ -37,6 +37,8 @@ var BackendServices = {
             'disabled': true //default
         });
         
+        $('#filter-services .results').jScrollPane();
+        $('#filter-categories .results').jScrollPane();
         
         if (bindEventHandlers) BackendServices.bindEventHandlers();        
     },
@@ -381,11 +383,13 @@ ServicesHelper.prototype.filter = function(key, selectId, display) {
 
         BackendServices.helper.filterResults = response;
         
+        $('#filter-services .results').data('jsp').destroy();
         $('#filter-services .results').html('');
         $.each(response, function(index, service) {
             var html = ServicesHelper.prototype.getFilterHtml(service);
             $('#filter-services .results').append(html);
         });        
+        $('#filter-services .results').jScrollPane();
         
         if (response.length == 0) {
             $('#filter-services .result').html('<em>No results found ...</em>');
@@ -409,7 +413,7 @@ ServicesHelper.prototype.getFilterHtml = function(service) {
                 '<strong>' + service.name + '</strong><br>' +
                 service.duration + ' min - ' + 
                 service.price + ' ' + service.currency + '<br>' +
-            '</div>';
+            '</div><hr>';
 
     return html;
 };
@@ -603,11 +607,13 @@ CategoriesHelper.prototype.filter = function(key, selectId, display) {
         
         BackendServices.helper.filterResults = response;
         
+        $('#filter-categories .results').data('jsp').destroy();
         $('#filter-categories .results').html('');
         $.each(response, function(index, category) {
            var html = BackendServices.helper.getFilterHtml(category);
            $('#filter-categories .results').append(html);
         });
+        $('#filter-categories .results').jScrollPane();
         
         if (response.length == 0) {
             $('#filter-categories .results').html('<em>No records found...</em>');
@@ -730,7 +736,7 @@ CategoriesHelper.prototype.getFilterHtml = function(category) {
     var html =
             '<div class="category-row" data-id="' + category.id + '">' + 
                 '<strong>' + category.name + '</strong>' +
-            '</div>';
+            '</div><hr>';
 
     return html;
 };

src/assets/js/backend_users.js

@@ -30,6 +30,11 @@ var BackendUsers = {
     initialize: function(defaultEventHandlers) {
         if (defaultEventHandlers == undefined) defaultEventHandlers = true;
         
+        // Initialize jScrollPane Scrollbars
+        $('#filter-admins .results').jScrollPane();
+        $('#filter-providers .results').jScrollPane();
+        $('#filter-secretaries .results').jScrollPane();
+        
         // Instanciate default helper object (admin).
         BackendUsers.helper = new AdminsHelper();
         BackendUsers.helper.resetForm();
@@ -44,12 +49,14 @@ var BackendUsers = {
                     + service.name + '</label>'; 
             $('#provider-services').append(html);
         });
+        $('#provider-services').jScrollPane();
                 
         $.each(GlobalVariables.providers, function(index, provider) {
            var html = '<label class="checkbox"><input type="checkbox" data-id="' + provider.id + '" />' 
                    + provider.first_name + ' ' + provider.last_name + '</label>';
             $('#secretary-providers').append(html);
         });
+        $('#secretary-providers').jScrollPane();
         
         // Bind event handlers.
         if (defaultEventHandlers) BackendUsers.bindEventHandlers();
@@ -75,6 +82,8 @@ var BackendUsers = {
                 BackendUsers.helper = new AdminsHelper();
             } else if ($(this).hasClass('providers-tab')) { // display providers tab
                 $('#providers').show();
+                $('#provider-services').data('jsp').destroy();
+                $('#provider-services').jScrollPane();
                 BackendUsers.helper = new ProvidersHelper();
             } else if ($(this).hasClass('secretaries-tab')) { // display secretaries tab
                 $('#secretaries').show();
@@ -92,6 +101,7 @@ var BackendUsers = {
                     
                     GlobalVariables.providers = response;
                 
+                    $('#secretary-providers').data('jsp').destroy();
                     $('#secretary-providers').html('');
                     $.each(GlobalVariables.providers, function(index, provider) {
                         var html = '<label class="checkbox"><input type="checkbox" data-id="' + provider.id + '" />' 
@@ -99,6 +109,7 @@ var BackendUsers = {
                          $('#secretary-providers').append(html);
                      });
                      $('#secretary-providers input[type="checkbox"]').prop('disabled', true);
+                     $('#secretary-providers').jScrollPane();
                 }, 'json');
             }
             

src/assets/js/backend_users_admins.js

@@ -324,11 +324,13 @@ AdminsHelper.prototype.filter = function(key, selectId, display) {
         
         BackendUsers.helper.filterResults = response;
         
+        $('#filter-admins .results').data('jsp').destroy();
         $('#filter-admins .results').html('');
         $.each(response, function(index, admin) {
             var html = AdminsHelper.prototype.getFilterHtml(admin);
             $('#filter-admins .results').append(html);
         });
+        $('#filter-admins .results').jScrollPane();
         
         if (response.length == 0) {
             $('#filter-admins .results').html('<em>No results found ...</em>')
@@ -351,7 +353,7 @@ AdminsHelper.prototype.getFilterHtml = function(admin) {
             '<div class="admin-row" data-id="' + admin.id + '">' + 
                 '<strong>' + admin.first_name + ' ' + admin.last_name + '</strong><br>' +
                 admin.email + ', ' + admin.mobile_number + ', ' + admin.phone_number + '<br>' + 
-            '</div>';
+            '</div><hr>';
 
     return html;
 };

src/assets/js/backend_users_providers.js

@@ -390,11 +390,14 @@ ProvidersHelper.prototype.filter = function(key, selectId, display) {
         
         BackendUsers.helper.filterResults = response;
         
+        
+        $('#filter-providers .results').data('jsp').destroy;
         $('#filter-providers .results').html('');
         $.each(response, function(index, provider) {
             var html = ProvidersHelper.prototype.getFilterHtml(provider);
             $('#filter-providers .results').append(html);
         });
+        $('#filter-providers .results').jScrollPane();
         
         if (response.length == 0) {
             $('#filter-providers .results').html('<em>No results found ...</em>')
@@ -417,7 +420,7 @@ ProvidersHelper.prototype.getFilterHtml = function(provider) {
             '<div class="provider-row" data-id="' + provider.id + '">' + 
                 '<strong>' + provider.first_name + ' ' + provider.last_name + '</strong><br>' +
                 provider.email + ', ' + provider.mobile_number + ', ' + provider.phone_number + '<br>' + 
-            '</div>';
+            '</div><hr>';
 
     return html;
 };

src/assets/js/backend_users_secretaries.js

@@ -345,11 +345,13 @@ SecretariesHelper.prototype.filter = function(key, selectId, display) {
         
         BackendUsers.helper.filterResults = response;
         
+        $('#filter-secretaries .results').data('jsp').destroy();
         $('#filter-secretaries .results').html('');
         $.each(response, function(index, secretary) {
             var html = SecretariesHelper.prototype.getFilterHtml(secretary);
             $('#filter-secretaries .results').append(html);
         });
+        $('#filter-secretaries .results').jScrollPane();
         
         if (response.length == 0) {
             $('#filter-secretaries .results').html('<em>No results found ...</em>')
@@ -372,7 +374,7 @@ SecretariesHelper.prototype.getFilterHtml = function(secretary) {
             '<div class="secretary-row" data-id="' + secretary.id + '">' + 
                 '<strong>' + secretary.first_name + ' ' + secretary.last_name + '</strong><br>' +
                 secretary.email + ', ' + secretary.mobile_number + ', ' + secretary.phone_number + '<br>' + 
-            '</div>';
+            '</div><hr>';
 
     return html;
 };

src/assets/js/libs/jquery/jquery.mousewheel.js

@@ -0,0 +1,117 @@
+/*! Copyright (c) 2013 Brandon Aaron (http://brandonaaron.net)
+ * Licensed under the MIT License (LICENSE.txt).
+ *
+ * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
+ * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
+ * Thanks to: Seamus Leahy for adding deltaX and deltaY
+ *
+ * Version: 3.1.3
+ *
+ * Requires: 1.2.2+
+ */
+
+(function (factory) {
+    if ( typeof define === 'function' && define.amd ) {
+        // AMD. Register as an anonymous module.
+        define(['jquery'], factory);
+    } else if (typeof exports === 'object') {
+        // Node/CommonJS style for Browserify
+        module.exports = factory;
+    } else {
+        // Browser globals
+        factory(jQuery);
+    }
+}(function ($) {
+
+    var toFix = ['wheel', 'mousewheel', 'DOMMouseScroll', 'MozMousePixelScroll'];
+    var toBind = 'onwheel' in document || document.documentMode >= 9 ? ['wheel'] : ['mousewheel', 'DomMouseScroll', 'MozMousePixelScroll'];
+    var lowestDelta, lowestDeltaXY;
+
+    if ( $.event.fixHooks ) {
+        for ( var i = toFix.length; i; ) {
+            $.event.fixHooks[ toFix[--i] ] = $.event.mouseHooks;
+        }
+    }
+
+    $.event.special.mousewheel = {
+        setup: function() {
+            if ( this.addEventListener ) {
+                for ( var i = toBind.length; i; ) {
+                    this.addEventListener( toBind[--i], handler, false );
+                }
+            } else {
+                this.onmousewheel = handler;
+            }
+        },
+
+        teardown: function() {
+            if ( this.removeEventListener ) {
+                for ( var i = toBind.length; i; ) {
+                    this.removeEventListener( toBind[--i], handler, false );
+                }
+            } else {
+                this.onmousewheel = null;
+            }
+        }
+    };
+
+    $.fn.extend({
+        mousewheel: function(fn) {
+            return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
+        },
+
+        unmousewheel: function(fn) {
+            return this.unbind("mousewheel", fn);
+        }
+    });
+
+
+    function handler(event) {
+        var orgEvent = event || window.event,
+            args = [].slice.call(arguments, 1),
+            delta = 0,
+            deltaX = 0,
+            deltaY = 0,
+            absDelta = 0,
+            absDeltaXY = 0,
+            fn;
+        event = $.event.fix(orgEvent);
+        event.type = "mousewheel";
+
+        // Old school scrollwheel delta
+        if ( orgEvent.wheelDelta ) { delta = orgEvent.wheelDelta; }
+        if ( orgEvent.detail )     { delta = orgEvent.detail * -1; }
+
+        // New school wheel delta (wheel event)
+        if ( orgEvent.deltaY ) {
+            deltaY = orgEvent.deltaY * -1;
+            delta  = deltaY;
+        }
+        if ( orgEvent.deltaX ) {
+            deltaX = orgEvent.deltaX;
+            delta  = deltaX * -1;
+        }
+
+        // Webkit
+        if ( orgEvent.wheelDeltaY !== undefined ) { deltaY = orgEvent.wheelDeltaY; }
+        if ( orgEvent.wheelDeltaX !== undefined ) { deltaX = orgEvent.wheelDeltaX * -1; }
+
+        // Look for lowest delta to normalize the delta values
+        absDelta = Math.abs(delta);
+        if ( !lowestDelta || absDelta < lowestDelta ) { lowestDelta = absDelta; }
+        absDeltaXY = Math.max(Math.abs(deltaY), Math.abs(deltaX));
+        if ( !lowestDeltaXY || absDeltaXY < lowestDeltaXY ) { lowestDeltaXY = absDeltaXY; }
+
+        // Get a whole value for the deltas
+        fn = delta > 0 ? 'floor' : 'ceil';
+        delta  = Math[fn](delta / lowestDelta);
+        deltaX = Math[fn](deltaX / lowestDeltaXY);
+        deltaY = Math[fn](deltaY / lowestDeltaXY);
+
+        // Add event and delta to the front of the arguments
+        args.unshift(event, delta, deltaX, deltaY);
+
+        return ($.event.dispatch || $.event.handle).apply(this, args);
+    }
+
+}));