Git Product home page Git Product logo

db-assets's Introduction

DB-Assets Library

DB-Assets is a simple library designed to simplify including Javascript and CSS files into views.

Setup

The script is set to use a folder named "assets" in the root of your directory structure.

/application
/assets
.../js
.../css
/sparks
/system
/tools

You can setup your custom directory structure in the db_assets.php config file.

Usage

This library supports including of CSS and Javascript assets. It also supports including Javascript libraries hosted at Google Libraries API CDN and simple one-line IE conditional comments.

Including Javascripts

Let's assume you want to include a Javascript file located at /assets/js/site.js.

<?php echo js("site.js"); ?>

This code generates:

<script type="text/javascript" src="YOUR-BASE-URL/assets/js/site.js"></script>

Additionaly, if you want to include a Javascript file located at subfolder, like /assets/js/lib/jquery.min.js you would do this:

<?php echo js("lib/jquery.min.js");

Including CSS

Let's assume you want to include a CSS stylesheet located at /assets/css/master.css.

<?php echo css("master.css"); ?>

This code generates:

<link rel="stylesheet" href="YOUR-BASE-URL/assets/css/stylesheet.css" type="text/css" />

If you need to specify media attribute you would do this:

<?php echo css("master.css", "all"); ?>

This will generate:

<link rel="stylesheet" href="YOUR-BASE-URL/assets/css/stylesheet.css" type="text/css" media="all" />

Don't forget you can organize stylesheets in subfolders.

Including Javascript libraries hosted at Google Libraries API CDN

DB-Assets supports including Javascript libraries hosted at Google Libraries API CDN.

Let's assume you want to load jQuery 1.6.2. All you have to write is:

<?php echo google("jquery", "1.6.2"); ?>

This code generates:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

Also note, if you don't specify the version you want to load, the latest one* will be loaded. You are strongly encouraged to specify a version number.

* This library has latest versions of libraries stored in the configuration file. Therefore, if you don't specify a version number, the version from the configuration will be loaded. The version from the configuration is the latest at the time of release of library.

Compressed versions of libraries are loaded by default. (if available)

If you want to load uncompressed version you need to pass true as third parameter:

<?php echo google("jquery", "1.6.2", true); ?>

Supported libraries are:

Library Name
Chrome Frame chrome-frame
Dojo dojo
Ext Core ext-core
jQuery jquery
jQuery UI jqueryui
MooTools mootools
Prototype prototype
script.aculo.us scriptaculous
SWFObject swfobject
Yahoo! User Interface Library (YUI) yui
WebFont Loader webfont

For more info on Google Libraries API CDN please visit their website.

IE conditional comments

This library supports easy wrapping of assets into an IE conditional comment.

Let's assume you need to include a stylesheet located at /assets/css/ie6.css aimed for Internet Explorer 6 or below.

The first parameter is the chunk of HTML that needs to be in conditional comment. The second parameter is the condition. For the first parameter we will use our css() function.

<?php echo conditional(css("ie6.css"), "lte IE6"); ?>

This will generate:

<!--[if lte IE6]>
<link rel="stylesheet" href="YOUR-BASE-URL/assets/css/ie6.css" type="text/css" />
<![endif]-->

Condition is one of the following

  • IE - any version of IE
  • lt IE version - any version of IE less than specified version
  • lte IE version - any version of IE less than or equal to the specified version
  • IE version - specified version of IE only
  • gt IE version - any version of IE greater than specified version
  • gte IE version - any version of IE greater or equal to the specified version

Typical versions are 6, 7, 8 and 9.

If you don't specify any condition at all, the "IE" condition will be used which is any version of IE.

db-assets's People

Contributors

danijelb avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.