Closes #4748 - Bootstrap5 Theme enhancements. Bootswatch 5.

e107_core/templates/header_default.php

@@ -301,9 +301,13 @@ if(defined("PREVIEWTHEME"))
 } 
 else 
 {
-	$css_default = "all"; // TODO - default should be defined by the theme
+	$css_default = "all";
-	// theme-css.php auto-detection TODO - convert it to constant or anything different from GLOBAL
+
-	if (isset($theme_css_php) && $theme_css_php) 
+	if(method_exists('theme', 'css')) // new v2.3.2  theme styles load override.
+	{
+		e107::callMethod('theme', 'css');
+	}
+	elseif (isset($theme_css_php) && $theme_css_php)
 	{
 		//echo "<link rel='stylesheet' href='".THEME_ABS."theme-css.php' type='text/css' />\n";
 		$e_js->themeCSS('theme-css.php', $css_default);
@@ -352,16 +356,10 @@ $e_js->renderLinks();
 
 // Other CSS - from unknown location, different from core/theme/plugin location or backward compatibility; NOTE - could be removed in the future!!!
 
-//TODO Additional options for 'bootstrap' and 'style' (ie. THEME_STYLE loaded above). Requires changes to js_manager.php 
-
-
-
-
-
 $CSSORDER = deftrue('CSSORDER') ? explode(",",CSSORDER) : array('library', 'other','core','plugin','theme','inline');
 
 /** Experimental - Subject to removal at any time. Use at own risk  */
-if(method_exists('theme', 'css'))
+if(method_exists('theme', 'cssFilter'))
 {
 	$e_js->set('_theme_css_processor', true);
 }

e107_handlers/e107_class.php

@@ -2652,7 +2652,7 @@ class e107
 		$jshandler = self::getJs();
 		$jshandler->setDependency($dep);
 
-		if(strpos($data,'http')===0)
+		if(strpos($data,'http')===0 && ($type !== 'theme'))
 		{
 			$type = 'url';
 		}
@@ -2670,7 +2670,7 @@ class e107
 			break;
 
 			case 'theme':
-				// data is path relative to current theme
+				// data is path relative to current theme or URL to load in the 'theme' zone.
 				$jshandler->themeCSS($data, $media, $preComment, $postComment);
 			break;
 

e107_handlers/js_manager.php

@@ -1083,7 +1083,7 @@ class e_jsmanager
 			break;
 
 			case 'theme_css':
-				$file_path = $runtime_location.$this->_sep.'{e_THEME}'.$this->getCurrentTheme().'/'.trim($file_path, '/').$this->_sep.$pre.$this->_sep.$post;
+				$file_path = $runtime_location.$this->_sep.(strpos($file_path, 'http') !== 0 && strpos($file_path, '//') !== 0 ?'{e_THEME}'.$this->getCurrentTheme().'/'.trim($file_path, '/') : $file_path).$this->_sep.$pre.$this->_sep.$post;
 				if(!isset($this->_e_css['theme'])) $this->_e_css['theme'] = array();
 				$registry = &$this->_e_css['theme'];
 				$runtime = true;
@@ -1291,8 +1291,8 @@ class e_jsmanager
 			case 'core_css': //e_jslib
 				if($this->_theme_css_processor)
 				{
-					$this->_e_css['core'] = e107::callMethod('theme', 'css', $this->_e_css['core'], 'core');
+					$this->_e_css['core'] = e107::callMethod('theme', 'cssFilter', $this->_e_css['core'], 'core');
-					e107::getMessage()->addDebug('Theme css() method is experimental and is subject to removal at any time. Use at own risk');
+					e107::getMessage()->addDebug('Theme cssFilter() method is experimental and is subject to removal at any time. Use at own risk');
 				}
 				$this->renderFile(varset($this->_e_css['core'], array()), $external, 'Core CSS', $mod, false);
 				unset($this->_e_css['core']);
@@ -1301,7 +1301,7 @@ class e_jsmanager
 			case 'plugin_css': //e_jslib
 				if($this->_theme_css_processor)
 				{
-					$this->_e_css['plugin'] = e107::callMethod('theme', 'css', $this->_e_css['plugin'], 'plugin');
+					$this->_e_css['plugin'] = e107::callMethod('theme', 'cssFilter', $this->_e_css['plugin'], 'plugin');
 				}
 				$this->renderFile(varset($this->_e_css['plugin'], array()), $external, 'Plugin CSS', $mod, false);
 				unset($this->_e_css['plugin']);
@@ -1315,7 +1315,7 @@ class e_jsmanager
 			case 'other_css':
 				if($this->_theme_css_processor)
 				{
-					$this->_e_css['other'] = e107::callMethod('theme', 'css', $this->_e_css['other'], 'other');
+					$this->_e_css['other'] = e107::callMethod('theme', 'cssFilter', $this->_e_css['other'], 'other');
 				}
 				$this->renderFile(varset($this->_e_css['other'], array()), $external, 'Other CSS', $mod, false);
 				unset($this->_e_css['other']);

e107_handlers/theme_handler.php

@@ -166,7 +166,7 @@ class e_theme
 	/**
 	 * Return an array of theme library or stylesheet values (as defined in theme.xml) that match the desired scope.
 	 * @note New in v2.3.1+
-	 * @param string $type library | stylesheet
+	 * @param string $type library | css
 	 * @param string $scope  front | admin | all | auto (as defined in theme.xml)
 	 * @return array
 	 */
@@ -287,8 +287,7 @@ class e_theme
 	/**
 	 * Load library dependencies.
 	 *
-	 * @param string $scope
+	 * @param string $scope  front | admin | all | auto
-	 *  front | admin | all | auto
 	 */
 	public function loadLibrary($scope = 'auto')
 	{
@@ -302,6 +301,8 @@ class e_theme
 
 		$loaded = [];
 
+		$excludeCSS = (string) $this->cssAttribute('auto', 'exclude'); // current theme style
+
 		foreach($libraries as $name => $library)
 		{
 
@@ -310,6 +311,11 @@ class e_theme
 				continue;
 			}
 
+			if($name === $excludeCSS)
+			{
+				$library['files'] = 'js'; // load only JS, but not CSS since the style excluded it.
+			}
+
 			if($name === 'bootstrap' && !empty($library['version']))
 			{
 				if((int) $library['version'] > 3) // quick fix.
@@ -1348,7 +1354,7 @@ class e_theme
 			define('THEME_STYLE', $pref['admincss']);
 			self::initThemeLayout();  // the equivalent for frontend is in header_default.php
 		}
-		elseif(!empty($pref['themecss']) && file_exists(THEME.$pref['themecss']))
+		elseif(!empty($pref['themecss']) && (file_exists(THEME.$pref['themecss']) || strpos($pref['themecss'],'https') === 0))
 		{
 			define('THEME_STYLE', $pref['themecss']);
 		}
@@ -2831,38 +2837,12 @@ class themeHandler
 		
 					$text .= varset($itext);
 
-
-
 					// Render skin previews.
-					if(self::RENDER_ADMINPREFS === $mode)
+					if($skinText = self::renderSkin($theme, $mode, $pref))
 					{
-						$parms = [];
+						$text .= $skinText;
-						$parms['path'] = e_THEME.$theme['path'].'/';
-						$parms['block-class'] = 'admin-css-selector col-md-3';
-
-						foreach($theme['css'] as $val)
-						{
-							$kid = $val['name'];
-						 // $val['description'];
-							$parms['optArray'][$kid] = array(
-								'thumbnail' => $val['thumbnail'],
-								'label'     => $val['info']."<br /><small>".$val['description']."</small>",
-							);
 					}
-
+					elseif(!empty($theme['multipleStylesheets']) && $mode && !empty($theme['css']) && self::RENDER_SITEPREFS === $mode)
-						$text .= "<tr><td style='vertical-align:top;'><b>".TPVLAN_95.":</b></td>
-								<td colspan='2' style='vertical-align:top'>
-								";
-						$text .= e107::getForm()->radioImage('admincss', vartrue($pref['admincss']), $parms);
-						$text .= "</td></tr>";
-
-
-					}
-
-
-
-
-					if(array_key_exists("multipleStylesheets", $theme) && $mode && !empty($theme['css']) && self::RENDER_SITEPREFS === $mode)
 					{
 						$pLabel =  TPVLAN_22;
 
@@ -3461,8 +3441,48 @@ class themeHandler
 
 	}
 */
+	/**
+	 * @param array $theme
+	 * @param string $mode
+	 * @param mixed $value
+	 * @return array
+	 */
+	private static function renderSkin($theme, $mode, $pref)
+	{
 
+		$parms = [];
+		$parms['path'] = e_THEME . $theme['path'] . '/';
+		$parms['block-class'] = 'admin-css-selector col-md-3';
 
+		foreach($theme['css'] as $val)
+		{
+			if(empty($val['thumbnail']))
+			{
+				continue;
+			}
+
+			$kid = $val['name'];
+			// $val['description'];
+			$parms['optArray'][$kid] = array(
+				'thumbnail' => $val['thumbnail'],
+				'label'     => $val['info'] . "<br /><small>" . $val['description'] . "</small>",
+			);
+		}
+
+		if(empty($parms['optArray']))
+		{
+			return '';
+		}
+
+		$text = "<tr><td style='vertical-align:top;'><b>" . TPVLAN_95 . ":</b></td>
+								<td colspan='2' style='vertical-align:top'>
+								";
+		$css = ($mode === self::RENDER_ADMINPREFS) ? 'admincss' : 'themecss';
+		$text .= e107::getForm()->radioImage($css, vartrue($pref[$css]), $parms);
+		$text .= "</td></tr>";
+
+		return $text;
+	}
 
 
 }

e107_plugins/hero/templates/hero_template.php

@@ -30,7 +30,7 @@ $HERO_TEMPLATE['default']['footer'] 	= '</div><div class="carousel-controls">
 						              </div>';
 
 
-$HERO_TEMPLATE['default']['start'] 	    = '<div class="carousel-item item {HERO_SLIDE_ACTIVE}" style="background-image:{HERO_BGIMAGE}">
+$HERO_TEMPLATE['default']['start'] 	    = '<div class="carousel-item item {HERO_SLIDE_ACTIVE} bg-dark" style="background-image:{HERO_BGIMAGE}">
 						                  <div class="container">
 						                  
 						                  <div class="carousel-caption">

e107_tests/tests/unit/e_themeTest.php

@@ -23,7 +23,7 @@ class e_themeTest extends \Codeception\Test\Unit
 		}
 		catch(Exception $e)
 		{
-			$this->assertTrue(false, "Couldn't load e_theme object");
+			$this->fail("Couldn't load e_theme object");
 		}
 
 		$this->tm->clearCache();
@@ -31,12 +31,13 @@ class e_themeTest extends \Codeception\Test\Unit
 	}
 
 
