Skip to content

Taco Class The power of jQuery all wrapped up in a Codeigniter Library

Derek Jones edited this page Jul 4, 2012 · 10 revisions

[color=green][size=4][b]The Taco class for codeigniter.[/b] [/size][/color] [color=green]——————————————————————————————————————————————————-[/color] You can see a demonstration of this libaray at http://findmeonthe.net/TACONITE/ It has lots of examples. [color=green]——————————————————————————————————————————————————-[/color] [size=3][color=blue]Updated to version:- 4.06[/color][/size]

What does this class do:

  • [b]Manipulate html elements from within your controller [/b]
  • [b]Transmit data via AJAX[/b]
  • [b]Send JQUERY commands e.g. slideUp, fade, show, hide, replaceWith, append, etc etc. to munipulate your webpages, without reloading the pages[/b]

This class simply generates an xml file that allows you to take control of your webpage.

Where the magic happens

<?php if (!defined('ABSPATH')) exit('No direct script access allowed');

/**
* ----------------------------------------------------------------------------
*
* The Software shall be used for Good, not Evil... bad eval()!
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
* SOFTWARE.
*
*/
DEFINE('TACO_VERSION', 4.06);

// --------------------------------------------------------------------    
class Taco{

    var $storage =  array();
    
    var $newline = "\r\n";
    
    var $xml_encode = 'ISO-8859-1';
    
    var $xml_vers = '1.0';
    
    var $html = FALSE;
    
    var $method = 'xml';

// --------------------------------------------------------------------    
    function taco()
    {
        $this->storage[] = '<eval>&lt;![CDATA['.$this->_decode().']]></eval>';    
    }    
// --------------------------------------------------------------------            
    function _encode($string){
        return preg_replace(array('/</', '/>/','/&raquo;/'), array('&lt;','&gt;','~raquo;'), $string);
    }    
// --------------------------------------------------------------------            
    function _camel($string)
    {    
        if( strpos($string,'_') === FALSE )    return $string;    
        $s = split('_', $string );
        return strtolower( trim( $s[0] ) ). ucwords( strtolower( trim( $s[1] ) ) );
    }    
// --------------------------------------------------------------------    
    function set($name = '', $attributes = NULL, $content = NULL)
    {
        if( is_string($attributes) and $attributes != '' )
        {            
            /*  */
            switch(true)
            {
                /* self closing + css/class etc. etc. */
                case( is_array($content) ):
                
                    foreach( $content as $arg1 => $arg2 ) 
                    {
                        $this->storage[] = '<'.$name.' select="'.$attributes.'" arg1="'.$this->_camel($arg1).'" arg2="'.$this->_camel($arg2).'" />';
                    }        
                    break;
                /* single + show or class */
                case( $content == 'fast'):
                case( $content == 'slow' ):
                case( $name == 'addClass' ):
                case( $name == 'removeClass' ):
                case( $name == 'toggleClass' ):                
                    $this->storage[] = '<'.$name.' select="'.$attributes.'" arg1="'.$content.'" />';
                    break;
                /* self closing + special: eval */
                case( ($name == 'eval' ) ):
                    
                    $this->storage[] = '<eval>&lt;![CDATA['.$attributes.']]></eval>';
                    break;
                /* content replace etc. etc. */
                case( is_string($content) ):
                    $this->storage[] = '<'.$name.' select="'.$attributes.'">'.$this->_encode($content). $this->newline .'</'.$name.'>';
                    $this->storage[] = '<decode select="'.$attributes.'" />';                    
                    break;
                
                default:
                    $this->storage[] = '<'.$name.' select="'.$attributes.'" arg1="'.$content.'" />';
            }    
        }
    }
// --------------------------------------------------------------------    
    function _decode(){
    /* add decodeing for rss_convert to taco */
        return  "jQuery.fn.decode=function(){
                return this.each(
                  function(){
                      var element = jQuery(this);
                      var html = element.html();
                      element.html(html.replace(/&amp;/g,'&')
                                        .replace(/&lt;/g,'<')
                                        .replace(/&gt;/g,'>')
                                        .replace(/~raquo;/g,'&raquo;')
                                        ); 
                    });
              };";
    }
// --------------------------------------------------------------------            
    /*  */
    function output()
    {
        $storage = $this->storage;
        if($storage != '' and is_array($storage) and count($storage) > 0 )
        {
            $xmlString = '';
            
            foreach( $storage as $string )
            {
                $xmlString .= $this->newline . $string;
            }
           /* 
            * Validation of xmldoc is not available in php4 as far as I can tell...
            * But IE7 & FF3 have xml validating so check your generated docs with them.
            */
            if( $this->html == true )
            {
                header('Content-type: text/html;');
            }
            else
            {
                header('Content-type: text/'.$this->method.'; charset='.$this->xml_encode);    
                echo '&lt;?xml version="'.$this->xml_vers.'" encoding="'.$this->xml_encode.'"?&gt;'.$this->newline;
            }
            echo '<taconite>'.$xmlString.$this->newline.'</taconite>';
        }
    }
}/* &lt;!-- Taco --&gt;*/
?&gt;

For this to work you need the [url=http://jquery.com]JQUERY [/url]library and the Taconite library from [url=http://malsup.com/jquery/taconite]malsup.com[/url] added to your [VIEW] file.

[b]The power behind this library is the Taconite Plugin for JQUERY which is well documented on the [url=http://malsup.com/jquery/taconite]MALSUP[/url] website.[/b]

This example shows how you can easily manipulate the structure of the DOM. The markup is as follows.

[color=red][size=3]In the view file[/size][/color]

<div id="example1" style="background-color: #ffa; padding:10px; border:1px solid #ccc"> 
    This is the <span style="color:#800">structure example</span> div. 
</div>

The following code is used in the view to request example1:

$('#MYBUTTON').click(function() {$.get('http://findmeonthe.net/TACONITE/index.php/taco_example/example1'); });

[color=red][size=3]In the controller the php code[/size][/color]

function example1()
        {
          $this->taco->set('after', '#example1', 'This text will go AFTER the example div.');
          $this->taco->set('before', '#example1', '<div>This div will go BEFORE the example div.</div>');
          $this->taco->set('wrap', '#example1 span', '<span style="border: 1px dashed #00F"/>');
          $this->taco->set('append', '#example1', '<div>This div is APPENDED</div>');
          $this->taco->output();    
        }

[color=red][size=3]The browser ouput is[/size][/color]

<div>This div will go BEFORE the example div.</div>
<div id="example1" style="border: 1px solid rgb(204, 204, 204); padding: 10px; background-color: rgb(255, 255, 170);"> 
       This is the <span style="border: 1px dashed rgb(0, 0, 255);">
                           <span style="color: rgb(136, 0, 0);">structure example</span>
                       </span> div. 
                       <div>This div is APPENDED</div>
</div>This text will go AFTER the example div.</div>
Clone this wiki locally