mirror of
https://codeberg.org/streams/streams.git
synced 2024-09-19 23:55:19 +00:00
Replace jslider with jRange
This commit is contained in:
parent
7791d28a5d
commit
128b0008ee
17 changed files with 2148 additions and 6 deletions
|
@ -421,7 +421,7 @@ function widget_affinity($arr) {
|
||||||
if(feature_enabled(local_user(),'affinity')) {
|
if(feature_enabled(local_user(),'affinity')) {
|
||||||
$tpl = get_markup_template('main_slider.tpl');
|
$tpl = get_markup_template('main_slider.tpl');
|
||||||
$x = replace_macros($tpl,array(
|
$x = replace_macros($tpl,array(
|
||||||
'$val' => $cmin . ';' . $cmax,
|
'$val' => $cmin . ',' . $cmax,
|
||||||
'$refresh' => t('Refresh'),
|
'$refresh' => t('Refresh'),
|
||||||
'$me' => t('Me'),
|
'$me' => t('Me'),
|
||||||
'$intimate' => t('Best Friends'),
|
'$intimate' => t('Best Friends'),
|
||||||
|
|
2
library/jRange/.gitignore
vendored
Normal file
2
library/jRange/.gitignore
vendored
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
|
||||||
|
*.codekit
|
21
library/jRange/LICENSE
Normal file
21
library/jRange/LICENSE
Normal file
|
@ -0,0 +1,21 @@
|
||||||
|
The MIT License (MIT)
|
||||||
|
|
||||||
|
Copyright (c) 2014 Nitin Hayaran
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
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.
|
5
library/jRange/README.md
Normal file
5
library/jRange/README.md
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
## jQuery plugin to create Range Selector
|
||||||
|
|
||||||
|
![jRange Preview](http://i.imgur.com/da8uZwx.png)
|
||||||
|
|
||||||
|
[Demo and Documentation](http://nitinhayaran.github.io/jRange/demo/)
|
245
library/jRange/demo/index.html
Normal file
245
library/jRange/demo/index.html
Normal file
|
@ -0,0 +1,245 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>jRange : jQuery Range Selector</title>
|
||||||
|
<link rel="stylesheet" href="normalize.css">
|
||||||
|
<link rel="stylesheet" href="main.css">
|
||||||
|
<link rel="stylesheet" href="prism/prism.css">
|
||||||
|
<link rel="stylesheet" href="../jquery.range.css">
|
||||||
|
<link href='http://fonts.googleapis.com/css?family=Raleway:100,300' rel='stylesheet' type='text/css'>
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<section class="pane header">
|
||||||
|
<div class="header">
|
||||||
|
<h1>jRange</h1>
|
||||||
|
<h2>jQuery Plugin to create Range Selector</h2>
|
||||||
|
</div>
|
||||||
|
<footer>
|
||||||
|
<div class="left">
|
||||||
|
<a href="http://twitter.com/share" class="twitter-share-button" data-url="https://github.com/nitinhayaran/jRange" data-text="jRange - jQuery plugin for Range Selector" data-count="none" data-via="nitinhayaran">Tweet</a>
|
||||||
|
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
|
||||||
|
<iframe src="http://ghbtns.com/github-btn.html?user=nitinhayaran&repo=jRange&type=watch&count=false&size=small"
|
||||||
|
allowtransparency="true" frameborder="0" scrolling="0" width="62" height="20"></iframe>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<a href="https://twitter.com/nitinhayaran" class="twitter-follow-button" data-show-count="false">Follow @nitinhayaran</a>
|
||||||
|
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
|
||||||
|
<iframe src="http://ghbtns.com/github-btn.html?user=nitinhayaran&type=follow&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="153" height="20"></iframe>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</section>
|
||||||
|
<section class="body demo">
|
||||||
|
<div class="container">
|
||||||
|
<h2>See it in Action</h2>
|
||||||
|
<h3>Play around with the demo</h3>
|
||||||
|
<div class="demo-container clearfix">
|
||||||
|
<div class="demo-section">
|
||||||
|
<div class="demo-code">
|
||||||
|
<pre><code class="language-javascript">$('.single-slider').jRange({
|
||||||
|
from: 0,
|
||||||
|
to: 100,
|
||||||
|
step: 1,
|
||||||
|
scale: [0,50,100],
|
||||||
|
format: '%s',
|
||||||
|
width: 300,
|
||||||
|
showLabels: true
|
||||||
|
});</code></pre>
|
||||||
|
</div>
|
||||||
|
<div class="demo-output">
|
||||||
|
<input class="single-slider" type="hidden" value="25"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="demo-section">
|
||||||
|
<div class="demo-code">
|
||||||
|
<pre><code class="language-javascript">$('.range-slider').jRange({
|
||||||
|
from: 0,
|
||||||
|
to: 100,
|
||||||
|
step: 1,
|
||||||
|
scale: [0,25,50,75,100],
|
||||||
|
format: '%s',
|
||||||
|
width: 300,
|
||||||
|
showLabels: true,
|
||||||
|
isRange : true
|
||||||
|
});</code></pre>
|
||||||
|
</div>
|
||||||
|
<div class="demo-output">
|
||||||
|
<input class="range-slider" type="hidden" value="25,75"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="text-container">
|
||||||
|
<h2>How to Use</h2>
|
||||||
|
<h3>Lets see some code</h3>
|
||||||
|
<p>To get started you'll have to include <code>jquery.range.js</code> and <code>jquery.range.css</code> files in your html file.</p>
|
||||||
|
<pre><code class="language-css"><link rel="stylesheet" href="jquery.range.css">
|
||||||
|
<script src="jquery.range.js"></script></code></pre>
|
||||||
|
<p>Later just add an hidden input, where ever you want this slider to be shown.</p>
|
||||||
|
<pre><code class="language-css"><input type="hidden" class="slider-input" value="23" /></code></pre>
|
||||||
|
<p>After this you'll have to intialize this plugin for that input, as shown in the example above</p>
|
||||||
|
|
||||||
|
<h2>Options</h2>
|
||||||
|
<h3>See configuration options</h3>
|
||||||
|
<p>Options can also be set programatically, by passing an options hash to the jRange method.
|
||||||
|
<table class="plugin-options" width='900'>
|
||||||
|
<tr>
|
||||||
|
<th>Option</th>
|
||||||
|
<th width="200">Override</th>
|
||||||
|
<th>Type</th>
|
||||||
|
<th>Details</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>from</td>
|
||||||
|
<td>Mandatory</td>
|
||||||
|
<td>Integer</td>
|
||||||
|
<td>Lower bound of slider</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>to</td>
|
||||||
|
<td>Mandatory</td>
|
||||||
|
<td>Integer</td>
|
||||||
|
<td>Upper bound of slider</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>step</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Integer</td>
|
||||||
|
<td>
|
||||||
|
<code>Default : 1</code>
|
||||||
|
<p>amount of increment on each step</p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>scale</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Array</td>
|
||||||
|
<td>
|
||||||
|
<p>Array containing label which are shown below the slider. By default its [from, to].</p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>showLabels</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Boolean</td>
|
||||||
|
<td>
|
||||||
|
<p>False, if you'd like to hide label which are shown on top of slider.</p>
|
||||||
|
<code>Default : true</code>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>showScale</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Boolean</td>
|
||||||
|
<td>
|
||||||
|
<p>False, if you'd like to hide scale which are shown below the slider.</p>
|
||||||
|
<code>Default : true</code>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>format</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>String / Function</td>
|
||||||
|
<td>
|
||||||
|
<p>this is used to show label on the pointer</p>
|
||||||
|
<code>Default : "%s"</code>
|
||||||
|
<p><code>String</code> : %s is replaced by its value, e.g., "%s days", "%s goats"</p>
|
||||||
|
<p>
|
||||||
|
<code>Function</code> : format(value, pointer)
|
||||||
|
<br>
|
||||||
|
<code>return</code> : string label for a given value and pointer. <br>
|
||||||
|
<code>pointer</code> could be 'low'/'high' if <code>isRange</code> is true, else undefined
|
||||||
|
</p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>width</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Integer</td>
|
||||||
|
<td>
|
||||||
|
<code>Default : 300</code>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>theme</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>String</td>
|
||||||
|
<td>
|
||||||
|
<code>Default : "theme-green"</code>
|
||||||
|
<p>This is the css class name added to the container. Available themes are "theme-blue", "theme-green". You can also add more themes, just like in <code>jquery.range.less</code></p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>isRange</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Boolean</td>
|
||||||
|
<td>
|
||||||
|
<code>Default : false</code>
|
||||||
|
<p>True if this is a range selector. If its a range the value of hidden input will be set comma-seperated, e.g., "25,75"</p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>onstatechange</td>
|
||||||
|
<td>Optional</td>
|
||||||
|
<td>Function</td>
|
||||||
|
<td>
|
||||||
|
<p>This function is called whenever the value is changed by user. This same value is also automatically set for the provided Hidden Input.</p>
|
||||||
|
<p>For single slider value is without comma, however for a range selector value is comma-seperated.</p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<div class="footer">
|
||||||
|
<a href="https://github.com/nitinhayaran/jRange" class="large-github">Get it from Github</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="footer">
|
||||||
|
<div class="text-container clearfix">
|
||||||
|
<div class="left">
|
||||||
|
<p>
|
||||||
|
<a href="https://twitter.com/nitinhayaran" class="twitter-follow-button" data-show-count="false">Follow @nitinhayaran</a>
|
||||||
|
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
|
||||||
|
</p>
|
||||||
|
<p><iframe src="http://ghbtns.com/github-btn.html?user=nitinhayaran&type=follow&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="153" height="20"></iframe></p>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<p><a href="https://github.com/nitinhayaran/jRange">jRange</a> is authored and maintained by <a href="https://github.com/nitinhayaran/">@nitinhayaran</a></p>
|
||||||
|
<p>
|
||||||
|
Released under the <a href="http://www.opensource.org/licenses/mit-license.php">MIT
|
||||||
|
License</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<script src="prism/prism.js"></script>
|
||||||
|
|
||||||
|
<script src="../jquery.range.js"></script>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$(document).ready(function(){
|
||||||
|
$('.single-slider').jRange({
|
||||||
|
from: 0,
|
||||||
|
to: 100,
|
||||||
|
step: 1,
|
||||||
|
scale: [0,25,50,75,100],
|
||||||
|
format: '%s',
|
||||||
|
width: 300,
|
||||||
|
showLabels: true
|
||||||
|
});
|
||||||
|
$('.range-slider').jRange({
|
||||||
|
from: 0,
|
||||||
|
to: 100,
|
||||||
|
step: 1,
|
||||||
|
scale: [0,25,50,75,100],
|
||||||
|
format: '%s',
|
||||||
|
width: 300,
|
||||||
|
showLabels: true,
|
||||||
|
isRange : true
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
289
library/jRange/demo/main.css
Normal file
289
library/jRange/demo/main.css
Normal file
|
@ -0,0 +1,289 @@
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-family: Helvetica Neue, Helvetica, Arial sans-serif;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: #434343;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
pre code {
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
width: 1130px;
|
||||||
|
padding: 0 20px;
|
||||||
|
margin: 0px auto;
|
||||||
|
}
|
||||||
|
.text-container {
|
||||||
|
width: 900px;
|
||||||
|
position: relative;
|
||||||
|
margin: 0px auto;
|
||||||
|
}
|
||||||
|
.clearfix:after {
|
||||||
|
content: " ";
|
||||||
|
/* Older browser do not support empty content */
|
||||||
|
visibility: hidden;
|
||||||
|
display: block;
|
||||||
|
height: 0;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.pane {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 50%;
|
||||||
|
min-height: 450px;
|
||||||
|
}
|
||||||
|
.body {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
section.header {
|
||||||
|
background-color: #606c88;
|
||||||
|
background: -webkit-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%);
|
||||||
|
/* Chrome 10+, Saf5.1+ */
|
||||||
|
background: -moz-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%);
|
||||||
|
/* FF3.6+ */
|
||||||
|
background: -ms-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%);
|
||||||
|
/* IE10 */
|
||||||
|
background: -o-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%);
|
||||||
|
/* Opera 11.10+ */
|
||||||
|
background: linear-gradient(90deg, #606c88 10%, #3f4c6b 90%);
|
||||||
|
/* W3C */
|
||||||
|
}
|
||||||
|
section.header footer {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 0;
|
||||||
|
padding: 10px 30px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.left {
|
||||||
|
float: left;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
float: right;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
div.header {
|
||||||
|
color: #fff;
|
||||||
|
width: 600px;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 40%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
div.header h1,
|
||||||
|
div.header h2 {
|
||||||
|
font-family: 'Raleway' sans-serif;
|
||||||
|
font-weight: 100;
|
||||||
|
line-height: 1;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
div.header h1 {
|
||||||
|
font-size: 72px;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
section.demo h2,
|
||||||
|
section.demo h3 {
|
||||||
|
font-family: 'Raleway' sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
line-height: 1;
|
||||||
|
margin: 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
section.demo h2 {
|
||||||
|
font-size: 48px;
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
section.demo h3 {
|
||||||
|
font-size: 28px;
|
||||||
|
margin: 0.8em 0 1em;
|
||||||
|
}
|
||||||
|
section.demo .demo-container {
|
||||||
|
margin: 40px 0 80px;
|
||||||
|
}
|
||||||
|
section.demo .demo-section {
|
||||||
|
margin: 20px 0;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
section.demo .demo-section .demo-code {
|
||||||
|
width: 50%;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
section.demo .demo-section .demo-output {
|
||||||
|
margin-left: 50%;
|
||||||
|
padding: 50px 0;
|
||||||
|
}
|
||||||
|
section.demo .demo-section .slider-container {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
section.demo .text-container h2 {
|
||||||
|
margin-top: 3em;
|
||||||
|
}
|
||||||
|
section.demo .form-vertical {
|
||||||
|
width: 200px;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
section.demo .image-container {
|
||||||
|
margin-left: 200px;
|
||||||
|
padding: 1px;
|
||||||
|
border: 1px solid #eee;
|
||||||
|
}
|
||||||
|
section.demo .form-group {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
section.demo label {
|
||||||
|
color: #999;
|
||||||
|
font-size: 13px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
section.demo input {
|
||||||
|
width: 150px;
|
||||||
|
margin-top: 3px;
|
||||||
|
border: 1px solid #999;
|
||||||
|
border-width: 0 0 1px 0;
|
||||||
|
padding: 3px 0 3px;
|
||||||
|
transition: 0.3s all;
|
||||||
|
}
|
||||||
|
section.demo input:focus,
|
||||||
|
section.demo input:active {
|
||||||
|
outline: none;
|
||||||
|
border-color: #2fc7ff;
|
||||||
|
box-shadow: 0 1px 3px -3px #2fc7ff;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
section.demo button {
|
||||||
|
position: relative;
|
||||||
|
overflow: visible;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.3em 1em;
|
||||||
|
border: 1px solid #d4d4d4;
|
||||||
|
margin: 0;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
text-shadow: 1px 1px 0 #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #333;
|
||||||
|
white-space: nowrap;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
background-color: #ececec;
|
||||||
|
background-image: linear-gradient(#f4f4f4, #ececec);
|
||||||
|
background-clip: padding-box;
|
||||||
|
border-radius: 0.2em;
|
||||||
|
zoom: 1;
|
||||||
|
transition: background-image 0.3s;
|
||||||
|
}
|
||||||
|
section.demo button:hover,
|
||||||
|
section.demo button:active {
|
||||||
|
border-color: #3072b3;
|
||||||
|
border-bottom-color: #2a65a0;
|
||||||
|
text-decoration: none;
|
||||||
|
text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
|
||||||
|
color: #fff;
|
||||||
|
background-color: #3c8dde;
|
||||||
|
background-image: linear-gradient(#599bdc, #3072b3);
|
||||||
|
}
|
||||||
|
section.demo p {
|
||||||
|
font-family: 'Raleway' sans-serif;
|
||||||
|
margin: 1em auto;
|
||||||
|
}
|
||||||
|
section.demo .footer {
|
||||||
|
margin-top: 80px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
section.demo .large-github {
|
||||||
|
display: inline-block;
|
||||||
|
border: 1px solid #21b0ff;
|
||||||
|
font-weight: 400;
|
||||||
|
font-family: 'Raleway' sans-serif;
|
||||||
|
text-shadow: none;
|
||||||
|
background-color: #fff;
|
||||||
|
background-image: none;
|
||||||
|
padding: 8px 25px;
|
||||||
|
color: #21b0ff;
|
||||||
|
font-size: 18px;
|
||||||
|
border-radius: 25px;
|
||||||
|
}
|
||||||
|
section.demo .large-github:hover,
|
||||||
|
section.demo .large-github:active {
|
||||||
|
background-color: #21b0ff;
|
||||||
|
color: #fff;
|
||||||
|
background-image: none;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
.two-coloumn em {
|
||||||
|
font-weight: normal;
|
||||||
|
text-decoration: none;
|
||||||
|
font-style: normal;
|
||||||
|
display: inline-block;
|
||||||
|
width: 85px;
|
||||||
|
}
|
||||||
|
.plugin-options {
|
||||||
|
font-size: 14px;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
width: 900px;
|
||||||
|
font-weight: 200;
|
||||||
|
}
|
||||||
|
.plugin-options td,
|
||||||
|
.plugin-options th {
|
||||||
|
padding: 8px ;
|
||||||
|
text-align: left;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
.plugin-options td:first-child,
|
||||||
|
.plugin-options th:first-child {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.plugin-options td:nth-child(2),
|
||||||
|
.plugin-options td:nth-child(3) {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.plugin-options td p {
|
||||||
|
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||||
|
margin: 4px 0;
|
||||||
|
}
|
||||||
|
.plugin-options td p:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
.plugin-options th {
|
||||||
|
background-color: #358ccb;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.plugin-options tr:nth-child(2n + 1) td {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
.plugin-options small {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.plugin-options ul {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.plugin-options ul ul {
|
||||||
|
list-style: circle inside;
|
||||||
|
}
|
||||||
|
section.footer {
|
||||||
|
margin-top: 80px;
|
||||||
|
padding: 30px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #333;
|
||||||
|
color: #999;
|
||||||
|
font-weight: 300;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
section.footer p {
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
section.footer a {
|
||||||
|
color: #fff;
|
||||||
|
}
|
296
library/jRange/demo/main.less
Normal file
296
library/jRange/demo/main.less
Normal file
|
@ -0,0 +1,296 @@
|
||||||
|
@font-family: 'Raleway' sans-serif;
|
||||||
|
html, body{
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
font-family: Helvetica Neue, Helvetica, Arial sans-serif;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: #434343;
|
||||||
|
}
|
||||||
|
a{
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
pre code{
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
.container{
|
||||||
|
width: 1130px;
|
||||||
|
padding: 0 20px;
|
||||||
|
margin: 0px auto;
|
||||||
|
}
|
||||||
|
.text-container{
|
||||||
|
width: 900px;
|
||||||
|
position: relative;
|
||||||
|
margin: 0px auto;
|
||||||
|
}
|
||||||
|
.clearfix:after {
|
||||||
|
content: " "; /* Older browser do not support empty content */
|
||||||
|
visibility: hidden;
|
||||||
|
display: block;
|
||||||
|
height: 0;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.pane{
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 50%;
|
||||||
|
min-height: 450px;
|
||||||
|
}
|
||||||
|
.body{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
section.header{
|
||||||
|
background-color: #606c88;
|
||||||
|
|
||||||
|
background: -webkit-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%); /* Chrome 10+, Saf5.1+ */
|
||||||
|
background: -moz-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%); /* FF3.6+ */
|
||||||
|
background: -ms-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%); /* IE10 */
|
||||||
|
background: -o-linear-gradient(90deg, #606c88 10%, #3f4c6b 90%); /* Opera 11.10+ */
|
||||||
|
background: linear-gradient(90deg, #606c88 10%, #3f4c6b 90%); /* W3C */
|
||||||
|
|
||||||
|
// background-image: radial-gradient(50% 102%, #3cb3db 48%, #2e6c9a 100%);
|
||||||
|
footer{
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 0;
|
||||||
|
padding: 10px 30px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left{
|
||||||
|
float: left;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.right{
|
||||||
|
float: right;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
div.header{
|
||||||
|
color: #fff;
|
||||||
|
width: 600px;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 40%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
// background-color: #333;
|
||||||
|
border-radius: 5px;
|
||||||
|
h1, h2{
|
||||||
|
font-family: @font-family;
|
||||||
|
font-weight: 100;
|
||||||
|
line-height: 1;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
h1{
|
||||||
|
font-size: 72px;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
section.demo{
|
||||||
|
h2, h3{
|
||||||
|
font-family: @font-family;
|
||||||
|
font-weight: 300;
|
||||||
|
line-height: 1;
|
||||||
|
margin: 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
h2{
|
||||||
|
font-size: 48px;
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
h3{
|
||||||
|
font-size: 28px;
|
||||||
|
margin: 0.8em 0 1em;
|
||||||
|
}
|
||||||
|
.demo-container{
|
||||||
|
margin: 40px 0 80px;
|
||||||
|
}
|
||||||
|
.demo-section{
|
||||||
|
margin: 20px 0;
|
||||||
|
clear: both;
|
||||||
|
.demo-code{
|
||||||
|
width: 50%;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.demo-output{
|
||||||
|
margin-left: 50%;
|
||||||
|
padding: 50px 0;
|
||||||
|
}
|
||||||
|
.slider-container{
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.text-container{
|
||||||
|
h2{
|
||||||
|
margin-top: 3em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.form-vertical{
|
||||||
|
width: 200px;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.image-container{
|
||||||
|
margin-left: 200px;
|
||||||
|
padding: 1px;
|
||||||
|
border: 1px solid #eee;
|
||||||
|
// background-color: #333;
|
||||||
|
}
|
||||||
|
.form-group{
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
label{
|
||||||
|
color: #999;
|
||||||
|
font-size: 13px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
input{
|
||||||
|
width: 150px;
|
||||||
|
margin-top: 3px;
|
||||||
|
// border-radius: 2px;
|
||||||
|
border: 1px solid #999;
|
||||||
|
border-width: 0 0 1px 0;
|
||||||
|
padding: 3px 0 3px;
|
||||||
|
transition: 0.3s all;
|
||||||
|
// color: #999;
|
||||||
|
&:focus, &:active{
|
||||||
|
outline: none;
|
||||||
|
border-color: #2fc7ff;
|
||||||
|
box-shadow: 0 1px 3px -3px #2fc7ff;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
button{
|
||||||
|
position: relative;
|
||||||
|
overflow: visible;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.3em 1em;
|
||||||
|
border: 1px solid #d4d4d4;
|
||||||
|
margin: 0;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
text-shadow: 1px 1px 0 #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #333;
|
||||||
|
white-space: nowrap;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
background-color: #ececec;
|
||||||
|
background-image: linear-gradient(#f4f4f4, #ececec);
|
||||||
|
background-clip: padding-box;
|
||||||
|
border-radius: 0.2em;
|
||||||
|
zoom: 1;
|
||||||
|
transition: background-image 0.3s;
|
||||||
|
&:hover, &:active{
|
||||||
|
border-color: #3072b3;
|
||||||
|
border-bottom-color: #2a65a0;
|
||||||
|
text-decoration: none;
|
||||||
|
text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
|
||||||
|
color: #fff;
|
||||||
|
background-color: #3c8dde;
|
||||||
|
background-image: linear-gradient(#599bdc, #3072b3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
p{
|
||||||
|
font-family: @font-family;
|
||||||
|
margin: 1em auto;
|
||||||
|
}
|
||||||
|
.footer{
|
||||||
|
margin-top: 80px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.large-github{
|
||||||
|
display: inline-block;
|
||||||
|
border: 1px solid #21b0ff;
|
||||||
|
font-weight: 400;
|
||||||
|
font-family: @font-family;
|
||||||
|
text-shadow: none;
|
||||||
|
background-color: #fff;
|
||||||
|
background-image: none;
|
||||||
|
padding: 8px 25px;
|
||||||
|
color: #21b0ff;
|
||||||
|
font-size: 18px;
|
||||||
|
border-radius: 25px;
|
||||||
|
&:hover, &:active{
|
||||||
|
background-color: #21b0ff;
|
||||||
|
color: #fff;
|
||||||
|
background-image: none;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.two-coloumn{
|
||||||
|
em{
|
||||||
|
font-weight: normal;
|
||||||
|
text-decoration: none;
|
||||||
|
font-style: normal;
|
||||||
|
display: inline-block;
|
||||||
|
width: 85px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.plugin-options{
|
||||||
|
font-size: 14px;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
width: 900px;
|
||||||
|
font-weight: 200;
|
||||||
|
td, th{
|
||||||
|
padding: 8px ;
|
||||||
|
text-align: left;
|
||||||
|
vertical-align: top;
|
||||||
|
&:first-child{
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
td{
|
||||||
|
&:nth-child(2), &:nth-child(3){
|
||||||
|
font-size: 13px;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
p{
|
||||||
|
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||||
|
margin: 4px 0;
|
||||||
|
&:first-child{
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
th{
|
||||||
|
background-color: #358ccb;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
tr{
|
||||||
|
&:nth-child(2n + 1){
|
||||||
|
td{
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
small{
|
||||||
|
display: block;
|
||||||
|
// white-space: nowrap;
|
||||||
|
}
|
||||||
|
ul{
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
ul{
|
||||||
|
list-style: circle inside;
|
||||||
|
// padding-left: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
section.footer{
|
||||||
|
margin-top: 80px;
|
||||||
|
padding: 30px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #333;
|
||||||
|
color: #999;
|
||||||
|
font-weight: 300;
|
||||||
|
font-size: 13px;
|
||||||
|
p{
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
a{
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
425
library/jRange/demo/normalize.css
vendored
Normal file
425
library/jRange/demo/normalize.css
vendored
Normal file
|
@ -0,0 +1,425 @@
|
||||||
|
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Set default font family to sans-serif.
|
||||||
|
* 2. Prevent iOS text size adjust after orientation change, without disabling
|
||||||
|
* user zoom.
|
||||||
|
*/
|
||||||
|
|
||||||
|
html {
|
||||||
|
font-family: sans-serif; /* 1 */
|
||||||
|
-ms-text-size-adjust: 100%; /* 2 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove default margin.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* HTML5 display definitions
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct `block` display not defined for any HTML5 element in IE 8/9.
|
||||||
|
* Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
|
||||||
|
* Correct `block` display not defined for `main` in IE 11.
|
||||||
|
*/
|
||||||
|
|
||||||
|
article,
|
||||||
|
aside,
|
||||||
|
details,
|
||||||
|
figcaption,
|
||||||
|
figure,
|
||||||
|
footer,
|
||||||
|
header,
|
||||||
|
hgroup,
|
||||||
|
main,
|
||||||
|
nav,
|
||||||
|
section,
|
||||||
|
summary {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct `inline-block` display not defined in IE 8/9.
|
||||||
|
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
audio,
|
||||||
|
canvas,
|
||||||
|
progress,
|
||||||
|
video {
|
||||||
|
display: inline-block; /* 1 */
|
||||||
|
vertical-align: baseline; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent modern browsers from displaying `audio` without controls.
|
||||||
|
* Remove excess height in iOS 5 devices.
|
||||||
|
*/
|
||||||
|
|
||||||
|
audio:not([controls]) {
|
||||||
|
display: none;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address `[hidden]` styling not present in IE 8/9/10.
|
||||||
|
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden],
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Links
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the gray background color from active links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Improve readability when focused and also mouse hovered in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a:active,
|
||||||
|
a:hover {
|
||||||
|
outline: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: 1px dotted;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address styling not present in Safari and Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
dfn {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address variable `h1` font-size and margin within `section` and `article`
|
||||||
|
* contexts in Firefox 4+, Safari, and Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
margin: 0.67em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address styling not present in IE 8/9.
|
||||||
|
*/
|
||||||
|
|
||||||
|
mark {
|
||||||
|
background: #ff0;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address inconsistent and variable font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove border when inside `a` element in IE 8/9/10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct overflow not hidden in IE 9/10/11.
|
||||||
|
*/
|
||||||
|
|
||||||
|
svg:not(:root) {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address margin not present in IE 8/9 and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
figure {
|
||||||
|
margin: 1em 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address differences between Firefox and other browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
-moz-box-sizing: content-box;
|
||||||
|
box-sizing: content-box;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Contain overflow in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address odd `em`-unit font size rendering in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
pre,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace;
|
||||||
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||||
|
* styling of `select`, unless a `border` property is set.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct color not being inherited.
|
||||||
|
* Known issue: affects color of disabled elements.
|
||||||
|
* 2. Correct font properties not being inherited.
|
||||||
|
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
color: inherit; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
margin: 0; /* 3 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address `overflow` set to `hidden` in IE 8/9/10/11.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button {
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||||
|
* All other form control elements do not inherit `text-transform` values.
|
||||||
|
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
|
||||||
|
* Correct `select` style inheritance in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select {
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||||
|
* and `video` controls.
|
||||||
|
* 2. Correct inability to style clickable `input` types in iOS.
|
||||||
|
* 3. Improve usability and consistency of cursor style between image-type
|
||||||
|
* `input` and others.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
html input[type="button"], /* 1 */
|
||||||
|
input[type="reset"],
|
||||||
|
input[type="submit"] {
|
||||||
|
-webkit-appearance: button; /* 2 */
|
||||||
|
cursor: pointer; /* 3 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Re-set default cursor for disabled elements.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button[disabled],
|
||||||
|
html input[disabled] {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove inner padding and border in Firefox 4+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
input::-moz-focus-inner {
|
||||||
|
border: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||||
|
* the UA stylesheet.
|
||||||
|
*/
|
||||||
|
|
||||||
|
input {
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* It's recommended that you don't attempt to style these elements.
|
||||||
|
* Firefox's implementation doesn't respect box-sizing, padding, or width.
|
||||||
|
*
|
||||||
|
* 1. Address box sizing set to `content-box` in IE 8/9/10.
|
||||||
|
* 2. Remove excess padding in IE 8/9/10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
input[type="checkbox"],
|
||||||
|
input[type="radio"] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||||
|
* `font-size` values of the `input`, it causes the cursor style of the
|
||||||
|
* decrement button to change from `default` to `text`.
|
||||||
|
*/
|
||||||
|
|
||||||
|
input[type="number"]::-webkit-inner-spin-button,
|
||||||
|
input[type="number"]::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||||
|
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
|
||||||
|
* (include `-moz` to future-proof).
|
||||||
|
*/
|
||||||
|
|
||||||
|
input[type="search"] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
-moz-box-sizing: content-box;
|
||||||
|
-webkit-box-sizing: content-box; /* 2 */
|
||||||
|
box-sizing: content-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||||
|
* Safari (but not Chrome) clips the cancel button when the search input has
|
||||||
|
* padding (and `textfield` appearance).
|
||||||
|
*/
|
||||||
|
|
||||||
|
input[type="search"]::-webkit-search-cancel-button,
|
||||||
|
input[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Define consistent border, margin, and padding.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
border: 1px solid #c0c0c0;
|
||||||
|
margin: 0 2px;
|
||||||
|
padding: 0.35em 0.625em 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct `color` not being inherited in IE 8/9/10/11.
|
||||||
|
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
border: 0; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove default vertical scrollbar in IE 8/9/10/11.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Don't inherit the `font-weight` (applied by a rule above).
|
||||||
|
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||||
|
*/
|
||||||
|
|
||||||
|
optgroup {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tables
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove most spacing between table cells.
|
||||||
|
*/
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
td,
|
||||||
|
th {
|
||||||
|
padding: 0;
|
||||||
|
}
|
193
library/jRange/demo/prism/prism.css
Normal file
193
library/jRange/demo/prism/prism.css
Normal file
|
@ -0,0 +1,193 @@
|
||||||
|
/* http://prismjs.com/download.html?themes=prism-coy&languages=markup+css+css-extras+clike+javascript */
|
||||||
|
/**
|
||||||
|
* prism.js Coy theme for JavaScript, CoffeeScript, CSS and HTML
|
||||||
|
* Based on https://github.com/tshedor/workshop-wp-theme (Example: http://workshop.kansan.com/category/sessions/basics or http://workshop.timshedor.com/category/sessions/basics);
|
||||||
|
* @author Tim Shedor
|
||||||
|
*/
|
||||||
|
|
||||||
|
code[class*="language-"],
|
||||||
|
pre[class*="language-"] {
|
||||||
|
color: black;
|
||||||
|
font-family: Consolas, Monaco, 'Andale Mono', monospace;
|
||||||
|
direction: ltr;
|
||||||
|
text-align: left;
|
||||||
|
white-space: pre;
|
||||||
|
word-spacing: normal;
|
||||||
|
word-break: normal;
|
||||||
|
|
||||||
|
-moz-tab-size: 4;
|
||||||
|
-o-tab-size: 4;
|
||||||
|
tab-size: 4;
|
||||||
|
|
||||||
|
-webkit-hyphens: none;
|
||||||
|
-moz-hyphens: none;
|
||||||
|
-ms-hyphens: none;
|
||||||
|
hyphens: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Code blocks */
|
||||||
|
pre[class*="language-"] {
|
||||||
|
position:relative;
|
||||||
|
padding: 1em;
|
||||||
|
margin: .5em 0;
|
||||||
|
-webkit-box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
|
||||||
|
-moz-box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
|
||||||
|
box-shadow: -1px 0px 0px 0px #358ccb, 0px 0px 0px 1px #dfdfdf;
|
||||||
|
border-left: 10px solid #358ccb;
|
||||||
|
background-color: #fdfdfd;
|
||||||
|
background-image: -webkit-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||||
|
background-image: -moz-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||||
|
background-image: -ms-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||||
|
background-image: -o-linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||||
|
background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%);
|
||||||
|
background-size: 3em 3em;
|
||||||
|
background-origin:content-box;
|
||||||
|
overflow:visible;
|
||||||
|
max-height:30em;
|
||||||
|
}
|
||||||
|
|
||||||
|
code[class*="language"] {
|
||||||
|
max-height:29em;
|
||||||
|
display:block;
|
||||||
|
overflow:scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Margin bottom to accomodate shadow */
|
||||||
|
:not(pre) > code[class*="language-"],
|
||||||
|
pre[class*="language-"] {
|
||||||
|
background-color:#fdfdfd;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Inline code */
|
||||||
|
:not(pre) > code[class*="language-"] {
|
||||||
|
position:relative;
|
||||||
|
padding: .2em;
|
||||||
|
-webkit-border-radius: 0.3em;
|
||||||
|
-moz-border-radius: 0.3em;
|
||||||
|
-ms-border-radius: 0.3em;
|
||||||
|
-o-border-radius: 0.3em;
|
||||||
|
border-radius: 0.3em;
|
||||||
|
color: #c92c2c;
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
pre[class*="language-"]:before,
|
||||||
|
pre[class*="language-"]:after {
|
||||||
|
content: '';
|
||||||
|
z-index: -2;
|
||||||
|
display:block;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0.75em;
|
||||||
|
left: 0.18em;
|
||||||
|
width: 40%;
|
||||||
|
height: 20%;
|
||||||
|
-webkit-box-shadow: 0px 13px 8px #979797;
|
||||||
|
-moz-box-shadow: 0px 13px 8px #979797;
|
||||||
|
box-shadow: 0px 13px 8px #979797;
|
||||||
|
-webkit-transform: rotate(-2deg);
|
||||||
|
-moz-transform: rotate(-2deg);
|
||||||
|
-ms-transform: rotate(-2deg);
|
||||||
|
-o-transform: rotate(-2deg);
|
||||||
|
transform: rotate(-2deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
:not(pre) > code[class*="language-"]:after,
|
||||||
|
pre[class*="language-"]:after {
|
||||||
|
right: 0.75em;
|
||||||
|
left: auto;
|
||||||
|
-webkit-transform: rotate(2deg);
|
||||||
|
-moz-transform: rotate(2deg);
|
||||||
|
-ms-transform: rotate(2deg);
|
||||||
|
-o-transform: rotate(2deg);
|
||||||
|
transform: rotate(2deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.comment,
|
||||||
|
.token.block-comment,
|
||||||
|
.token.prolog,
|
||||||
|
.token.doctype,
|
||||||
|
.token.cdata {
|
||||||
|
color: #7D8B99;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.punctuation {
|
||||||
|
color: #5F6364;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.property,
|
||||||
|
.token.tag,
|
||||||
|
.token.boolean,
|
||||||
|
.token.number,
|
||||||
|
.token.function-name,
|
||||||
|
.token.constant,
|
||||||
|
.token.symbol {
|
||||||
|
color: #c92c2c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.selector,
|
||||||
|
.token.attr-name,
|
||||||
|
.token.string,
|
||||||
|
.token.function,
|
||||||
|
.token.builtin {
|
||||||
|
color: #2f9c0a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.operator,
|
||||||
|
.token.entity,
|
||||||
|
.token.url,
|
||||||
|
.token.variable {
|
||||||
|
color: #a67f59;
|
||||||
|
background: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.atrule,
|
||||||
|
.token.attr-value,
|
||||||
|
.token.keyword,
|
||||||
|
.token.class-name {
|
||||||
|
color: #1990b8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.regex,
|
||||||
|
.token.important {
|
||||||
|
color: #e90;
|
||||||
|
}
|
||||||
|
.language-css .token.string,
|
||||||
|
.style .token.string {
|
||||||
|
color: #a67f59;
|
||||||
|
background: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.important {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.token.entity {
|
||||||
|
cursor: help;
|
||||||
|
}
|
||||||
|
|
||||||
|
.namespace {
|
||||||
|
opacity: .7;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width:767px){
|
||||||
|
pre[class*="language-"]:before,
|
||||||
|
pre[class*="language-"]:after {
|
||||||
|
bottom:14px;
|
||||||
|
-webkit-box-shadow:none;
|
||||||
|
-moz-box-shadow:none;
|
||||||
|
box-shadow:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Plugin styles */
|
||||||
|
.token.tab:not(:empty):before,
|
||||||
|
.token.cr:before,
|
||||||
|
.token.lf:before {
|
||||||
|
color: #e0d7d1;
|
||||||
|
}
|
||||||
|
|
8
library/jRange/demo/prism/prism.js
Normal file
8
library/jRange/demo/prism/prism.js
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
/* http://prismjs.com/download.html?themes=prism-coy&languages=markup+css+css-extras+clike+javascript */
|
||||||
|
var self=typeof window!="undefined"?window:{},Prism=function(){var e=/\blang(?:uage)?-(?!\*)(\w+)\b/i,t=self.Prism={util:{encode:function(e){return e instanceof n?new n(e.type,t.util.encode(e.content)):t.util.type(e)==="Array"?e.map(t.util.encode):e.replace(/&/g,"&").replace(/</g,"<").replace(/\u00a0/g," ")},type:function(e){return Object.prototype.toString.call(e).match(/\[object (\w+)\]/)[1]},clone:function(e){var n=t.util.type(e);switch(n){case"Object":var r={};for(var i in e)e.hasOwnProperty(i)&&(r[i]=t.util.clone(e[i]));return r;case"Array":return e.slice()}return e}},languages:{extend:function(e,n){var r=t.util.clone(t.languages[e]);for(var i in n)r[i]=n[i];return r},insertBefore:function(e,n,r,i){i=i||t.languages;var s=i[e],o={};for(var u in s)if(s.hasOwnProperty(u)){if(u==n)for(var a in r)r.hasOwnProperty(a)&&(o[a]=r[a]);o[u]=s[u]}return i[e]=o},DFS:function(e,n){for(var r in e){n.call(e,r,e[r]);t.util.type(e)==="Object"&&t.languages.DFS(e[r],n)}}},highlightAll:function(e,n){var r=document.querySelectorAll('code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code');for(var i=0,s;s=r[i++];)t.highlightElement(s,e===!0,n)},highlightElement:function(r,i,s){var o,u,a=r;while(a&&!e.test(a.className))a=a.parentNode;if(a){o=(a.className.match(e)||[,""])[1];u=t.languages[o]}if(!u)return;r.className=r.className.replace(e,"").replace(/\s+/g," ")+" language-"+o;a=r.parentNode;/pre/i.test(a.nodeName)&&(a.className=a.className.replace(e,"").replace(/\s+/g," ")+" language-"+o);var f=r.textContent;if(!f)return;var l={element:r,language:o,grammar:u,code:f};t.hooks.run("before-highlight",l);if(i&&self.Worker){var c=new Worker(t.filename);c.onmessage=function(e){l.highlightedCode=n.stringify(JSON.parse(e.data),o);t.hooks.run("before-insert",l);l.element.innerHTML=l.highlightedCode;s&&s.call(l.element);t.hooks.run("after-highlight",l)};c.postMessage(JSON.stringify({language:l.language,code:l.code}))}else{l.highlightedCode=t.highlight(l.code,l.grammar,l.language);t.hooks.run("before-insert",l);l.element.innerHTML=l.highlightedCode;s&&s.call(r);t.hooks.run("after-highlight",l)}},highlight:function(e,r,i){var s=t.tokenize(e,r);return n.stringify(t.util.encode(s),i)},tokenize:function(e,n,r){var i=t.Token,s=[e],o=n.rest;if(o){for(var u in o)n[u]=o[u];delete n.rest}e:for(var u in n){if(!n.hasOwnProperty(u)||!n[u])continue;var a=n[u],f=a.inside,l=!!a.lookbehind,c=0;a=a.pattern||a;for(var h=0;h<s.length;h++){var p=s[h];if(s.length>e.length)break e;if(p instanceof i)continue;a.lastIndex=0;var d=a.exec(p);if(d){l&&(c=d[1].length);var v=d.index-1+c,d=d[0].slice(c),m=d.length,g=v+m,y=p.slice(0,v+1),b=p.slice(g+1),w=[h,1];y&&w.push(y);var E=new i(u,f?t.tokenize(d,f):d);w.push(E);b&&w.push(b);Array.prototype.splice.apply(s,w)}}}return s},hooks:{all:{},add:function(e,n){var r=t.hooks.all;r[e]=r[e]||[];r[e].push(n)},run:function(e,n){var r=t.hooks.all[e];if(!r||!r.length)return;for(var i=0,s;s=r[i++];)s(n)}}},n=t.Token=function(e,t){this.type=e;this.content=t};n.stringify=function(e,r,i){if(typeof e=="string")return e;if(Object.prototype.toString.call(e)=="[object Array]")return e.map(function(t){return n.stringify(t,r,e)}).join("");var s={type:e.type,content:n.stringify(e.content,r,i),tag:"span",classes:["token",e.type],attributes:{},language:r,parent:i};s.type=="comment"&&(s.attributes.spellcheck="true");t.hooks.run("wrap",s);var o="";for(var u in s.attributes)o+=u+'="'+(s.attributes[u]||"")+'"';return"<"+s.tag+' class="'+s.classes.join(" ")+'" '+o+">"+s.content+"</"+s.tag+">"};if(!self.document){if(!self.addEventListener)return self.Prism;self.addEventListener("message",function(e){var n=JSON.parse(e.data),r=n.language,i=n.code;self.postMessage(JSON.stringify(t.tokenize(i,t.languages[r])));self.close()},!1);return self.Prism}var r=document.getElementsByTagName("script");r=r[r.length-1];if(r){t.filename=r.src;document.addEventListener&&!r.hasAttribute("data-manual")&&document.addEventListener("DOMContentLoaded",t.highlightAll)}return self.Prism}();typeof module!="undefined"&&module.exports&&(module.exports=Prism);;
|
||||||
|
Prism.languages.markup={comment:/<!--[\w\W]*?-->/g,prolog:/<\?.+?\?>/,doctype:/<!DOCTYPE.+?>/,cdata:/<!\[CDATA\[[\w\W]*?]]>/i,tag:{pattern:/<\/?[\w:-]+\s*(?:\s+[\w:-]+(?:=(?:("|')(\\?[\w\W])*?\1|[^\s'">=]+))?\s*)*\/?>/gi,inside:{tag:{pattern:/^<\/?[\w:-]+/i,inside:{punctuation:/^<\/?/,namespace:/^[\w-]+?:/}},"attr-value":{pattern:/=(?:('|")[\w\W]*?(\1)|[^\s>]+)/gi,inside:{punctuation:/=|>|"/g}},punctuation:/\/?>/g,"attr-name":{pattern:/[\w:-]+/g,inside:{namespace:/^[\w-]+?:/}}}},entity:/\&#?[\da-z]{1,8};/gi};Prism.hooks.add("wrap",function(e){e.type==="entity"&&(e.attributes.title=e.content.replace(/&/,"&"))});;
|
||||||
|
Prism.languages.css={comment:/\/\*[\w\W]*?\*\//g,atrule:{pattern:/@[\w-]+?.*?(;|(?=\s*{))/gi,inside:{punctuation:/[;:]/g}},url:/url\((["']?).*?\1\)/gi,selector:/[^\{\}\s][^\{\};]*(?=\s*\{)/g,property:/(\b|\B)[\w-]+(?=\s*:)/ig,string:/("|')(\\?.)*?\1/g,important:/\B!important\b/gi,punctuation:/[\{\};:]/g,"function":/[-a-z0-9]+(?=\()/ig};Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{style:{pattern:/<style[\w\W]*?>[\w\W]*?<\/style>/ig,inside:{tag:{pattern:/<style[\w\W]*?>|<\/style>/ig,inside:Prism.languages.markup.tag.inside},rest:Prism.languages.css}}});;
|
||||||
|
Prism.languages.css.selector={pattern:/[^\{\}\s][^\{\}]*(?=\s*\{)/g,inside:{"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/g,"pseudo-class":/:[-\w]+(?:\(.*\))?/g,"class":/\.[-:\.\w]+/g,id:/#[-:\.\w]+/g}};Prism.languages.insertBefore("css","ignore",{hexcode:/#[\da-f]{3,6}/gi,entity:/\\[\da-f]{1,8}/gi,number:/[\d%\.]+/g});;
|
||||||
|
Prism.languages.clike={comment:{pattern:/(^|[^\\])(\/\*[\w\W]*?\*\/|(^|[^:])\/\/.*?(\r?\n|$))/g,lookbehind:!0},string:/("|')(\\?.)*?\1/g,"class-name":{pattern:/((?:(?:class|interface|extends|implements|trait|instanceof|new)\s+)|(?:catch\s+\())[a-z0-9_\.\\]+/ig,lookbehind:!0,inside:{punctuation:/(\.|\\)/}},keyword:/\b(if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/g,"boolean":/\b(true|false)\b/g,"function":{pattern:/[a-z0-9_]+\(/ig,inside:{punctuation:/\(/}},number:/\b-?(0x[\dA-Fa-f]+|\d*\.?\d+([Ee]-?\d+)?)\b/g,operator:/[-+]{1,2}|!|<=?|>=?|={1,3}|&{1,2}|\|?\||\?|\*|\/|\~|\^|\%/g,ignore:/&(lt|gt|amp);/gi,punctuation:/[{}[\];(),.:]/g};;
|
||||||
|
Prism.languages.javascript=Prism.languages.extend("clike",{keyword:/\b(break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|false|finally|for|function|get|if|implements|import|in|instanceof|interface|let|new|null|package|private|protected|public|return|set|static|super|switch|this|throw|true|try|typeof|var|void|while|with|yield)\b/g,number:/\b-?(0x[\dA-Fa-f]+|\d*\.?\d+([Ee]-?\d+)?|NaN|-?Infinity)\b/g});Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/(^|[^/])\/(?!\/)(\[.+?]|\\.|[^/\r\n])+\/[gim]{0,3}(?=\s*($|[\r\n,.;})]))/g,lookbehind:!0}});Prism.languages.markup&&Prism.languages.insertBefore("markup","tag",{script:{pattern:/<script[\w\W]*?>[\w\W]*?<\/script>/ig,inside:{tag:{pattern:/<script[\w\W]*?>|<\/script>/ig,inside:Prism.languages.markup.tag.inside},rest:Prism.languages.javascript}}});
|
||||||
|
;
|
1
library/jRange/jquery.range-min.js
vendored
Normal file
1
library/jRange/jquery.range-min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
168
library/jRange/jquery.range.css
Normal file
168
library/jRange/jquery.range.css
Normal file
|
@ -0,0 +1,168 @@
|
||||||
|
.slider-container {
|
||||||
|
width: 300px;
|
||||||
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
|
}
|
||||||
|
.slider-container .back-bar {
|
||||||
|
height: 10px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.slider-container .back-bar .selected-bar {
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.slider-container .back-bar .pointer {
|
||||||
|
position: absolute;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
background-color: red;
|
||||||
|
cursor: move;
|
||||||
|
opacity: 1;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.slider-container .back-bar .pointer-label {
|
||||||
|
position: absolute;
|
||||||
|
top: -17px;
|
||||||
|
font-size: 8px;
|
||||||
|
background: white;
|
||||||
|
white-space: nowrap;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
.slider-container .back-bar .focused {
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
.slider-container .clickable-dummy {
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.slider-container .scale {
|
||||||
|
top: 2px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.slider-container .scale span {
|
||||||
|
position: absolute;
|
||||||
|
height: 5px;
|
||||||
|
border-left: 1px solid #999;
|
||||||
|
font-size: 0;
|
||||||
|
}
|
||||||
|
.slider-container .scale ins {
|
||||||
|
font-size: 9px;
|
||||||
|
text-decoration: none;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 5px;
|
||||||
|
color: #999;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
.theme-green .back-bar {
|
||||||
|
height: 5px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #eeeeee;
|
||||||
|
background-color: #e7e7e7;
|
||||||
|
background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
|
||||||
|
background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
|
||||||
|
}
|
||||||
|
.theme-green .back-bar .selected-bar {
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #a1fad0;
|
||||||
|
background-image: -moz-linear-gradient(top, #bdfade, #76fabc);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bdfade), to(#76fabc));
|
||||||
|
background-image: -webkit-linear-gradient(top, #bdfade, #76fabc);
|
||||||
|
background-image: -o-linear-gradient(top, #bdfade, #76fabc);
|
||||||
|
background-image: linear-gradient(to bottom, #bdfade, #76fabc);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbdfade', endColorstr='#ff76fabc', GradientType=0);
|
||||||
|
}
|
||||||
|
.theme-green .back-bar .pointer {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
top: -5px;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid #AAA;
|
||||||
|
background-color: #e7e7e7;
|
||||||
|
background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
|
||||||
|
background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
|
||||||
|
cursor: col-resize;
|
||||||
|
}
|
||||||
|
.theme-green .back-bar .pointer-label {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.theme-green .back-bar .focused {
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.theme-green .scale span {
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
.theme-green .scale ins {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.theme-blue .back-bar {
|
||||||
|
height: 5px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #eeeeee;
|
||||||
|
background-color: #e7e7e7;
|
||||||
|
background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
|
||||||
|
background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
|
||||||
|
}
|
||||||
|
.theme-blue .back-bar .selected-bar {
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #92c1f9;
|
||||||
|
background-image: -moz-linear-gradient(top, #b1d1f9, #64a8f9);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b1d1f9), to(#64a8f9));
|
||||||
|
background-image: -webkit-linear-gradient(top, #b1d1f9, #64a8f9);
|
||||||
|
background-image: -o-linear-gradient(top, #b1d1f9, #64a8f9);
|
||||||
|
background-image: linear-gradient(to bottom, #b1d1f9, #64a8f9);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb1d1f9', endColorstr='#ff64a8f9', GradientType=0);
|
||||||
|
}
|
||||||
|
.theme-blue .back-bar .pointer {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
top: -5px;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid #AAA;
|
||||||
|
background-color: #e7e7e7;
|
||||||
|
background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
|
||||||
|
background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
|
||||||
|
background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
|
||||||
|
cursor: col-resize;
|
||||||
|
}
|
||||||
|
.theme-blue .back-bar .pointer-label {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.theme-blue .back-bar .focused {
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.theme-blue .scale span {
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
.theme-blue .scale ins {
|
||||||
|
color: #999;
|
||||||
|
}
|
297
library/jRange/jquery.range.js
Normal file
297
library/jRange/jquery.range.js
Normal file
|
@ -0,0 +1,297 @@
|
||||||
|
/*jshint multistr:true, curly: false */
|
||||||
|
/*global jQuery:false, define: false */
|
||||||
|
/**
|
||||||
|
* jRange - Awesome range control
|
||||||
|
*
|
||||||
|
* Written by
|
||||||
|
* ----------
|
||||||
|
* Nitin Hayaran (nitinhayaran@gmail.com)
|
||||||
|
*
|
||||||
|
* Licensed under the MIT (MIT-LICENSE.txt).
|
||||||
|
*
|
||||||
|
* @author Nitin Hayaran
|
||||||
|
* @version 0.1-RELEASE
|
||||||
|
*
|
||||||
|
* Dependencies
|
||||||
|
* ------------
|
||||||
|
* jQuery (http://jquery.com)
|
||||||
|
*
|
||||||
|
**/
|
||||||
|
;
|
||||||
|
(function($, window, document, undefined) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var jRange = function(){
|
||||||
|
return this.init.apply(this, arguments);
|
||||||
|
};
|
||||||
|
jRange.prototype = {
|
||||||
|
defaults : {
|
||||||
|
onstatechange : function(){},
|
||||||
|
isRange : false,
|
||||||
|
showLabels : true,
|
||||||
|
showScale : true,
|
||||||
|
step : 1,
|
||||||
|
format: '%s',
|
||||||
|
theme : 'theme-green',
|
||||||
|
width : 300
|
||||||
|
},
|
||||||
|
template : '<div class="slider-container">\
|
||||||
|
<div class="back-bar">\
|
||||||
|
<div class="selected-bar"></div>\
|
||||||
|
<div class="pointer low"></div><div class="pointer-label">123456</div>\
|
||||||
|
<div class="pointer high"></div><div class="pointer-label">456789</div>\
|
||||||
|
<div class="clickable-dummy"></div>\
|
||||||
|
</div>\
|
||||||
|
<div class="scale"></div>\
|
||||||
|
</div>',
|
||||||
|
init : function(node, options){
|
||||||
|
this.options = $.extend({}, this.defaults, options);
|
||||||
|
this.inputNode = $(node);
|
||||||
|
this.options.value = this.inputNode.val() || (this.options.isRange ? this.options.from+','+this.options.from : this.options.from);
|
||||||
|
this.domNode = $(this.template);
|
||||||
|
this.domNode.addClass(this.options.theme);
|
||||||
|
this.inputNode.after(this.domNode);
|
||||||
|
this.domNode.on('change', this.onChange);
|
||||||
|
this.pointers = $('.pointer', this.domNode);
|
||||||
|
this.lowPointer = this.pointers.first();
|
||||||
|
this.highPointer = this.pointers.last();
|
||||||
|
this.labels = $('.pointer-label', this.domNode);
|
||||||
|
this.lowLabel = this.labels.first();
|
||||||
|
this.highLabel = this.labels.last();
|
||||||
|
this.scale = $('.scale', this.domNode);
|
||||||
|
this.bar = $('.selected-bar', this.domNode);
|
||||||
|
this.clickableBar = this.domNode.find('.clickable-dummy');
|
||||||
|
this.interval = this.options.to - this.options.from;
|
||||||
|
this.render();
|
||||||
|
},
|
||||||
|
render: function(){
|
||||||
|
// Check if inputNode is visible, and have some width, so that we can set slider width accordingly.
|
||||||
|
if( this.inputNode.width() === 0 && !this.options.width ){
|
||||||
|
console.log('jRange : no width found, returning');
|
||||||
|
return;
|
||||||
|
}else{
|
||||||
|
this.domNode.width( this.options.width || this.inputNode.width() );
|
||||||
|
this.inputNode.hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
if(this.isSingle()){
|
||||||
|
this.lowPointer.hide();
|
||||||
|
this.lowLabel.hide();
|
||||||
|
}
|
||||||
|
if(!this.options.showLabels){
|
||||||
|
this.labels.hide();
|
||||||
|
}
|
||||||
|
this.attachEvents();
|
||||||
|
if(this.options.showScale){
|
||||||
|
this.renderScale();
|
||||||
|
}
|
||||||
|
this.setValue(this.options.value);
|
||||||
|
},
|
||||||
|
isSingle: function(){
|
||||||
|
if(typeof(this.options.value) === 'number'){
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return (this.options.value.indexOf(',') !== -1 || this.options.isRange) ?
|
||||||
|
false : true;
|
||||||
|
},
|
||||||
|
attachEvents: function(){
|
||||||
|
this.clickableBar.click($.proxy(this.barClicked, this));
|
||||||
|
this.pointers.mousedown($.proxy(this.onDragStart, this));
|
||||||
|
this.pointers.bind('dragstart', function(event) { event.preventDefault(); });
|
||||||
|
},
|
||||||
|
onDragStart: function(e){
|
||||||
|
if(e.which !== 1){return;}
|
||||||
|
e.stopPropagation(); e.preventDefault();
|
||||||
|
var pointer = $(e.target);
|
||||||
|
pointer.addClass('focused');
|
||||||
|
this[(pointer.hasClass('low')?'low':'high') + 'Label'].addClass('focused');
|
||||||
|
$(document).on('mousemove.slider', $.proxy(this.onDrag, this, pointer));
|
||||||
|
$(document).on('mouseup.slider', $.proxy(this.onDragEnd, this));
|
||||||
|
},
|
||||||
|
onDrag: function(pointer, e){
|
||||||
|
e.stopPropagation(); e.preventDefault();
|
||||||
|
var position = e.clientX - this.domNode.offset().left;
|
||||||
|
this.domNode.trigger('change', [this, pointer, position]);
|
||||||
|
},
|
||||||
|
onDragEnd: function(){
|
||||||
|
this.pointers.removeClass('focused');
|
||||||
|
this.labels.removeClass('focused');
|
||||||
|
$(document).off('.slider');
|
||||||
|
$(document).off('.slider');
|
||||||
|
},
|
||||||
|
barClicked: function(e){
|
||||||
|
var x = e.pageX - this.clickableBar.offset().left;
|
||||||
|
if(this.isSingle())
|
||||||
|
this.setPosition(this.pointers.last(), x, true, true);
|
||||||
|
else{
|
||||||
|
var pointer = Math.abs(parseInt(this.pointers.first().css('left'), 10) - x + this.pointers.first().width() / 2) < Math.abs(parseInt(this.pointers.last().css('left'), 10) - x + this.pointers.first().width() / 2) ?
|
||||||
|
this.pointers.first() : this.pointers.last();
|
||||||
|
this.setPosition(pointer, x, true, true);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onChange: function(e, self, pointer, position){
|
||||||
|
var min, max;
|
||||||
|
if(self.isSingle()){
|
||||||
|
min = 0;
|
||||||
|
max = self.domNode.width();
|
||||||
|
}else{
|
||||||
|
min = pointer.hasClass('high')? self.lowPointer.position().left + self.lowPointer.width() / 2 : 0;
|
||||||
|
max = pointer.hasClass('low') ? self.highPointer.position().left + self.highPointer.width() / 2 : self.domNode.width();
|
||||||
|
}
|
||||||
|
var value = Math.min(Math.max(position, min), max);
|
||||||
|
self.setPosition(pointer, value, true);
|
||||||
|
},
|
||||||
|
setPosition: function(pointer, position, isPx, animate){
|
||||||
|
var leftPos,
|
||||||
|
lowPos = this.lowPointer.position().left,
|
||||||
|
highPos = this.highPointer.position().left,
|
||||||
|
circleWidth = this.highPointer.width() / 2;
|
||||||
|
if(!isPx){
|
||||||
|
position = this.prcToPx(position);
|
||||||
|
}
|
||||||
|
if(pointer[0] === this.highPointer[0]){
|
||||||
|
highPos = Math.round(position - circleWidth);
|
||||||
|
}else{
|
||||||
|
lowPos = Math.round(position - circleWidth);
|
||||||
|
}
|
||||||
|
pointer[animate?'animate':'css']({'left': Math.round(position - circleWidth)});
|
||||||
|
if(this.isSingle()){
|
||||||
|
leftPos = 0;
|
||||||
|
}else{
|
||||||
|
leftPos = lowPos + circleWidth;
|
||||||
|
}
|
||||||
|
this.bar[animate?'animate':'css']({
|
||||||
|
'width' : Math.round(highPos + circleWidth - leftPos),
|
||||||
|
'left' : leftPos
|
||||||
|
});
|
||||||
|
this.showPointerValue(pointer, position, animate);
|
||||||
|
},
|
||||||
|
// will be called from outside
|
||||||
|
setValue: function(value){
|
||||||
|
var values = value.toString().split(',');
|
||||||
|
this.options.value = value;
|
||||||
|
var prc = this.valuesToPrc( values.length === 2 ? values : [0, values[0]] );
|
||||||
|
if(this.isSingle()){
|
||||||
|
this.setPosition(this.highPointer, prc[1]);
|
||||||
|
}else{
|
||||||
|
this.setPosition(this.lowPointer, prc[0]);
|
||||||
|
this.setPosition(this.highPointer, prc[1]);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
renderScale: function(){
|
||||||
|
var s = this.options.scale || [this.options.from, this.options.to];
|
||||||
|
var prc = Math.round((100 / (s.length - 1)) * 10) / 10;
|
||||||
|
var str = '';
|
||||||
|
for(var i = 0; i < s.length ; i++ ){
|
||||||
|
str += '<span style="left: ' + i * prc + '%">' + (s[i] != '|' ? '<ins>' + s[i] + '</ins>' : '') + '</span>';
|
||||||
|
}
|
||||||
|
this.scale.html(str);
|
||||||
|
|
||||||
|
$('ins', this.scale).each(function () {
|
||||||
|
$(this).css({
|
||||||
|
marginLeft: -$(this).outerWidth() / 2
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getBarWidth: function(){
|
||||||
|
var values = this.options.value.split(',');
|
||||||
|
if(values.length > 1){
|
||||||
|
return parseInt(values[1], 10) - parseInt(values[0], 10);
|
||||||
|
}else{
|
||||||
|
return parseInt(values[0], 10);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
showPointerValue: function(pointer, position, animate){
|
||||||
|
var label = $('.pointer-label', this.domNode)[pointer.hasClass('low')?'first':'last']();
|
||||||
|
var text;
|
||||||
|
var value = this.positionToValue(position);
|
||||||
|
if($.isFunction(this.options.format)){
|
||||||
|
var type = this.isSingle() ? undefined : (pointer.hasClass('low') ? 'low':'high');
|
||||||
|
text = this.options.format(value, type);
|
||||||
|
}else{
|
||||||
|
text = this.options.format.replace('%s', value);
|
||||||
|
}
|
||||||
|
|
||||||
|
var width = label.html(text).width(),
|
||||||
|
left = position - width / 2;
|
||||||
|
left = Math.min(Math.max(left, 0), this.options.width - width);
|
||||||
|
label[animate?'animate':'css']({left: left});
|
||||||
|
this.setInputValue(pointer, value);
|
||||||
|
},
|
||||||
|
valuesToPrc: function(values){
|
||||||
|
var lowPrc = ( ( values[0] - this.options.from ) * 100 / this.interval ),
|
||||||
|
highPrc = ( ( values[1] - this.options.from ) * 100 / this.interval );
|
||||||
|
return [lowPrc, highPrc];
|
||||||
|
},
|
||||||
|
prcToPx: function(prc){
|
||||||
|
return (this.domNode.width() * prc) / 100;
|
||||||
|
},
|
||||||
|
positionToValue: function(pos){
|
||||||
|
var value = (pos / this.domNode.width()) * this.interval;
|
||||||
|
value = value + this.options.from;
|
||||||
|
return Math.round(value / this.options.step) * this.options.step;
|
||||||
|
},
|
||||||
|
setInputValue: function(pointer, v){
|
||||||
|
// if(!isChanged) return;
|
||||||
|
if(this.isSingle()){
|
||||||
|
this.options.value = v.toString();
|
||||||
|
}else{
|
||||||
|
var values = this.options.value.split(',');
|
||||||
|
if(pointer.hasClass('low')){
|
||||||
|
this.options.value = v + ',' + values[1];
|
||||||
|
}else{
|
||||||
|
this.options.value = values[0] + ',' + v;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if( this.inputNode.val() !== this.options.value ){
|
||||||
|
this.inputNode.val(this.options.value);
|
||||||
|
this.options.onstatechange.call(this, this.options.value);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getValue: function(){
|
||||||
|
return this.options.value;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
/*$.jRange = function (node, options) {
|
||||||
|
var jNode = $(node);
|
||||||
|
if(!jNode.data('jrange')){
|
||||||
|
jNode.data('jrange', new jRange(node, options));
|
||||||
|
}
|
||||||
|
return jNode.data('jrange');
|
||||||
|
};
|
||||||
|
|
||||||
|
$.fn.jRange = function (options) {
|
||||||
|
return this.each(function(){
|
||||||
|
$.jRange(this, options);
|
||||||
|
});
|
||||||
|
};*/
|
||||||
|
|
||||||
|
var pluginName = 'jRange';
|
||||||
|
// A really lightweight plugin wrapper around the constructor,
|
||||||
|
// preventing against multiple instantiations
|
||||||
|
$.fn[pluginName] = function(option) {
|
||||||
|
var args = arguments,
|
||||||
|
result;
|
||||||
|
|
||||||
|
this.each(function() {
|
||||||
|
var $this = $(this),
|
||||||
|
data = $.data(this, 'plugin_' + pluginName),
|
||||||
|
options = typeof option === 'object' && option;
|
||||||
|
if (!data) {
|
||||||
|
$this.data('plugin_' + pluginName, (data = new jRange(this, options)));
|
||||||
|
}
|
||||||
|
// if first argument is a string, call silimarly named function
|
||||||
|
// this gives flexibility to call functions of the plugin e.g.
|
||||||
|
// - $('.dial').plugin('destroy');
|
||||||
|
// - $('.dial').plugin('render', $('.new-child'));
|
||||||
|
if (typeof option === 'string') {
|
||||||
|
result = data[option].apply(data, Array.prototype.slice.call(args, 1));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// To enable plugin returns values
|
||||||
|
return result || this;
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery, window, document);
|
192
library/jRange/jquery.range.less
Normal file
192
library/jRange/jquery.range.less
Normal file
|
@ -0,0 +1,192 @@
|
||||||
|
#gradient {
|
||||||
|
.horizontal(@startColor: #555, @endColor: #333) {
|
||||||
|
background-color: @endColor;
|
||||||
|
background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
|
||||||
|
background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||||
|
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
|
||||||
|
background-image: linear-gradient(to right, @startColor, @endColor); // Standard, IE10
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down
|
||||||
|
}
|
||||||
|
.vertical(@startColor: #555, @endColor: #333) {
|
||||||
|
background-color: mix(@startColor, @endColor, 60%);
|
||||||
|
background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+
|
||||||
|
background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||||
|
background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10
|
||||||
|
background-image: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down
|
||||||
|
}
|
||||||
|
.directional(@startColor: #555, @endColor: #333, @deg: 45deg) {
|
||||||
|
background-color: @endColor;
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+
|
||||||
|
background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+
|
||||||
|
background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10
|
||||||
|
background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10
|
||||||
|
}
|
||||||
|
.vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) {
|
||||||
|
background-color: mix(@midColor, @endColor, 80%);
|
||||||
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor));
|
||||||
|
background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||||
|
background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor);
|
||||||
|
background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||||
|
background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback
|
||||||
|
}
|
||||||
|
.radial(@innerColor: #555, @outerColor: #333) {
|
||||||
|
background-color: @outerColor;
|
||||||
|
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor));
|
||||||
|
background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor);
|
||||||
|
background-image: -moz-radial-gradient(circle, @innerColor, @outerColor);
|
||||||
|
background-image: -o-radial-gradient(circle, @innerColor, @outerColor);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
.striped(@color: #555, @angle: 45deg) {
|
||||||
|
background-color: @color;
|
||||||
|
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
|
||||||
|
background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||||
|
background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||||
|
background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||||
|
background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider-container {
|
||||||
|
width: 300px;
|
||||||
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
|
.back-bar {
|
||||||
|
height: 10px;
|
||||||
|
position: relative;
|
||||||
|
.selected-bar {
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.pointer {
|
||||||
|
position: absolute;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
background-color: red;
|
||||||
|
cursor: move;
|
||||||
|
opacity: 1;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.pointer-label {
|
||||||
|
position: absolute;
|
||||||
|
top: -17px;
|
||||||
|
font-size: 8px;
|
||||||
|
background: white;
|
||||||
|
white-space: nowrap;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
.focused {
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.clickable-dummy {
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.scale {
|
||||||
|
top: 2px;
|
||||||
|
position: relative;
|
||||||
|
span {
|
||||||
|
position: absolute;
|
||||||
|
height: 5px;
|
||||||
|
border-left: 1px solid #999;
|
||||||
|
font-size: 0;
|
||||||
|
}
|
||||||
|
ins {
|
||||||
|
font-size: 9px;
|
||||||
|
text-decoration: none;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 5px;
|
||||||
|
color: #999;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.theme-green {
|
||||||
|
.back-bar {
|
||||||
|
height: 5px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #eeeeee;
|
||||||
|
#gradient > .vertical(#eeeeee, #dddddd);
|
||||||
|
.selected-bar {
|
||||||
|
border-radius: 2px;
|
||||||
|
#gradient > .vertical(#bdfade, #76fabc);
|
||||||
|
}
|
||||||
|
.pointer {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
top: -5px;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid #AAA;
|
||||||
|
#gradient > .vertical(#eeeeee, #dddddd);
|
||||||
|
cursor: col-resize;
|
||||||
|
}
|
||||||
|
.pointer-label {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.focused {
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.scale {
|
||||||
|
span {
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
ins {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-blue {
|
||||||
|
.back-bar {
|
||||||
|
height: 5px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #eeeeee;
|
||||||
|
#gradient > .vertical(#eeeeee, #dddddd);
|
||||||
|
.selected-bar {
|
||||||
|
border-radius: 2px;
|
||||||
|
#gradient > .vertical(#b1d1f9, #64a8f9);
|
||||||
|
}
|
||||||
|
.pointer {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
top: -5px;
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid #AAA;
|
||||||
|
#gradient > .vertical(#eeeeee, #dddddd);
|
||||||
|
cursor: col-resize;
|
||||||
|
}
|
||||||
|
.pointer-label {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.focused {
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.scale {
|
||||||
|
span {
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
ins {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -5,7 +5,7 @@ require_once('include/plugin.php');
|
||||||
head_add_css('library/fancybox/jquery.fancybox-1.3.4.css');
|
head_add_css('library/fancybox/jquery.fancybox-1.3.4.css');
|
||||||
head_add_css('library/tiptip/tipTip.css');
|
head_add_css('library/tiptip/tipTip.css');
|
||||||
head_add_css('library/jgrowl/jquery.jgrowl.css');
|
head_add_css('library/jgrowl/jquery.jgrowl.css');
|
||||||
head_add_css('library/jslider/css/jslider.css');
|
head_add_css('library/jRange/jquery.range.css');
|
||||||
head_add_css('library/colorbox/colorbox.css');
|
head_add_css('library/colorbox/colorbox.css');
|
||||||
|
|
||||||
head_add_css('view/css/conversation.css');
|
head_add_css('view/css/conversation.css');
|
||||||
|
@ -39,7 +39,7 @@ head_add_js('acl.js');
|
||||||
head_add_js('webtoolkit.base64.js');
|
head_add_js('webtoolkit.base64.js');
|
||||||
head_add_js('main.js');
|
head_add_js('main.js');
|
||||||
head_add_js('crypto.js');
|
head_add_js('crypto.js');
|
||||||
head_add_js('library/jslider/bin/jquery.slider.min.js');
|
head_add_js('library/jRange/jquery.range.js');
|
||||||
head_add_js('docready.js');
|
head_add_js('docready.js');
|
||||||
head_add_js('library/colorbox/jquery.colorbox-min.js');
|
head_add_js('library/colorbox/jquery.colorbox-min.js');
|
||||||
head_add_js('library/bootstrap-tagsinput/bootstrap-tagsinput.js');
|
head_add_js('library/bootstrap-tagsinput/bootstrap-tagsinput.js');
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div id="contact-slider" class="slider" style="height: 32px; position: relative; left: 5%; width: 90%;"><input id="contact-range" type="text" name="fake-closeness" value="{{$val}}" /></div>
|
<div id="contact-slider" class="slider" style="height: 32px; position: relative; left: 5%; width: 90%;"><input id="contact-range" type="text" name="fake-closeness" value="{{$val}}" /></div>
|
||||||
<script>
|
<script>
|
||||||
$("#contact-range").slider({ from: {{$min|default:'0'}}, to: 99, step: 1, scale: ['{{$me}}', '|', '{{$intimate}}', '|', '{{$friends}}', '|', '{{$oldfriends}}', '|', '{{$acquaintances}}', '|', '{{$world}}' ], onstatechange: function(v) { $("#contact-closeness-mirror").val(v); } });
|
$("#contact-range").jRange({ from: {{$min|default:'0'}}, to: 99, step: 1, scale: ['{{$me}}', '|', '{{$intimate}}', '|', '{{$friends}}', '|', '{{$oldfriends}}', '|', '{{$acquaintances}}', '|', '{{$world}}' ], width:'100%', showLabels: false, onstatechange: function(v) { $("#contact-closeness-mirror").val(v); } });
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -2,8 +2,8 @@
|
||||||
<script>
|
<script>
|
||||||
var old_cmin = 0;
|
var old_cmin = 0;
|
||||||
var old_cmax = 99;
|
var old_cmax = 99;
|
||||||
$("#main-range").slider({ from: 0, to: 99, step: 1, scale: ['{{$me}}', '|', '{{$intimate}}', '|', '{{$friends}}', '|', '{{$oldfriends}}', '|', '{{$acquaintances}}', '|', '{{$world}}' ], onstatechange: function(v) {
|
$("#main-range").jRange({ isRange: true, from: 0, to: 99, step: 1, scale: ['{{$me}}', '|', '{{$intimate}}', '|', '{{$friends}}', '|', '{{$oldfriends}}', '|', '{{$acquaintances}}', '|', '{{$world}}' ], width:'100%', showLabels: false, onstatechange: function(v) {
|
||||||
var carr = v.split(";");
|
var carr = v.split(",");
|
||||||
if(carr[0] != bParam_cmin) {
|
if(carr[0] != bParam_cmin) {
|
||||||
old_cmin = bParam_cmin;
|
old_cmin = bParam_cmin;
|
||||||
bParam_cmin = carr[0];
|
bParam_cmin = carr[0];
|
||||||
|
|
Loading…
Reference in a new issue