-	/*
+
 	public function testCssAttribute()
 	{
-
+		$result = e107::getTheme('bootstrap5')->cssAttribute('front','name');
+		$this->assertSame('style.css', $result);
 	}
-
+/*
 			public function testUpgradeThemeCode()
 			{
 
@@ -484,11 +485,18 @@ class e_themeTest extends \Codeception\Test\Unit
 			{
 
 			}
-
+*/
 	public function testGetThemeInfo()
 	{
+		$themeObj = $this->tm;
+		$data = $themeObj::getThemeInfo('bootstrap3');
+		$result= !empty($data['stylesheetThumbnails']['admin']);
+		$this->assertTrue($result);
 
-			}*/
+		$data = $themeObj::getThemeInfo('bootstrap5');
+		$result= !empty($data['stylesheetThumbnails']['front']);
+		$this->assertTrue($result);
+	}
 
 	public function testGetThemeLayout()
 	{

e107_themes/bootstrap5/style.css

@@ -105,8 +105,18 @@ ul.social-buttons li a {
  /* margin-top: 60px;*/
   padding: 2rem 1rem;
  /* margin-bottom: 2rem;*/
-  background-color: #e9ecef;
+ /* background-color: #e9ecef;*/
  /* border-radius: .3rem;*/
 }
 
+#carousel-hero.carousel {
+  position: relative;
+  left: 0;
+  top: 70px;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  margin-bottom: 60px;
+}
+
 /* CUSTOM Responsive Styles */

