Problem:
I created a static page view (in its own view folder) that demos the new Sakura.css framework. The framework comes with four CSS themes. I want to be able to select a theme from a list of links and reload the same view with the associated CSS theme file via the controller. I also need the view to default to the 'standard.css' theme. Finally, I'd like to avoid JavaScript/jQuery solutions.
I'm struggling to grasp the relationship between controller function names, custom routing, and the URI. I think I'm at the brink of an 'aha' moment, and finding a solution this issue out is definitely going to help.
Current Code:
Note: I've also set .htaccess to remove index.php from the URL.
views/sakura/index.php
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<title>Sakura Demo</title>
<link rel="stylesheet" href="<?php echo asset_url() ;?>css/<?php echo $theme; ?>.css" media="screen" />
</head>
<body>
<header>
<nav>
<ul>
<li><a <?php if (isset($theme) && ($theme = 'standard')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/standard'); ?>">Standard</a></li>
<li><a <?php if (isset($theme) && ($theme = 'dark')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/dark'); ?>">Dark</a></li>
<li><a <?php if (isset($theme) && ($theme = 'earthly')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/earthly'); ?>">Earthly</a></li>
<li><a <?php if (isset($theme) && ($theme = 'vader')) { echo 'class="current"'; } ?>href="<?php echo base_url('sakura/vader'); ?>">Vader</a></li>
</ul>
</nav>
</header>
<main>
<h1>Sakura.css Demo</h1>
<p>Sakura.css is a minimal css framework/theme that can be dropped into any project for an instantaneous modern-looking website.</p>
</main>
<footer>
<p>Footer Text</p>
</footer>
</body>
</html>
controllers/Sakura.php
<?php
class Sakura extends CI_Controller {
public function theme($theme)
{
$data['theme'] = array(
'standard' => "standard",
'dark' => "dark",
'earthly' => "earthly",
'vader' => "vader"
);
$this->load->view('sakura/theme', $data);
}
}
config/routes.php
<?php
$route['sakura/(:any)'] = 'sakura/$1';
$route['sakura'] = 'sakura';
$route['default_controller'] = 'pages/view';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;
The only way I've been able to get the view to load at all is with this function in the Sakura.php controller:
public function index()
{
$data['theme'] = "standard";
$this->load->view('sakura/index', $data);
}
Desired URL Structure: <-- Not necessary, but would be great!
Default View: mywebsite.com/sakura/ -or- mywebsite.com/sakura/standard
Theme View: mywebsite.com/sakura/selected-theme
Final Thoughts:
Thank you all in advance for any help on this issue. I rely on the StackOverflow community often and I greatly appreciate the time and consideration that goes into solving my issues.
