-
Notifications
You must be signed in to change notification settings - Fork 7.6k
Snappy Source
World Wide Web Server edited this page Jul 4, 2012
·
12 revisions
<div id="about">
<h1>Snappy Source<sup style="font-size: 50%"></sup> <i>v1.0</i></h1>
<p>
<strong>
Snappy Source assists in embedding common source files such as images, stylesheets and javascripts into your CodeIgniter application.
</strong>
</p>
<h2>How to use Snappy Source</h2>
<p>Place the helper file in the following directory:</p>
<code>www-root/system/application/helpers/</code>
<p>Create the necessary directories used by Snappy Source</p>
<code>
www-root/system/application/sources/<br />
www-root/system/application/sources/images/<br />
www-root/system/application/sources/styles/<br />
www-root/system/application/sources/scripts/
</code>
<p>If you use mod_rewrite, make sure you allow the sources directory to be accessed. To do this, set up your <i>.htaccess</i> file to look something like this:</p>
<code>
RewriteEngine on<br />
RewriteCond $1 !^(index\.php|images|stylesheets|<strong>system/application/sources/</strong>)<br />
RewriteRule ^(.*)$ /index.php/$1 [L]
</code>
<p>Finally, load up the Snappy Source helper as you would with any other CodeIgniter helper. There are two possible ways to do this. Directly from within your controller:</p>
<code>$this->load->helper('<strong>snappy_source</strong>');</code>
<p>Or, auto-load the Snappy Source helper from within <i>system/application/config/autoload.php</i>:</p>
<code>$autoload['helper'] = array('<strong>snappy_source</strong>');</code>
</div>
<br />
<div id="images">
<h1>Embedding Single Images</h1>
<p>
<ul>
<strong>Required Parameters:</strong>
<li><var>$fileName</var> - The images file name.</li>
</ul>
</p>
<p>
<ul>
<strong>Optional Parameters</strong>
<li><var>$imageAlt</var> - ALT tag for the image.</li>
<li><var>$imageClass</var> - A CSS class name.</li>
</ul>
</p>
<h2>snappy_image(<var>$fileName</var>, <var>$imageAlt = ""</var>, <var>$imageClass = NULL</var>)</h2>
<p>Example:</p>
<code>snappy_image('pic.jpg', 'My Picture', 'somestyle');</code>
<p>Would return:</p>
<code><img class="somestyle" src="http://example.com/system/application/sources/images/pic.jpg" alt="My Picture" /></code>
<h1>Embedding Multiple Images</h1>
<p>
<ul>
<strong>Required Parameters:</strong>
<li><var>$imageArray</var> - A multi-dimensional array of image details</li>
</ul>
</p>
<h2>snappy_image(<var>$imageArray</var>)</h2>
<p>Example:</p>
<code>
$imageArray = array(<br />
array('pic_one.jpg'),<br />
array('pic_two.jpg', '', 'myimage'),<br />
array('pic_three.jpg', 'Picture Three')<br />
);<br />
<br />
snappy_image($imageArray);
</code>
<p>Would return:</p>
<code>
<img src="http://example.com/system/application/sources/images/pic_one.jpg" alt="" /><br />
<img class="myimage" src="http://example.com/system/application/sources/images/pic_two.jpg" alt="" /><br />
<img src="http://example.com/system/application/sources/images/pic_three.jpg" alt="Picture Three" />
</code>
</div>
<br />
<div id="stylesheets">
<h1>Embedding Single Stylesheets</h1>
<p>
<ul>
<strong>Required Parameters:</strong>
<li><var>$fileName</var> - The stylesheets file name.</li>
</ul>
</p>
<p>
<ul>
<strong>Optional Parameters</strong>
<li><var>$mediaType</var> - The stylesheets media type. Defaults to "screen"</li>
</ul>
</p>
<h2>snappy_style(<var>$fileName</var>, <var>$mediaType = "screen"</var>)</h2>
<p>Example:</p>
<code>snappy_style('style.css');</code>
<p>Would return:</p>
<code><link rel="stylesheet" type="text/css" href="http://example.com/system/application/sources/styles/style.css" media="screen" /></code>
<h1>Embedding Multiple Stylesheets</h1>
<p>
<ul>
<strong>Required Parameters:</strong>
<li><var>$styleArray</var> - A multi-dimensional array of stylesheet details</li>
</ul>
</p>
<h2>snappy_style(<var>$styleArray</var>)</h2>
<p>Example:</p>
<code>
$styleArray = array(<br />
array('style_one.css'),<br />
array('style_two.css', 'print'),<br />
array('style_three.css', 'both')<br />
);<br />
<br />
snappy_style($styleArray);
</code>
<p>Would return:</p>
<code>
<link rel="stylesheet" type="text/css" href="http://example.com/system/application/sources/styles/style_once.css" media="screen" /><br />
<link rel="stylesheet" type="text/css" href="http://example.com/system/application/sources/styles/style_two.css" media="print" /><br />
<link rel="stylesheet" type="text/css" href="http://example.com/system/application/sources/styles/style_three.css" media="both" />
</code>
</div>
<br />
<div id="javascripts">
<h1>Embedding Single Javascripts</h1>
<p>
<ul>
<strong>Required Parameters:</strong>
<li><var>$fileName</var> - The javascripts file name.</li>
</ul>
</p>
<h2>snappy_script(<var>$fileName</var>)</h2>
<p>Example:</p>
<code>snappy_script('script.js');</code>
<p>Would return:</p>
<code><script type="text/javascript" src="http://example.com/system/application/sources/scripts/script.js"><script/></code>
<h1>Embedding Multiple Javascripts</h1>
<p>
<ul>
<strong>Required Parameters:</strong>
<li><var>$scriptArray</var> - An array of javascript details</li>
</ul>
</p>
<h2>snappy_script(<var>$scriptArray</var>)</h2>
<p>Example:</p>
<code>
$scriptArray = array('script_one.js', 'script_two.js', 'script_three.js');<br />
<br />
snappy_script($scriptArray);
</code>
<p>Would return:</p>
<code>
<script type="text/javascript" src="http://example.com/system/application/sources/scripts/script_one.js"><script/><br />
<script type="text/javascript" src="http://example.com/system/application/sources/scripts/script_two.js"><script/><br />
<script type="text/javascript" src="http://example.com/system/application/sources/scripts/script_three.js"><script/>
</code>
</div>