e107_themes/bootstrap5/theme.php

@@ -10,6 +10,8 @@ if(!defined('e107_INIT'))
 	class theme implements e_theme_render
 	{
 
+
+
         public function init()
         {
 
@@ -17,15 +19,8 @@ if(!defined('e107_INIT'))
 
             e107::meta('viewport', 'width=device-width, initial-scale=1.0'); // added to <head>
 	        // e107::link('rel="preload" href="{THEME}fonts/myfont.woff2?v=2.2.0" as="font" type="font/woff2" crossorigin');  // added to <head>
-
             // e107::meta('apple-mobile-web-app-capable','yes');
 
-            if($bootswatch = e107::pref('theme', 'bootswatch', false))
-            {
-                e107::css('url', 'https://bootswatch.com/4/' . $bootswatch . '/bootstrap.min.css');
-                e107::css('url', 'https://bootswatch.com/4/' . $bootswatch . '/bootstrap.min.css');
-            }
-
             $login_iframe  = e107::pref('theme', 'login_iframe', false);
 
             if(THEME_LAYOUT === "splash" && $login_iframe)
@@ -36,13 +31,23 @@ if(!defined('e107_INIT'))
         }
 
 
+		/**
+		 * Override how THEME_STYLE is loaded. Duplicates will be automatically removed.
+		 * @return void
+		 */
+		function css()
+		{
+			e107::css('theme', THEME_STYLE);
+			e107::css('theme', 'style.css'); // always load style.css last.
+		}
+
+
 		/**
 		 * @param string $text
 		 * @return string without p tags added always with bbcodes
 		 * note: this solves W3C validation issue and CSS style problems
 		 * use this carefully, mainly for custom menus, let decision on theme developers
 		 */
-
 		function remove_ptags($text = '') // FIXME this is a bug in e107 if this is required.
 		{
 
@@ -72,6 +77,9 @@ if(!defined('e107_INIT'))
 					$style = 'splash';
 					break;
 
+				case 'news_months_menu':
+					$style = 'listgroup';
+				break;
 			}
 
 			echo "\n<!-- tablestyle initial:  style=" . $style . "  mode=" . $mode . "  UniqueId=" . varset($options['uniqueId']) . " -->\n\n";

e107_themes/bootstrap5/theme.xml

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
-<e107Theme name="Bootstrap 5" version="1.0" date="2021-03-22" compatibility="2.3.1">
+<e107Theme name="Bootstrap 5" version="1.1" date="2022-04-05" compatibility="2.3.2">
 	<author name ="e107 Inc" email="e107inc@something.com" url="https://e107.org" />
 	<summary>Bootstrap 5 basic theme</summary>
 	<description>A starter template for bootstrap5 themes.</description>
@@ -10,12 +10,14 @@
         <plugin name='rss_menu' url='core' />
         <plugin name='social' url='core' />
         <plugin name='tinymce4' url='core' />
+        <plugin name='gsitemap' url='core' />
 	</plugins>
 	<keywords>
 		<word>bootstrap</word>
 		<word>bootstrap5</word>
 		<word>clean</word>
         <word>wireframe</word>
+        <word>bootswatch</word>
 	</keywords>
 	<libraries>
 		<library name="bootstrap" version="5" scope="front"/>
@@ -24,7 +26,12 @@
         <library name="animate.css" scope="front" />
 	</libraries>
 	<stylesheets>
-		<css file="style.css" name="Default" />
+		<css file="style.css" name="Default" thumbnail='preview_frontend.png' scope='front' />
+		<css file="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/5.1.3/lux/bootstrap.min.css" name="Lux" thumbnail='images/lux.png' scope='front' exclude='bootstrap' />
+		<css file="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/5.1.3/sketchy/bootstrap.min.css" name="Sketchy" thumbnail='images/sketchy.png' scope='front' exclude='bootstrap' />
+        <css file="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/5.1.3/quartz/bootstrap.min.css" name="Quartz" thumbnail='images/quartz.png' scope='front' exclude='bootstrap' />
+		<css file="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/5.1.3/slate/bootstrap.min.css" name="Slate" thumbnail='images/slate.png' scope='front' exclude='bootstrap' />
+        <css file="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/5.1.3/superhero/bootstrap.min.css" name="Superhero" thumbnail='images/superhero.png' scope='front' exclude='bootstrap' />
 	</stylesheets>
 	<screenshots>
 		<image>preview_frontend.png</image>
@@ -47,7 +54,6 @@
 	</layouts>
 	<themePrefs>
 		<pref name='cardmenu_look'>1</pref>
-		<pref name='inlinecss'></pref>
 		<pref name='login_iframe'></pref>
 	</themePrefs>
 </e107Theme>

e107_themes/bootstrap5/theme_config.php

@@ -33,22 +33,25 @@ class theme_config implements e_theme_config
 			"lux"       => 'Lux',
 			"materia"   => 'Materia',
 			"minty"     => 'Minty',
+			'morph'     => 'Morph',
 			"pulse"     => 'Pulse',
+			'quartz'    => 'Quartz',
 			"sandstone" => 'Sandstone',
 			"simplex"   => 'Simplex',
-            "sketchy"=> 'sketchy', 
+			"sketchy"   => 'Sketchy',
 			"slate"     => 'Slate',
 			"solar"     => 'Solar',
 			"spacelab"  => 'Spacelab',
 			"superhero" => 'Superhero',
 			"united"    => 'United',
 			"yeti"      => 'Yeti',
+			'zephyr'    => 'Zephyr',
 		);
 		
 		$previewLink = " <a class='btn btn-default btn-secondary e-modal' data-modal-caption=\"Use the 'Themes' menu to view the selection.\" href='http://bootswatch.com/default/'>".LAN_PREVIEW."</a>";
 
 		return array(
-			'bootswatch'        => array('title'=>LAN_THEMEPREF_01, 'type'=>'dropdown', 'writeParms'=>array('optArray'=> $bootswatch, 'post'=>$previewLink, 'default'=>LAN_DEFAULT)),
+			//'bootswatch'        => array('title'=>LAN_THEMEPREF_01, 'type'=>'dropdown', 'writeParms'=>array('optArray'=> $bootswatch, 'post'=>$previewLink, 'default'=>LAN_DEFAULT)),
 			'cardmenu_look' => array('title' => LAN_THEMEPREF_02, 'type'=>'boolean', 'writeParms'=>array(),'help'=>''),
 			'login_iframe' => array('title' => LAN_THEMEPREF_03, 'type'=>'boolean', 'writeParms'=>array(),'help'=>''),
 			);