Welcome Guest, Not a member yet? Register   Sign In
Jottla CI Template library
#1

[eluser]Syed Mobarak[/eluser]
Hi,

I have been working with CodeIgniter since 2 year. In this duration, I have made this library as per my needs. Today, I thought it might help you guys in your project. I have released it for all of you. I know it might need more work. I'll keep working on it. Your valuable feedback is necessary here. Please write me what's on your mind.

Find this project at google code (jottla-ci-template)
jottla-ci-template.googlecode.com/files/jottla-ci-template-v01.zip

File Structure:

See this file to understand the configuration
application/config/jottla_template.php

See this file to understand the library
application/libraries/Jottla_Template.php

Usage:
=================================
application/controllers/store.php
=================================
Code:
public function index() {
        // Load the library here or you can configure it in config/autoload as it's needed everywhere
        $this->load->library('Jottla_Template');

        // Set title which can be accessed from anywhere using
        // $this->jottla_template->getTitle() method
        // Also the static web title can be set in config/jottla_template
        $this->jottla_template->setTitle("My Store");

        // Set page title which can be accessed from anywhere using
        // $this->jottla_template->getPageTitle() method
        $this->jottla_template->setPageTitle("Store");

        // lets tell template about your panels and modules
        // nothing is not loaded instantly.
        // it's just saying the template what are the things it needs to consider
        // in the master view when you call $this->jottla_template->getPanel('header');
        // then it'll be rendered. So, it's on your demand.
        // In the panel or anywhere you can call the module, $this->jottla_template->getModule('footer_links');
        $this->jottla_template->setPanels(array('header', 'body', 'footer'));
        $this->jottla_template->setModules(array('footer_links'));

        //
        $this->jottla_template->data["items"] = array (
            'Computer',
            'Cell Phone',
            'Laptop',
            'Car'
        );
        
        $this->jottla_template->setBody("store");
        $this->jottla_template->load();
    }


============================
application/views/master.php
============================
Code:
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="keywords" content="<?php echo $this->jottla_template->getKeywords(); ?>" />
        <meta name="description" content="<?php echo $this->jottla_template->getDescription(); ?>" />
        <title><?php echo $this->jottla_template->getTitle(); ?></title>
        <?php $this->jottla_template->writeCss(); ?>
        <?php $this->jottla_template->writeJs(); ?>
    </head>
    <body>
        <!--header_panel  -->
        <?php echo $this->jottla_template->getPanel('header'); ?>
        <!--body_panel  -->
        <?php echo $this->jottla_template->getPanel('body'); ?>
        <!--footer  -->
        <?php echo $this->jottla_template->getPanel('footer'); ?>
    </body>
</html>

=========================================
application/views/panels/panel_footer.php
=========================================
Code:
<div id="footer_panel">
    <div class="wrapper">
        &lt;?php echo $this->jottla_template->getModule('footer_links'); // loading the module ?&gt;
        <p>&copy; Syed Mobarak, 2011, All rights reserved.</p>
    </div>
</div>

=========================================
application/views/panels/panel_body.php
=========================================
Code:
<div id="body_panel">
    <div class="wrapper">
        <table width="100%" cellpadding="0" cellspacing="0" border="0">
            <tr>
                <td valign="top" style="width: 100%;">
                    &lt;?php echo $this->jottla_template->getBody(); ?&gt;
                </td>
            </tr>
        </table>
        <div class="clear" style="height:20px;"></div>
    </div>
    &lt;!--pagewrap End --&gt;
</div>

=========================================
application/views/modules/mod_footer_links.php
=========================================
Code:
<div>
    Your links here
</div>
#2

[eluser]toopay[/eluser]
Did you have provide some caching/minify feature, since i see your template library also outputing asset (css, js files). Also did your template provide a way to load the js file in body section rather than in head? All of these questions is just to ensure maximum performance Tongue
Also, can you elaborate more about your template parse ability, more clearly?

Thank you.
#3

[eluser]Syed Mobarak[/eluser]
Since CodeIgniter has it's own cache feature, I didn't think about it. Jottla is a library which collects all resources and data for UI(view) through the process of an action. Also it splits up your UI with different segments to manage. Actually, it's an interface between Controller and View. Controller does not pass data to the view directly. data is collected by the Jottla library and when a view is rendered, it gets data from Jottla. I just tried to gather some functions and properties there so that we don't need to define all stuffs in $data array.

Anyway, I could not make the proper document for it yet. I'll do that once. In this mean time please look over all functions in libraries/Jottla_Template.php file. Nothing complex, you'll have a good idea of it.

To answer your question of JS in Body. No, I didn't do that yet. But it's a good idea and thanks for that. I'll work it out in my free time.
#4

[eluser]toopay[/eluser]
When i said about cache/minify features of asset file (js/css), i am referencing to "cache static content" stuff, which nothing to do with CI cache mechanism i believe. You will consider these stuff, everytime you tunning your v2 application to reach maximum performance (like what i do for these recent weeks lol)

Second, by load js file on the body, it still related with my first paragraph. In that way, somehow, your template (should) provide an ability to collect js files (or even better, create a single cached js file) also grab all inline script in the right place. Since in that phase, every milisecond which can improve performance is damn important Smile

Anyway, i will take a look for that, and once again, thanks for share.




Theme © iAndrew 2016 - Forum software by © MyBB