Initial commit
After Width: | Height: | Size: 995 B |
BIN
app/static/global/plugins/rateit/example/content/antenna-red.png
Normal file
After Width: | Height: | Size: 992 B |
After Width: | Height: | Size: 992 B |
16
app/static/global/plugins/rateit/example/content/antenna.css
Normal file
@ -0,0 +1,16 @@
|
||||
div.antenna div.rateit-range
|
||||
{
|
||||
background: url(antenna-black.png) no-repeat;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
div.antenna div.rateit-hover
|
||||
{
|
||||
background: url(antenna-yellow.png) no-repeat;
|
||||
}
|
||||
|
||||
div.antenna div.rateit-selected
|
||||
{
|
||||
background: url(antenna-red.png) no-repeat;
|
||||
}
|
||||
|
@ -0,0 +1,34 @@
|
||||
/*
|
||||
SOURCE: http://iconexpo.com/2008/12/free-8color-star-icons/
|
||||
|
||||
*/
|
||||
|
||||
|
||||
div.bigstars div.rateit-range
|
||||
{
|
||||
background: url(star-white32.png);
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-hover
|
||||
{
|
||||
background: url(star-gold32.png);
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-selected
|
||||
{
|
||||
background: url(star-red32.png);
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-reset
|
||||
{
|
||||
background: url(star-black32.png);
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-reset:hover
|
||||
{
|
||||
background: url(star-white32.png);
|
||||
}
|
After Width: | Height: | Size: 1.4 KiB |
BIN
app/static/global/plugins/rateit/example/content/star-gold32.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
BIN
app/static/global/plugins/rateit/example/content/star-red32.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.6 KiB |
BIN
app/static/global/plugins/rateit/example/content/star_2.gif
Normal file
After Width: | Height: | Size: 2.4 KiB |
BIN
app/static/global/plugins/rateit/example/content/star_3.gif
Normal file
After Width: | Height: | Size: 2.4 KiB |
BIN
app/static/global/plugins/rateit/example/content/star_4.gif
Normal file
After Width: | Height: | Size: 2.4 KiB |
639
app/static/global/plugins/rateit/example/example.htm
Normal file
@ -0,0 +1,639 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>RateIt</title>
|
||||
<link href="../src/rateit.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
|
||||
|
||||
<style>
|
||||
body
|
||||
{
|
||||
font-family: Tahoma;
|
||||
font-size: 12px;
|
||||
}
|
||||
h1
|
||||
{
|
||||
font-size: 1.7em;
|
||||
}
|
||||
h2
|
||||
{
|
||||
font-size: 1.5em;
|
||||
}
|
||||
h3
|
||||
{
|
||||
font-size: 1.2em;
|
||||
}
|
||||
ul.nostyle
|
||||
{
|
||||
list-style: none;
|
||||
}
|
||||
ul.nostyle h3
|
||||
{
|
||||
margin-left: -20px;
|
||||
}
|
||||
</style>
|
||||
<!-- alternative styles -->
|
||||
<link href="content/bigstars.css" rel="stylesheet" type="text/css">
|
||||
<link href="content/antenna.css" rel="stylesheet" type="text/css">
|
||||
<!-- syntax highlighter -->
|
||||
<link href="sh/shCore.css" rel="stylesheet" type="text/css">
|
||||
<link href="sh/shCoreDefault.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>
|
||||
RateIt plugin</h1>
|
||||
<h2>
|
||||
Prerequisites</h2>
|
||||
<p>
|
||||
In order to use RateIt you'll need:
|
||||
<ul>
|
||||
<li><a target="_blank" href="http://www.jquery.com">jQuery 1.6.0</a> or newer.</li>
|
||||
<li>jquery.rateit.min.js, rateit.css, delete.gif, star.gif - <a href="http://rateit.codeplex.com/releases">
|
||||
Download RateIt</a></li>
|
||||
<li>Place a reference to the rateit.css stylesheet into the page head.</li>
|
||||
<li>Place a script reference to jquery.rateit.js before your </body> tag.
|
||||
</li>
|
||||
</ul>
|
||||
</p>
|
||||
<h2>
|
||||
Options</h2>
|
||||
Go to the <a href="http://rateit.codeplex.com">RateIt project homepage</a> to view
|
||||
the documentation.
|
||||
<h2>
|
||||
Examples</h2>
|
||||
<div style="font-weight: bold">
|
||||
<span id="toc"></span>
|
||||
</div>
|
||||
<ul class="nostyle" id="examples">
|
||||
<li id="ex_a1">
|
||||
<h3>
|
||||
1a) Basic usage</h3>
|
||||
<div class="rateit">
|
||||
</div>
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit">
|
||||
</div>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_1b">
|
||||
<h3>
|
||||
1a) Basic usage (inline element)</h3>
|
||||
<span class="rateit">
|
||||
</span>
|
||||
<pre class="brush: xml">
|
||||
<span class="rateit">
|
||||
</span>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_2a">
|
||||
<h3>
|
||||
2a) Progressive enhancement (using HTML5 range input type)
|
||||
</h3>
|
||||
<input type="range" min="0" max="7" value="0" step="0.5" id="backing2">
|
||||
<div class="rateit" data-rateit-backingfld="#backing2">
|
||||
</div>
|
||||
<pre class="brush: xml">
|
||||
<input type="range" min="0" max="7" value="0" step="0.5" id="backing2">
|
||||
<div class="rateit" data-rateit-backingfld="#backing2"></div>
|
||||
</pre>
|
||||
<button onclick="$('#backing2').toggle()">
|
||||
Toggle Backing Field visibility</button>
|
||||
</li>
|
||||
<li id="ex_2b">
|
||||
<h3>
|
||||
2b) Progressive enhancement (using select)
|
||||
</h3>
|
||||
<select id="backing2b">
|
||||
<option value="0">Bad</option>
|
||||
<option value="1">OK</option>
|
||||
<option value="2">Great</option>
|
||||
<option value="3">Excellent</option>
|
||||
</select>
|
||||
<div class="rateit" data-rateit-backingfld="#backing2b">
|
||||
</div>
|
||||
<pre class="brush: xml">
|
||||
<select id="backing2b">
|
||||
<option value="0">Bad</option>
|
||||
<option value="1">OK</option>
|
||||
<option value="2">Great</option>
|
||||
<option value="3">Excellent</option>
|
||||
</select>
|
||||
<div class="rateit" data-rateit-backingfld="#backing2b"></div>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_3">
|
||||
<h3>
|
||||
3) Readonly and preset value</h3>
|
||||
<div class="rateit" data-rateit-value="2.5" data-rateit-ispreset="true" data-rateit-readonly="true">
|
||||
</div>
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit" data-rateit-value="2.5" data-rateit-ispreset="true" data-rateit-readonly="true"></div>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_4">
|
||||
<h3>
|
||||
4) More settings</h3>
|
||||
<input type="range" value="4" step="0.25" id="backing4">
|
||||
<div class="rateit" data-rateit-backingfld="#backing4" data-rateit-resetable="false" data-rateit-ispreset="true"
|
||||
data-rateit-min="0" data-rateit-max="10">
|
||||
</div>
|
||||
<pre class="brush: xml">
|
||||
<input type="range" value="4" step="0.25" id="backing4">
|
||||
<div class="rateit" data-rateit-backingfld="#backing4" data-rateit-resetable="false" data-rateit-ispreset="true"
|
||||
data-rateit-min="0" data-rateit-max="10">
|
||||
</div>
|
||||
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_5">
|
||||
<h3>
|
||||
5) Javascript interaction</h3>
|
||||
<div class="rateit" id="rateit5" data-rateit-min="2">
|
||||
</div>
|
||||
<div>
|
||||
<span id="value5"></span><span id="hover5"></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$("#rateit5").bind('rated', function (event, value) { $('#value5').text('You\'ve rated it: ' + value); });
|
||||
$("#rateit5").bind('reset', function () { $('#value5').text('Rating reset'); });
|
||||
$("#rateit5").bind('over', function (event, value) { $('#hover5').text('Hovering over: ' + value); });
|
||||
</script>
|
||||
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit" id="rateit5" data-rateit-min="2">
|
||||
</div>
|
||||
<div>
|
||||
<span id="value5"></span>
|
||||
<span id="hover5"></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$("#rateit5").bind('rated', function (event, value) { $('#value5').text('You\'ve rated it: ' + value); });
|
||||
$("#rateit5").bind('reset', function () { $('#value5').text('Rating reset'); });
|
||||
$("#rateit5").bind('over', function (event, value) { $('#hover5').text('Hovering over: ' + value); });
|
||||
</script>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_6">
|
||||
<h3>
|
||||
6) Javascript invocation</h3>
|
||||
<input type="hidden" id="backing6">
|
||||
<div id="rateit6">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () { $('#rateit6').rateit({ max: 20, step: 2, backingfld: '#backing6' }); });
|
||||
</script>
|
||||
|
||||
<pre class="brush: xml">
|
||||
<input type="hidden" id="backing6">
|
||||
<div id="rateit6">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () { $('#rateit6').rateit({ max: 20, step: 2, backingfld: '#backing6' }); });
|
||||
</script>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_7a">
|
||||
<h3>
|
||||
7a) Styling</h3>
|
||||
<p>
|
||||
You can change the styles of the plugin in a two ways.
|
||||
<ul>
|
||||
<li>You can change change the star.gif and delete.gif pictures (and perhaps the default
|
||||
starwidth, and starheight values in the javascript file). This will change the style
|
||||
everywhere.</li>
|
||||
<li>You can change individual items, by adding a stylesheet with a few rules.</li>
|
||||
</ul>
|
||||
Here I've opted for the second option.
|
||||
</p>
|
||||
<div class="rateit bigstars" data-rateit-starwidth="32" data-rateit-starheight="32">
|
||||
</div>
|
||||
<h4>
|
||||
Inline code</h4>
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit bigstars" data-rateit-starwidth="32" data-rateit-starheight="32"></div>
|
||||
</pre>
|
||||
<h4>
|
||||
Style sheet</h4>
|
||||
<pre class="brush: css">
|
||||
div.bigstars div.rateit-range
|
||||
{
|
||||
background: url(star-white32.png);
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-hover
|
||||
{
|
||||
background: url(star-gold32.png);
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-selected
|
||||
{
|
||||
background: url(star-red32.png);
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-reset
|
||||
{
|
||||
background: url(star-black32.png);
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
div.bigstars div.rateit-reset:hover
|
||||
{
|
||||
background: url(star-white32.png);
|
||||
}
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_7b">
|
||||
<h3>
|
||||
7b) More styling</h3>
|
||||
<p>
|
||||
Here we use one big image (actually 3), with different dimensions. Not very pretty,
|
||||
but it conveys the message I hope.</p>
|
||||
<div class="rateit antenna" data-rateit-starwidth="11" data-rateit-starheight="25">
|
||||
</div>
|
||||
<h4>
|
||||
Inline code</h4>
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit antenna" data-rateit-starwidth="11" data-rateit-starheight="25"></div>
|
||||
</pre>
|
||||
<h4>
|
||||
Style sheet</h4>
|
||||
<pre class="brush: css">
|
||||
div.antenna div.rateit-range
|
||||
{
|
||||
background: url(antenna-black.png) no-repeat;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
div.antenna div.rateit-hover
|
||||
{
|
||||
background: url(antenna-yellow.png) no-repeat;
|
||||
}
|
||||
|
||||
div.antenna div.rateit-selected
|
||||
{
|
||||
background: url(antenna-red.png) no-repeat;
|
||||
}
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_8">
|
||||
<h3>
|
||||
8) RTL support</h3>
|
||||
<div style="direction: rtl">
|
||||
Now we are in RTL mode. No changes needed to make this work.
|
||||
<div class="rateit">
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li id="ex_9">
|
||||
<h3>
|
||||
9) Setting and Getting values</h3>
|
||||
<p>
|
||||
All properties can also be set on the fly. Here are a few examples:</p>
|
||||
<div class="rateit" id="rateit9">
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('value'))">
|
||||
Get value</button>
|
||||
<button onclick="$('#rateit9').rateit('value', prompt('Input numerical value'))">
|
||||
Set value</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('max'))">
|
||||
Get max value</button>
|
||||
<button onclick="$('#rateit9').rateit('max', prompt('Input numerical value'))">
|
||||
Set max value</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('min'))">
|
||||
Get min value</button>
|
||||
<button onclick="$('#rateit9').rateit('min', prompt('Input numerical value'))">
|
||||
Set min value</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('step'))">
|
||||
Get step size</button>
|
||||
<button onclick="$('#rateit9').rateit('step', prompt('Input numerical value'))">
|
||||
Set step size</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('readonly'))">
|
||||
Get readonly value</button>
|
||||
<button onclick="$('#rateit9').rateit('readonly',!$('#rateit9').rateit('readonly'))">
|
||||
Toggle readonly</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('ispreset'))">
|
||||
Get ispreset value</button>
|
||||
<button onclick="$('#rateit9').rateit('ispreset',!$('#rateit9').rateit('ispreset'))">
|
||||
Toggle ispreset</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="$('#rateit9').rateit('reset')">
|
||||
Reset
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit" id="rateit9">
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('value'))">Get value</button>
|
||||
<button onclick="$('#rateit9').rateit('value', prompt('Input numerical value'))">Set value</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('max'))">Get max value</button>
|
||||
<button onclick="$('#rateit9').rateit('max', prompt('Input numerical value'))">Set max value</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('step'))">Get step size</button>
|
||||
<button onclick="$('#rateit9').rateit('step', prompt('Input numerical value'))">Set step size</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('readonly'))">Get readonly value</button>
|
||||
<button onclick="$('#rateit9').rateit('readonly',!$('#rateit9').rateit('readonly'))">Toggle readonly</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="alert($('#rateit9').rateit('ispreset'))">Get ispreset value</button>
|
||||
<button onclick="$('#rateit9').rateit('ispreset',!$('#rateit9').rateit('ispreset'))">Toggle ispreset</button>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="$('#rateit9').rateit('reset')">Reset</button>
|
||||
</div>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_10">
|
||||
<h3>
|
||||
10) Tooltip example</h3>
|
||||
<p>
|
||||
Using tooltips is easy. Just bind to the hover event, and do your thing. Shown here
|
||||
is the basic tooltip, but of course you can use any tooltip you'd like.</p>
|
||||
<h4>
|
||||
Basic numbers</h4>
|
||||
<div class="rateit" id="rateit10">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$("#rateit10").bind('over', function (event, value) { $(this).attr('title', value); });
|
||||
</script>
|
||||
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit" id="rateit10">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$("#rateit10").bind('over', function (event,value) { $(this).attr('title', value); });
|
||||
</script>
|
||||
</pre>
|
||||
<h4>
|
||||
Custom text</h4>
|
||||
<div class="rateit" id="rateit10b" data-rateit-step="1">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var tooltipvalues = ['bad', 'poor', 'ok', 'good', 'super'];
|
||||
$("#rateit10b").bind('over', function (event, value) { $(this).attr('title', tooltipvalues[value - 1]); });
|
||||
</script>
|
||||
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit" id="rateit10b" data-rateit-step="1">
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var tooltipvalues = ['bad', 'poor', 'ok', 'good', 'super'];
|
||||
$("#rateit10b").bind('over', function (event, value) { $(this).attr('title', tooltipvalues[value-1]); });
|
||||
</script>
|
||||
</pre>
|
||||
</li>
|
||||
<li id="ex_11">
|
||||
<h3>
|
||||
11) AJAX example</h3>
|
||||
<p>
|
||||
Most times RateIt will be used using some Ajax. There are different ways of implementing
|
||||
it (with/without backing field, using data-* attributes etc.)</p>
|
||||
<div id="products">
|
||||
<div style="float: right; width: 350px; border: 1px solid #ccc; padding: 1em;">
|
||||
<strong>Server response:</strong>
|
||||
<ul id="response">
|
||||
</ul>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<h4>
|
||||
Product X (id: 312)</h4>
|
||||
RateIt:
|
||||
<div data-productid="312" class="rateit">
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<h4>
|
||||
Product Y (id: 423)</h4>
|
||||
RateIt:
|
||||
<div data-productid="423" class="rateit">
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<h4>
|
||||
Product Z (id: 653)</h4>
|
||||
RateIt:
|
||||
<div data-productid="653" class="rateit">
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
//we bind only to the rateit controls within the products div
|
||||
$('#products .rateit').bind('rated reset', function (e) {
|
||||
var ri = $(this);
|
||||
|
||||
//if the use pressed reset, it will get value: 0 (to be compatible with the HTML range control), we could check if e.type == 'reset', and then set the value to null .
|
||||
var value = ri.rateit('value');
|
||||
var productID = ri.data('productid'); // if the product id was in some hidden field: ri.closest('li').find('input[name="productid"]').val()
|
||||
|
||||
//maybe we want to disable voting?
|
||||
ri.rateit('readonly', true);
|
||||
|
||||
$.ajax({
|
||||
url: 'rateit.aspx', //your server side script
|
||||
data: { id: productID, value: value }, //our data
|
||||
type: 'POST',
|
||||
success: function (data) {
|
||||
$('#response').append('<li>' + data + '</li>');
|
||||
|
||||
},
|
||||
error: function (jxhr, msg, err) {
|
||||
$('#response').append('<li style="color:red">' + msg + '</li>');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<h4>
|
||||
Client</h4>
|
||||
<pre class="brush: xml">
|
||||
<div id="products">
|
||||
<div style="float:right; width:350px; border:1px solid #ccc; padding:1em;">
|
||||
<strong>Server response:</strong>
|
||||
<ul id="response">
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
<ul>
|
||||
<li><h4>Product X (id: 312)</h4>
|
||||
RateIt: <div data-productid="312" class="rateit"></div>
|
||||
</li>
|
||||
<li><h4>Product Y (id: 423)</h4>
|
||||
RateIt: <div data-productid="423" class="rateit"></div></li>
|
||||
<li><h4>Product Z (id: 653)</h4>
|
||||
RateIt: <div data-productid="653" class="rateit"></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<script type ="text/javascript">
|
||||
//we bind only to the rateit controls within the products div
|
||||
$('#products .rateit').bind('rated reset', function (e) {
|
||||
var ri = $(this);
|
||||
|
||||
//if the use pressed reset, it will get value: 0 (to be compatible with the HTML range control), we could check if e.type == 'reset', and then set the value to null .
|
||||
var value = ri.rateit('value');
|
||||
var productID = ri.data('productid'); // if the product id was in some hidden field: ri.closest('li').find('input[name="productid"]').val()
|
||||
|
||||
//maybe we want to disable voting?
|
||||
ri.rateit('readonly', true);
|
||||
|
||||
$.ajax({
|
||||
url: 'rateit.aspx', //your server side script
|
||||
data: { id: productID, value: value }, //our data
|
||||
type: 'POST',
|
||||
success: function (data) {
|
||||
$('#response').append('<li>' + data + '</li>');
|
||||
|
||||
},
|
||||
error: function (jxhr, msg, err) {
|
||||
$('#response').append('<li style="color:red">' + msg + '</li>');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</pre>
|
||||
<h4>
|
||||
Server (ASPX) super simplified</h4>
|
||||
<pre class="brush: c-sharp">
|
||||
<%@ Page Language="C#" %>
|
||||
<%
|
||||
//Get value
|
||||
float value = float.Parse(Request.Form["value"]);
|
||||
int productID = int.Parse(Request.Form["id"]);
|
||||
|
||||
Response.Write(string.Format("You voted {0} on product: {1}.<br/>Time on server: {2}", value, productID, DateTime.Now.ToString()));
|
||||
|
||||
%>
|
||||
|
||||
|
||||
|
||||
</pre>
|
||||
</li>
|
||||
|
||||
<li id="ex_12">
|
||||
<h3>
|
||||
12) Resizing
|
||||
</h3>
|
||||
<p>
|
||||
Sometimes we would like to resize the rating controls (perhaps based on screen size). <br />
|
||||
This is as easy as<br />
|
||||
a) adding a class to the rateit control, which would change the background image.<br/>
|
||||
b) modifying the starwidth and starheigth properties.
|
||||
<br /><br />
|
||||
The alternative styling is taken from example <a href="#ex_7a">7a) styling</a>.
|
||||
</p>
|
||||
|
||||
<div class="rateit" id="rateit12">
|
||||
</div>
|
||||
<p>Pick a size: <select id="size_12"><option data-class="" data-size="16" selected>normal</option><option data-class="bigstars" data-size="32">big</option></select></p>
|
||||
|
||||
<script type="text/javascript">
|
||||
$('#size_12').change(function () {
|
||||
var option = $(this.options[this.selectedIndex]);
|
||||
$('#rateit12').removeClass('bigstars')
|
||||
.addClass(option.data('class'))
|
||||
.rateit('starwidth', option.data('size'))
|
||||
.rateit('starheight', option.data('size'));
|
||||
|
||||
});
|
||||
</script>
|
||||
<pre class="brush: xml">
|
||||
<div class="rateit" id="rateit12"></div>
|
||||
<p>Pick a size:
|
||||
<select id="size_12">
|
||||
<option data-class="" data-size="16" selected>normal</option>
|
||||
<option data-class="bigstars" data-size="32">big</option>
|
||||
</select>
|
||||
</p>
|
||||
|
||||
<script type="text/javascript">
|
||||
$('#size_12').change(function () {
|
||||
var option = $(this.options[this.selectedIndex]);
|
||||
$('#rateit12').removeClass('bigstars') //remove old class
|
||||
.addClass(option.data('class')) //add new class
|
||||
.rateit('starwidth', option.data('size')) //change width
|
||||
.rateit('starheight', option.data('size')); //change height
|
||||
|
||||
});
|
||||
</script>
|
||||
</pre>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<script src="../src/jquery.rateit.js" type="text/javascript"></script>
|
||||
|
||||
<script>
|
||||
//build toc
|
||||
var toc = [];
|
||||
$('#examples > li').each(function (i, e) {
|
||||
|
||||
|
||||
if (i > 0)
|
||||
toc.push(', ');
|
||||
toc.push('<a href="#')
|
||||
toc.push(e.id)
|
||||
toc.push('">')
|
||||
var title = $(e).find('h3:first').text();
|
||||
title = title.substring(title.indexOf(')') + 2);
|
||||
toc.push(title);
|
||||
toc.push('</a>');
|
||||
|
||||
});
|
||||
|
||||
$('#toc').html(toc.join(''));
|
||||
|
||||
</script>
|
||||
|
||||
<!-- syntax highlighter -->
|
||||
|
||||
<script src="sh/shCore.js" type="text/javascript"></script>
|
||||
|
||||
<script src="sh/shBrushJScript.js" type="text/javascript"></script>
|
||||
|
||||
<script src="sh/shBrushXml.js" type="text/javascript"></script>
|
||||
|
||||
<script src="sh/shBrushCss.js" type="text/javascript"></script>
|
||||
|
||||
<script src="sh/shBrushCSharp.js" type="text/javascript"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
SyntaxHighlighter.all()
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
9
app/static/global/plugins/rateit/example/rateit.aspx
Normal file
@ -0,0 +1,9 @@
|
||||
<%@ Page Language="C#" %>
|
||||
<%
|
||||
//Get value
|
||||
float value = float.Parse(Request.Form["value"]);
|
||||
int productID = int.Parse(Request.Form["id"]);
|
||||
|
||||
Response.Write(string.Format("You voted {0} on product: {1}.<br/>Time on server: {2}", value, productID, DateTime.Now.ToString()));
|
||||
|
||||
%>
|
65
app/static/global/plugins/rateit/example/sh/shBrushCSharp.js
vendored
Normal file
@ -0,0 +1,65 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
var keywords = 'abstract as base bool break byte case catch char checked class const ' +
|
||||
'continue decimal default delegate do double else enum event explicit ' +
|
||||
'extern false finally fixed float for foreach get goto if implicit in int ' +
|
||||
'interface internal is lock long namespace new null object operator out ' +
|
||||
'override params private protected public readonly ref return sbyte sealed set ' +
|
||||
'short sizeof stackalloc static string struct switch this throw true try ' +
|
||||
'typeof uint ulong unchecked unsafe ushort using virtual void while';
|
||||
|
||||
function fixComments(match, regexInfo)
|
||||
{
|
||||
var css = (match[0].indexOf("///") == 0)
|
||||
? 'color1'
|
||||
: 'comments'
|
||||
;
|
||||
|
||||
return [new SyntaxHighlighter.Match(match[0], match.index, css)];
|
||||
}
|
||||
|
||||
this.regexList = [
|
||||
{ regex: SyntaxHighlighter.regexLib.singleLineCComments, func : fixComments }, // one line comments
|
||||
{ regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments
|
||||
{ regex: /@"(?:[^"]|"")*"/g, css: 'string' }, // @-quoted strings
|
||||
{ regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // strings
|
||||
{ regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // strings
|
||||
{ regex: /^\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion
|
||||
{ regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' }, // c# keyword
|
||||
{ regex: /\bpartial(?=\s+(?:class|interface|struct)\b)/g, css: 'keyword' }, // contextual keyword: 'partial'
|
||||
{ regex: /\byield(?=\s+(?:return|break)\b)/g, css: 'keyword' } // contextual keyword: 'yield'
|
||||
];
|
||||
|
||||
this.forHtmlScript(SyntaxHighlighter.regexLib.aspScriptTags);
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['c#', 'c-sharp', 'csharp'];
|
||||
|
||||
SyntaxHighlighter.brushes.CSharp = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
||||
|
91
app/static/global/plugins/rateit/example/sh/shBrushCss.js
vendored
Normal file
@ -0,0 +1,91 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
function getKeywordsCSS(str)
|
||||
{
|
||||
return '\\b([a-z_]|)' + str.replace(/ /g, '(?=:)\\b|\\b([a-z_\\*]|\\*|)') + '(?=:)\\b';
|
||||
};
|
||||
|
||||
function getValuesCSS(str)
|
||||
{
|
||||
return '\\b' + str.replace(/ /g, '(?!-)(?!:)\\b|\\b()') + '\:\\b';
|
||||
};
|
||||
|
||||
var keywords = 'ascent azimuth background-attachment background-color background-image background-position ' +
|
||||
'background-repeat background baseline bbox border-collapse border-color border-spacing border-style border-top ' +
|
||||
'border-right border-bottom border-left border-top-color border-right-color border-bottom-color border-left-color ' +
|
||||
'border-top-style border-right-style border-bottom-style border-left-style border-top-width border-right-width ' +
|
||||
'border-bottom-width border-left-width border-width border bottom cap-height caption-side centerline clear clip color ' +
|
||||
'content counter-increment counter-reset cue-after cue-before cue cursor definition-src descent direction display ' +
|
||||
'elevation empty-cells float font-size-adjust font-family font-size font-stretch font-style font-variant font-weight font ' +
|
||||
'height left letter-spacing line-height list-style-image list-style-position list-style-type list-style margin-top ' +
|
||||
'margin-right margin-bottom margin-left margin marker-offset marks mathline max-height max-width min-height min-width orphans ' +
|
||||
'outline-color outline-style outline-width outline overflow padding-top padding-right padding-bottom padding-left padding page ' +
|
||||
'page-break-after page-break-before page-break-inside pause pause-after pause-before pitch pitch-range play-during position ' +
|
||||
'quotes right richness size slope src speak-header speak-numeral speak-punctuation speak speech-rate stemh stemv stress ' +
|
||||
'table-layout text-align top text-decoration text-indent text-shadow text-transform unicode-bidi unicode-range units-per-em ' +
|
||||
'vertical-align visibility voice-family volume white-space widows width widths word-spacing x-height z-index';
|
||||
|
||||
var values = 'above absolute all always aqua armenian attr aural auto avoid baseline behind below bidi-override black blink block blue bold bolder '+
|
||||
'both bottom braille capitalize caption center center-left center-right circle close-quote code collapse compact condensed '+
|
||||
'continuous counter counters crop cross crosshair cursive dashed decimal decimal-leading-zero default digits disc dotted double '+
|
||||
'embed embossed e-resize expanded extra-condensed extra-expanded fantasy far-left far-right fast faster fixed format fuchsia '+
|
||||
'gray green groove handheld hebrew help hidden hide high higher icon inline-table inline inset inside invert italic '+
|
||||
'justify landscape large larger left-side left leftwards level lighter lime line-through list-item local loud lower-alpha '+
|
||||
'lowercase lower-greek lower-latin lower-roman lower low ltr marker maroon medium message-box middle mix move narrower '+
|
||||
'navy ne-resize no-close-quote none no-open-quote no-repeat normal nowrap n-resize nw-resize oblique olive once open-quote outset '+
|
||||
'outside overline pointer portrait pre print projection purple red relative repeat repeat-x repeat-y rgb ridge right right-side '+
|
||||
'rightwards rtl run-in screen scroll semi-condensed semi-expanded separate se-resize show silent silver slower slow '+
|
||||
'small small-caps small-caption smaller soft solid speech spell-out square s-resize static status-bar sub super sw-resize '+
|
||||
'table-caption table-cell table-column table-column-group table-footer-group table-header-group table-row table-row-group teal '+
|
||||
'text-bottom text-top thick thin top transparent tty tv ultra-condensed ultra-expanded underline upper-alpha uppercase upper-latin '+
|
||||
'upper-roman url visible wait white wider w-resize x-fast x-high x-large x-loud x-low x-slow x-small x-soft xx-large xx-small yellow';
|
||||
|
||||
var fonts = '[mM]onospace [tT]ahoma [vV]erdana [aA]rial [hH]elvetica [sS]ans-serif [sS]erif [cC]ourier mono sans serif';
|
||||
|
||||
this.regexList = [
|
||||
{ regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments
|
||||
{ regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // double quoted strings
|
||||
{ regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // single quoted strings
|
||||
{ regex: /\#[a-fA-F0-9]{3,6}/g, css: 'value' }, // html colors
|
||||
{ regex: /(-?\d+)(\.\d+)?(px|em|pt|\:|\%|)/g, css: 'value' }, // sizes
|
||||
{ regex: /!important/g, css: 'color3' }, // !important
|
||||
{ regex: new RegExp(getKeywordsCSS(keywords), 'gm'), css: 'keyword' }, // keywords
|
||||
{ regex: new RegExp(getValuesCSS(values), 'g'), css: 'value' }, // values
|
||||
{ regex: new RegExp(this.getKeywords(fonts), 'g'), css: 'color1' } // fonts
|
||||
];
|
||||
|
||||
this.forHtmlScript({
|
||||
left: /(<|<)\s*style.*?(>|>)/gi,
|
||||
right: /(<|<)\/\s*style\s*(>|>)/gi
|
||||
});
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['css'];
|
||||
|
||||
SyntaxHighlighter.brushes.CSS = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
52
app/static/global/plugins/rateit/example/sh/shBrushJScript.js
vendored
Normal file
@ -0,0 +1,52 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
var keywords = 'break case catch continue ' +
|
||||
'default delete do else false ' +
|
||||
'for function if in instanceof ' +
|
||||
'new null return super switch ' +
|
||||
'this throw true try typeof var while with'
|
||||
;
|
||||
|
||||
var r = SyntaxHighlighter.regexLib;
|
||||
|
||||
this.regexList = [
|
||||
{ regex: r.multiLineDoubleQuotedString, css: 'string' }, // double quoted strings
|
||||
{ regex: r.multiLineSingleQuotedString, css: 'string' }, // single quoted strings
|
||||
{ regex: r.singleLineCComments, css: 'comments' }, // one line comments
|
||||
{ regex: r.multiLineCComments, css: 'comments' }, // multiline comments
|
||||
{ regex: /\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion
|
||||
{ regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' } // keywords
|
||||
];
|
||||
|
||||
this.forHtmlScript(r.scriptScriptTags);
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['js', 'jscript', 'javascript'];
|
||||
|
||||
SyntaxHighlighter.brushes.JScript = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
69
app/static/global/plugins/rateit/example/sh/shBrushXml.js
vendored
Normal file
@ -0,0 +1,69 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
function process(match, regexInfo)
|
||||
{
|
||||
var constructor = SyntaxHighlighter.Match,
|
||||
code = match[0],
|
||||
tag = new XRegExp('(<|<)[\\s\\/\\?]*(?<name>[:\\w-\\.]+)', 'xg').exec(code),
|
||||
result = []
|
||||
;
|
||||
|
||||
if (match.attributes != null)
|
||||
{
|
||||
var attributes,
|
||||
regex = new XRegExp('(?<name> [\\w:\\-\\.]+)' +
|
||||
'\\s*=\\s*' +
|
||||
'(?<value> ".*?"|\'.*?\'|\\w+)',
|
||||
'xg');
|
||||
|
||||
while ((attributes = regex.exec(code)) != null)
|
||||
{
|
||||
result.push(new constructor(attributes.name, match.index + attributes.index, 'color1'));
|
||||
result.push(new constructor(attributes.value, match.index + attributes.index + attributes[0].indexOf(attributes.value), 'string'));
|
||||
}
|
||||
}
|
||||
|
||||
if (tag != null)
|
||||
result.push(
|
||||
new constructor(tag.name, match.index + tag[0].indexOf(tag.name), 'keyword')
|
||||
);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
this.regexList = [
|
||||
{ regex: new XRegExp('(\\<|<)\\!\\[[\\w\\s]*?\\[(.|\\s)*?\\]\\](\\>|>)', 'gm'), css: 'color2' }, // <![ ... [ ... ]]>
|
||||
{ regex: SyntaxHighlighter.regexLib.xmlComments, css: 'comments' }, // <!-- ... -->
|
||||
{ regex: new XRegExp('(<|<)[\\s\\/\\?]*(\\w+)(?<attributes>.*?)[\\s\\/\\?]*(>|>)', 'sg'), func: process }
|
||||
];
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['xml', 'xhtml', 'xslt', 'html'];
|
||||
|
||||
SyntaxHighlighter.brushes.Xml = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
226
app/static/global/plugins/rateit/example/sh/shCore.css
Normal file
@ -0,0 +1,226 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
.syntaxhighlighter a,
|
||||
.syntaxhighlighter div,
|
||||
.syntaxhighlighter code,
|
||||
.syntaxhighlighter table,
|
||||
.syntaxhighlighter table td,
|
||||
.syntaxhighlighter table tr,
|
||||
.syntaxhighlighter table tbody,
|
||||
.syntaxhighlighter table thead,
|
||||
.syntaxhighlighter table caption,
|
||||
.syntaxhighlighter textarea {
|
||||
-moz-border-radius: 0 0 0 0 !important;
|
||||
-webkit-border-radius: 0 0 0 0 !important;
|
||||
background: none !important;
|
||||
border: 0 !important;
|
||||
bottom: auto !important;
|
||||
float: none !important;
|
||||
height: auto !important;
|
||||
left: auto !important;
|
||||
line-height: 1.1em !important;
|
||||
margin: 0 !important;
|
||||
outline: 0 !important;
|
||||
overflow: visible !important;
|
||||
padding: 0 !important;
|
||||
position: static !important;
|
||||
right: auto !important;
|
||||
text-align: left !important;
|
||||
top: auto !important;
|
||||
vertical-align: baseline !important;
|
||||
width: auto !important;
|
||||
box-sizing: content-box !important;
|
||||
font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
|
||||
font-weight: normal !important;
|
||||
font-style: normal !important;
|
||||
font-size: 1em !important;
|
||||
min-height: inherit !important;
|
||||
min-height: auto !important;
|
||||
}
|
||||
|
||||
.syntaxhighlighter {
|
||||
width: 100% !important;
|
||||
margin: 1em 0 1em 0 !important;
|
||||
position: relative !important;
|
||||
overflow: auto !important;
|
||||
font-size: 1em !important;
|
||||
}
|
||||
.syntaxhighlighter.source {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
.syntaxhighlighter .bold {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.syntaxhighlighter .italic {
|
||||
font-style: italic !important;
|
||||
}
|
||||
.syntaxhighlighter .line {
|
||||
white-space: pre !important;
|
||||
}
|
||||
.syntaxhighlighter table {
|
||||
width: 100% !important;
|
||||
}
|
||||
.syntaxhighlighter table caption {
|
||||
text-align: left !important;
|
||||
padding: .5em 0 0.5em 1em !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code {
|
||||
width: 100% !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .container {
|
||||
position: relative !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .container textarea {
|
||||
box-sizing: border-box !important;
|
||||
position: absolute !important;
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
border: none !important;
|
||||
background: white !important;
|
||||
padding-left: 1em !important;
|
||||
overflow: hidden !important;
|
||||
white-space: pre !important;
|
||||
}
|
||||
.syntaxhighlighter table td.gutter .line {
|
||||
text-align: right !important;
|
||||
padding: 0 0.5em 0 1em !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .line {
|
||||
padding: 0 1em !important;
|
||||
}
|
||||
.syntaxhighlighter.nogutter td.code .container textarea, .syntaxhighlighter.nogutter td.code .line {
|
||||
padding-left: 0em !important;
|
||||
}
|
||||
.syntaxhighlighter.show {
|
||||
display: block !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed table {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar {
|
||||
padding: 0.1em 0.8em 0em 0.8em !important;
|
||||
font-size: 1em !important;
|
||||
position: static !important;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar span {
|
||||
display: inline !important;
|
||||
margin-right: 1em !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar span a {
|
||||
padding: 0 !important;
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar span a.expandSource {
|
||||
display: inline !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar {
|
||||
position: absolute !important;
|
||||
right: 1px !important;
|
||||
top: 1px !important;
|
||||
width: 11px !important;
|
||||
height: 11px !important;
|
||||
font-size: 10px !important;
|
||||
z-index: 10 !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar span.title {
|
||||
display: inline !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar a {
|
||||
display: block !important;
|
||||
text-align: center !important;
|
||||
text-decoration: none !important;
|
||||
padding-top: 1px !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar a.expandSource {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.ie {
|
||||
font-size: .9em !important;
|
||||
padding: 1px 0 1px 0 !important;
|
||||
}
|
||||
.syntaxhighlighter.ie .toolbar {
|
||||
line-height: 8px !important;
|
||||
}
|
||||
.syntaxhighlighter.ie .toolbar a {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line.alt1 .content,
|
||||
.syntaxhighlighter.printing .line.alt2 .content,
|
||||
.syntaxhighlighter.printing .line.highlighted .number,
|
||||
.syntaxhighlighter.printing .line.highlighted.alt1 .content,
|
||||
.syntaxhighlighter.printing .line.highlighted.alt2 .content {
|
||||
background: none !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line .number {
|
||||
color: #bbbbbb !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line .content {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .toolbar {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.printing a {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .plain, .syntaxhighlighter.printing .plain a {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .comments, .syntaxhighlighter.printing .comments a {
|
||||
color: #008200 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .string, .syntaxhighlighter.printing .string a {
|
||||
color: blue !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .keyword {
|
||||
color: #006699 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .preprocessor {
|
||||
color: gray !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .variable {
|
||||
color: #aa7700 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .value {
|
||||
color: #009900 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .functions {
|
||||
color: #ff1493 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .constants {
|
||||
color: #0066cc !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .script {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .color1, .syntaxhighlighter.printing .color1 a {
|
||||
color: gray !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .color2, .syntaxhighlighter.printing .color2 a {
|
||||
color: #ff1493 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .color3, .syntaxhighlighter.printing .color3 a {
|
||||
color: red !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .break, .syntaxhighlighter.printing .break a {
|
||||
color: black !important;
|
||||
}
|
17
app/static/global/plugins/rateit/example/sh/shCore.js
vendored
Normal file
328
app/static/global/plugins/rateit/example/sh/shCoreDefault.css
Normal file
@ -0,0 +1,328 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
.syntaxhighlighter a,
|
||||
.syntaxhighlighter div,
|
||||
.syntaxhighlighter code,
|
||||
.syntaxhighlighter table,
|
||||
.syntaxhighlighter table td,
|
||||
.syntaxhighlighter table tr,
|
||||
.syntaxhighlighter table tbody,
|
||||
.syntaxhighlighter table thead,
|
||||
.syntaxhighlighter table caption,
|
||||
.syntaxhighlighter textarea {
|
||||
-moz-border-radius: 0 0 0 0 !important;
|
||||
-webkit-border-radius: 0 0 0 0 !important;
|
||||
background: none !important;
|
||||
border: 0 !important;
|
||||
bottom: auto !important;
|
||||
float: none !important;
|
||||
height: auto !important;
|
||||
left: auto !important;
|
||||
line-height: 1.1em !important;
|
||||
margin: 0 !important;
|
||||
outline: 0 !important;
|
||||
overflow: visible !important;
|
||||
padding: 0 !important;
|
||||
position: static !important;
|
||||
right: auto !important;
|
||||
text-align: left !important;
|
||||
top: auto !important;
|
||||
vertical-align: baseline !important;
|
||||
width: auto !important;
|
||||
box-sizing: content-box !important;
|
||||
font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
|
||||
font-weight: normal !important;
|
||||
font-style: normal !important;
|
||||
font-size: 1em !important;
|
||||
min-height: inherit !important;
|
||||
min-height: auto !important;
|
||||
}
|
||||
|
||||
.syntaxhighlighter {
|
||||
width: 100% !important;
|
||||
margin: 1em 0 1em 0 !important;
|
||||
position: relative !important;
|
||||
overflow: auto !important;
|
||||
font-size: 1em !important;
|
||||
}
|
||||
.syntaxhighlighter.source {
|
||||
overflow: hidden !important;
|
||||
}
|
||||
.syntaxhighlighter .bold {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.syntaxhighlighter .italic {
|
||||
font-style: italic !important;
|
||||
}
|
||||
.syntaxhighlighter .line {
|
||||
white-space: pre !important;
|
||||
}
|
||||
.syntaxhighlighter table {
|
||||
width: 100% !important;
|
||||
}
|
||||
.syntaxhighlighter table caption {
|
||||
text-align: left !important;
|
||||
padding: .5em 0 0.5em 1em !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code {
|
||||
width: 100% !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .container {
|
||||
position: relative !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .container textarea {
|
||||
box-sizing: border-box !important;
|
||||
position: absolute !important;
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
border: none !important;
|
||||
background: white !important;
|
||||
padding-left: 1em !important;
|
||||
overflow: hidden !important;
|
||||
white-space: pre !important;
|
||||
}
|
||||
.syntaxhighlighter table td.gutter .line {
|
||||
text-align: right !important;
|
||||
padding: 0 0.5em 0 1em !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .line {
|
||||
padding: 0 1em !important;
|
||||
}
|
||||
.syntaxhighlighter.nogutter td.code .container textarea, .syntaxhighlighter.nogutter td.code .line {
|
||||
padding-left: 0em !important;
|
||||
}
|
||||
.syntaxhighlighter.show {
|
||||
display: block !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed table {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar {
|
||||
padding: 0.1em 0.8em 0em 0.8em !important;
|
||||
font-size: 1em !important;
|
||||
position: static !important;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar span {
|
||||
display: inline !important;
|
||||
margin-right: 1em !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar span a {
|
||||
padding: 0 !important;
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar span a.expandSource {
|
||||
display: inline !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar {
|
||||
position: absolute !important;
|
||||
right: 1px !important;
|
||||
top: 1px !important;
|
||||
width: 11px !important;
|
||||
height: 11px !important;
|
||||
font-size: 10px !important;
|
||||
z-index: 10 !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar span.title {
|
||||
display: inline !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar a {
|
||||
display: block !important;
|
||||
text-align: center !important;
|
||||
text-decoration: none !important;
|
||||
padding-top: 1px !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar a.expandSource {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.ie {
|
||||
font-size: .9em !important;
|
||||
padding: 1px 0 1px 0 !important;
|
||||
}
|
||||
.syntaxhighlighter.ie .toolbar {
|
||||
line-height: 8px !important;
|
||||
}
|
||||
.syntaxhighlighter.ie .toolbar a {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line.alt1 .content,
|
||||
.syntaxhighlighter.printing .line.alt2 .content,
|
||||
.syntaxhighlighter.printing .line.highlighted .number,
|
||||
.syntaxhighlighter.printing .line.highlighted.alt1 .content,
|
||||
.syntaxhighlighter.printing .line.highlighted.alt2 .content {
|
||||
background: none !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line .number {
|
||||
color: #bbbbbb !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line .content {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .toolbar {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter.printing a {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .plain, .syntaxhighlighter.printing .plain a {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .comments, .syntaxhighlighter.printing .comments a {
|
||||
color: #008200 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .string, .syntaxhighlighter.printing .string a {
|
||||
color: blue !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .keyword {
|
||||
color: #006699 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .preprocessor {
|
||||
color: gray !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .variable {
|
||||
color: #aa7700 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .value {
|
||||
color: #009900 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .functions {
|
||||
color: #ff1493 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .constants {
|
||||
color: #0066cc !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .script {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .color1, .syntaxhighlighter.printing .color1 a {
|
||||
color: gray !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .color2, .syntaxhighlighter.printing .color2 a {
|
||||
color: #ff1493 !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .color3, .syntaxhighlighter.printing .color3 a {
|
||||
color: red !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .break, .syntaxhighlighter.printing .break a {
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
.syntaxhighlighter {
|
||||
background-color: white !important;
|
||||
}
|
||||
.syntaxhighlighter .line.alt1 {
|
||||
background-color: white !important;
|
||||
}
|
||||
.syntaxhighlighter .line.alt2 {
|
||||
background-color: white !important;
|
||||
}
|
||||
.syntaxhighlighter .line.highlighted.alt1, .syntaxhighlighter .line.highlighted.alt2 {
|
||||
background-color: #e0e0e0 !important;
|
||||
}
|
||||
.syntaxhighlighter .line.highlighted.number {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter table caption {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter .gutter {
|
||||
color: #afafaf !important;
|
||||
}
|
||||
.syntaxhighlighter .gutter .line {
|
||||
border-right: 3px solid #6ce26c !important;
|
||||
}
|
||||
.syntaxhighlighter .gutter .line.highlighted {
|
||||
background-color: #6ce26c !important;
|
||||
color: white !important;
|
||||
}
|
||||
.syntaxhighlighter.printing .line .content {
|
||||
border: none !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed {
|
||||
overflow: visible !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar {
|
||||
color: blue !important;
|
||||
background: white !important;
|
||||
border: 1px solid #6ce26c !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar a {
|
||||
color: blue !important;
|
||||
}
|
||||
.syntaxhighlighter.collapsed .toolbar a:hover {
|
||||
color: red !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar {
|
||||
color: white !important;
|
||||
background: #6ce26c !important;
|
||||
border: none !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar a {
|
||||
color: white !important;
|
||||
}
|
||||
.syntaxhighlighter .toolbar a:hover {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter .plain, .syntaxhighlighter .plain a {
|
||||
color: black !important;
|
||||
}
|
||||
.syntaxhighlighter .comments, .syntaxhighlighter .comments a {
|
||||
color: #008200 !important;
|
||||
}
|
||||
.syntaxhighlighter .string, .syntaxhighlighter .string a {
|
||||
color: blue !important;
|
||||
}
|
||||
.syntaxhighlighter .keyword {
|
||||
color: #006699 !important;
|
||||
}
|
||||
.syntaxhighlighter .preprocessor {
|
||||
color: gray !important;
|
||||
}
|
||||
.syntaxhighlighter .variable {
|
||||
color: #aa7700 !important;
|
||||
}
|
||||
.syntaxhighlighter .value {
|
||||
color: #009900 !important;
|
||||
}
|
||||
.syntaxhighlighter .functions {
|
||||
color: #ff1493 !important;
|
||||
}
|
||||
.syntaxhighlighter .constants {
|
||||
color: #0066cc !important;
|
||||
}
|
||||
.syntaxhighlighter .script {
|
||||
font-weight: bold !important;
|
||||
color: #006699 !important;
|
||||
background-color: none !important;
|
||||
}
|
||||
.syntaxhighlighter .color1, .syntaxhighlighter .color1 a {
|
||||
color: gray !important;
|
||||
}
|
||||
.syntaxhighlighter .color2, .syntaxhighlighter .color2 a {
|
||||
color: #ff1493 !important;
|
||||
}
|
||||
.syntaxhighlighter .color3, .syntaxhighlighter .color3 a {
|
||||
color: red !important;
|
||||
}
|
||||
|
||||
.syntaxhighlighter .keyword {
|
||||
font-weight: bold !important;
|
||||
}
|