changed plugin settings tab module to have independent api calls

api/classes/organizr.class.php

@@ -2010,6 +2010,27 @@ class Organizr
 	
 	public function systemMenuLists()
 	{
+		$pluginsMenu = [
+			[
+				'active' => false,
+				'api' => 'api/v2/page/settings_plugins_enabled',
+				'anchor' => 'settings-plugins-enabled-anchor',
+				'name' => 'Active',
+			],
+			[
+				'active' => false,
+				'api' => 'api/v2/page/settings_plugins_disabled',
+				'anchor' => 'settings-plugins-disabled-anchor',
+				'name' => 'Inactive',
+			],
+			[
+				'active' => false,
+				'api' => false,
+				'anchor' => 'settings-plugins-marketplace-anchor',
+				'name' => 'Marketplace',
+				'onclick' => 'loadMarketplace(\'plugins\');'
+			],
+		];
 		$userManagementMenu = [
 			[
 				'active' => false,
@@ -2119,6 +2140,7 @@ class Organizr
 		$systemMenus['tab_editor'] = $this->buildSettingsMenus($tabEditorMenu, 'Tab Editor');
 		$systemMenus['customize'] = $this->buildSettingsMenus($customizeMenu, 'Customize');
 		$systemMenus['user_management'] = $this->buildSettingsMenus($userManagementMenu, 'User Management');
+		$systemMenus['plugins'] = $this->buildSettingsMenus($pluginsMenu, 'Plugins');
 		return $systemMenus;
 	}
 	

api/pages/settings-plugins-disabled.php

@@ -0,0 +1,20 @@
+<?php
+$GLOBALS['organizrPages'][] = 'settings_plugins_disabled';
+function get_page_settings_plugins_disabled($Organizr)
+{
+	if (!$Organizr) {
+		$Organizr = new Organizr();
+	}
+	if ((!$Organizr->hasDB())) {
+		return false;
+	}
+	if (!$Organizr->qualifyRequest(1, true)) {
+		return false;
+	}
+	return '
+<script>
+	buildPlugins("disabled");
+</script>
+<div id="disabled-plugin-area"></div>
+';
+}

api/pages/settings-plugins-enabled.php

@@ -0,0 +1,25 @@
+<?php
+$GLOBALS['organizrPages'][] = 'settings_plugins_enabled';
+function get_page_settings_plugins_enabled($Organizr)
+{
+	if (!$Organizr) {
+		$Organizr = new Organizr();
+	}
+	if ((!$Organizr->hasDB())) {
+		return false;
+	}
+	if (!$Organizr->qualifyRequest(1, true)) {
+		return false;
+	}
+	return '
+<script>
+	buildPlugins("enabled");
+</script>
+<div id="enabled-plugin-area"></div>
+<form id="about-plugin-form" class="mfp-hide white-popup-block mfp-with-anim">
+    <h2 id="about-plugin-title">Loading...</h2>
+    <div class="clearfix"></div>
+    <div id="about-plugin-body" class=""></div>
+</form>
+';
+}

api/pages/settings.php

@@ -52,7 +52,7 @@ function get_page_settings($Organizr)
 						<li onclick="changeSettingsMenu(\'Settings::Customize\')" id="settings-main-customize-anchor"><a href="#settings-main-customize" class="sticon ti-paint-bucket"><span lang="en">Customize</span></a></li>
 						<li onclick="changeSettingsMenu(\'Settings::User Management\')" id="settings-main-user-management-anchor"><a href="#settings-main-user-management" class="sticon ti-user"><span lang="en">User Management</span></a></li>
 						<li onclick="changeSettingsMenu(\'Settings::Image Manager\');loadSettingsPage2(\'api/v2/page/settings_image_manager\',\'#settings-image-manager-view\',\'Image Viewer\');" id="settings-main-image-manager-anchor"><a href="#settings-main-image-manager" class="sticon ti-image"><span lang="en">Image Manager</span></a></li>
-						<li onclick="changeSettingsMenu(\'Settings::Plugins\');loadSettingsPage2(\'api/v2/page/settings_plugins\',\'#settings-main-plugins\',\'Plugins\');" id="settings-main-plugins-anchor"><a href="#settings-main-plugins" class="sticon ti-plug"><span lang="en">Plugins</span></a></li>
+						<li onclick="changeSettingsMenu(\'Settings::Plugins\')" id="settings-main-plugins-anchor"><a href="#settings-main-plugins" class="sticon ti-plug"><span lang="en">Plugins</span></a></li>
 						<li onclick="changeSettingsMenu(\'Settings::System Settings\');authDebugCheck();" id="settings-main-system-settings-anchor"><a href="#settings-main-system-settings" class="sticon ti-settings"><span lang="en">System Settings</span></a></li>
 					</ul>
 				</nav>
@@ -144,7 +144,43 @@ function get_page_settings($Organizr)
 					</section>
 					<! -- PLUGINS -->
 					<section id="settings-main-plugins">
-						<h2 lang="en">Plugins</h2>
+						' . $systemMenus['plugins'] . '
+						<!-- Tab panes -->
+						<div class="tab-content">
+							<div role="tabpanel" class="tab-pane fade" id="settings-plugins-enabled">
+								<h2 lang="en">Loading...</h2>
+								<div class="clearfix"></div>
+							</div>
+							<div role="tabpanel" class="tab-pane fade" id="settings-plugins-disabled">
+								<h2 lang="en">Loading...</h2>
+								<div class="clearfix"></div>
+							</div>
+							<div role="tabpanel" class="tab-pane fade" id="settings-plugins-marketplace">
+								<div class="panel bg-org panel-info">
+									<div class="panel-heading">
+										<span lang="en">Plugin Marketplace</span>
+									</div>
+									<div class="panel-wrapper collapse in" aria-expanded="true">
+										<div class="table-responsive">
+											<table class="table table-hover manage-u-table">
+												<thead>
+													<tr>
+														<th width="70" class="text-center" lang="en">PLUGIN</th>
+														<th></th>
+														<th lang="en">CATEGORY</th>
+														<th lang="en">STATUS</th>
+														<th lang="en" style="text-align:center">INFO</th>
+														<th lang="en" style="text-align:center">INSTALL</th>
+														<th lang="en" style="text-align:center">DELETE</th>
+													</tr>
+												</thead>
+												<tbody id="managePluginTable"></tbody>
+											</table>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
 					</section>
 					<! -- SYSTEM SETTINGS -->
 					<section id="settings-main-system-settings">

js/custom.js

@@ -1154,7 +1154,6 @@ $(document).on('click', '.enablePlugin', function() {
 	ajaxloader(".content-wrap","in");
 	let pluginConfigValue = $(this).attr('data-config-name');
 	let callbacks = $.Callbacks();
-	callbacks.add( buildPlugins );
 	callbacks.add( ajaxloader );
 	let data = {};
 	data[pluginConfigValue] = 'true';
@@ -1162,6 +1161,8 @@ $(document).on('click', '.enablePlugin', function() {
 		try {
 			message('Plugin Enabled','',activeInfo.settings.notifications.position,"#FFF","success","5000");
 			if(callbacks){ callbacks.fire(); }
+			buildPlugins('disabled');
+			//buildPlugins('enabled');
 		}catch(e) {
 			organizrCatchError(e,data);
 		}
@@ -1187,7 +1188,6 @@ $(document).on('click', '.disablePlugin', function() {
 	        ajaxloader(".content-wrap","in");
 			let pluginConfigValue = plugin.attr('data-config-name');
 	        var callbacks = $.Callbacks();
-	        callbacks.add( buildPlugins );
 	        callbacks.add( ajaxloader );
 	        var data = {};
 	        data[pluginConfigValue] = 'false';
@@ -1195,6 +1195,7 @@ $(document).on('click', '.disablePlugin', function() {
 		        try {
 			        message('Plugin Disabled','',activeInfo.settings.notifications.position,"#FFF","success","5000");
 			        if(callbacks){ callbacks.fire(); }
+			        buildPlugins('enabled');
 		        }catch(e) {
 			        organizrCatchError(e,data);
 		        }

js/functions.js

@@ -1161,7 +1161,87 @@ function buildFormItem(item){
 			return '<span class="text-danger">BuildFormItem Class not setup...';
 	}
 }
-function buildPluginsItem(array){
+function buildPluginsItem(array, type = 'enabled'){
+	var activePlugins = '';
+	var inactivePlugins = '';
+	$.each(array, function(i,v) {
+		var settingsPage = (v.settings == true && type == 'enabled') ? `
+		<!-- Plugin Settings Page -->
+		<form id="`+v.idPrefix+`-settings-page" class="mfp-hide white-popup mfp-with-anim addFormTick col-md-10 col-md-offset-1" autocomplete="off">
+            <div class="panel bg-org panel-info">
+                <div class="panel-heading">
+                    <span lang="en">`+v.name+` Settings</span>
+                    <button type="button" class="btn bg-org btn-circle close-popup pull-right"><i class="fa fa-times"></i> </button>
+                    <button id="`+v.idPrefix+`-settings-page-save" onclick="submitSettingsForm('`+v.idPrefix+`-settings-page')" class="btn btn-sm btn-info btn-rounded waves-effect waves-light pull-right hidden animated loop-animation rubberBand m-r-20" type="button"><span class="btn-label"><i class="fa fa-save"></i></span><span lang="en">Save</span></button>
+                </div>
+                <div class="panel-wrapper collapse in" aria-expanded="true">
+                    <div class="bg-org">
+                        <fieldset id="`+v.idPrefix+`-settings-items" style="border:0;" class=""><h2>Loading...</h2></fieldset>
+                    </div>
+                    <div class="clearfix"></div>
+                </div>
+            </div>
+		</form>
+		` : '';
+		var href = (v.settings == true) ? '#'+v.idPrefix+'-settings-page' : 'javascript:void(0);';
+		if(v.enabled == true){
+			var activeToggle = `<li><a class="btn default btn-outline disablePlugin" href="javascript:void(0);" data-plugin-name="`+v.name+`" data-config-prefix="`+v.configPrefix+`" data-config-name="`+v.configPrefix+`-enabled"><i class="ti-power-off fa-2x"></i></a></li>`;
+			var settings = `<li><a class="btn default btn-outline popup-with-form" href="`+href+`" data-effect="mfp-3d-unfold"data-plugin-name="`+v.name+`" id="`+v.idPrefix+`-settings-button" data-config-prefix="`+v.configPrefix+`" data-api="${v.api}" data-settings="${v.settings}" data-bind="${v.bind}"><i class="ti-panel fa-2x"></i></a></li>`;
+		}else{
+			var activeToggle = `<li><a class="btn default btn-outline enablePlugin" href="javascript:void(0);" data-plugin-name="`+v.name+`" data-config-prefix="`+v.configPrefix+`" data-config-name="`+v.configPrefix+`-enabled"><i class="ti-plug fa-2x"></i></a></li>`;
+			var settings = '';
+		}
+		var plugin = `
+		<div class="col-lg-2 col-md-2 col-sm-4 col-xs-4">
+			<div class="white-box m-0">
+				<div class="el-card-item p-0">
+					<div class="el-card-avatar el-overlay-1 m-0"> <img class="lazyload" data-src="`+v.image+`">
+						<div class="el-overlay">
+							<ul class="el-info">
+								${settings} ${activeToggle}
+							</ul>
+						</div>
+					</div>
+					<div class="el-card-content">
+						<h3 class="box-title elip">`+v.name+`</h3>
+						<small class="elip text-uppercase p-b-10">`+v.category+`</small>
+					</div>
+				</div>
+			</div>
+		</div>
+		`;
+		if(v.enabled == true){
+			activePlugins += plugin+settingsPage;
+		}else{
+			inactivePlugins += plugin+settingsPage;
+		}
+	});
+	activePlugins = (activePlugins.length !== 0) ? activePlugins : '<h2 class="text-center" lang="en">Nothing Active</h2>';
+	inactivePlugins = (inactivePlugins.length !== 0) ? inactivePlugins : '<h2 class="text-center" lang="en">Everything Active</h2>';
+	return (type === 'enabled') ? `
+	<div class="panel bg-org panel-info">
+		<div class="panel-heading">
+			<span lang="en">Active Plugins</span>
+		</div>
+		<div class="panel-wrapper collapse in" aria-expanded="true">
+			<div class="panel-body bg-org">
+				<div class="row el-element-overlay m-b-40">`+activePlugins+`</div>
+			</div>
+		</div>
+	</div>
+	<div class="clearfix"></div>` : `	
+	<div class="panel bg-org panel-info">
+		<div class="panel-heading">
+			<span lang="en">Inactive Plugins</span>
+		</div>
+		<div class="panel-wrapper collapse in" aria-expanded="true">
+			<div class="panel-body bg-org">
+				<div class="row el-element-overlay m-b-40">`+inactivePlugins+`</div>
+			</div>
+		</div>
+	</div>`;
+}
+function buildPluginsItemOld(array){
 	var activePlugins = '';
 	var inactivePlugins = '';
 	$.each(array, function(i,v) {
@@ -1831,14 +1911,26 @@ function buildHomepageItem(array){
 	}
 	return listing;
 }
-function buildPlugins(){
+function buildPluginsOLD(){
 	organizrAPI2('GET','api/v2/plugins').success(function(data) {
         try {
             var response = data.response;
         }catch(e) {
 	        organizrCatchError(e,data);
         }
-		$('#main-plugin-area').html(buildPluginsItem(response.data));
+		$('#main-plugin-area').html(buildPluginsItemOLD(response.data));
+	}).fail(function(xhr) {
+		OrganizrApiError(xhr);
+	});
+}
+function buildPlugins(status = 'enabled'){
+	organizrAPI2('GET','api/v2/plugins/' + status).success(function(data) {
+		try {
+			var response = data.response;
+		}catch(e) {
+			organizrCatchError(e,data);
+		}
+		$('#'+status+'-plugin-area').html(buildPluginsItem(response.data, status));
 	}).fail(function(xhr) {
 		OrganizrApiError(xhr);
 	});