Skip to content
Snippets Groups Projects
Commit a915e542 authored by Kawtar Laariche's avatar Kawtar Laariche
Browse files

#26: add bootstrap-star-rating folder

parent 6d52b22a
No related branches found
No related tags found
1 merge request!15Feautres/design studio
Showing
with 1864 additions and 0 deletions
Change Log: `bootstrap-star-rating`
===================================
## Version 4.0.2
**Date:** 03-Jul-2016
1. (enh #108): Add French Translations.
2. (enh #115): Add Romanian Translations.
3. (enh #122): Add Spanish Translations.
4. (enh #123): Add Italian Translations.
5. (enh #124): Add License Headers.
6. (enh #127): Add Chinese Translations.
7. (enh #130): Better management of themes and locales.
## Version 4.0.1
**Date:** 28-Feb-2016
1. (bug #99): Correct documentation for refresh method.
2. (bug #100): Correct caption and clear rendering methods.
3. (bug #101): Correct caption setting when `showCaption` is `false`.
4. (bug #102): Revamp generation of rating via `refresh` method.
5. (enh #103): Implement method chaining and revamp private methods
- enhance public methods like `create`, `destroy`, `refresh`, `clear`, `reset` to return the rating element jQuery object
6. Update package.json to include `peerDependencies` instead of `dependencies`.
## Version 4.0.0
**Date:** 16-Feb-2016
1. (enh #91): Add SVG Icon Support
2. (enh #94): Add Theming Functionality.
- New property `theme` will assign a CSS class with the `rating-<theme-name>` to the rating container.
- Themes included
- The default (blank) theme (for displaying bootstrap glyphicons)
- `krajee-svg` (for displaying svg icons)
- `krajee-uni` (for displaying unicode symbols as stars)
- `krajee-fa` (for displaying font awesome icons)
- Add ability to override and add one's own themes
**Various new features and BC breaking enhancements**
- **REMOVED**: `symbol`, `glyphicon`, `ratingClass` properties will be removed.
- The requirement for the above will be replaced with the `theme` property (and can also be implemented using the `containerClass` property).
- Stars now have a better padding and spacing that can be configured via CSS and themes
- New property `filledStar` - will allow one to set the markup for `filledStar` - will default to
- `<i class="glyphicon glyphicon-star"></i>`
- New property `emptyStar` - will allow one to set the markup for `emptyStar` - will default to
- `<i class="glyphicon glyphicon-star-empty"></i>`
- Exclusive support for SVG (and a prebuilt `krajee-svg` theme that contains two different ready to use SVG icons).
3. (enh #95): Add display only capability.
4. (enh #96): Add support for `bootstrap-sass` official repo via `sass` branch.
5. (enh #97): Add `animate` property to enable / disable animation of star highlight on hover / change.
## Version 3.5.8
**Date:** 16-Feb-2016
1. (enh #88): Add German Translations.
2. (enh #89): Add Portugese Brazilian Translations.
3. (bug #90): Rename reserved word used as variable.
## Version 3.5.7
**Date:** 22-Jan-2016
1. (enh #84): Add Ukranian Translations.
2. (enh #86): Refactor code for listening events and deep extend options correctly.
## Version 3.5.6
**Date:** 29-Dec-2015
1. (enh #76): Add Russian Translations.
2. (bug #77): Correct `touches` and `changedTouches` validation.
3. (enh #81): Simplify README docs.
4. (enh #82): Added "main" key into NPM package.json.
## Version 3.5.5
**Date:** 22-Nov-2015
1. (enh #71): Fix `Error: Cannot read property 'pageX' of undefined` error on touch devices.
2. (enh #74): Universal Module Definition for use with CommonJS, AMD or browser globals.
3. (enh #75): Implement Locales and Translations.
## Version 3.5.4
**Date:** 20-Sep-2015
1. (enh #47): Styling enhancements for printed output (better star colors and hide clear button).
2. (enh #59): Remove `String.prototype.replaceAll` and implement regex replace.
3. (enh #63): Add `package.json` for npm install.
4. Update bootstrap bower version to support only 3.x variants.
## Version 3.5.3
**Date:** 18-Jun-2015
1. (enh #58): Remove redundant tooltip title on hover of caption element.
2. Fixes for composer.json dependencies.
## Version 3.5.2
**Date:** 10-May-2015
1. (enh #45): Validate on `touchstart` for devices that do not support `click` event.
2. (enh #46): More correct init of `clear` and `caption` elements.
## Version 3.5.1
**Date:** 13-Feb-2015
1. (enh #44): Ability to integrate with other font icon CSS frameworks like Font Awesome.
- New property `ratingClass` added to allow configuring other icon framework css classes.
2. Set copyright year to current.
## Version 3.5.0
**Date:** 31-Jan-2015
1. (enh #39): Prevent invalid star rating for numStars > 5 with default value & hoverChange enabled.
2. (enh #42): Code cleanup and restructure for JS lint changes (using JSHint Code cleanup library).
## Version 3.4.0
**Date:** 16-Dec-2014
1. (enh #35): Added `destroy` method to destroy the rating plugin.
2. (enh #36): Added `create` method to create the rating plugin (typically after a destroy).
## Version 3.3.0
**Date:** 17-Nov-2014
1. (bug #32): Prevent invalid star ratings if cursor is close to left/right edge of star array.
2. (enh #33): Enhance touch methods for compatibility across more wider mobile device browsers.
## Version 3.2.0
**Date:** 08-Nov-2014
1. Set release to stable in composer.json.
2. Updated CHANGE log to reflect user friendly date time formats.
## Version 3.1.0
**Date:** 27-Oct-2014
1. enh #26: Add touch device support to enable touch and slide across stars.
2. enh #27: Reset events on the rating element before every refresh.
3. enh #28: Add rating.refresh event.
## Version 3.0.0
**Date:** 13-Oct-2014
1. enh #20, #21: Included hover validation routine and rating state change on hover. Following new configurable properties added:
- `hoverEnabled`: _boolean_ whether hover functionality is enabled. This will dynamically change the stars and caption on mouse hover. Defaults to `true`. This functionality will only work on desktop devices and if the input is not `disabled` or `readonly`.
- `hoverChangeCaption`: _boolean_ control whether the caption should dynamically change on mouse hover. Defaults to `true`. Will be applicable only if `hoverEnabled` is `true`.
- `hoverChangeStars`: _boolean_ control whether the stars should dynamically change on mouse hover. Defaults to `true`. Will be applicable only if `hoverEnabled` is `true`.
2. enh #21: Following new events are added:
- `rating.hover`
- `rating.hoverleave`
3. enh #22: More correct minimum value and clear value validation through new `getWidthFromValue` method.
4. enh #24: Set `clearValue` to default to `min` if not set.
## Version 2.6.0
**Date:** 23-Aug-2014
1. enh #17: Dynamic configuration for `starCaptions` and `starCaptionClasses` using a function.
## Version 2.5.0
**Date:** 27-May-2014
1. Change to entire plugin code to eliminate dependency of HTML5 input. Plugin size reduced to 8KB minified.
2. Uses special JQuery routines to trigger star rating changes.
3. Plugin support is now extended to all browsers including pre IE10
4. Plugin support is now extended to all Touch based and mobile devices like iOS, Android.
5. Removed cloning of inputs to allow better refreshing of input across ajax and other scenarios.
6. Caption and Clear elements parameters treated as identifiers rather than JQuery object elements.
## Version 2.1.0
**Date:** 08-May-2014
1. Bug #8,#9,#10: Correct cloning and con## Version of field to a range slider input.
## Version 2.0.0
**Date:** 25-Apr-2014
1. Revamp of entire plugin code. Cleverly leverages CSS3 styles, animations, and HTML5 input features
to render the plugin.
2. Render and display fractional star ratings. Configure number of stars, min, max, step, and theoretically
support any fractional rating.
3. Right to left (RTL) support enhancement. Optimally uses the `dir` attribute of the range input.
4. Bootstrap style is made optional and configurable. Can override CSS to use any style.
5. Any star symbol (unicode or icon font) can be embedded instead of Glyphicon.
6. Uses HTML 5 range input to change ratings. Polyfills for range input in case JQuery/Javascript is disabled.
7. Automatically degrades to a normal SELECT dropdown input for browsers that do not support
HTML 5 range input.
## Version 1.2.0
**Date:** 04-Apr-2014
1. Widget is customizable for using any CSS markup to override Bootstrap styles.
2. Clear button class customization added.
## Version 1.1.0
**Date:** 10-Mar-2014
Revamped the methods for usage across wider scenarios:
1. Included `update` method to set a value of a rating via javascript.
2. Revamped the `refresh` method to enable refreshing all plugin options at runtime via parameters.
## Version 1.0.0
**Date:** 01-Oct-2013
Initial release. The following features are included in this release:
1. Convert any HTML input to a star rating control. Recommended input is of `type = number`, which will help fallback to a number input for browsers not supporting JQuery or Javascript.
2. The plugin automatically converts an input with `type = number` to a star rating control if you set its `class = rating`. All options to the input can be passed as HTML5 `data` attributes.
3. Involves pure CSS3 styling of the stars. Say goodbye to image sprites or playing with image backgrounds. Offers clean scalable vector icons for consistent display across devices.
4. Specifically uses Bootstrap 3.x styles & glyphs. Can be combined to work better for Bootstrap styled projects (or input group addons).
5. Ability to clear values and options for the stars. Control where the clear button element can be shown.
6. Reset star rating to the initial value when the form is reset.
7. Ability to control and display caption of the selected stars. Each rated star can have its own caption. Control where the caption element can be shown.
8. Ability to size the rating control including the stars, caption, and clear button. Five prebuilt size templates are available `xl`, `lg`, `md`, `sm`, and `xs`.
9. Support for RIGHT TO LEFT (RTL) input. Automatically changes star styling for RTL.
10. Triggers JQuery events for advanced development. Events currently available are `rating.change`, `rating.clear`, and `rating.reset`.
11. Disabled and readonly input star rating support.
12. Size of the entire plugin is less than 9KB (about 6KB for the minified JS and 3KB for the minified CSS).
\ No newline at end of file
Copyright (c) 2013 - 2016, Kartik Visweswaran
Krajee.com
All rights reserved.
Redistribution and use in source and binary forms, with or without modification,
are permitted provided that the following conditions are met:
* Redistributions of source code must retain the above copyright notice, this
list of conditions and the following disclaimer.
* Redistributions in binary form must reproduce the above copyright notice, this
list of conditions and the following disclaimer in the documentation and/or
other materials provided with the distribution.
* Neither the names of Kartik Visweswaran or Krajee nor the names of its
contributors may be used to endorse or promote products derived from
this software without specific prior written permission.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
\ No newline at end of file
{
"name": "bootstrap-star-rating",
"version": "4.0.2",
"homepage": "https://github.com/kartik-v/bootstrap-star-rating",
"authors": [
"Kartik Visweswaran <kartikv2@gmail.com>"
],
"description": "A simple yet powerful JQuery star rating plugin for Bootstrap.",
"main": [
"./css/star-rating.min.css",
"./js/star-rating.min.js"
],
"keywords": [
"bootstrap",
"star",
"rating",
"font",
"awesome",
"glyphicon",
"svg"
],
"dependencies": {
"jquery": ">= 1.9.0",
"bootstrap": "~3"
},
"ignore": [
"**/.*",
"node_modules",
"composer.json",
"examples",
"bower_components",
"test",
"tests"
],
"license": "BSD-3-Clause"
}
{
"name": "kartik-v/bootstrap-star-rating",
"description": "A simple yet powerful JQuery star rating plugin for Bootstrap.",
"keywords": [
"bootstrap",
"star",
"rating",
"font",
"awesome",
"glyphicon",
"svg"
],
"homepage": "https://github.com/kartik-v/bootstrap-star-rating",
"license": "BSD-3-Clause",
"authors": [
{
"name": "Kartik Visweswaran",
"email": "kartikv2@gmail.com",
"homepage": "http://www.krajee.com/"
}
],
"extra": {
"branch-alias": {
"dev-master": "4.0.x-dev"
}
}
}
\ No newline at end of file
/*!
* bootstrap-star-rating v4.0.2
* http://plugins.krajee.com/star-rating
*
* Author: Kartik Visweswaran
* Copyright: 2014 - 2016, Kartik Visweswaran, Krajee.com
*
* Licensed under the BSD 3-Clause
* https://github.com/kartik-v/bootstrap-star-rating/blob/master/LICENSE.md
*/
.rating-loading {
width: 25px;
height: 25px;
font-size: 0;
color: #fff;
/*background: transparent url('../img/loading.gif') top left no-repeat;*/
border: none;
}
/*
* Stars
*/
.rating-container .rating {
cursor: default;
position: relative;
vertical-align: middle;
display: inline-block;
overflow: hidden;
white-space: nowrap;
}
.rating-disabled .rating {
cursor: not-allowed;
}
.rating-container .star {
display: inline-block;
margin: 0 3px;
text-align: center;
}
.rating-container .empty-stars {
color: #aaa;
}
.rating-container .filled-stars {
position: absolute;
left: 0;
top: 0;
margin: auto;
color: #fde16d;
white-space: nowrap;
overflow: hidden;
-webkit-text-stroke: 1px #777;
text-shadow: 1px 1px #999;
}
.rating-rtl {
float: right;
}
.rating-animate .filled-stars {
transition: width 0.25s ease;
-o-transition: width 0.25s ease;
-moz-transition: width 0.25s ease;
-webkit-transition: width 0.25s ease;
}
.rating-rtl .filled-stars {
left: auto;
right: 0;
-moz-transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
-webkit-transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
-o-transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
transform: matrix(-1, 0, 0, 1, 0, 0) translate3d(0, 0, 0);
}
.rating-rtl.is-star .filled-stars {
right: 0.06em;
}
.rating-rtl.is-heart .empty-stars {
margin-right: 0.07em;
}
/**
* Sizes
*/
.rating-xl {
font-size: 4.89em;
}
.rating-lg {
font-size: 3.91em;
}
.rating-md {
font-size: 3.13em;
}
.rating-sm {
font-size: 2.5em;
}
.rating-xs {
font-size: 2em;
}
.rating-xl {
font-size: 4.89em;
}
/**
* Clear
*/
.rating-container .clear-rating {
color: #aaa;
cursor: not-allowed;
display: inline-block;
vertical-align: middle;
font-size: 60%;
}
.clear-rating-active {
cursor: pointer !important;
}
.clear-rating-active:hover {
color: #843534;
}
.rating-container .clear-rating {
padding-right: 5px;
}
/**
* Caption
*/
.rating-container .caption {
color: #999;
display: inline-block;
vertical-align: middle;
font-size: 60%;
margin-top: -0.6em;
}
.rating-container .caption {
margin-left: 5px;
margin-right: 0;
}
.rating-rtl .caption {
margin-right: 5px;
margin-left: 0;
}
/**
* Print
*/
@media print {
.rating-container .clear-rating {
display: none;
}
}
\ No newline at end of file
/*!
* bootstrap-star-rating v4.0.2
* http://plugins.krajee.com/star-rating
*
* Author: Kartik Visweswaran
* Copyright: 2014 - 2016, Kartik Visweswaran, Krajee.com
*
* Licensed under the BSD 3-Clause
* https://github.com/kartik-v/bootstrap-star-rating/blob/master/LICENSE.md
*/.rating-container .caption,.rating-container .clear-rating,.rating-container .rating{display:inline-block;vertical-align:middle}.rating-loading{width:25px;height:25px;font-size:0;color:#fff; /*background:url(../img/loading.gif) top left no-repeat;*/border:none}.rating-container .rating{cursor:default;position:relative;overflow:hidden;white-space:nowrap}.rating-disabled .rating{cursor:not-allowed}.rating-container .star{display:inline-block;margin:0 3px;text-align:center}.rating-container .empty-stars{color:#aaa}.rating-container .filled-stars{position:absolute;left:0;top:0;margin:auto;color:#fde16d;white-space:nowrap;overflow:hidden;-webkit-text-stroke:1px #777;text-shadow:1px 1px #999}.rating-rtl{float:right}.rating-animate .filled-stars{transition:width .25s ease;-o-transition:width .25s ease;-moz-transition:width .25s ease;-webkit-transition:width .25s ease}.rating-rtl .filled-stars{left:auto;right:0;-moz-transform:matrix(-1,0,0,1,0,0) translate3d(0,0,0);-webkit-transform:matrix(-1,0,0,1,0,0) translate3d(0,0,0);-o-transform:matrix(-1,0,0,1,0,0) translate3d(0,0,0);transform:matrix(-1,0,0,1,0,0) translate3d(0,0,0)}.rating-rtl.is-star .filled-stars{right:.06em}.rating-rtl.is-heart .empty-stars{margin-right:.07em}.rating-lg{font-size:3.91em}.rating-md{font-size:3.13em}.rating-sm{font-size:2.5em}.rating-xs{font-size:2em}.rating-xl{font-size:4.89em}.rating-container .clear-rating{color:#aaa;cursor:not-allowed;font-size:60%;padding-right:5px}.clear-rating-active{cursor:pointer!important}.clear-rating-active:hover{color:#843534}.rating-container .caption{color:#999;font-size:60%;margin-top:-.6em;margin-left:5px;margin-right:0}.rating-rtl .caption{margin-right:5px;margin-left:0}@media print{.rating-container .clear-rating{display:none}}
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Krajee JQuery Plugins - &copy; Kartik</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/star-rating.css" media="all" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="../js/star-rating.js" type="text/javascript"></script>
<body>
<div class="container">
<div class="page-header">
<h2>Bootstrap Star Rating Examples <small>&copy; Kartik Visweswaran, Krajee.com</small></h2>
</div>
<form>
<input id="input-21b" value="4" type="number" class="rating" min=0 max=5 step=0.2 data-size="lg">
<hr>
<input id="input-21c" value="0" type="number" class="rating" min=0 max=8 step=0.5 data-size="xl" data-stars="8">
<hr>
<input id="input-21d" value="2" type="number" class="rating" min=0 max=5 step=0.5 data-size="sm">
<hr>
<input id="input-21e" value="0" type="number" class="rating" min=0 max=5 step=0.5 data-size="xs" >
<hr>
<input id="input-21f" value="0" type="number" min=0 max=5 step=0.1 data-size="md" >
<hr>
<input id="input-2ba" type="number" class="rating" min="0" max="5" step="0.5" data-stars=5
data-symbol="&#xe005;" data-default-caption="{rating} hearts" data-star-captions="{}">
<hr>
<input id="input-22" value="0" type="number" class="rating" min=0 max=5 step=0.5 data-rtl=1 data-container-class='text-right' data-glyphicon=0>
<div class="clearfix"></div>
<hr>
<input class="rb-rating">
<hr>
<input id="rating-input" type="number" />
<button id="btn-rating-input" type="button" class="btn btn-primary">Toggle Disable</button>
<hr>
<input id="kartik" class="rating" data-stars="5" data-step="0.1"/>
<div class="form-group" style="margin-top:10px">
<button type="submit" class="btn btn-primary">Submit</button>
<button type="reset" class="btn btn-default">Reset</button>
<button type="button" class="btn btn-danger">Destroy</button>
<button type="button" class="btn btn-success">Create</button>
</div>
</form>
<hr>
<script>
jQuery(document).ready(function () {
$("#input-21f").rating({
starCaptions: function(val) {
if (val < 3) {
return val;
} else {
return 'high';
}
},
starCaptionClasses: function(val) {
if (val < 3) {
return 'label label-danger';
} else {
return 'label label-success';
}
},
hoverOnClear: false
});
$('#rating-input').rating({
min: 0,
max: 5,
step: 1,
size: 'lg',
showClear: false
});
$('#btn-rating-input').on('click', function() {
$('#rating-input').rating('refresh', {
showClear:true,
disabled: !$('#rating-input').attr('disabled')
});
});
$('.btn-danger').on('click', function() {
$("#kartik").rating('destroy');
});
$('.btn-success').on('click', function() {
$("#kartik").rating('create');
});
$('#rating-input').on('rating.change', function() {
alert($('#rating-input').val());
});
$('.rb-rating').rating({'showCaption':true, 'stars':'3', 'min':'0', 'max':'3', 'step':'1', 'size':'xs', 'starCaptions': {0:'status:nix', 1:'status:wackelt', 2:'status:geht', 3:'status:laeuft'}});
});
</script>
</div>
</body>
</html>
<!DOCTYPE html>
<!--suppress CssUnusedSymbol, JSUnresolvedLibraryURL -->
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>Krajee JQuery Plugins - &copy; Kartik</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/star-rating.css" media="all" type="text/css"/>
<link rel="stylesheet" href="../css/themes/krajee-fa/theme.css" media="all" type="text/css"/>
<link rel="stylesheet" href="../css/themes/krajee-svg/theme.css" media="all" type="text/css"/>
<link rel="stylesheet" href="../css/themes/krajee-uni/theme.css" media="all" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="../js/star-rating.js" type="text/javascript"></script>
<script src="../js/themes/krajee-fa/theme.js" type="text/javascript"></script>
<script src="../js/themes/krajee-svg/theme.js" type="text/javascript"></script>
<script src="../js/themes/krajee-uni/theme.js" type="text/javascript"></script>
<body>
<div class="container">
<div class="page-header">
<h2>Bootstrap Star Rating Examples
<small>&copy; Kartik Visweswaran, Krajee.com</small>
</h2>
</div>
<form>
<div class="page-header">
<h3>Glyphicon Star LTR</h3>
</div>
<input type="text" class="rating rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="rating rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="rating rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="rating rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="rating rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>Glyphicon Star RTL</h3>
</div>
<input type="text" class="kv-gly-star rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-star rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-star rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-star rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-star rating-loading" value="2" dir="rtl" data-size="xs"
title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>Glyphicon Heart LTR</h3>
</div>
<input type="text" class="kv-gly-heart rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="kv-gly-heart rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-gly-heart rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-gly-heart rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-gly-heart rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>Glyphicon Heart RTL</h3>
</div>
<input type="text" class="kv-gly-heart rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-heart rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-heart rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-heart rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-gly-heart rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>Unicode Star LTR</h3>
</div>
<input type="text" class="kv-uni-star rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="kv-uni-star rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-uni-star rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-uni-star rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-uni-star rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>Unicode Star RTL</h3>
</div>
<input type="text" class="kv-uni-star rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-star rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-star rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-star rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-star rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>Unicode Rook LTR</h3>
</div>
<input type="text" class="kv-uni-rook rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="kv-uni-rook rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-uni-rook rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-uni-rook rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-uni-rook rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>Unicode Rook RTL</h3>
</div>
<input type="text" class="kv-uni-rook rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-rook rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-rook rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-rook rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-uni-rook rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>Font Awesome Star LTR</h3>
</div>
<input type="text" class="kv-fa rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="kv-fa rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-fa rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-fa rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-fa rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>Font Awesome Star RTL</h3>
</div>
<input type="text" class="kv-fa rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>Font Awesome Heart LTR</h3>
</div>
<input type="text" class="kv-fa-heart rating-loading" value="3.75" data-size="xl"
title="">
<br>
<input type="text" class="kv-fa-heart rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-fa-heart rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-fa-heart rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-fa-heart rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>Font Awesome Heart RTL</h3>
</div>
<input type="text" class="kv-fa-heart rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa-heart rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa-heart rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa-heart rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-fa-heart rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>SVG LTR Star</h3>
</div>
<input type="text" class="kv-svg rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="kv-svg rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-svg rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-svg rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-svg rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>SVG RTL Star</h3>
</div>
<input type="text" class="kv-svg rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
<div class="page-header">
<h3>SVG LTR Heart</h3>
</div>
<input type="text" class="kv-svg-heart rating-loading" value="3.75" data-size="xl" title="">
<br>
<input type="text" class="kv-svg-heart rating-loading" value="2.5" data-size="lg" title="">
<br>
<input type="text" class="kv-svg-heart rating-loading" value="1.75" data-size="md" title="">
<br>
<input type="text" class="kv-svg-heart rating-loading" value="4" data-size="sm" title="">
<br>
<input type="text" class="kv-svg-heart rating-loading" value="2" data-size="xs" title="">
<br>
<div class="page-header">
<h3>SVG RTL Heart</h3>
</div>
<input type="text" class="kv-svg-heart rating-loading" value="3.75" dir="rtl" data-size="xl" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg-heart rating-loading" value="2.5" dir="rtl" data-size="lg" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg-heart rating-loading" value="1.75" dir="rtl" data-size="md" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg-heart rating-loading" value="4" dir="rtl" data-size="sm" title="">
<div class="clearfix"></div>
<br>
<input type="text" class="kv-svg-heart rating-loading" value="2" dir="rtl" data-size="xs" title="">
<div class="clearfix"></div>
<br>
</form>
</div>
</body>
<script>
$(document).on('ready', function () {
$('.kv-gly-star').rating({
containerClass: 'is-star'
});
$('.kv-gly-heart').rating({
containerClass: 'is-heart',
defaultCaption: '{rating} hearts',
starCaptions: function (rating) {
return rating == 1 ? 'One heart' : rating + ' hearts';
},
filledStar: '<i class="glyphicon glyphicon-heart"></i>',
emptyStar: '<i class="glyphicon glyphicon-heart-empty"></i>'
});
$('.kv-fa').rating({
theme: 'krajee-fa',
filledStar: '<i class="fa fa-star"></i>',
emptyStar: '<i class="fa fa-star-o"></i>'
});
$('.kv-fa-heart').rating({
defaultCaption: '{rating} hearts',
starCaptions: function (rating) {
return rating == 1 ? 'One heart' : rating + ' hearts';
},
theme: 'krajee-fa',
filledStar: '<i class="fa fa-heart"></i>',
emptyStar: '<i class="fa fa-heart-o"></i>'
});
$('.kv-uni-star').rating({
theme: 'krajee-uni',
filledStar: '&#x2605;',
emptyStar: '&#x2606;'
});
$('.kv-uni-rook').rating({
theme: 'krajee-uni',
defaultCaption: '{rating} rooks',
starCaptions: function (rating) {
return rating == 1 ? 'One rook' : rating + ' rooks';
},
filledStar: '&#9820;',
emptyStar: '&#9814;'
});
$('.kv-svg').rating({
theme: 'krajee-svg',
filledStar: '<span class="krajee-icon krajee-icon-star"></span>',
emptyStar: '<span class="krajee-icon krajee-icon-star"></span>'
});
$('.kv-svg-heart').rating({
theme: 'krajee-svg',
filledStar: '<span class="krajee-icon krajee-icon-heart"></span>',
emptyStar: '<span class="krajee-icon krajee-icon-heart"></span>',
defaultCaption: '{rating} hearts',
starCaptions: function (rating) {
return rating == 1 ? 'One heart' : rating + ' hearts';
},
containerClass: 'is-heart'
});
$('.rating,.kv-gly-star,.kv-gly-heart,.kv-uni-star,.kv-uni-rook,.kv-fa,.kv-fa-heart,.kv-svg,.kv-svg-heart').on(
'change', function () {
console.log('Rating selected: ' + $(this).val());
});
});
</script>
</html>
src/legacy/bootstrap-star-rating/img/loading.gif

847 B

/*!
* Star Rating <LANG> Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales['<LANG>'] = {
defaultCaption: '{rating} Stars',
starCaptions: {
0.5: 'Half Star',
1: 'One Star',
1.5: 'One & Half Star',
2: 'Two Stars',
2.5: 'Two & Half Stars',
3: 'Three Stars',
3.5: 'Three & Half Stars',
4: 'Four Stars',
4.5: 'Four & Half Stars',
5: 'Five Stars'
},
clearButtonTitle: 'Clear',
clearCaption: 'Not Rated'
};
})(window.jQuery);
/*!
* Star Rating German Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales['de'] = {
defaultCaption: '{rating} Sterne',
starCaptions: {
0.5: 'Halber Stern',
1: 'Ein Stern',
1.5: 'Eineinhalb Sterne',
2: 'Zwei Sterne',
2.5: 'Zweieinhalb Sterne',
3: 'Drei Sterne',
3.5: 'Dreieinhalb Sterne',
4: 'Vier Sterne',
4.5: 'Viereinhalb Sterne',
5: 'Fünf Sterne'
},
clearButtonTitle: 'Zuücksetzen',
clearCaption: 'Nicht Bewertet'
};
})(window.jQuery);
/*!
* Star Rating Spanish Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales.es = {
defaultCaption: '{rating} Estrellas',
starCaptions: {
0.5: 'Media Estrella',
1: 'Una Estrella',
1.5: 'Una Estrella y Media',
2: 'Dos Estrellas',
2.5: 'Dos Estrellas y Media',
3: 'Tres Estrellas',
3.5: 'Tres Estrellas y Media',
4: 'Cuatro Estrellas',
4.5: 'Cuatro Estrellas y Media',
5: 'Cinco Estrellas'
},
clearButtonTitle: 'Limpiar',
clearCaption: 'Sin Calificar'
};
})(window.jQuery);
\ No newline at end of file
/*!
* Star Rating French Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales['fr'] = {
defaultCaption: '{rating} étoiles',
starCaptions: {
0.5: 'Une demi étoile',
1: 'Une étoile',
1.5: 'Une étoile et demi',
2: 'Deux étoiles',
2.5: 'Deux étoiles et demi',
3: 'Trois étoiles',
3.5: 'Trois étoiles et demi',
4: 'Quatre étoiles',
4.5: 'Quatre étoiles et demi',
5: 'Cinq étoiles'
},
clearButtonTitle: 'Effacer',
clearCaption: 'Non noté'
};
})(window.jQuery);
/*!
* Star Rating Italian Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales['it'] = {
defaultCaption: '{rating} Stelle',
starCaptions: {
0.5: 'Mezza Stella',
1: 'Una Stella',
1.5: 'Una Stella & Mezzo',
2: 'Due Stelle',
2.5: 'Due Stelle & Mezzo',
3: 'Tre Stelle',
3.5: 'Tre Stelle & Mezzo',
4: 'Quattro Stelle',
4.5: 'Quattro Stelle & Mezzo',
5: 'Five Stars'
},
clearButtonTitle: 'Rimuovi',
clearCaption: 'Nessuna valutazione'
};
})(window.jQuery);
/*!
* Star Rating Portugese Brazilian Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales['pt-BR'] = {
defaultCaption: '{rating} Estrelas',
starCaptions: {
0.5: 'Meia Estrela',
1: 'Uma Estrela',
1.5: 'Uma Estrela e Meia',
2: 'Duas Estrelas',
2.5: 'Duas Estrelas e Meia',
3: 'Três Estrelas',
3.5: 'Três Estrelas e Meia',
4: 'Quatro Estrelas',
4.5: 'Quatro Estrelas e Meia',
5: 'Cinco Estrelas'
},
clearButtonTitle: 'Limpar',
clearCaption: 'Não Avaliado'
};
})(window.jQuery);
/*!
* Star Rating Romanian Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
*/
(function ($) {
"use strict";
$.fn.ratingLocales['ro'] = {
defaultCaption: '{rating} stele',
starCaptions: {
0.5: 'Jumatate de stea',
1: 'O Stea',
1.5: 'O stea si jumatate',
2: 'Doua stele',
2.5: 'Doua stele si jumatate',
3: 'Trei stele',
3.5: 'Trei stele si jumatate',
4: 'Patru stele',
4.5: 'Patru stele si jumatate',
5: 'Cinci stele'
},
clearButtonTitle: 'Sterge',
clearCaption: 'Fara vot'
};
})(window.jQuery);
/*!
* Star Rating Russian Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
* @author Ivan Zhuravlev.
*/
(function ($) {
"use strict";
$.fn.ratingLocales['ru'] = {
defaultCaption: '{rating} Звёзды',
starCaptions: {
0.5: 'Половина звезды',
1: 'Одна звезда',
1.5: 'Полторы звезды',
2: 'Две звезды',
2.5: 'Две с половиной звезды',
3: 'Три звезды',
3.5: 'Три с половиной звезды',
4: 'Четыре звезды',
4.5: 'Четыре с половиной звезды',
5: 'Пять звёзд'
},
clearButtonTitle: 'Очистить',
clearCaption: 'Без рейтинга'
};
})(window.jQuery);
/*!
* Star Rating Ukrainian Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
* @author https://github.com/wowkin2
*/
(function ($) {
"use strict";
$.fn.ratingLocales['ua'] = {
defaultCaption: '{rating} Зірки',
starCaptions: {
0.5: 'Пів зірки',
1: 'Одна зірка',
1.5: 'Півтори зірки',
2: 'Дві зірки',
2.5: 'Дві з половиною зірки',
3: 'Три зірки',
3.5: 'Три з половиною зірки',
4: 'Чотири зірки',
4.5: 'Чотири з половиною зірки',
5: 'П\'ять зірок'
},
clearButtonTitle: 'Очистити',
clearCaption: 'Без рейтингу'
};
})(window.jQuery);
/*!
* Star Rating Chinese Translations
*
* This file must be loaded after 'star-rating.js'. Patterns in braces '{}', or
* any HTML markup tags in the messages must not be converted or translated.
*
* NOTE: this file must be saved in UTF-8 encoding.
*
* @see http://github.com/kartik-v/bootstrap-star-rating
* @author Kartik Visweswaran <kartikv2@gmail.com>
* @author Freeman
*/
(function ($) {
"use strict";
$.fn.ratingLocales['zh'] = {
defaultCaption: '{rating} 星',
starCaptions: {
0.5: '半星',
1: '一星',
1.5: '一星半',
2: '二星',
2.5: '二星半',
3: '三星',
3.5: '三星半',
4: '四星',
4.5: '四星半',
5: '五星'
},
clearButtonTitle: '清除',
clearCaption: '未评级'
};
})(window.jQuery);
/*!
* bootstrap-star-rating v4.0.2
* http://plugins.krajee.com/star-rating
*
* Author: Kartik Visweswaran
* Copyright: 2014 - 2016, Kartik Visweswaran, Krajee.com
*
* Licensed under the BSD 3-Clause
* https://github.com/kartik-v/bootstrap-star-rating/blob/master/LICENSE.md
*/
(function (factory) {
"use strict";
//noinspection JSUnresolvedVariable
if (typeof define === 'function' && define.amd) { // jshint ignore:line
// AMD. Register as an anonymous module.
define(['jquery'], factory); // jshint ignore:line
} else { // noinspection JSUnresolvedVariable
if (typeof module === 'object' && module.exports) { // jshint ignore:line
// Node/CommonJS
// noinspection JSUnresolvedVariable
module.exports = factory(require('jquery')); // jshint ignore:line
} else {
// Browser globals
factory(window.jQuery);
}
}
}(function ($) {
"use strict";
$.fn.ratingLocales = {};
$.fn.ratingThemes = {};
var NAMESPACE, DEFAULT_MIN, DEFAULT_MAX, DEFAULT_STEP, isEmpty, getCss, addCss, getDecimalPlaces, applyPrecision,
handler, Rating;
NAMESPACE = '.rating';
DEFAULT_MIN = 0;
DEFAULT_MAX = 5;
DEFAULT_STEP = 0.5;
isEmpty = function (value, trim) {
return value === null || value === undefined || value.length === 0 || (trim && $.trim(value) === '');
};
getCss = function (condition, css) {
return condition ? ' ' + css : '';
};
addCss = function ($el, css) {
$el.removeClass(css).addClass(css);
};
getDecimalPlaces = function (num) {
var match = ('' + num).match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
return !match ? 0 : Math.max(0, (match[1] ? match[1].length : 0) - (match[2] ? +match[2] : 0));
};
applyPrecision = function (val, precision) {
return parseFloat(val.toFixed(precision));
};
handler = function ($el, event, callback, skipNS) {
var ev = skipNS ? event : event.split(' ').join(NAMESPACE + ' ') + NAMESPACE;
$el.off(ev).on(ev, callback);
};
Rating = function (element, options) {
var self = this;
self.$element = $(element);
self._init(options);
};
Rating.prototype = {
constructor: Rating,
_parseAttr: function (vattr, options) {
var self = this, $el = self.$element, elType = $el.attr('type'), finalVal, val, chk, out;
if (elType === 'range' || elType === 'number') {
val = options[vattr] || $el.data(vattr) || $el.attr(vattr);
switch (vattr) {
case 'min':
chk = DEFAULT_MIN;
break;
case 'max':
chk = DEFAULT_MAX;
break;
default:
chk = DEFAULT_STEP;
}
finalVal = isEmpty(val) ? chk : val;
out = parseFloat(finalVal);
} else {
out = parseFloat(options[vattr]);
}
return isNaN(out) ? chk : out;
},
_setDefault: function (key, val) {
var self = this;
if (isEmpty(self[key])) {
self[key] = val;
}
},
_listenClick: function (e, callback) {
e.stopPropagation();
e.preventDefault();
if (e.handled !== true) {
callback(e);
e.handled = true;
} else {
return false;
}
},
_starClick: function (e) {
var self = this, pos;
self._listenClick(e, function (ev) {
if (self.inactive) {
return false;
}
pos = self._getTouchPosition(ev);
self._setStars(pos);
self.$element.trigger('change').trigger('rating.change', [self.$element.val(), self._getCaption()]);
self.starClicked = true;
});
},
_starMouseMove: function (e) {
var self = this, pos, out;
if (!self.hoverEnabled || self.inactive || (e && e.isDefaultPrevented())) {
return;
}
self.starClicked = false;
pos = self._getTouchPosition(e);
out = self.calculate(pos);
self._toggleHover(out);
self.$element.trigger('rating.hover', [out.val, out.caption, 'stars']);
},
_starMouseLeave: function (e) {
var self = this, out;
if (!self.hoverEnabled || self.inactive || self.starClicked || (e && e.isDefaultPrevented())) {
return;
}
out = self.cache;
self._toggleHover(out);
self.$element.trigger('rating.hoverleave', ['stars']);
},
_clearClick: function (e) {
var self = this;
self._listenClick(e, function () {
if (!self.inactive) {
self.clear();
self.clearClicked = true;
}
});
},
_clearMouseMove: function (e) {
var self = this, caption, val, width, out;
if (!self.hoverEnabled || self.inactive || !self.hoverOnClear || (e && e.isDefaultPrevented())) {
return;
}
self.clearClicked = false;
caption = '<span class="' + self.clearCaptionClass + '">' + self.clearCaption + '</span>';
val = self.clearValue;
width = self.getWidthFromValue(val) || 0;
out = {caption: caption, width: width, val: val};
self._toggleHover(out);
self.$element.trigger('rating.hover', [val, caption, 'clear']);
},
_clearMouseLeave: function (e) {
var self = this, out;
if (!self.hoverEnabled || self.inactive || self.clearClicked || !self.hoverOnClear || (e && e.isDefaultPrevented())) {
return;
}
out = self.cache;
self._toggleHover(out);
self.$element.trigger('rating.hoverleave', ['clear']);
},
_resetForm: function (e) {
var self = this;
if (e && e.isDefaultPrevented()) {
return;
}
if (!self.inactive) {
self.reset();
}
},
_setTouch: function (e, flag) {
//noinspection JSUnresolvedVariable
var self = this, ev, touches, pos, out, caption, w, width, isTouchCapable = 'ontouchstart' in window ||
(window.DocumentTouch && document instanceof window.DocumentTouch);
if (!isTouchCapable || self.inactive) {
return;
}
ev = e.originalEvent;
//noinspection JSUnresolvedVariable
touches = !isEmpty(ev.touches) ? ev.touches : ev.changedTouches;
pos = self._getTouchPosition(touches[0]);
if (flag) {
self._setStars(pos);
self.$element.trigger('change').trigger('rating.change', [self.$element.val(), self._getCaption()]);
self.starClicked = true;
} else {
out = self.calculate(pos);
caption = out.val <= self.clearValue ? self.fetchCaption(self.clearValue) : out.caption;
w = self.getWidthFromValue(self.clearValue);
width = out.val <= self.clearValue ? w + '%' : out.width;
self._setCaption(caption);
self.$filledStars.css('width', width);
}
},
_initTouch: function (e) {
var self = this, flag = (e.type === "touchend");
self._setTouch(e, flag);
},
_initSlider: function (options) {
var self = this;
if (isEmpty(self.$element.val())) {
self.$element.val(0);
}
self.initialValue = self.$element.val();
self._setDefault('min', self._parseAttr('min', options));
self._setDefault('max', self._parseAttr('max', options));
self._setDefault('step', self._parseAttr('step', options));
if (isNaN(self.min) || isEmpty(self.min)) {
self.min = DEFAULT_MIN;
}
if (isNaN(self.max) || isEmpty(self.max)) {
self.max = DEFAULT_MAX;
}
if (isNaN(self.step) || isEmpty(self.step) || self.step === 0) {
self.step = DEFAULT_STEP;
}
self.diff = self.max - self.min;
},
_initHighlight: function (v) {
var self = this, w, cap = self._getCaption();
if (!v) {
v = self.$element.val();
}
w = self.getWidthFromValue(v) + '%';
self.$filledStars.width(w);
self.cache = {caption: cap, width: w, val: v};
},
_getContainerCss: function () {
var self = this;
return 'rating-container' +
getCss(self.theme, 'theme-' + self.theme) +
getCss(self.rtl, 'rating-rtl') +
getCss(self.size, 'rating-' + self.size) +
getCss(self.animate, 'rating-animate') +
getCss(self.disabled || self.readonly, 'rating-disabled') +
getCss(self.containerClass, self.containerClass);
},
_checkDisabled: function () {
var self = this, $el = self.$element, opts = self.options;
self.disabled = opts.disabled === undefined ? $el.attr('disabled') || false : opts.disabled;
self.readonly = opts.readonly === undefined ? $el.attr('readonly') || false : opts.readonly;
self.inactive = (self.disabled || self.readonly);
$el.attr({disabled: self.disabled, readonly: self.readonly});
},
_addContent: function (type, content) {
var self = this, $container = self.$container, isClear = type === 'clear';
if (self.rtl) {
return isClear ? $container.append(content) : $container.prepend(content);
} else {
return isClear ? $container.prepend(content) : $container.append(content);
}
},
_generateRating: function () {
var self = this, $el = self.$element, $rating, $container, w;
$container = self.$container = $(document.createElement("div")).insertBefore($el);
addCss($container, self._getContainerCss());
self.$rating = $rating = $(document.createElement("div")).attr('class', 'rating').appendTo($container)
.append(self._getStars('empty')).append(self._getStars('filled'));
self.$emptyStars = $rating.find('.empty-stars');
self.$filledStars = $rating.find('.filled-stars');
self._renderCaption();
self._renderClear();
self._initHighlight();
$container.append($el);
if (self.rtl) {
w = Math.max(self.$emptyStars.outerWidth(), self.$filledStars.outerWidth());
self.$emptyStars.width(w);
}
},
_getCaption: function () {
var self = this;
return self.$caption && self.$caption.length ? self.$caption.html() : self.defaultCaption;
},
_setCaption: function (content) {
var self = this;
if (self.$caption && self.$caption.length) {
self.$caption.html(content);
}
},
_renderCaption: function () {
var self = this, val = self.$element.val(), html, $cap = self.captionElement ? $(self.captionElement) : '';
if (!self.showCaption) {
return;
}
html = self.fetchCaption(val);
if ($cap && $cap.length) {
addCss($cap, 'caption');
$cap.html(html);
self.$caption = $cap;
return;
}
self._addContent('caption', '<div class="caption">' + html + '</div>');
self.$caption = self.$container.find(".caption");
},
_renderClear: function () {
var self = this, css, $clr = self.clearElement ? $(self.clearElement) : '';
if (!self.showClear) {
return;
}
css = self._getClearClass();
if ($clr.length) {
addCss($clr, css);
$clr.attr({"title": self.clearButtonTitle}).html(self.clearButton);
self.$clear = $clr;
return;
}
self._addContent('clear',
'<div class="' + css + '" title="' + self.clearButtonTitle + '">' + self.clearButton + '</div>');
self.$clear = self.$container.find('.' + self.clearButtonBaseClass);
},
_getClearClass: function () {
return this.clearButtonBaseClass + ' ' + ((this.inactive) ? '' : this.clearButtonActiveClass);
},
_getTouchPosition: function (e) {
var pageX = isEmpty(e.pageX) ? e.originalEvent.touches[0].pageX : e.pageX;
return pageX - this.$rating.offset().left;
},
_toggleHover: function (out) {
var self = this, w, width, caption;
if (!out) {
return;
}
if (self.hoverChangeStars) {
w = self.getWidthFromValue(self.clearValue);
width = out.val <= self.clearValue ? w + '%' : out.width;
self.$filledStars.css('width', width);
}
if (self.hoverChangeCaption) {
caption = out.val <= self.clearValue ? self.fetchCaption(self.clearValue) : out.caption;
if (caption) {
self._setCaption(caption + '');
}
}
},
_init: function (options) {
var self = this, $el = self.$element.addClass('hide');
self.options = options;
$.each(options, function (key, value) {
self[key] = value;
});
if (self.rtl || $el.attr('dir') === 'rtl') {
self.rtl = true;
$el.attr('dir', 'rtl');
}
self.starClicked = false;
self.clearClicked = false;
self._initSlider(options);
self._checkDisabled();
if (self.displayOnly) {
self.inactive = true;
self.showClear = false;
self.showCaption = false;
}
self._generateRating();
self._listen();
return $el.removeClass('rating-loading');
},
_listen: function () {
var self = this, $el = self.$element, $form = $el.closest('form'), $rating = self.$rating,
$clear = self.$clear;
handler($rating, 'touchstart touchmove touchend', $.proxy(self._initTouch, self));
handler($rating, 'click touchstart', $.proxy(self._starClick, self));
handler($rating, 'mousemove', $.proxy(self._starMouseMove, self));
handler($rating, 'mouseleave', $.proxy(self._starMouseLeave, self));
if (self.showClear && $clear.length) {
handler($clear, 'click touchstart', $.proxy(self._clearClick, self));
handler($clear, 'mousemove', $.proxy(self._clearMouseMove, self));
handler($clear, 'mouseleave', $.proxy(self._clearMouseLeave, self));
}
if ($form.length) {
handler($form, 'reset', $.proxy(self._resetForm, self));
}
return $el;
},
_getStars: function (type) {
var self = this, stars = '<span class="' + type + '-stars">', i;
for (i = 1; i <= self.stars; i++) {
stars += '<span class="star">' + self[type + 'Star'] + '</span>';
}
return stars + '</span>';
},
_setStars: function (pos) {
var self = this, out = arguments.length ? self.calculate(pos) : self.calculate(), $el = self.$element;
$el.val(out.val);
self.$filledStars.css('width', out.width);
self._setCaption(out.caption);
self.cache = out;
return $el;
},
showStars: function (val) {
var self = this, v = parseFloat(val);
self.$element.val(isNaN(v) ? self.clearValue : v);
return self._setStars();
},
calculate: function (pos) {
var self = this, defaultVal = isEmpty(self.$element.val()) ? 0 : self.$element.val(),
val = arguments.length ? self.getValueFromPosition(pos) : defaultVal,
caption = self.fetchCaption(val), width = self.getWidthFromValue(val);
width += '%';
return {caption: caption, width: width, val: val};
},
getValueFromPosition: function (pos) {
var self = this, precision = getDecimalPlaces(self.step), val, factor, maxWidth = self.$rating.width();
factor = (self.diff * pos) / (maxWidth * self.step);
factor = self.rtl ? Math.floor(factor) : Math.ceil(factor);
val = applyPrecision(parseFloat(self.min + factor * self.step), precision);
val = Math.max(Math.min(val, self.max), self.min);
return self.rtl ? (self.max - val) : val;
},
getWidthFromValue: function (val) {
var self = this, min = self.min, max = self.max, factor, $r = self.$emptyStars, w;
if (!val || val <= min || min === max) {
return 0;
}
w = $r.outerWidth();
factor = w ? $r.width() / w : 1;
if (val >= max) {
return 100;
}
return (val - min) * factor * 100 / (max - min);
},
fetchCaption: function (rating) {
var self = this, val = parseFloat(rating) || self.clearValue, css, cap, capVal, cssVal, caption,
vCap = self.starCaptions, vCss = self.starCaptionClasses;
if (val && val !== self.clearValue) {
val = applyPrecision(val, getDecimalPlaces(self.step));
}
cssVal = typeof vCss === "function" ? vCss(val) : vCss[val];
capVal = typeof vCap === "function" ? vCap(val) : vCap[val];
cap = isEmpty(capVal) ? self.defaultCaption.replace(/\{rating}/g, val) : capVal;
css = isEmpty(cssVal) ? self.clearCaptionClass : cssVal;
caption = (val === self.clearValue) ? self.clearCaption : cap;
return '<span class="' + css + '">' + caption + '</span>';
},
destroy: function () {
var self = this, $el = self.$element;
if (!isEmpty(self.$container)) {
self.$container.before($el).remove();
}
$.removeData($el.get(0));
return $el.off('rating').removeClass('hide');
},
create: function (options) {
var self = this, opts = options || self.options || {};
return self.destroy().rating(opts);
},
clear: function () {
var self = this, title = '<span class="' + self.clearCaptionClass + '">' + self.clearCaption + '</span>';
if (!self.inactive) {
self._setCaption(title);
}
return self.showStars(self.clearValue).trigger('change').trigger('rating.clear');
},
reset: function () {
var self = this;
return self.showStars(self.initialValue).trigger('rating.reset');
},
update: function (val) {
var self = this;
return arguments.length ? self.showStars(val) : self.$element;
},
refresh: function (options) {
var self = this, $el = self.$element;
if (!options) {
return $el;
}
return self.destroy().rating($.extend(true, self.options, options)).trigger('rating.refresh');
}
};
$.fn.rating = function (option) {
var args = Array.apply(null, arguments), retvals = [];
args.shift();
this.each(function () {
var self = $(this), data = self.data('rating'), options = typeof option === 'object' && option,
theme = options.theme || self.data('theme'), lang = options.language || self.data('language') || 'en',
thm = {}, loc = {}, opts;
if (!data) {
if (theme) {
thm = $.fn.ratingThemes[theme] || {};
}
if (lang !== 'en' && !isEmpty($.fn.ratingLocales[lang])) {
loc = $.fn.ratingLocales[lang];
}
opts = $.extend(true, {}, $.fn.rating.defaults, thm, $.fn.ratingLocales.en, loc, options, self.data());
data = new Rating(this, opts);
self.data('rating', data);
}
if (typeof option === 'string') {
retvals.push(data[option].apply(data, args));
}
});
switch (retvals.length) {
case 0:
return this;
case 1:
return retvals[0] === undefined ? this : retvals[0];
default:
return retvals;
}
};
$.fn.rating.defaults = {
theme: '',
language: 'en',
stars: 5,
filledStar: '<i class="glyphicon glyphicon-star"></i>',
emptyStar: '<i class="glyphicon glyphicon-star-empty"></i>',
containerClass: '',
size: 'md',
animate: true,
displayOnly: false,
rtl: false,
showClear: true,
showCaption: true,
starCaptionClasses: {
0.5: 'label label-danger',
1: 'label label-danger',
1.5: 'label label-warning',
2: 'label label-warning',
2.5: 'label label-info',
3: 'label label-info',
3.5: 'label label-primary',
4: 'label label-primary',
4.5: 'label label-success',
5: 'label label-success'
},
clearButton: '<i class="glyphicon glyphicon-minus-sign"></i>',
clearButtonBaseClass: 'clear-rating',
clearButtonActiveClass: 'clear-rating-active',
clearCaptionClass: 'label label-default',
clearValue: null,
captionElement: null,
clearElement: null,
hoverEnabled: true,
hoverChangeCaption: true,
hoverChangeStars: true,
hoverOnClear: true
};
$.fn.ratingLocales.en = {
defaultCaption: '{rating} Stars',
starCaptions: {
0.5: 'Half Star',
1: 'One Star',
1.5: 'One & Half Star',
2: 'Two Stars',
2.5: 'Two & Half Stars',
3: 'Three Stars',
3.5: 'Three & Half Stars',
4: 'Four Stars',
4.5: 'Four & Half Stars',
5: 'Five Stars'
},
clearButtonTitle: 'Clear',
clearCaption: 'Not Rated'
};
$.fn.rating.Constructor = Rating;
/**
* Convert automatically inputs with class 'rating' into Krajee's star rating control.
*/
$(document).ready(function () {
var $input = $('input.rating');
if ($input.length) {
$input.removeClass('rating-loading').addClass('rating-loading').rating();
}
});
}));
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment