code clean up and color adding

api/config/default.php

@@ -12,6 +12,8 @@ return array(
     'useLogo' => false,
     'headerColor' => '',
     'headerTextColor' => '',
+    'sidebarColor' => '',
+    'sidebarTextColor' => '',
     'lockScreen' => false,
     'theme'=>'Organizr',
     'style'=>'dark',

api/functions/organizr-functions.php

@@ -138,190 +138,194 @@ function organizrStatus(){
 }
 function getSettingsMain(){
 	return array(
-		array(
-			'type' => 'select',
-			'name' => 'branch',
-			'label' => 'Branch',
-			'value' => $GLOBALS['branch'],
-			'options' => getBranches()
-		),
-		array(
-			'type' => 'button',
-			'label' => 'Force Install Branch',
-			'class' => 'updateNow',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Retrieve'
-		),
-		array(
-			'type' => 'select',
-			'name' => 'authType',
-            'id' => 'authSelect',
-			'label' => 'Authentication Type',
-			'value' => $GLOBALS['authType'],
-			'options' => getAuthTypes()
-		),
-        array(
-			'type' => 'select',
-			'name' => 'authBackend',
-            'id' => 'authBackendSelect',
-			'label' => 'Authentication Backend',
-            'class' => 'backendAuth switchAuth',
-			'value' => $GLOBALS['authBackend'],
-			'options' => getAuthBackends()
-		),
-        array(
-			'type' => 'input',
-			'name' => 'plexToken',
-            'class' => 'plexAuth switchAuth',
-			'label' => 'Plex Token',
-			'value' => $GLOBALS['plexToken'],
-			'placeholder' => 'Use Get Token Button'
-		),
-		array(
-			'type' => 'button',
-			'label' => 'Get Plex Token',
-			'class' => 'popup-with-form getPlexTokenAuth plexAuth switchAuth',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Retrieve',
-			'href' => '#auth-plex-token-form',
-			'attr' => 'data-effect="mfp-3d-unfold"'
-		),
-		array(
-			'type' => 'input',
-			'name' => 'plexID',
-            'class' => 'plexAuth switchAuth',
-			'label' => 'Plex Machine',
-			'value' => $GLOBALS['plexID'],
-			'placeholder' => 'Use Get Plex Machine Button'
-		),
-		array(
-			'type' => 'button',
-			'label' => 'Get Plex Machine',
-			'class' => 'popup-with-form getPlexMachineAuth plexAuth switchAuth',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Retrieve',
-			'href' => '#auth-plex-machine-form',
-			'attr' => 'data-effect="mfp-3d-unfold"'
-		),
-        array(
-			'type' => 'input',
-			'name' => 'authBackendHost',
-            'class' => 'ldapAuth ftpAuth switchAuth',
-			'label' => 'Host Address',
-			'value' => $GLOBALS['authBackendHost'],
-			'placeholder' => 'http{s) | ftp(s) | ldap(s)://hostname:port'
-		),
-        array(
-			'type' => 'input',
-			'name' => 'authBaseDN',
-            'class' => 'ldapAuth switchAuth',
-			'label' => 'Host Base DN',
-			'value' => $GLOBALS['authBaseDN'],
-			'placeholder' => 'cn=%s,dc=sub,dc=domain,dc=com'
-		),
-        array(
-			'type' => 'input',
-			'name' => 'embyURL',
-            'class' => 'embyAuth switchAuth',
-			'label' => 'Emby URL',
-			'value' => $GLOBALS['embyURL'],
-			'placeholder' => ''
-		),
-        array(
-			'type' => 'input',
-			'name' => 'embyToken',
-            'class' => 'embyAuth switchAuth',
-			'label' => 'Emby Token',
-			'value' => $GLOBALS['embyToken'],
-			'placeholder' => ''
-		)
-		/*array(
-			'type' => 'button',
-			'label' => 'Send Test',
-			'class' => 'phpmSendTestEmail',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Send'
-		)*/
+        'Github' => array(
+    		array(
+    			'type' => 'select',
+    			'name' => 'branch',
+    			'label' => 'Branch',
+    			'value' => $GLOBALS['branch'],
+    			'options' => getBranches()
+    		),
+    		array(
+    			'type' => 'button',
+    			'label' => 'Force Install Branch',
+    			'class' => 'updateNow',
+    			'icon' => 'fa fa-paper-plane',
+    			'text' => 'Retrieve'
+    		)
+        ),
+        'Authentication' => array(
+    		array(
+    			'type' => 'select',
+    			'name' => 'authType',
+                'id' => 'authSelect',
+    			'label' => 'Authentication Type',
+    			'value' => $GLOBALS['authType'],
+    			'options' => getAuthTypes()
+    		),
+            array(
+    			'type' => 'select',
+    			'name' => 'authBackend',
+                'id' => 'authBackendSelect',
+    			'label' => 'Authentication Backend',
+                'class' => 'backendAuth switchAuth',
+    			'value' => $GLOBALS['authBackend'],
+    			'options' => getAuthBackends()
+    		),
+            array(
+    			'type' => 'input',
+    			'name' => 'plexToken',
+                'class' => 'plexAuth switchAuth',
+    			'label' => 'Plex Token',
+    			'value' => $GLOBALS['plexToken'],
+    			'placeholder' => 'Use Get Token Button'
+    		),
+    		array(
+    			'type' => 'button',
+    			'label' => 'Get Plex Token',
+    			'class' => 'popup-with-form getPlexTokenAuth plexAuth switchAuth',
+    			'icon' => 'fa fa-paper-plane',
+    			'text' => 'Retrieve',
+    			'href' => '#auth-plex-token-form',
+    			'attr' => 'data-effect="mfp-3d-unfold"'
+    		),
+    		array(
+    			'type' => 'input',
+    			'name' => 'plexID',
+                'class' => 'plexAuth switchAuth',
+    			'label' => 'Plex Machine',
+    			'value' => $GLOBALS['plexID'],
+    			'placeholder' => 'Use Get Plex Machine Button'
+    		),
+    		array(
+    			'type' => 'button',
+    			'label' => 'Get Plex Machine',
+    			'class' => 'popup-with-form getPlexMachineAuth plexAuth switchAuth',
+    			'icon' => 'fa fa-paper-plane',
+    			'text' => 'Retrieve',
+    			'href' => '#auth-plex-machine-form',
+    			'attr' => 'data-effect="mfp-3d-unfold"'
+    		),
+            array(
+    			'type' => 'input',
+    			'name' => 'authBackendHost',
+                'class' => 'ldapAuth ftpAuth switchAuth',
+    			'label' => 'Host Address',
+    			'value' => $GLOBALS['authBackendHost'],
+    			'placeholder' => 'http{s) | ftp(s) | ldap(s)://hostname:port'
+    		),
+            array(
+    			'type' => 'input',
+    			'name' => 'authBaseDN',
+                'class' => 'ldapAuth switchAuth',
+    			'label' => 'Host Base DN',
+    			'value' => $GLOBALS['authBaseDN'],
+    			'placeholder' => 'cn=%s,dc=sub,dc=domain,dc=com'
+    		),
+            array(
+    			'type' => 'input',
+    			'name' => 'embyURL',
+                'class' => 'embyAuth switchAuth',
+    			'label' => 'Emby URL',
+    			'value' => $GLOBALS['embyURL'],
+    			'placeholder' => ''
+    		),
+            array(
+    			'type' => 'input',
+    			'name' => 'embyToken',
+                'class' => 'embyAuth switchAuth',
+    			'label' => 'Emby Token',
+    			'value' => $GLOBALS['embyToken'],
+    			'placeholder' => ''
+    		)
+    		/*array(
+    			'type' => 'button',
+    			'label' => 'Send Test',
+    			'class' => 'phpmSendTestEmail',
+    			'icon' => 'fa fa-paper-plane',
+    			'text' => 'Send'
+    		)*/
+        )
 	);
 }
 function getSSO(){
 	return array(
-		array(
-			'type' => 'input',
-			'name' => 'plexToken',
-			'label' => 'Plex Token',
-			'value' => $GLOBALS['plexToken'],
-			'placeholder' => 'Use Get Token Button'
-		),
-		array(
-			'type' => 'button',
-			'label' => 'Get Plex Token',
-			'class' => 'popup-with-form getPlexTokenSSO',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Retrieve',
-			'href' => '#sso-plex-token-form',
-			'attr' => 'data-effect="mfp-3d-unfold"'
-		),
-		array(
-			'type' => 'input',
-			'name' => 'plexID',
-			'label' => 'Plex Machine',
-			'value' => $GLOBALS['plexID'],
-			'placeholder' => 'Use Get Plex Machine Button'
-		),
-		array(
-			'type' => 'button',
-			'label' => 'Get Plex Machine',
-			'class' => 'popup-with-form getPlexMachineSSO',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Retrieve',
-			'href' => '#sso-plex-machine-form',
-			'attr' => 'data-effect="mfp-3d-unfold"'
-		),
-		array(
-			'type' => 'html',
-			'label' => 'Plex Note',
-			'html' => '<span lang="en">Please make sure both Token and Machine are filled in</span>'
-		),
-		array(
-			'type' => 'switch',
-			'name' => 'ssoPlex',
-			'label' => 'Enable',
-			'value' => $GLOBALS['ssoPlex']
-		),
-		array(
-			'type' => 'input',
-			'name' => 'ombiURL',
-			'label' => 'Ombi URL',
-			'value' => $GLOBALS['ombiURL'],
-			'placeholder' => 'http(s)://hostname'
-		),
-		array(
-			'type' => 'switch',
-			'name' => 'ssoOmbi',
-			'label' => 'Enable',
-			'value' => $GLOBALS['ssoOmbi']
-		),
-		array(
-			'type' => 'input',
-			'name' => 'tautulliURL',
-			'label' => 'Tautulli URL',
-			'value' => $GLOBALS['tautulliURL'],
-			'placeholder' => 'http(s)://hostname'
-		),
-		array(
-			'type' => 'switch',
-			'name' => 'ssoTautulli',
-			'label' => 'Enable',
-			'value' => $GLOBALS['ssoTautulli']
-		)
-		/*array(
-			'type' => 'button',
-			'label' => 'Send Test',
-			'class' => 'phpmSendTestEmail',
-			'icon' => 'fa fa-paper-plane',
-			'text' => 'Send'
-		)*/
+        'Plex' => array(
+    		array(
+    			'type' => 'input',
+    			'name' => 'plexToken',
+    			'label' => 'Plex Token',
+    			'value' => $GLOBALS['plexToken'],
+    			'placeholder' => 'Use Get Token Button'
+    		),
+    		array(
+    			'type' => 'button',
+    			'label' => 'Get Plex Token',
+    			'class' => 'popup-with-form getPlexTokenSSO',
+    			'icon' => 'fa fa-paper-plane',
+    			'text' => 'Retrieve',
+    			'href' => '#sso-plex-token-form',
+    			'attr' => 'data-effect="mfp-3d-unfold"'
+    		),
+    		array(
+    			'type' => 'input',
+    			'name' => 'plexID',
+    			'label' => 'Plex Machine',
+    			'value' => $GLOBALS['plexID'],
+    			'placeholder' => 'Use Get Plex Machine Button'
+    		),
+    		array(
+    			'type' => 'button',
+    			'label' => 'Get Plex Machine',
+    			'class' => 'popup-with-form getPlexMachineSSO',
+    			'icon' => 'fa fa-paper-plane',
+    			'text' => 'Retrieve',
+    			'href' => '#sso-plex-machine-form',
+    			'attr' => 'data-effect="mfp-3d-unfold"'
+    		),
+    		array(
+    			'type' => 'html',
+    			'label' => 'Plex Note',
+    			'html' => '<span lang="en">Please make sure both Token and Machine are filled in</span>'
+    		),
+    		array(
+    			'type' => 'switch',
+    			'name' => 'ssoPlex',
+    			'label' => 'Enable',
+    			'value' => $GLOBALS['ssoPlex']
+    		)
+        ),
+        'Ombu' => array(
+    		array(
+    			'type' => 'input',
+    			'name' => 'ombiURL',
+    			'label' => 'Ombi URL',
+    			'value' => $GLOBALS['ombiURL'],
+    			'placeholder' => 'http(s)://hostname'
+    		),
+    		array(
+    			'type' => 'switch',
+    			'name' => 'ssoOmbi',
+    			'label' => 'Enable',
+    			'value' => $GLOBALS['ssoOmbi']
+    		)
+        ),
+        'Tautulli' => array(
+    		array(
+    			'type' => 'input',
+    			'name' => 'tautulliURL',
+    			'label' => 'Tautulli URL',
+    			'value' => $GLOBALS['tautulliURL'],
+    			'placeholder' => 'http(s)://hostname'
+    		),
+    		array(
+    			'type' => 'switch',
+    			'name' => 'ssoTautulli',
+    			'label' => 'Enable',
+
+            	'value' => $GLOBALS['ssoTautulli']
+    		)
+        )
 	);
 }
 function loadAppearance(){
@@ -336,29 +340,13 @@ function loadAppearance(){
 function getCustomizeAppearance(){
     if(file_exists(dirname(__DIR__,1).DIRECTORY_SEPARATOR.'config'.DIRECTORY_SEPARATOR.'config.php')){
         return array(
-            'config' => array(/*
-                array(
-                    'type' => 'select',
-                    'name' => 'branch',
-                    'label' => 'Organizr Branch',
-                    'value' => $GLOBALS['branch'],
-                    'options' => array(
-                        'Master' => 'v2-master',
-                        'Develop' => 'v2-develop'
-                    )
-                ),*/
+            'Top Bar' => array(
                 array(
                     'type' => 'input',
                     'name' => 'logo',
                     'label' => 'Logo',
                     'value' => $GLOBALS['logo']
                 ),
-                array(
-                    'type' => 'input',
-                    'name' => 'loginWallpaper',
-                    'label' => 'Login Wallpaper',
-                    'value' => $GLOBALS['loginWallpaper']
-                ),
                 array(
                     'type' => 'input',
                     'name' => 'title',
@@ -370,7 +358,17 @@ function getCustomizeAppearance(){
                     'name' => 'useLogo',
                     'label' => 'Use Logo instead of Title',
                     'value' => $GLOBALS['useLogo']
-                ),
+                )
+            ),
+            'Login Page' => array(
+                array(
+                    'type' => 'input',
+                    'name' => 'loginWallpaper',
+                    'label' => 'Login Wallpaper',
+                    'value' => $GLOBALS['loginWallpaper']
+                )
+            ),
+            'Colors & Themes' => array(
                 array(
                     'type' => 'input',
                     'name' => 'headerColor',
@@ -378,6 +376,30 @@ function getCustomizeAppearance(){
                     'value' => $GLOBALS['headerColor'],
                     'class' => 'colorpicker',
                     'disabled' => true
+                ),
+                array(
+                    'type' => 'input',
+                    'name' => 'headerTextColor',
+                    'label' => 'Nav Bar Text Color',
+                    'value' => $GLOBALS['headerTextColor'],
+                    'class' => 'colorpicker',
+                    'disabled' => true
+                ),
+                array(
+                    'type' => 'input',
+                    'name' => 'sidebarColor',
+                    'label' => 'Side Bar Color',
+                    'value' => $GLOBALS['sidebarColor'],
+                    'class' => 'colorpicker',
+                    'disabled' => true
+                ),
+                array(
+                    'type' => 'input',
+                    'name' => 'sidebarTextColor',
+                    'label' => 'Side Bar Text Color',
+                    'value' => $GLOBALS['sidebarTextColor'],
+                    'class' => 'colorpicker',
+                    'disabled' => true
                 ),
 				array(
 					'type' => 'select',
@@ -404,9 +426,6 @@ function getCustomizeAppearance(){
                         )
                     )
 				)
-            ),
-            'database' => array(
-
             )
         );
     }

js/functions.js

@@ -636,17 +636,21 @@ function buildPlugins(){
 	});
 	ajaxloader();
 }
-function buildCustomizeAppearanceItem(array){
-	if (Array.isArray(array.config)) {
-		var preRowConfig = `
+function buildFormGroup(array){
+	var group = '';
+	$.each(array, function(i,v) {
+		var count = 0;
+		var total = v.length;
+		group += `
 			<!-- FORM GROUP -->
-			<h3 class="box-title" lang="en">Config Items</h3>
+			<h3 class="box-title" lang="en">`+i+`</h3>
 			<hr class="m-t-0 m-b-40">
 			<div class="row">
 		`;
-		var customizeItems = preRowConfig;
-		$.each(array.config, function(i,v) {
-			customizeItems += `
+		$.each(v, function(i,v) {
+			count++;
+			if(count%2 !== 0 ){ group += '<div class="row start">'; };
+			group += `
 				<!-- INPUT BOX -->
 				<div class="col-md-6">
 					<div class="form-group">
@@ -658,75 +662,11 @@ function buildCustomizeAppearanceItem(array){
 				</div>
 				<!--/ INPUT BOX -->
 			`;
+			if(count%2 == 0 || count == total ){ group += '</div><!--end-->'; };
 		});
-		customizeItems += '</div>';
-	}
-
-	return customizeItems;
-}
-function buildSSOItem(array){
-    if (Array.isArray(array)) {
-		var count = 0;
-        var preRow = `
-            <!-- FORM GROUP -->
-            <h3 class="box-title" lang="en">SSO Settings</h3>
-            <hr class="m-t-0 m-b-40">
-            <div class="row">
-        `;
-        var ssoItems = preRow;
-        $.each(array, function(i,v) {
-			count++;
-
-			if(count%2 !== 0 ){ ssoItems += '<div class="row start">'; };
-            ssoItems += `
-                <!-- INPUT BOX -->
-                <div class="col-md-6 p-b-10">
-                    <div class="form-group">
-                        <label class="control-label col-md-3" lang="en">`+v.label+`</label>
-                        <div class="col-md-9">
-                            `+buildFormItem(v)+`
-                        </div>
-                    </div>
-                </div>
-                <!--/ INPUT BOX -->
-            `;
-			if(count%2 == 0 ){ ssoItems += '</div><!--end-->'; };
-        });
-        ssoItems += '</div>';
-    }
-    return ssoItems;
-}
-function buildSettingsMainItem(array){
-    if (Array.isArray(array)) {
-		var count = 0;
-        var preRow = `
-            <!-- FORM GROUP -->
-            <h3 class="box-title" lang="en">Main Settings</h3>
-            <hr class="m-t-0 m-b-40">
-            <div class="row">
-        `;
-        var settingsItems = preRow;
-        $.each(array, function(i,v) {
-			count++;
-
-			if(count%2 !== 0 ){ settingsItems += '<div class="row start">'; };
-            settingsItems += `
-                <!-- INPUT BOX -->
-                <div class="col-md-6 p-b-10">
-                    <div class="form-group">
-                        <label class="control-label col-md-3" lang="en">`+v.label+`</label>
-                        <div class="col-md-9">
-                            `+buildFormItem(v)+`
-                        </div>
-                    </div>
-                </div>
-                <!--/ INPUT BOX -->
-            `;
-			if(count%2 == 0 ){ settingsItems += '</div><!--end-->'; };
-        });
-        settingsItems += '</div>';
-    }
-    return settingsItems;
+		group += '</div>';
+	});
+	return group;
 }
 function buildImageManagerViewItem(array){
 	var imageListing = '';
@@ -772,7 +712,7 @@ function buildCustomizeAppearance(){
 	ajaxloader(".content-wrap","in");
 	organizrAPI('GET','api/?v1/customize/appearance').success(function(data) {
 		var response = JSON.parse(data);
-		$('#customize-appearance-form').html(buildCustomizeAppearanceItem(response.data));
+		$('#customize-appearance-form').html(buildFormGroup(response.data));
 		;
 	}).fail(function(xhr) {
 		console.error("Organizr Function: API Connection Failed");
@@ -783,7 +723,7 @@ function buildSSO(){
 	ajaxloader(".content-wrap","in");
 	organizrAPI('GET','api/?v1/sso').success(function(data) {
 		var response = JSON.parse(data);
-		$('#sso-form').html(buildSSOItem(response.data));
+		$('#sso-form').html(buildFormGroup(response.data));
 		;
 	}).fail(function(xhr) {
 		console.error("Organizr Function: API Connection Failed");
@@ -795,7 +735,7 @@ function buildSettingsMain(){
 	organizrAPI('GET','api/?v1/settings/main').success(function(data) {
 		var response = JSON.parse(data);
 		console.log(response)
-		$('#settings-main-form').html(buildSettingsMainItem(response.data));
+		$('#settings-main-form').html(buildFormGroup(response.data));
 		changeAuth();
 		;
 	}).fail(function(xhr) {
@@ -1160,7 +1100,7 @@ function buildGroupManagementItem(array){
 		    return n + (group.group_id == v.group_id);
 		}, 0);
 		var disabledDefault = (v.group_id == 0 || v.group_id == 999) ? 'disabled' : '';
-		var disabledDelete = (userCount > 0 || v.default == 1 || v.group_id == 999 || v.group_id == 0) ? 'disabled' : '';
+		var disabledDelete = (userCount > 0 || v.default == 1 || v.group_id == 999 || v.group_id <= 1) ? 'disabled' : '';
 		var defaultIcon = (v.default == 1) ? 'icon-user-following' : 'icon-user-follow';
 		var defaultColor = (v.default == 1) ? 'btn-info disabled' : 'btn-warning';
 		userList += `