An open API service indexing awesome lists of open source software.

https://github.com/sqro2/frigate

A jquery based html preprocessor
https://github.com/sqro2/frigate

html-preprocessor jquery-plugin

Last synced: 5 months ago
JSON representation

A jquery based html preprocessor

Awesome Lists containing this project

README

          

#What is frigate ?
Frigate is a jquery based html preprocessor which helps write html faster with much less code,time,effort.

#What problem it solves?
Writing pure HTML markup is tedious and kills a lot of development time. Frigate was created to simply make this process faster.

#Two quick example :

Input :


div*6

Output



<div id="null" class="null"> </div>
<div id="null" class="null"> </div>
<div id="null" class="null"> </div>
<div id="null" class="null"> </div>
<div id="null" class="null"> </div>
<div id="null" class="null"> </div>



Input :



header(.header-class #header-id){
nav(.nav-class #nav-id){
ul(.ul-class #ul-id){
li(.li-class #li-id){
a
}*5
}*2
}
}

Output



<header id="header-id" class="header-class">
<nav id="nav-id" class="nav-class">
<ul id="ul-id" class="ul-class">
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
</ul>
<ul id="ul-id" class="ul-class">
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
<li id="li-id" class="li-class">
<a id="null" class="null"> </a>
</li>
</ul>
</nav>
</header>



#installation
To install with bower :

Run this command - bower install frigate


For manual installation :

Include jquery to your project(latest dist recommended ).


Include the file 'frigate.min.js'.

#Usage
Before using this preprocessor It's neccessary to get familiar with it's syntax.Please visit This page for documentation.
How to implement

Html :



<textarea rows='6' cols='12' id='input-data'></textarea>
<input type ='button' id='button-process'>Process</button>
<div id='output-data'></div>

Jquery :



$('#input-data').toHtml(function(result){
$('#output-data').html(result);
})