diff --git a/SE_API/API.py b/SE_API/API.py index 972c39e..387ba41 100644 --- a/SE_API/API.py +++ b/SE_API/API.py @@ -52,10 +52,6 @@ app.register_blueprint(project_routes) auto = Autodoc(app) -@app.errorhandler(404) -def page_not_found(e): - return app.send_static_file('views/404/index.html') - @app.route('/') def wellcomePage(): return app.send_static_file('index.html') diff --git a/SE_API/CampusRoutes.py b/SE_API/CampusRoutes.py index 11af4b3..c52fe9c 100644 --- a/SE_API/CampusRoutes.py +++ b/SE_API/CampusRoutes.py @@ -79,7 +79,6 @@ def create_campus(token): except Exception: return bad_request() - send_create_campus_request(user.email, user.name, campus.title) notify_se_hub_campus_request(campus, campus.title) return ok() diff --git a/SE_API/UserRoutes.py b/SE_API/UserRoutes.py index 0bc26d1..d66fdea 100644 --- a/SE_API/UserRoutes.py +++ b/SE_API/UserRoutes.py @@ -25,7 +25,7 @@ from SE_API.Respones_Utils import * user_routes = Blueprint("user_routes", __name__) auto = Autodoc() - +@user_routes.route('/api/users/getUserByToken/', defaults={'token': None}) @user_routes.route('/api/users/getUserByToken/', methods=["GET"]) @auto.doc() def getUserByToken(token): @@ -59,6 +59,9 @@ def getUserByToken(token):
403 - No User Found """ + if token is None: + return no_content("Token Is Empty, No User Found") + query = User.all() query.filter("seToken =", token) diff --git a/templates/css/theme.css b/templates/css/theme.css index 92d6805..815890f 100644 --- a/templates/css/theme.css +++ b/templates/css/theme.css @@ -2,10 +2,10 @@ body{ font-family: "Alef Hebrew", - “Helvetica Neue”, - Helvetica, - Arial, - sans-serif; + “Helvetica Neue”, + Helvetica, + Arial, + sans-serif; } .menuBtn { @@ -76,28 +76,21 @@ body.noscroll margin-top: 1em; margin-right: 1em; position: center; - -webkit-border-radius: 30%; -moz-border-radius: 30%; border-radius: 30%; - - } -/*.avatar { - background: rgba(0, 0, 0, 0.2); - }*/ - - .avatar img { - border-radius: 40px; - position:center; - width: 80px; - height: 80px; - margin: 6px; /*centers the image in the parent element */ - -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); - -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); - box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); - } +.avatar img { + border-radius: 40px; + position:center; + width: 80px; + height: 80px; + margin: 6px; + -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); + -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); + box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); +} /* Added BY devMatan */ @@ -111,37 +104,33 @@ body.noscroll }*/ - .campusAvatar img - { -/* - margin-top: 1em; - margin-right: 1em; - position: center; - */ +.campusAvatar img +{ + border-radius: 40px; + position:center; + width: 80px; + height: 80px; + margin: 6px; + -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); + -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); + box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); +} - border-radius: 40px; - position:center; - width: 80px; - height: 80px; - margin: 6px; - -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); - -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); - box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75); - } +.spacer{ + margin-right: auto; + margin-left: auto; +} - .spacer{ - margin-right: auto; - margin-left: auto; - } +.port_spacer +{ + margin-top: auto; + margin-bottom: auto; +} - .port_spacer{ - margin-top: auto; - margin-bottom: auto; - } - - .mail_suffix{ - margin-top: auto; - } +.mail_suffix +{ + margin-top: auto; +} .createCampus @@ -149,13 +138,55 @@ body.noscroll position:relative; } - -/*div.img campusAvatar +.listdemoBasicUsage md-divider { - border: 1px solid #0000ff; - padding-right: 10px; - float:right; - }*/ + margin-top: 10px; + margin-bottom: 10px; +} + +.feed +{ + overflow-y: scroll; + height: 300px; + /*width: 100%;*/ +} + +/*.feedMessages +{ + overflow: scroll; + height: 300px; + width: 100%; +} +.feedTasks +{ + overflow: scroll; + height: 300px; + width: 100%; +} + +.feedContent +{ + padding-left: 6%; + font-size: 15px; + display:table; +}*/ + +.md-no-sticky +{ + background-color: blue; +} + +.roundUserAvatar +{ + width: 6%; + height: auto; + border-radius: 150px; + -webkit-border-radius: 150px; + -moz-border-radius: 150px; + box-shadow: 0 0 8px rgba(0, 0, 0, .8); + -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8); + -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); +} /*.dropDown /* TODO * { @@ -166,10 +197,47 @@ body.noscroll border-radius: 1px black solid; }*/ - .gray-font{ + .gray-font + { color: #7f7f7f; font-size: 300%; text-shadow:#e0e0e0 1px 1px 0; + opacity: 0; + -webkit-animation-duration: 8s; + animation-duration: 8s; + -webkit-animation-fill-mode: both; + animation-fill-mode: both; + overflow: hidden; + height: 100%; + } + + @-webkit-keyframes fadeOutUp { + 0% { + opacity: 1; + -webkit-transform: translateY(0); + } + 100% { + opacity: 0; + -webkit-transform: translateY(-200px); + /*-webkit-transform: scale(0,0); */ + height: 0px; + } + } + @keyframes fadeOutUp { + 0% { + opacity: 1; + transform: translateY(0); + } + 100% { + opacity: 0; + transform: translateY(-200px); + /*transform: scale(0,0); */ + height: 0px; + } + } + .fadeOutUp { + -webkit-animation-name: fadeOutUp; + animation-name: fadeOutUp; } .user-pane-menu{ @@ -189,7 +257,6 @@ body.noscroll -moz-border-radius: 100px; border-radius: 50px; width: 30%; - /*top: -40px;*/ position: relative; z-index: 50; } @@ -235,7 +302,6 @@ body.noscroll .user-box img{ width: 100%; border: 4px #7f7f7f solid; - -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; @@ -247,4 +313,112 @@ body.noscroll .se-menu ul a{ text-decoration: none !important; color: #7f7f7f; - } \ No newline at end of file + } + + /*Settings Style*/ + + .settingList .settingListItem:hover{ + background-color: #E2E2E2; + font-weight: bold; + } + + .settingList .settingListItemRoot{ + list-style: none; + padding: 0; + padding-left: 0; + } + + .settingList .settingListItem{ + width: 100%; + padding: 15px 0px auto 15px; + } + + + /*End Settings*/ + + + /*md Effects*/ + + .md-avatar{ + width: 40px; + height: 40px; + margin-top: 8px; + margin-bottom: 8px; + margin-right: 16px; + border-radius: 50%; + box-sizing: content-box; + } + +/*gridList Effects*/ + +md-grid-list +{ + margin: 8px; +} +.gray +{ + background:#f5f5f5; +} + +.aliceblue { + background: aliceblue; +} + .green { + background: #b9f6ca; +} + .yellow { + background: #ffff8d; +} + .blue { + background: #84ffff; +} + .purple { + background: #b388ff; +} + .red { + background: #ff8a80; +} + +.whiteframedemoBasicUsage md-whiteframe { + background: #fff; + margin: 20px; + padding: 20px; +} + + +/* md-grid-tile { + transition: all 400ms ease-out 50ms; +}*/ + +/*END gridList Effects*/ + + +.tasksContent +{ + /*float:left;*/ +} + + + md-list-item .md-no-style.md-button, md-list-item.md-no-proxy.md-button { + font-size: inherit; + height: inherit; + text-align: left; + text-transform: none; + width: 300px; + white-space: normal; +} + +/*md-list-item, md-list-item .md-list-item-inner { + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-align-items: center; + -ms-flex-align: center; + align-items: center; + min-height: 48px; + }*/ + +/*End Effects for MD*/ \ No newline at end of file diff --git a/templates/js/app.js b/templates/js/app.js index 86cbcc1..3a9b514 100644 --- a/templates/js/app.js +++ b/templates/js/app.js @@ -2,7 +2,7 @@ var DEBUG = true; var welcome = angular.module('welcome', ['ngMaterial', 'seHub.services', 'ngRoute' , 'ngCookies']); -var app = angular.module('SeHub', ['ngMaterial', 'ngRoute', 'seHub.services', 'ngCookies']); +var app = angular.module('SeHub', ['ngMaterial', 'ngRoute', 'seHub.services', 'ngCookies', 'chart.js']); welcome.config(function($mdThemingProvider) { @@ -41,8 +41,11 @@ app.config(['$routeProvider', '$locationProvider', .when('/Settings', { templateUrl: 'templates/views/settings.html', controller: 'settingsController' + }) + .when('/tasks', { + templateUrl: 'templates/views/tasks.html', + controller: 'tasksController' }); - } ]); diff --git a/templates/js/controllers/homeController.js b/templates/js/controllers/homeController.js index 46395cb..573dab3 100644 --- a/templates/js/controllers/homeController.js +++ b/templates/js/controllers/homeController.js @@ -1,9 +1,57 @@ -/** - * Created by sagi on 6/16/15. - */ angular.module('SeHub') .controller('homeController', ['$scope', '$cookies', '$cookieStore', '$window', '$location', '$mdToast', '$mdDialog', 'apiService', '$rootScope', function ($scope, $cookies, $cookieStore, $window, $location, $mdToast, $mdDialog, apiService ,$rootScope) { + var imagePath = $scope.user.avatar_url; + $scope.phones = [ + { type: 'Home', number: '(972) 865-82861' }, + { type: 'Cell', number: '(972) 5251-32309' }, + ]; + + $scope.messages = [ + { + face : imagePath, + what: 'Let me tell you a secret', + who: 'Sagi Dayan', + when: '4:15PM', + notes: " I am S'ein" + }, + { + face : imagePath, + what: 'Listen to this!', + who: 'Aran Zaiger', + when: '6:15PM', + notes: " I am gaylord ultima!!" + }, + { + face : imagePath, + what: 'Hi?', + who: 'Etye Meyer', + when: '7:45AM', + notes: " I am mega gaylord ultima" + } + ]; + + $scope.tasks = [ + { + ExNum: '1', + dueDate: '23/06/15', + notes: " Build A Game: Scrabble" + }, + { + ExNum: '3', + dueDate: '30/06/15', + notes: " Static Array" + }, + { + ExNum: '4', + dueDate: '07/07/15', + notes: " Dynamic Array" + }, + ]; + + + // animation + $scope.isEnterd = top.setIsEnterd; }]); \ No newline at end of file diff --git a/templates/js/controllers/mainController.js b/templates/js/controllers/mainController.js index bad88a9..f2eb0b4 100644 --- a/templates/js/controllers/mainController.js +++ b/templates/js/controllers/mainController.js @@ -1,78 +1,90 @@ angular.module('SeHub') - .controller('mainController', ['$scope', '$rootScope', 'apiService', '$cookies', '$location', function($scope, $rootScope, apiService, $cookies, $location) { + .controller('mainController', ['$scope', '$rootScope', 'dataService','apiService', '$cookies', '$cookieStore', '$location', '$window', - var token = $cookies['com.sehub.www']; + function($scope, $rootScope, dataService, apiService, $cookies, $cookieStore, $location, $window) { + top.setIsEnterd = true; + var token = $cookies['com.sehub.www']; - $scope.loadingData = true; - $scope.isInRegisterMode = false; + $scope.loadingData = true; + $scope.isInRegisterMode = false; - apiService.getUserByToken(token).success(function(data) { - if (data.message == 'No User Found') { - console.error("No User Found!"); - } - $scope.loadingData = false; - $scope.user = data; - console.log(data); - if ($scope.user.isFirstLogin) { - $scope.menuObj = {}; - $scope.isInRegisterMode = true; - $scope.loadingData = false; - $location.path('/register') - } else { - $location.path('/home') - } - - }) - - $scope.menuItems = [{ - "title": "Home", - "icon": "fa fa-home", - "style": "selected", - "route": "/home" - }, { - "title": "My Campuses", - "icon": "fa fa-university", - "style": "", - "route": "/campuses" - }, { - "title": "My Classes", - "icon": "fa fa-graduation-cap", - "style": "", - "route": "/campuses" - }, { - "title": "My Projects", - "icon": "fa fa-cube", - "style": "", - "route": "/campuses" - }, { - "title": "Tasks", - "icon": "fa fa-clipboard", - "style": "", - "route": "/campuses" - }, { - "title": "Settings", - "icon": "fa fa-cogs", - "style": "", - "route": "/Settings" - }, { - "title": "Log Out", - "icon": "fa fa-power-off", - "style": "", - "route": "/logout" - }]; - - $scope.menuClicked = function(item){ - var route = "" - for (var i = $scope.menuItems.length - 1; i >= 0; i--) { - if($scope.menuItems[i].title === item.title){ - $scope.menuItems[i].style="selected"; - route = $scope.menuItems[i].route; - }else{ - $scope.menuItems[i].style = ""; + apiService.getUserByToken(token).success(function(data) { + if (data.message == 'No User Found') { + console.error("No User Found!"); } - }; - $location.path(route); + $scope.loadingData = false; + $scope.user = data; + dataService.initService($scope); //Start Data Sync Service (For User) + console.log(data); + if ($scope.user.isFirstLogin) { + $scope.menuObj = {}; + $scope.isInRegisterMode = true; + $scope.loadingData = false; + $location.path('/register') + } else { + $location.path('/home') + } + + }); + + + + $scope.menuItems = [{ + "title": "Dash Board", + "icon": "fa fa-tachometer", + "style": "selected", + "route": "/home" + }, { + "title": "My Campuses", + "icon": "fa fa-university", + "style": "", + "route": "/campuses" + }, { + "title": "My Classes", + "icon": "fa fa-graduation-cap", + "style": "", + "route": "/campuses" + }, { + "title": "My Projects", + "icon": "fa fa-cube", + "style": "", + "route": "/campuses" + }, { + "title": "Tasks", + "icon": "fa fa-clipboard", + "style": "", + "route": "/tasks" + }, { + "title": "Settings", + "icon": "fa fa-cogs", + "style": "", + "route": "/Settings" + }, { + "title": "Log Out", + "icon": "fa fa-power-off", + "style": "", + "route": "/logout" + }]; + + $scope.menuClicked = function(item) { + var route = "" + if (item.title == "Log Out") { + console.info('Logging Out!'); + $cookieStore.remove('com.sehub.www'); + $window.location.href = 'http://se-hub.appspot.com'; // Reference to 'welcome' page + } + for (var i = $scope.menuItems.length - 1; i >= 0; i--) { + if ($scope.menuItems[i].title === item.title) { + $scope.menuItems[i].style = "selected"; + route = $scope.menuItems[i].route; + } else { + $scope.menuItems[i].style = ""; + } + }; + top.setIsEnterd = false; + $location.path(route); + } + + } - - - }]); \ No newline at end of file + ]); \ No newline at end of file diff --git a/templates/js/controllers/registerController.js b/templates/js/controllers/registerController.js index a2ca317..071096c 100644 --- a/templates/js/controllers/registerController.js +++ b/templates/js/controllers/registerController.js @@ -6,11 +6,11 @@ angular.module('SeHub') $scope.createCampusClicked = false; $scope.isEmpty = true; // if the academic email line is empty $scope.jsonCreateCampus = - { - "title": "Create Campus", - "email": "email_ending", - "avatar": "self.avatar.url" - } + { + "title": "Create Campus", + "email": "email_ending", + "avatar": "self.avatar.url" + } $rootScope.seToken = $cookies['com.sehub.www']; var token = $rootScope.seToken; @@ -57,10 +57,25 @@ angular.module('SeHub') $scope.submitClicked = function(ev) { var emailValid = false; + var jsonUpdateUser = + { + "lecturerStat": "$scope.user.isLecturer", + "campName": "$scope.campusName" + } + if($scope.user.AcMail != null) { var fullMail = $scope.user.AcMail + $scope.campusObj.email_ending; // Holds the full academic email of the user + apiService.updateUser($scope.user.seToken, jsonUpdateUser).success(function(data) + { + + }).error(function() + { + // TODO Error + console.log("Error occured on updateUser"); + }); + console.log("Mail: " + fullMail); apiService.sendValidationMail($scope.user.seToken, fullMail).success(function(data) diff --git a/templates/js/controllers/settingsController.js b/templates/js/controllers/settingsController.js index 4968b42..35c9531 100644 --- a/templates/js/controllers/settingsController.js +++ b/templates/js/controllers/settingsController.js @@ -1,30 +1,93 @@ angular.module('SeHub') - .controller('settingsController', ['$scope', '$rootScope', 'apiService', '$cookies', '$location', function($scope, $rootScope, apiService, $cookies, $location) { + .controller('settingsController', ['$scope', '$rootScope', 'dataService', 'apiService', '$cookies', '$location', + function($scope, $rootScope, dataService, apiService, $cookies, $location) { - var token = $cookies['com.sehub.www']; + var token = $cookies['com.sehub.www']; - $scope.loadingData = true; - $scope.isInRegisterMode = false; + $scope.loadingData = true; + $scope.isInRegisterMode = false; - $scope.title = "Settings" + $scope.title = "Settings" - apiService.getUserByToken(token).success(function(data) { - if (data.message == 'No User Found') { - console.error("No User Found!"); - } - $scope.loadingData = false; - $scope.user = data; - console.log(data); - if ($scope.user.isFirstLogin) { - $scope.menuObj = {}; - $scope.isInRegisterMode = true; + apiService.getUserByToken(token).success(function(data) { + if (data.message == 'No User Found') { + console.error("No User Found!"); + } $scope.loadingData = false; - $location.path('/register') + $scope.user = data; + console.log(data); + if ($scope.user.isFirstLogin) { + $scope.menuObj = {}; + $scope.isInRegisterMode = true; + $scope.loadingData = false; + $location.path('/register') + } + + }); + + $scope.isEditMode = false; + $scope.profileMode = "Edit Profile"; + $scope.profileModeIcon = "fa fa-pencil"; + + $scope.changeProfileMode = function() { + $scope.isEditMode = !$scope.isEditMode; + if ($scope.isEditMode) { + $scope.profileMode = "Save Profile"; + $scope.profileModeIcon = "fa fa-floppy-o"; + } else { + apiService.updateUser(token, $scope.user).success(function(data) { + console.info('User Saved'); + dataService.userBrodcast($scope.user); + + }).error(function(e) { + console.error('Fail To Save User'); + }); + $scope.profileMode = "Edit Profile"; + $scope.profileModeIcon = "fa fa-pencil"; + } } - }); + /** + * DEBUG DATA + */ + $scope.courses = [{ + "courseName": "Advance Math", + "campusName": "JCE", + "startDate": { + "year": 2015, + "month": 4, + "day": 3 + }, + "endDate": { + "year": 2016, + "month": 5, + "day": 14 + }, + "taskFlag": false, + "campus_avatar": "https://yt3.ggpht.com/--ZkWxybWGOM/AAAAAAAAAAI/AAAAAAAAAAA/_nAICC_kzzI/s88-c-k-no/photo.jpg" + }]; + + $scope.campuses = [{ + 'title': 'JCE', + 'email_ending': '@post.jce.ac.il', + 'master_user_id': 123453433341, + 'avatar_url': 'https://yt3.ggpht.com/--ZkWxybWGOM/AAAAAAAAAAI/AAAAAAAAAAA/_nAICC_kzzI/s88-c-k-no/photo.jpg' + }, { + 'title': 'Stanford', + 'email_ending': '@post.jce.ac.il', + 'master_user_id': 123453433341, + 'avatar_url': 'https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcR9M4uQgaJP1zyiCGw-dK31hU8buWqeuOi9vTXBd4Y8hQcFTZqA' + }]; + $scope.labels = ['Commits', 'Issues Assigned', 'Messages', 'Open Tasks']; + $scope.series = ['Project A', 'Project B']; + + $scope.data = [ + [54, 3, 15, 3], + [28, 48, 40, 3] + ]; - }]); \ No newline at end of file + } + ]); \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/.editorconfig b/templates/js/libs/angular-chart.js-0.7.2/.editorconfig new file mode 100644 index 0000000..8565360 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/.editorconfig @@ -0,0 +1,18 @@ +# This file is for unifying the coding style for different editors and IDEs +# editorconfig.org + +root = true + +[*] +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true + +# Tabs in JS unless otherwise specified +[**.js] +indent_style = space +indent_size = 2 + +[*.md] +trim_trailing_whitespace = false \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/.gitignore b/templates/js/libs/angular-chart.js-0.7.2/.gitignore new file mode 100644 index 0000000..aeb776d --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/.gitignore @@ -0,0 +1,4 @@ +.idea/ +node_modules/ +test/fixtures/shots/ +bower_components/ diff --git a/templates/js/libs/angular-chart.js-0.7.2/.jscsrc b/templates/js/libs/angular-chart.js-0.7.2/.jscsrc new file mode 100644 index 0000000..2095ebc --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/.jscsrc @@ -0,0 +1,80 @@ +{ + "requireCurlyBraces": [ + "try", + "catch", + "do" + ], + "requireCamelCaseOrUpperCaseIdentifiers": "ignoreProperties", + "requireCapitalizedConstructors": true, + "maximumLineLength": { + "value": 120, + "allowComments": true, + "allowRegex": true + }, + "validateIndentation": 2, + "validateQuoteMarks": "'", + + "disallowMultipleLineStrings": true, + "disallowMixedSpacesAndTabs": true, + "disallowTrailingWhitespace": true, + "disallowQuotedKeysInObjects": true, + "disallowSpaceAfterObjectKeys": true, + + "requireSpaceAfterKeywords": [ + "if", + "else", + "for", + "while", + "do", + "switch", + "return", + "try", + "catch", + "function", + "typeof" + ], + "requireSpaceBeforeBinaryOperators": [ + "=", "+=", "-=", "*=", "/=", "%=", "<<=", ">>=", ">>>=", + "&=", "|=", "^=", "+=", + + "+", "-", "*", "/", "%", "<<", ">>", ">>>", "&", + "|", "^", "&&", "||", "===", "==", ">=", + "<=", "<", ">", "!=", "!==" + ], + "requireSpaceAfterPrefixUnaryOperators": [ + "!" + ], + "requireSpacesInConditionalExpression": true, + "requireSpaceBeforeBlockStatements": true, + "requireSpacesInForStatement": true, + "requireLineFeedAtFileEnd": true, + "requireSpacesInFunctionExpression": { + "beforeOpeningCurlyBrace": true, + "beforeOpeningRoundBrace": true + }, + "requireSpacesInFunctionDeclaration": { + "beforeOpeningCurlyBrace": true, + "beforeOpeningRoundBrace": true + }, + "requireDotNotation": true, + "disallowSpacesInsideArrayBrackets": "all", + "disallowSpacesInsideParentheses": true, + + + "validateJSDoc": { + "checkParamNames": true, + "requireParamTypes": true + }, + + "disallowMultipleLineBreaks": true, + "disallowNewlineBeforeBlockStatements": true, + "disallowKeywords": [ "with" ], + + "excludeFiles": [ + "bower_components/**", + "node_modules/**", + "dist/**", + "test/coverage/**", + "examples/smoothscroll.min.js" + ] +} diff --git a/templates/js/libs/angular-chart.js-0.7.2/.jshintignore b/templates/js/libs/angular-chart.js-0.7.2/.jshintignore new file mode 100644 index 0000000..0ce3e64 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/.jshintignore @@ -0,0 +1,6 @@ +bower_components/ +node_modules/ +dist/ +tmp/ +examples/smoothscroll.min.js + diff --git a/templates/js/libs/angular-chart.js-0.7.2/.jshintrc b/templates/js/libs/angular-chart.js-0.7.2/.jshintrc new file mode 100644 index 0000000..59c7bdc --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/.jshintrc @@ -0,0 +1,22 @@ +{ + "strict" : true, // true: Requires all functions run in ES5 Strict Mode + "undef" : true, // true: Require all non-global variables to be declared (prevents global leaks) + "unused" : true, // true: Require all defined variables be used + "noempty" : true, // Prohibit use of empty blocks + "trailing" : true, // Prohibit trailing whitespaces. + "white" : false, // Check against strict whitespace and indentation rules. + "indent" : 2, // {int} Number of spaces to use for indentation + "newcap" : true, // true: Require capitalization of all constructor functions e.g. `new F()` + "quotmark" : "single", // Quotation mark consistency + "-W058" : true, // Missing '()' invoking a constructor + "browser" : true, // Standard browser globals e.g. `window`, `document`. + "predef" : [ // Custom globals. + "angular", + "G_vmlCanvasManager", + "require", + "console", + "Chart", + "define", + "module" + ] +} diff --git a/templates/js/libs/angular-chart.js-0.7.2/.travis.yml b/templates/js/libs/angular-chart.js-0.7.2/.travis.yml new file mode 100644 index 0000000..08395fd --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/.travis.yml @@ -0,0 +1,13 @@ +language: node_js +node_js: +- '0.10' +before_install: +- npm install -g bower +- bower install +- sudo apt-get install graphicsmagick +env: + global: + - secure: YWABlINoIkwl9RFLOW9G0lATEP3aiXXi+DS6TWfvQWWG/jkS5sn7IqWC2U67LjwQ0lDg0yevo3ZD7FyYQ5lr8AVuScAZ6P2o2dm9t/HBKGTG4u016dxbWWYVZ8MAlKT7TfjVD8iDzcWyZedsbpuyaNNp4pGr/CNcvq7TGdJLNkU= + - CI=1 + - TOLERANCE=0.002 + - DELAY=5000 diff --git a/templates/js/libs/angular-chart.js-0.7.2/LICENSE b/templates/js/libs/angular-chart.js-0.7.2/LICENSE new file mode 100644 index 0000000..f3bd714 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/LICENSE @@ -0,0 +1,27 @@ +Copyright (c) Jerome Touffe-Blin ("Author") +All rights reserved. + +The BSD License + +Redistribution and use in source and binary forms, with or without +modification, are permitted provided that the following conditions +are met: + +1. Redistributions of source code must retain the above copyright + notice, this list of conditions and the following disclaimer. + +2. 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. + +THIS SOFTWARE IS PROVIDED BY THE AUTHOR 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 AUTHOR 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 diff --git a/templates/js/libs/angular-chart.js-0.7.2/README.md b/templates/js/libs/angular-chart.js-0.7.2/README.md new file mode 100644 index 0000000..28f65a1 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/README.md @@ -0,0 +1,175 @@ +# angular-chart.js + +[![Bower version](https://badge.fury.io/bo/angular-chart.js.svg)](http://badge.fury.io/bo/angular-chart.js) +[![npm version](https://badge.fury.io/js/angular-chart.js.svg)](http://badge.fury.io/js/angular-chart.js) +[![Build Status](https://travis-ci.org/jtblin/angular-chart.js.png)](https://travis-ci.org/jtblin/angular-chart.js) +[![Code Climate](https://codeclimate.com/github/jtblin/angular-chart.js/badges/gpa.svg)](https://codeclimate.com/github/jtblin/angular-chart.js) + +Beautiful, reactive, responsive charts for Angular.JS using [Chart.js](http://www.chartjs.org/). + +[Demo](http://jtblin.github.io/angular-chart.js/) + +# Installation + + bower install angular-chart.js --save + +or copy the files from `dist/`. Then add the sources to your code (adjust paths as needed) after +adding the dependencies for Angular and Chart.js first: + +```html + + + +``` + +# Utilisation + +There are 6 types of charts so 6 directives: `chart-line`, `chart-bar`, `chart-radar`, `chart-pie`, +`chart-polar-area`, `chart-doughnut`. + +They all use mostly the same API: + +- `data`: series data +- `labels`: x axis labels (line, bar, radar) or series labels (pie, doughnut, polar area) +- `options`: chart options (as from [Chart.js documentation](http://www.chartjs.org/docs/)) +- `series`: (default: `[]`): series labels (line, bar, radar) +- `colours`: data colours (will use default colours if not specified) +- `getColour`: function that returns a colour in case there are not enough (will use random colours if not specified) +- `click`: onclick event handler +- `hover`: onmousemove event handler +- `legend`: (default: `false`): show legend below the chart + +There is another directive `chart-base` that takes an extra attribute `chart-type` to define the type +dynamically, see [stacked bar example](http://jtblin.github.io/angular-chart.js/examples/stacked-bars.html). + +## Browser compatibility + +For IE8 and older browsers, you will need +to include [excanvas](https://code.google.com/p/explorercanvas/wiki/Instructions). +You will also need [shims](https://github.com/es-shims/es5-shim) for ES5 functions. + +```html + + + + +``` + +# Example + +## Markup + +```html + +``` + +## Javascript + +```javascript +angular.module("app", ["chart.js"]) + // Optional configuration + .config(['ChartJsProvider', function (ChartJsProvider) { + // Configure all charts + ChartJsProvider.setOptions({ + colours: ['#FF5252', '#FF8A80'], + responsive: false + }); + // Configure all line charts + ChartJsProvider.setOptions('Line', { + datasetFill: false + }); + }]) + .controller("LineCtrl", ['$scope', '$timeout', function ($scope, $timeout) { + + $scope.labels = ["January", "February", "March", "April", "May", "June", "July"]; + $scope.series = ['Series A', 'Series B']; + $scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + $scope.onClick = function (points, evt) { + console.log(points, evt); + }; + + // Simulate async data update + $timeout(function () { + $scope.data = [ + [28, 48, 40, 19, 86, 27, 90], + [65, 59, 80, 81, 56, 55, 40] + ]; + }, 3000); +}]); +``` + +## Reactive + +angular-chart.js watch updates on data, series, labels, colours and options and will update, or destroy and recreate, +the chart on changes. + +## Events + +angular-chart.js emits the following events on the `scope` and pass the chart as argument: + +* `create`: when chart is created +* `update`: when chart is updated + +``` +$scope.$on('create', function (event, chart) { + console.log(chart); +}); +``` + +**Note**: the event can be emitted multiple times for each chart as the chart can be destroyed and +created multiple times during angular `watch` lifecycle. + +angular-chart.js listen to the scope `destroy` event and destroy the chart when it happens. + +## Colours + +There are a set of 7 default colours. Colours can be replaced using the `colours` attribute. +If there is more data than colours, colours are generated randomly or can be provided +via a function through the `getColour` attribute. + +Hex colours are converted to Chart.js colours automatically, +including different shades for highlight, fill, stroke, etc. + +# Issues + +**Issues or feature requests for Chart.js (e.g. new chart type, new axis, etc.) need to be opened on +[Chart.js issues tracker](https://github.com/nnnick/Chart.js/issues)** + +Please check if issue exists and otherwise open issue in [github](https://github.com/jtblin/angular-chart.js/issues). +**Please add a link to a plunker, jsbin, or equivalent.** +Here is a [jsbin template](http://jsbin.com/dufibi/3/edit?html,js,output) for convenience. + +# Contributing + +Pull requests welcome! + +1. Fork the repo +1. Make your changes +1. Run tests: `npm test` +1. Submit pull request + +## Contributors + +Thank you! + +* [@jantimon](https://twitter.com/jantimon) +* [RevanProdigalKnight](https://github.com/RevanProdigalKnight) +* [@ManuelRauber](https://twitter.com/ManuelRauber) +* [@vad710](https://twitter.com/vad710) +* [@JAAulde](https://twitter.com/JAAulde) +* [@offsky](https://twitter.com/offsky) +* [@jonathansampson](https://twitter.com/jonathansampson) +* [@idangozlan](https://twitter.com/idangozlan) + +# Author + +Jerome Touffe-Blin, [@jtblin](https://twitter.com/jtblin), [About me](http://about.me/jtblin) + +# License + +angular-chart.js is copyright 2015 Jerome Touffe-Blin and contributors. +It is licensed under the BSD license. See the include LICENSE file for details. diff --git a/templates/js/libs/angular-chart.js-0.7.2/angular-chart.js b/templates/js/libs/angular-chart.js-0.7.2/angular-chart.js new file mode 100644 index 0000000..158f3ed --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/angular-chart.js @@ -0,0 +1,301 @@ +(function (factory) { + 'use strict'; + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['angular', 'chart.js'], factory); + } else if (typeof exports === 'object') { + // Node/CommonJS + module.exports = factory(require('angular'), require('chart.js')); + } else { + // Browser globals + factory(angular, Chart); + } +}(function (angular, Chart) { + 'use strict'; + + Chart.defaults.global.responsive = true; + Chart.defaults.global.multiTooltipTemplate = '<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>'; + + Chart.defaults.global.colours = [ + '#97BBCD', // blue + '#DCDCDC', // light grey + '#F7464A', // red + '#46BFBD', // green + '#FDB45C', // yellow + '#949FB1', // grey + '#4D5360' // dark grey + ]; + + angular.module('chart.js', []) + .provider('ChartJs', ChartJsProvider) + .factory('ChartJsFactory', ['ChartJs', ChartJsFactory]) + .directive('chartBase', function (ChartJsFactory) { return new ChartJsFactory(); }) + .directive('chartLine', function (ChartJsFactory) { return new ChartJsFactory('Line'); }) + .directive('chartBar', function (ChartJsFactory) { return new ChartJsFactory('Bar'); }) + .directive('chartRadar', function (ChartJsFactory) { return new ChartJsFactory('Radar'); }) + .directive('chartDoughnut', function (ChartJsFactory) { return new ChartJsFactory('Doughnut'); }) + .directive('chartPie', function (ChartJsFactory) { return new ChartJsFactory('Pie'); }) + .directive('chartPolarArea', function (ChartJsFactory) { return new ChartJsFactory('PolarArea'); }); + + /** + * Wrapper for chart.js + * Allows configuring chart js using the provider + * + * angular.module('myModule', ['chart.js']).config(function(ChartJsProvider) { + * ChartJsProvider.setOptions({ responsive: true }); + * ChartJsProvider.setOptions('Line', { responsive: false }); + * }))) + */ + function ChartJsProvider () { + var options = {}; + var ChartJs = { + Chart: Chart, + getOptions: function (type) { + var typeOptions = type && options[type] || {}; + return angular.extend({}, options, typeOptions); + } + }; + + /** + * Allow to set global options during configuration + */ + this.setOptions = function (type, customOptions) { + // If no type was specified set option for the global object + if (! customOptions) { + customOptions = type; + options = angular.extend(options, customOptions); + return; + } + // Set options for the specific chart + options[type] = angular.extend(options[type] || {}, customOptions); + }; + + this.$get = function () { + return ChartJs; + }; + } + + function ChartJsFactory (ChartJs) { + return function chart (type) { + return { + restrict: 'CA', + scope: { + data: '=', + labels: '=', + options: '=', + series: '=', + colours: '=?', + getColour: '=?', + chartType: '=', + legend: '@', + click: '=', + hover: '=' + }, + link: function (scope, elem/*, attrs */) { + var chart, container = document.createElement('div'); + container.className = 'chart-container'; + elem.replaceWith(container); + container.appendChild(elem[0]); + + if (typeof window.G_vmlCanvasManager === 'object' && window.G_vmlCanvasManager !== null) { + if (typeof window.G_vmlCanvasManager.initElement === 'function') { + window.G_vmlCanvasManager.initElement(elem[0]); + } + } + + // Order of setting "watch" matter + + scope.$watch('data', function (newVal, oldVal) { + if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) return; + var chartType = type || scope.chartType; + if (! chartType) return; + + if (chart) { + if (canUpdateChart(newVal, oldVal)) return updateChart(chart, newVal, scope); + chart.destroy(); + } + + chart = createChart(chartType, scope, elem); + }, true); + + scope.$watch('series', resetChart, true); + scope.$watch('labels', resetChart, true); + scope.$watch('options', resetChart, true); + scope.$watch('colours', resetChart, true); + + scope.$watch('chartType', function (newVal, oldVal) { + if (isEmpty(newVal)) return; + if (angular.equals(newVal, oldVal)) return; + if (chart) chart.destroy(); + chart = createChart(newVal, scope, elem); + }); + + scope.$on('$destroy', function () { + if (chart) chart.destroy(); + }); + + function resetChart (newVal, oldVal) { + if (isEmpty(newVal)) return; + if (angular.equals(newVal, oldVal)) return; + var chartType = type || scope.chartType; + if (! chartType) return; + + // chart.update() doesn't work for series and labels + // so we have to re-create the chart entirely + if (chart) chart.destroy(); + + chart = createChart(chartType, scope, elem); + } + } + }; + }; + + function canUpdateChart (newVal, oldVal) { + if (newVal && oldVal && newVal.length && oldVal.length) { + return Array.isArray(newVal[0]) ? + newVal.length === oldVal.length && newVal[0].length === oldVal[0].length : + oldVal.reduce(sum, 0) > 0 ? newVal.length === oldVal.length : false; + } + return false; + } + + function sum (carry, val) { + return carry + val; + } + + function createChart (type, scope, elem) { + if (! scope.data || ! scope.data.length) return; + scope.getColour = typeof scope.getColour === 'function' ? scope.getColour : getRandomColour; + scope.colours = getColours(type, scope); + var cvs = elem[0], ctx = cvs.getContext('2d'); + var data = Array.isArray(scope.data[0]) ? + getDataSets(scope.labels, scope.data, scope.series || [], scope.colours) : + getData(scope.labels, scope.data, scope.colours); + var options = angular.extend({}, ChartJs.getOptions(type), scope.options); + var chart = new ChartJs.Chart(ctx)[type](data, options); + scope.$emit('create', chart); + + ['hover', 'click'].forEach(function (action) { + if (scope[action]) cvs[action === 'click' ? 'onclick' : 'onmousemove'] = getEventHandler(scope, chart, action); + }); + if (scope.legend && scope.legend !== 'false') setLegend(elem, chart); + return chart; + } + + function getEventHandler (scope, chart, action) { + return function (evt) { + var atEvent = chart.getPointsAtEvent || chart.getBarsAtEvent || chart.getSegmentsAtEvent; + if (atEvent) { + var activePoints = atEvent.call(chart, evt); + scope[action](activePoints, evt); + scope.$apply(); + } + }; + } + + function getColours (type, scope) { + var colours = angular.copy(scope.colours || + ChartJs.getOptions(type).colours || + Chart.defaults.global.colours + ); + while (colours.length < scope.data.length) { + colours.push(scope.getColour()); + } + return colours.map(convertColour); + } + + function convertColour (colour) { + if (typeof colour === 'object' && colour !== null) return colour; + if (typeof colour === 'string' && colour[0] === '#') return getColour(hexToRgb(colour.substr(1))); + return getRandomColour(); + } + + function getRandomColour () { + var colour = [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)]; + return getColour(colour); + } + + function getColour (colour) { + return { + fillColor: rgba(colour, 0.2), + strokeColor: rgba(colour, 1), + pointColor: rgba(colour, 1), + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: rgba(colour, 0.8) + }; + } + + function getRandomInt (min, max) { + return Math.floor(Math.random() * (max - min + 1)) + min; + } + + function rgba (colour, alpha) { + return 'rgba(' + colour.concat(alpha).join(',') + ')'; + } + + // Credit: http://stackoverflow.com/a/11508164/1190235 + function hexToRgb (hex) { + var bigint = parseInt(hex, 16), + r = (bigint >> 16) & 255, + g = (bigint >> 8) & 255, + b = bigint & 255; + + return [r, g, b]; + } + + function getDataSets (labels, data, series, colours) { + return { + labels: labels, + datasets: data.map(function (item, i) { + return angular.extend({}, colours[i], { + label: series[i], + data: item + }); + }) + }; + } + + function getData (labels, data, colours) { + return labels.map(function (label, i) { + return angular.extend({}, colours[i], { + label: label, + value: data[i], + color: colours[i].strokeColor, + highlight: colours[i].pointHighlightStroke + }); + }); + } + + function setLegend (elem, chart) { + var $parent = elem.parent(), + $oldLegend = $parent.find('chart-legend'), + legend = '' + chart.generateLegend() + ''; + if ($oldLegend.length) $oldLegend.replaceWith(legend); + else $parent.append(legend); + } + + function updateChart (chart, values, scope) { + if (Array.isArray(scope.data[0])) { + chart.datasets.forEach(function (dataset, i) { + (dataset.points || dataset.bars).forEach(function (dataItem, j) { + dataItem.value = values[i][j]; + }); + }); + } else { + chart.segments.forEach(function (segment, i) { + segment.value = values[i]; + }); + } + chart.update(); + scope.$emit('update', chart); + } + + function isEmpty (value) { + return ! value || + (Array.isArray(value) && ! value.length) || + (typeof value === 'object' && ! Object.keys(value).length); + } + + } +})); diff --git a/templates/js/libs/angular-chart.js-0.7.2/angular-chart.less b/templates/js/libs/angular-chart.js-0.7.2/angular-chart.less new file mode 100644 index 0000000..ba6b18d --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/angular-chart.less @@ -0,0 +1,30 @@ +.chart-legend, .bar-legend, .line-legend, .pie-legend, .radar-legend, .polararea-legend, .doughnut-legend { + list-style-type: none; + margin-top: 5px; + text-align: center; + /* NOTE: Browsers automatically add 40px of padding-left to all lists, so we should offset that, otherwise the legend is off-center */ + -webkit-padding-start:0; /* Webkit */ + -moz-padding-start:0; /* Mozilla */ + padding-left:0; /* IE (handles all cases, really, but we should also include the vendor-specific properties just to be safe) */ + + li { + display: inline-block; + white-space: nowrap; + position: relative; + margin-bottom: 4px; + border-radius: 5px; + padding: 2px 8px 2px 28px; + font-size: smaller; + cursor: default; + + span { + display: block; + position: absolute; + left: 0; + top: 0; + width: 20px; + height: 20px; + border-radius: 5px; + } + } +} diff --git a/templates/js/libs/angular-chart.js-0.7.2/bower.json b/templates/js/libs/angular-chart.js-0.7.2/bower.json new file mode 100644 index 0000000..df8c612 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/bower.json @@ -0,0 +1,56 @@ +{ + "name": "angular-chart.js", + "version": "0.7.2", + "main": [ + "./dist/angular-chart.js", + "./dist/angular-chart.css" + ], + "authors": [ + "Jerome Touffe-Blin " + ], + "repository": { + "type": "git", + "url": "git://github.com/jtblin/angular-chart.js.git" + }, + "description": "An angular.js wrapper for Chart.js - reactive, responsive, beautiful charts.", + "moduleType": [ + "globals" + ], + "keywords": [ + "angular", + "angular.js", + "chartjs", + "chart", + "reactive", + "responsive", + "graph", + "bar", + "line", + "area", + "donut" + ], + "license": "BSD", + "ignore": [ + "**/.*", + "node_modules", + "bower_components", + "test", + "tests" + ], + "dependencies": { + "angular": "1.x", + "Chart.js": "~1.0.1" + }, + "devDependencies": { + "angular-bootstrap": "~0.11.0", + "font-awesome": "~4.1.0", + "rainbow": "~1.1.9", + "Chart.StackedBar.js": "~1.0.1", + "angular-mocks": "~1.3.10" + }, + "resolutions": { + "Chart.js": "~1.0.1", + "angular": "1.x", + "angular-mocks": "1.3.10" + } +} diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.css b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.css new file mode 100644 index 0000000..ac9de0f --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.css @@ -0,0 +1,2 @@ +.chart-legend,.bar-legend,.line-legend,.pie-legend,.radar-legend,.polararea-legend,.doughnut-legend{list-style-type:none;margin-top:5px;text-align:center;-webkit-padding-start:0;-moz-padding-start:0;padding-left:0}.chart-legend li,.bar-legend li,.line-legend li,.pie-legend li,.radar-legend li,.polararea-legend li,.doughnut-legend li{display:inline-block;white-space:nowrap;position:relative;margin-bottom:4px;border-radius:5px;padding:2px 8px 2px 28px;font-size:smaller;cursor:default}.chart-legend li span,.bar-legend li span,.line-legend li span,.pie-legend li span,.radar-legend li span,.polararea-legend li span,.doughnut-legend li span{display:block;position:absolute;left:0;top:0;width:20px;height:20px;border-radius:5px} +/*# sourceMappingURL=angular-chart.css.map */ \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.css.map b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.css.map new file mode 100755 index 0000000..2293371 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["angular-chart.less"],"names":[],"mappings":"AAAA;AAAe;AAAa;AAAc;AAAa;AAAe;AAAmB;EACvF,qBAAA;EACA,eAAA;EACA,kBAAA;;EAEA,wBAAA;;EACA,qBAAA;;EACA,eAAA;;;AAPF,aASE;AATa,WASb;AAT0B,YAS1B;AATwC,WASxC;AATqD,aASrD;AAToE,iBASpE;AATuF,gBASvF;EACE,qBAAA;EACA,mBAAA;EACA,kBAAA;EACA,kBAAA;EACA,kBAAA;EACA,yBAAA;EACA,kBAAA;EACA,eAAA;;AAjBJ,aASE,GAUE;AAnBW,WASb,GAUE;AAnBwB,YAS1B,GAUE;AAnBsC,WASxC,GAUE;AAnBmD,aASrD,GAUE;AAnBkE,iBASpE,GAUE;AAnBqF,gBASvF,GAUE;EACE,cAAA;EACA,kBAAA;EACA,OAAA;EACA,MAAA;EACA,WAAA;EACA,YAAA;EACA,kBAAA","file":"angular-chart.css","sourcesContent":[".chart-legend, .bar-legend, .line-legend, .pie-legend, .radar-legend, .polararea-legend, .doughnut-legend {\n list-style-type: none;\n margin-top: 5px;\n text-align: center;\n /* NOTE: Browsers automatically add 40px of padding-left to all lists, so we should offset that, otherwise the legend is off-center */\n -webkit-padding-start:0; /* Webkit */\n -moz-padding-start:0; /* Mozilla */\n padding-left:0; /* IE (handles all cases, really, but we should also include the vendor-specific properties just to be safe) */\n\n li {\n display: inline-block;\n white-space: nowrap;\n position: relative;\n margin-bottom: 4px;\n border-radius: 5px;\n padding: 2px 8px 2px 28px;\n font-size: smaller;\n cursor: default;\n\n span {\n display: block;\n position: absolute;\n left: 0;\n top: 0;\n width: 20px;\n height: 20px;\n border-radius: 5px;\n }\n }\n}\n"],"sourceRoot":"/source/"} \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.js b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.js new file mode 100644 index 0000000..228ff26 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.js @@ -0,0 +1,301 @@ +(function (factory) { + 'use strict'; + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module. + define(['angular', 'chart.js'], factory); + } else if (typeof exports === 'object') { + // Node/CommonJS + module.exports = factory(require('angular'), require('chart.js')); + } else { + // Browser globals + factory(angular, Chart); + } +}(function (angular, Chart) { + 'use strict'; + + Chart.defaults.global.responsive = true; + Chart.defaults.global.multiTooltipTemplate = '<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>'; + + Chart.defaults.global.colours = [ + '#97BBCD', // blue + '#DCDCDC', // light grey + '#F7464A', // red + '#46BFBD', // green + '#FDB45C', // yellow + '#949FB1', // grey + '#4D5360' // dark grey + ]; + + angular.module('chart.js', []) + .provider('ChartJs', ChartJsProvider) + .factory('ChartJsFactory', ['ChartJs', ChartJsFactory]) + .directive('chartBase', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory(); }]) + .directive('chartLine', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Line'); }]) + .directive('chartBar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Bar'); }]) + .directive('chartRadar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Radar'); }]) + .directive('chartDoughnut', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Doughnut'); }]) + .directive('chartPie', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Pie'); }]) + .directive('chartPolarArea', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('PolarArea'); }]); + + /** + * Wrapper for chart.js + * Allows configuring chart js using the provider + * + * angular.module('myModule', ['chart.js']).config(function(ChartJsProvider) { + * ChartJsProvider.setOptions({ responsive: true }); + * ChartJsProvider.setOptions('Line', { responsive: false }); + * }))) + */ + function ChartJsProvider () { + var options = {}; + var ChartJs = { + Chart: Chart, + getOptions: function (type) { + var typeOptions = type && options[type] || {}; + return angular.extend({}, options, typeOptions); + } + }; + + /** + * Allow to set global options during configuration + */ + this.setOptions = function (type, customOptions) { + // If no type was specified set option for the global object + if (! customOptions) { + customOptions = type; + options = angular.extend(options, customOptions); + return; + } + // Set options for the specific chart + options[type] = angular.extend(options[type] || {}, customOptions); + }; + + this.$get = function () { + return ChartJs; + }; + } + + function ChartJsFactory (ChartJs) { + return function chart (type) { + return { + restrict: 'CA', + scope: { + data: '=', + labels: '=', + options: '=', + series: '=', + colours: '=?', + getColour: '=?', + chartType: '=', + legend: '@', + click: '=', + hover: '=' + }, + link: function (scope, elem/*, attrs */) { + var chart, container = document.createElement('div'); + container.className = 'chart-container'; + elem.replaceWith(container); + container.appendChild(elem[0]); + + if (typeof window.G_vmlCanvasManager === 'object' && window.G_vmlCanvasManager !== null) { + if (typeof window.G_vmlCanvasManager.initElement === 'function') { + window.G_vmlCanvasManager.initElement(elem[0]); + } + } + + // Order of setting "watch" matter + + scope.$watch('data', function (newVal, oldVal) { + if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) return; + var chartType = type || scope.chartType; + if (! chartType) return; + + if (chart) { + if (canUpdateChart(newVal, oldVal)) return updateChart(chart, newVal, scope); + chart.destroy(); + } + + chart = createChart(chartType, scope, elem); + }, true); + + scope.$watch('series', resetChart, true); + scope.$watch('labels', resetChart, true); + scope.$watch('options', resetChart, true); + scope.$watch('colours', resetChart, true); + + scope.$watch('chartType', function (newVal, oldVal) { + if (isEmpty(newVal)) return; + if (angular.equals(newVal, oldVal)) return; + if (chart) chart.destroy(); + chart = createChart(newVal, scope, elem); + }); + + scope.$on('$destroy', function () { + if (chart) chart.destroy(); + }); + + function resetChart (newVal, oldVal) { + if (isEmpty(newVal)) return; + if (angular.equals(newVal, oldVal)) return; + var chartType = type || scope.chartType; + if (! chartType) return; + + // chart.update() doesn't work for series and labels + // so we have to re-create the chart entirely + if (chart) chart.destroy(); + + chart = createChart(chartType, scope, elem); + } + } + }; + }; + + function canUpdateChart (newVal, oldVal) { + if (newVal && oldVal && newVal.length && oldVal.length) { + return Array.isArray(newVal[0]) ? + newVal.length === oldVal.length && newVal[0].length === oldVal[0].length : + oldVal.reduce(sum, 0) > 0 ? newVal.length === oldVal.length : false; + } + return false; + } + + function sum (carry, val) { + return carry + val; + } + + function createChart (type, scope, elem) { + if (! scope.data || ! scope.data.length) return; + scope.getColour = typeof scope.getColour === 'function' ? scope.getColour : getRandomColour; + scope.colours = getColours(type, scope); + var cvs = elem[0], ctx = cvs.getContext('2d'); + var data = Array.isArray(scope.data[0]) ? + getDataSets(scope.labels, scope.data, scope.series || [], scope.colours) : + getData(scope.labels, scope.data, scope.colours); + var options = angular.extend({}, ChartJs.getOptions(type), scope.options); + var chart = new ChartJs.Chart(ctx)[type](data, options); + scope.$emit('create', chart); + + ['hover', 'click'].forEach(function (action) { + if (scope[action]) cvs[action === 'click' ? 'onclick' : 'onmousemove'] = getEventHandler(scope, chart, action); + }); + if (scope.legend && scope.legend !== 'false') setLegend(elem, chart); + return chart; + } + + function getEventHandler (scope, chart, action) { + return function (evt) { + var atEvent = chart.getPointsAtEvent || chart.getBarsAtEvent || chart.getSegmentsAtEvent; + if (atEvent) { + var activePoints = atEvent.call(chart, evt); + scope[action](activePoints, evt); + scope.$apply(); + } + }; + } + + function getColours (type, scope) { + var colours = angular.copy(scope.colours || + ChartJs.getOptions(type).colours || + Chart.defaults.global.colours + ); + while (colours.length < scope.data.length) { + colours.push(scope.getColour()); + } + return colours.map(convertColour); + } + + function convertColour (colour) { + if (typeof colour === 'object' && colour !== null) return colour; + if (typeof colour === 'string' && colour[0] === '#') return getColour(hexToRgb(colour.substr(1))); + return getRandomColour(); + } + + function getRandomColour () { + var colour = [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)]; + return getColour(colour); + } + + function getColour (colour) { + return { + fillColor: rgba(colour, 0.2), + strokeColor: rgba(colour, 1), + pointColor: rgba(colour, 1), + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: rgba(colour, 0.8) + }; + } + + function getRandomInt (min, max) { + return Math.floor(Math.random() * (max - min + 1)) + min; + } + + function rgba (colour, alpha) { + return 'rgba(' + colour.concat(alpha).join(',') + ')'; + } + + // Credit: http://stackoverflow.com/a/11508164/1190235 + function hexToRgb (hex) { + var bigint = parseInt(hex, 16), + r = (bigint >> 16) & 255, + g = (bigint >> 8) & 255, + b = bigint & 255; + + return [r, g, b]; + } + + function getDataSets (labels, data, series, colours) { + return { + labels: labels, + datasets: data.map(function (item, i) { + return angular.extend({}, colours[i], { + label: series[i], + data: item + }); + }) + }; + } + + function getData (labels, data, colours) { + return labels.map(function (label, i) { + return angular.extend({}, colours[i], { + label: label, + value: data[i], + color: colours[i].strokeColor, + highlight: colours[i].pointHighlightStroke + }); + }); + } + + function setLegend (elem, chart) { + var $parent = elem.parent(), + $oldLegend = $parent.find('chart-legend'), + legend = '' + chart.generateLegend() + ''; + if ($oldLegend.length) $oldLegend.replaceWith(legend); + else $parent.append(legend); + } + + function updateChart (chart, values, scope) { + if (Array.isArray(scope.data[0])) { + chart.datasets.forEach(function (dataset, i) { + (dataset.points || dataset.bars).forEach(function (dataItem, j) { + dataItem.value = values[i][j]; + }); + }); + } else { + chart.segments.forEach(function (segment, i) { + segment.value = values[i]; + }); + } + chart.update(); + scope.$emit('update', chart); + } + + function isEmpty (value) { + return ! value || + (Array.isArray(value) && ! value.length) || + (typeof value === 'object' && ! Object.keys(value).length); + } + + } +})); diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.js.tar.gz b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.js.tar.gz new file mode 100755 index 0000000..79a7373 Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.js.tar.gz differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.min.js b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.min.js new file mode 100644 index 0000000..aec38e4 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.min.js @@ -0,0 +1,2 @@ +!function(t){"use strict";"function"==typeof define&&define.amd?define(["angular","chart.js"],t):"object"==typeof exports?module.exports=t(require("angular"),require("chart.js")):t(angular,Chart)}(function(t,e){"use strict";function n(){var n={},r={Chart:e,getOptions:function(e){var r=e&&n[e]||{};return t.extend({},n,r)}};this.setOptions=function(e,r){return r?(n[e]=t.extend(n[e]||{},r),void 0):(r=e,n=t.extend(n,r),void 0)},this.$get=function(){return r}}function r(n){function r(t,e){return t&&e&&t.length&&e.length?Array.isArray(t[0])?t.length===e.length&&t[0].length===e[0].length:e.reduce(a,0)>0?t.length===e.length:!1:!1}function a(t,e){return t+e}function o(e,r,a){if(r.data&&r.data.length){r.getColour="function"==typeof r.getColour?r.getColour:l,r.colours=c(e,r);var o=a[0],u=o.getContext("2d"),s=Array.isArray(r.data[0])?g(r.labels,r.data,r.series||[],r.colours):p(r.labels,r.data,r.colours),f=t.extend({},n.getOptions(e),r.options),h=new n.Chart(u)[e](s,f);return r.$emit("create",h),["hover","click"].forEach(function(t){r[t]&&(o["click"===t?"onclick":"onmousemove"]=i(r,h,t))}),r.legend&&"false"!==r.legend&&v(a,h),h}}function i(t,e,n){return function(r){var a=e.getPointsAtEvent||e.getBarsAtEvent||e.getSegmentsAtEvent;if(a){var o=a.call(e,r);t[n](o,r),t.$apply()}}}function c(r,a){for(var o=t.copy(a.colours||n.getOptions(r).colours||e.defaults.global.colours);o.length>16&255,r=e>>8&255,a=255&e;return[n,r,a]}function g(e,n,r,a){return{labels:e,datasets:n.map(function(e,n){return t.extend({},a[n],{label:r[n],data:e})})}}function p(e,n,r){return e.map(function(e,a){return t.extend({},r[a],{label:e,value:n[a],color:r[a].strokeColor,highlight:r[a].pointHighlightStroke})})}function v(t,e){var n=t.parent(),r=n.find("chart-legend"),a=""+e.generateLegend()+"";r.length?r.replaceWith(a):n.append(a)}function y(t,e,n){Array.isArray(n.data[0])?t.datasets.forEach(function(t,n){(t.points||t.bars).forEach(function(t,r){t.value=e[n][r]})}):t.segments.forEach(function(t,n){t.value=e[n]}),t.update(),n.$emit("update",t)}function C(t){return!t||Array.isArray(t)&&!t.length||"object"==typeof t&&!Object.keys(t).length}return function(e){return{restrict:"CA",scope:{data:"=",labels:"=",options:"=",series:"=",colours:"=?",getColour:"=?",chartType:"=",legend:"@",click:"=",hover:"="},link:function(n,a){function i(r,i){if(!C(r)&&!t.equals(r,i)){var u=e||n.chartType;u&&(c&&c.destroy(),c=o(u,n,a))}}var c,u=document.createElement("div");u.className="chart-container",a.replaceWith(u),u.appendChild(a[0]),"object"==typeof window.G_vmlCanvasManager&&null!==window.G_vmlCanvasManager&&"function"==typeof window.G_vmlCanvasManager.initElement&&window.G_vmlCanvasManager.initElement(a[0]),n.$watch("data",function(t,i){if(t&&t.length&&(!Array.isArray(t[0])||t[0].length)){var u=e||n.chartType;if(u){if(c){if(r(t,i))return y(c,t,n);c.destroy()}c=o(u,n,a)}}},!0),n.$watch("series",i,!0),n.$watch("labels",i,!0),n.$watch("options",i,!0),n.$watch("colours",i,!0),n.$watch("chartType",function(e,r){C(e)||t.equals(e,r)||(c&&c.destroy(),c=o(e,n,a))}),n.$on("$destroy",function(){c&&c.destroy()})}}}}e.defaults.global.responsive=!0,e.defaults.global.multiTooltipTemplate="<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>",e.defaults.global.colours=["#97BBCD","#DCDCDC","#F7464A","#46BFBD","#FDB45C","#949FB1","#4D5360"],t.module("chart.js",[]).provider("ChartJs",n).factory("ChartJsFactory",["ChartJs",r]).directive("chartBase",["ChartJsFactory",function(t){return new t}]).directive("chartLine",["ChartJsFactory",function(t){return new t("Line")}]).directive("chartBar",["ChartJsFactory",function(t){return new t("Bar")}]).directive("chartRadar",["ChartJsFactory",function(t){return new t("Radar")}]).directive("chartDoughnut",["ChartJsFactory",function(t){return new t("Doughnut")}]).directive("chartPie",["ChartJsFactory",function(t){return new t("Pie")}]).directive("chartPolarArea",["ChartJsFactory",function(t){return new t("PolarArea")}])}); +//# sourceMappingURL=angular-chart.min.js.map \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.min.js.map b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.min.js.map new file mode 100644 index 0000000..980b3c0 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/dist/angular-chart.min.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["angular-chart.min.js"],"names":["factory","define","amd","exports","module","require","angular","Chart","ChartJsProvider","options","ChartJs","getOptions","type","typeOptions","extend","this","setOptions","customOptions","$get","ChartJsFactory","canUpdateChart","newVal","oldVal","length","Array","isArray","reduce","sum","carry","val","createChart","scope","elem","data","getColour","getRandomColour","colours","getColours","cvs","ctx","getContext","getDataSets","labels","series","getData","chart","$emit","forEach","action","getEventHandler","legend","setLegend","evt","atEvent","getPointsAtEvent","getBarsAtEvent","getSegmentsAtEvent","activePoints","call","$apply","copy","defaults","global","push","map","convertColour","colour","hexToRgb","substr","getRandomInt","fillColor","rgba","strokeColor","pointColor","pointStrokeColor","pointHighlightFill","pointHighlightStroke","min","max","Math","floor","random","alpha","concat","join","hex","bigint","parseInt","r","g","b","datasets","item","i","label","value","color","highlight","$parent","parent","$oldLegend","find","generateLegend","replaceWith","append","updateChart","values","dataset","points","bars","dataItem","j","segments","segment","update","isEmpty","Object","keys","restrict","chartType","click","hover","link","resetChart","equals","destroy","container","document","createElement","className","appendChild","window","G_vmlCanvasManager","initElement","$watch","$on","responsive","multiTooltipTemplate","provider","directive"],"mappings":"CAAC,SAAUA,GACT,YACsB,mBAAXC,SAAyBA,OAAOC,IAEzCD,QAAQ,UAAW,YAAaD,GACJ,gBAAZG,SAEhBC,OAAOD,QAAUH,EAAQK,QAAQ,WAAYA,QAAQ,aAGrDL,EAAQM,QAASC,QAEnB,SAAUD,EAASC,GACnB,YAmCA,SAASC,KACP,GAAIC,MACAC,GACFH,MAAOA,EACPI,WAAY,SAAUC,GACpB,GAAIC,GAAcD,GAAQH,EAAQG,MAClC,OAAON,GAAQQ,UAAWL,EAASI,IAOvCE,MAAKC,WAAa,SAAUJ,EAAMK,GAEhC,MAAMA,IAMNR,EAAQG,GAAQN,EAAQQ,OAAOL,EAAQG,OAAaK,GAApDR,SALEQ,EAAgBL,EAChBH,EAAUH,EAAQQ,OAAOL,EAASQ,GAClC,SAMJF,KAAKG,KAAO,WACV,MAAOR,IAIX,QAASS,GAAgBT,GA2EvB,QAASU,GAAgBC,EAAQC,GAC/B,MAAID,IAAUC,GAAUD,EAAOE,QAAUD,EAAOC,OACvCC,MAAMC,QAAQJ,EAAO,IAC5BA,EAAOE,SAAWD,EAAOC,QAAUF,EAAO,GAAGE,SAAWD,EAAO,GAAGC,OAChED,EAAOI,OAAOC,EAAK,GAAK,EAAIN,EAAOE,SAAWD,EAAOC,QAAS,GAE3D,EAGT,QAASI,GAAKC,EAAOC,GACnB,MAAOD,GAAQC,EAGjB,QAASC,GAAalB,EAAMmB,EAAOC,GACjC,GAAMD,EAAME,MAAUF,EAAME,KAAKV,OAAjC,CACAQ,EAAMG,UAAuC,kBAApBH,GAAMG,UAA2BH,EAAMG,UAAYC,EAC5EJ,EAAMK,QAAUC,EAAWzB,EAAMmB,EACjC,IAAIO,GAAMN,EAAK,GAAIO,EAAMD,EAAIE,WAAW,MACpCP,EAAOT,MAAMC,QAAQM,EAAME,KAAK,IAClCQ,EAAYV,EAAMW,OAAQX,EAAME,KAAMF,EAAMY,WAAcZ,EAAMK,SAChEQ,EAAQb,EAAMW,OAAQX,EAAME,KAAMF,EAAMK,SACtC3B,EAAUH,EAAQQ,UAAWJ,EAAQC,WAAWC,GAAOmB,EAAMtB,SAC7DoC,EAAQ,GAAInC,GAAQH,MAAMgC,GAAK3B,GAAMqB,EAAMxB,EAO/C,OANAsB,GAAMe,MAAM,SAAUD,IAErB,QAAS,SAASE,QAAQ,SAAUC,GAC/BjB,EAAMiB,KAASV,EAAe,UAAXU,EAAqB,UAAY,eAAiBC,EAAgBlB,EAAOc,EAAOG,MAErGjB,EAAMmB,QAA2B,UAAjBnB,EAAMmB,QAAoBC,EAAUnB,EAAMa,GACvDA,GAGT,QAASI,GAAiBlB,EAAOc,EAAOG,GACtC,MAAO,UAAUI,GACf,GAAIC,GAAUR,EAAMS,kBAAoBT,EAAMU,gBAAkBV,EAAMW,kBACtE,IAAIH,EAAS,CACX,GAAII,GAAeJ,EAAQK,KAAKb,EAAOO,EACvCrB,GAAMiB,GAAQS,EAAcL,GAC5BrB,EAAM4B,WAKZ,QAAStB,GAAYzB,EAAMmB,GAKzB,IAJA,GAAIK,GAAU9B,EAAQsD,KAAK7B,EAAMK,SAC/B1B,EAAQC,WAAWC,GAAMwB,SACzB7B,EAAMsD,SAASC,OAAO1B,SAEjBA,EAAQb,OAASQ,EAAME,KAAKV,QACjCa,EAAQ2B,KAAKhC,EAAMG,YAErB,OAAOE,GAAQ4B,IAAIC,GAGrB,QAASA,GAAeC,GACtB,MAAsB,gBAAXA,IAAkC,OAAXA,EAAwBA,EACpC,gBAAXA,IAAqC,MAAdA,EAAO,GAAmBhC,EAAUiC,EAASD,EAAOE,OAAO,KACtFjC,IAGT,QAASA,KACP,GAAI+B,IAAUG,EAAa,EAAG,KAAMA,EAAa,EAAG,KAAMA,EAAa,EAAG,KAC1E,OAAOnC,GAAUgC,GAGnB,QAAShC,GAAWgC,GAClB,OACEI,UAAWC,EAAKL,EAAQ,IACxBM,YAAaD,EAAKL,EAAQ,GAC1BO,WAAYF,EAAKL,EAAQ,GACzBQ,iBAAkB,OAClBC,mBAAoB,OACpBC,qBAAsBL,EAAKL,EAAQ,KAIvC,QAASG,GAAcQ,EAAKC,GAC1B,MAAOC,MAAKC,MAAMD,KAAKE,UAAYH,EAAMD,EAAM,IAAMA,EAGvD,QAASN,GAAML,EAAQgB,GACrB,MAAO,QAAUhB,EAAOiB,OAAOD,GAAOE,KAAK,KAAO,IAIpD,QAASjB,GAAUkB,GACjB,GAAIC,GAASC,SAASF,EAAK,IACzBG,EAAKF,GAAU,GAAM,IACrBG,EAAKH,GAAU,EAAK,IACpBI,EAAa,IAATJ,CAEN,QAAQE,EAAGC,EAAGC,GAGhB,QAASjD,GAAaC,EAAQT,EAAMU,EAAQP,GAC1C,OACEM,OAAQA,EACRiD,SAAU1D,EAAK+B,IAAI,SAAU4B,EAAMC,GACjC,MAAOvF,GAAQQ,UAAWsB,EAAQyD,IAChCC,MAAOnD,EAAOkD,GACd5D,KAAM2D,OAMd,QAAShD,GAASF,EAAQT,EAAMG,GAC9B,MAAOM,GAAOsB,IAAI,SAAU8B,EAAOD,GACjC,MAAOvF,GAAQQ,UAAWsB,EAAQyD,IAChCC,MAAOA,EACPC,MAAO9D,EAAK4D,GACZG,MAAO5D,EAAQyD,GAAGrB,YAClByB,UAAW7D,EAAQyD,GAAGjB,yBAK5B,QAASzB,GAAWnB,EAAMa,GACxB,GAAIqD,GAAUlE,EAAKmE,SACfC,EAAaF,EAAQG,KAAK,gBAC1BnD,EAAS,iBAAmBL,EAAMyD,iBAAmB,iBACrDF,GAAW7E,OAAQ6E,EAAWG,YAAYrD,GACzCgD,EAAQM,OAAOtD,GAGtB,QAASuD,GAAa5D,EAAO6D,EAAQ3E,GAC/BP,MAAMC,QAAQM,EAAME,KAAK,IAC3BY,EAAM8C,SAAS5C,QAAQ,SAAU4D,EAASd,IACvCc,EAAQC,QAAUD,EAAQE,MAAM9D,QAAQ,SAAU+D,EAAUC,GAC3DD,EAASf,MAAQW,EAAOb,GAAGkB,OAI/BlE,EAAMmE,SAASjE,QAAQ,SAAUkE,EAASpB,GACxCoB,EAAQlB,MAAQW,EAAOb,KAG3BhD,EAAMqE,SACNnF,EAAMe,MAAM,SAAUD,GAGxB,QAASsE,GAASpB,GAChB,OAASA,GACNvE,MAAMC,QAAQsE,KAAYA,EAAMxE,QACf,gBAAVwE,KAAwBqB,OAAOC,KAAKtB,GAAOxE,OA1NvD,MAAO,UAAgBX,GACrB,OACE0G,SAAU,KACVvF,OACEE,KAAM,IACNS,OAAQ,IACRjC,QAAS,IACTkC,OAAQ,IACRP,QAAS,KACTF,UAAW,KACXqF,UAAW,IACXrE,OAAQ,IACRsE,MAAO,IACPC,MAAO,KAETC,KAAM,SAAU3F,EAAOC,GA2CrB,QAAS2F,GAAYtG,EAAQC,GAC3B,IAAI6F,EAAQ9F,KACRf,EAAQsH,OAAOvG,EAAQC,GAA3B,CACA,GAAIiG,GAAY3G,GAAQmB,EAAMwF,SACxBA,KAIF1E,GAAOA,EAAMgF,UAEjBhF,EAAQf,EAAYyF,EAAWxF,EAAOC,KApDxC,GAAIa,GAAOiF,EAAYC,SAASC,cAAc,MAC9CF,GAAUG,UAAY,kBACtBjG,EAAKuE,YAAYuB,GACjBA,EAAUI,YAAYlG,EAAK,IAEc,gBAA9BmG,QAAOC,oBAAiE,OAA9BD,OAAOC,oBACL,kBAA1CD,QAAOC,mBAAmBC,aACnCF,OAAOC,mBAAmBC,YAAYrG,EAAK,IAM/CD,EAAMuG,OAAO,OAAQ,SAAUjH,EAAQC,GACrC,GAAMD,GAAYA,EAAOE,UAAWC,MAAMC,QAAQJ,EAAO,KAASA,EAAO,GAAGE,QAA5E,CACA,GAAIgG,GAAY3G,GAAQmB,EAAMwF,SAC9B,IAAMA,EAAN,CAEA,GAAI1E,EAAO,CACT,GAAIzB,EAAeC,EAAQC,GAAS,MAAOmF,GAAY5D,EAAOxB,EAAQU,EACtEc,GAAMgF,UAGRhF,EAAQf,EAAYyF,EAAWxF,EAAOC,OACrC,GAEHD,EAAMuG,OAAO,SAAUX,GAAY,GACnC5F,EAAMuG,OAAO,SAAUX,GAAY,GACnC5F,EAAMuG,OAAO,UAAWX,GAAY,GACpC5F,EAAMuG,OAAO,UAAWX,GAAY,GAEpC5F,EAAMuG,OAAO,YAAa,SAAUjH,EAAQC,GACtC6F,EAAQ9F,IACRf,EAAQsH,OAAOvG,EAAQC,KACvBuB,GAAOA,EAAMgF,UACjBhF,EAAQf,EAAYT,EAAQU,EAAOC,MAGrCD,EAAMwG,IAAI,WAAY,WAChB1F,GAAOA,EAAMgF,eAtH3BtH,EAAMsD,SAASC,OAAO0E,YAAa,EACnCjI,EAAMsD,SAASC,OAAO2E,qBAAuB,6DAE7ClI,EAAMsD,SAASC,OAAO1B,SACpB,UACA,UACA,UACA,UACA,UACA,UACA,WAGF9B,EAAQF,OAAO,eACZsI,SAAS,UAAWlI,GACpBR,QAAQ,kBAAmB,UAAWmB,IACtCwH,UAAU,aAAc,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,MACjFwH,UAAU,aAAc,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,GAAe,WAChGwH,UAAU,YAAa,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,GAAe,UAC/FwH,UAAU,cAAe,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,GAAe,YACjGwH,UAAU,iBAAkB,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,GAAe,eACpGwH,UAAU,YAAa,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,GAAe,UAC/FwH,UAAU,kBAAmB,iBAAkB,SAAUxH,GAAkB,MAAO,IAAIA,GAAe","file":"angular-chart.min.js","sourcesContent":["(function (factory) {\n 'use strict';\n if (typeof define === 'function' && define.amd) {\n // AMD. Register as an anonymous module.\n define(['angular', 'chart.js'], factory);\n } else if (typeof exports === 'object') {\n // Node/CommonJS\n module.exports = factory(require('angular'), require('chart.js'));\n } else {\n // Browser globals\n factory(angular, Chart);\n }\n}(function (angular, Chart) {\n 'use strict';\n\n Chart.defaults.global.responsive = true;\n Chart.defaults.global.multiTooltipTemplate = '<%if (datasetLabel){%><%=datasetLabel%>: <%}%><%= value %>';\n\n Chart.defaults.global.colours = [\n '#97BBCD', // blue\n '#DCDCDC', // light grey\n '#F7464A', // red\n '#46BFBD', // green\n '#FDB45C', // yellow\n '#949FB1', // grey\n '#4D5360' // dark grey\n ];\n\n angular.module('chart.js', [])\n .provider('ChartJs', ChartJsProvider)\n .factory('ChartJsFactory', ['ChartJs', ChartJsFactory])\n .directive('chartBase', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory(); }])\n .directive('chartLine', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Line'); }])\n .directive('chartBar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Bar'); }])\n .directive('chartRadar', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Radar'); }])\n .directive('chartDoughnut', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Doughnut'); }])\n .directive('chartPie', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('Pie'); }])\n .directive('chartPolarArea', ['ChartJsFactory', function (ChartJsFactory) { return new ChartJsFactory('PolarArea'); }]);\n\n /**\n * Wrapper for chart.js\n * Allows configuring chart js using the provider\n *\n * angular.module('myModule', ['chart.js']).config(function(ChartJsProvider) {\n * ChartJsProvider.setOptions({ responsive: true });\n * ChartJsProvider.setOptions('Line', { responsive: false });\n * })))\n */\n function ChartJsProvider () {\n var options = {};\n var ChartJs = {\n Chart: Chart,\n getOptions: function (type) {\n var typeOptions = type && options[type] || {};\n return angular.extend({}, options, typeOptions);\n }\n };\n\n /**\n * Allow to set global options during configuration\n */\n this.setOptions = function (type, customOptions) {\n // If no type was specified set option for the global object\n if (! customOptions) {\n customOptions = type;\n options = angular.extend(options, customOptions);\n return;\n }\n // Set options for the specific chart\n options[type] = angular.extend(options[type] || {}, customOptions);\n };\n\n this.$get = function () {\n return ChartJs;\n };\n }\n\n function ChartJsFactory (ChartJs) {\n return function chart (type) {\n return {\n restrict: 'CA',\n scope: {\n data: '=',\n labels: '=',\n options: '=',\n series: '=',\n colours: '=?',\n getColour: '=?',\n chartType: '=',\n legend: '@',\n click: '=',\n hover: '='\n },\n link: function (scope, elem/*, attrs */) {\n var chart, container = document.createElement('div');\n container.className = 'chart-container';\n elem.replaceWith(container);\n container.appendChild(elem[0]);\n\n if (typeof window.G_vmlCanvasManager === 'object' && window.G_vmlCanvasManager !== null) {\n if (typeof window.G_vmlCanvasManager.initElement === 'function') {\n window.G_vmlCanvasManager.initElement(elem[0]);\n }\n }\n\n // Order of setting \"watch\" matter\n\n scope.$watch('data', function (newVal, oldVal) {\n if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) return;\n var chartType = type || scope.chartType;\n if (! chartType) return;\n\n if (chart) {\n if (canUpdateChart(newVal, oldVal)) return updateChart(chart, newVal, scope);\n chart.destroy();\n }\n\n chart = createChart(chartType, scope, elem);\n }, true);\n\n scope.$watch('series', resetChart, true);\n scope.$watch('labels', resetChart, true);\n scope.$watch('options', resetChart, true);\n scope.$watch('colours', resetChart, true);\n\n scope.$watch('chartType', function (newVal, oldVal) {\n if (isEmpty(newVal)) return;\n if (angular.equals(newVal, oldVal)) return;\n if (chart) chart.destroy();\n chart = createChart(newVal, scope, elem);\n });\n\n scope.$on('$destroy', function () {\n if (chart) chart.destroy();\n });\n\n function resetChart (newVal, oldVal) {\n if (isEmpty(newVal)) return;\n if (angular.equals(newVal, oldVal)) return;\n var chartType = type || scope.chartType;\n if (! chartType) return;\n\n // chart.update() doesn't work for series and labels\n // so we have to re-create the chart entirely\n if (chart) chart.destroy();\n\n chart = createChart(chartType, scope, elem);\n }\n }\n };\n };\n\n function canUpdateChart (newVal, oldVal) {\n if (newVal && oldVal && newVal.length && oldVal.length) {\n return Array.isArray(newVal[0]) ?\n newVal.length === oldVal.length && newVal[0].length === oldVal[0].length :\n oldVal.reduce(sum, 0) > 0 ? newVal.length === oldVal.length : false;\n }\n return false;\n }\n\n function sum (carry, val) {\n return carry + val;\n }\n\n function createChart (type, scope, elem) {\n if (! scope.data || ! scope.data.length) return;\n scope.getColour = typeof scope.getColour === 'function' ? scope.getColour : getRandomColour;\n scope.colours = getColours(type, scope);\n var cvs = elem[0], ctx = cvs.getContext('2d');\n var data = Array.isArray(scope.data[0]) ?\n getDataSets(scope.labels, scope.data, scope.series || [], scope.colours) :\n getData(scope.labels, scope.data, scope.colours);\n var options = angular.extend({}, ChartJs.getOptions(type), scope.options);\n var chart = new ChartJs.Chart(ctx)[type](data, options);\n scope.$emit('create', chart);\n\n ['hover', 'click'].forEach(function (action) {\n if (scope[action]) cvs[action === 'click' ? 'onclick' : 'onmousemove'] = getEventHandler(scope, chart, action);\n });\n if (scope.legend && scope.legend !== 'false') setLegend(elem, chart);\n return chart;\n }\n\n function getEventHandler (scope, chart, action) {\n return function (evt) {\n var atEvent = chart.getPointsAtEvent || chart.getBarsAtEvent || chart.getSegmentsAtEvent;\n if (atEvent) {\n var activePoints = atEvent.call(chart, evt);\n scope[action](activePoints, evt);\n scope.$apply();\n }\n };\n }\n\n function getColours (type, scope) {\n var colours = angular.copy(scope.colours ||\n ChartJs.getOptions(type).colours ||\n Chart.defaults.global.colours\n );\n while (colours.length < scope.data.length) {\n colours.push(scope.getColour());\n }\n return colours.map(convertColour);\n }\n\n function convertColour (colour) {\n if (typeof colour === 'object' && colour !== null) return colour;\n if (typeof colour === 'string' && colour[0] === '#') return getColour(hexToRgb(colour.substr(1)));\n return getRandomColour();\n }\n\n function getRandomColour () {\n var colour = [getRandomInt(0, 255), getRandomInt(0, 255), getRandomInt(0, 255)];\n return getColour(colour);\n }\n\n function getColour (colour) {\n return {\n fillColor: rgba(colour, 0.2),\n strokeColor: rgba(colour, 1),\n pointColor: rgba(colour, 1),\n pointStrokeColor: '#fff',\n pointHighlightFill: '#fff',\n pointHighlightStroke: rgba(colour, 0.8)\n };\n }\n\n function getRandomInt (min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n }\n\n function rgba (colour, alpha) {\n return 'rgba(' + colour.concat(alpha).join(',') + ')';\n }\n\n // Credit: http://stackoverflow.com/a/11508164/1190235\n function hexToRgb (hex) {\n var bigint = parseInt(hex, 16),\n r = (bigint >> 16) & 255,\n g = (bigint >> 8) & 255,\n b = bigint & 255;\n\n return [r, g, b];\n }\n\n function getDataSets (labels, data, series, colours) {\n return {\n labels: labels,\n datasets: data.map(function (item, i) {\n return angular.extend({}, colours[i], {\n label: series[i],\n data: item\n });\n })\n };\n }\n\n function getData (labels, data, colours) {\n return labels.map(function (label, i) {\n return angular.extend({}, colours[i], {\n label: label,\n value: data[i],\n color: colours[i].strokeColor,\n highlight: colours[i].pointHighlightStroke\n });\n });\n }\n\n function setLegend (elem, chart) {\n var $parent = elem.parent(),\n $oldLegend = $parent.find('chart-legend'),\n legend = '' + chart.generateLegend() + '';\n if ($oldLegend.length) $oldLegend.replaceWith(legend);\n else $parent.append(legend);\n }\n\n function updateChart (chart, values, scope) {\n if (Array.isArray(scope.data[0])) {\n chart.datasets.forEach(function (dataset, i) {\n (dataset.points || dataset.bars).forEach(function (dataItem, j) {\n dataItem.value = values[i][j];\n });\n });\n } else {\n chart.segments.forEach(function (segment, i) {\n segment.value = values[i];\n });\n }\n chart.update();\n scope.$emit('update', chart);\n }\n\n function isEmpty (value) {\n return ! value ||\n (Array.isArray(value) && ! value.length) ||\n (typeof value === 'object' && ! Object.keys(value).length);\n }\n\n }\n}));\n"],"sourceRoot":"/source/"} \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/dist/chart.js b/templates/js/libs/angular-chart.js-0.7.2/dist/chart.js new file mode 100644 index 0000000..c264262 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/dist/chart.js @@ -0,0 +1,3477 @@ +/*! + * Chart.js + * http://chartjs.org/ + * Version: 1.0.2 + * + * Copyright 2015 Nick Downie + * Released under the MIT license + * https://github.com/nnnick/Chart.js/blob/master/LICENSE.md + */ + + +(function(){ + + "use strict"; + + //Declare root variable - window in the browser, global on the server + var root = this, + previous = root.Chart; + + //Occupy the global variable of Chart, and create a simple base class + var Chart = function(context){ + var chart = this; + this.canvas = context.canvas; + + this.ctx = context; + + //Variables global to the chart + var computeDimension = function(element,dimension) + { + if (element['offset'+dimension]) + { + return element['offset'+dimension]; + } + else + { + return document.defaultView.getComputedStyle(element).getPropertyValue(dimension); + } + } + + var width = this.width = computeDimension(context.canvas,'Width'); + var height = this.height = computeDimension(context.canvas,'Height'); + + // Firefox requires this to work correctly + context.canvas.width = width; + context.canvas.height = height; + + var width = this.width = context.canvas.width; + var height = this.height = context.canvas.height; + this.aspectRatio = this.width / this.height; + //High pixel density displays - multiply the size of the canvas height/width by the device pixel ratio, then scale. + helpers.retinaScale(this); + + return this; + }; + //Globally expose the defaults to allow for user updating/changing + Chart.defaults = { + global: { + // Boolean - Whether to animate the chart + animation: true, + + // Number - Number of animation steps + animationSteps: 60, + + // String - Animation easing effect + animationEasing: "easeOutQuart", + + // Boolean - If we should show the scale at all + showScale: true, + + // Boolean - If we want to override with a hard coded scale + scaleOverride: false, + + // ** Required if scaleOverride is true ** + // Number - The number of steps in a hard coded scale + scaleSteps: null, + // Number - The value jump in the hard coded scale + scaleStepWidth: null, + // Number - The scale starting value + scaleStartValue: null, + + // String - Colour of the scale line + scaleLineColor: "rgba(0,0,0,.1)", + + // Number - Pixel width of the scale line + scaleLineWidth: 1, + + // Boolean - Whether to show labels on the scale + scaleShowLabels: true, + + // Interpolated JS string - can access value + scaleLabel: "<%=value%>", + + // Boolean - Whether the scale should stick to integers, and not show any floats even if drawing space is there + scaleIntegersOnly: true, + + // Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value + scaleBeginAtZero: false, + + // String - Scale label font declaration for the scale label + scaleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", + + // Number - Scale label font size in pixels + scaleFontSize: 12, + + // String - Scale label font weight style + scaleFontStyle: "normal", + + // String - Scale label font colour + scaleFontColor: "#666", + + // Boolean - whether or not the chart should be responsive and resize when the browser does. + responsive: false, + + // Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container + maintainAspectRatio: true, + + // Boolean - Determines whether to draw tooltips on the canvas or not - attaches events to touchmove & mousemove + showTooltips: true, + + // Boolean - Determines whether to draw built-in tooltip or call custom tooltip function + customTooltips: false, + + // Array - Array of string names to attach tooltip events + tooltipEvents: ["mousemove", "touchstart", "touchmove", "mouseout"], + + // String - Tooltip background colour + tooltipFillColor: "rgba(0,0,0,0.8)", + + // String - Tooltip label font declaration for the scale label + tooltipFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", + + // Number - Tooltip label font size in pixels + tooltipFontSize: 14, + + // String - Tooltip font weight style + tooltipFontStyle: "normal", + + // String - Tooltip label font colour + tooltipFontColor: "#fff", + + // String - Tooltip title font declaration for the scale label + tooltipTitleFontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", + + // Number - Tooltip title font size in pixels + tooltipTitleFontSize: 14, + + // String - Tooltip title font weight style + tooltipTitleFontStyle: "bold", + + // String - Tooltip title font colour + tooltipTitleFontColor: "#fff", + + // Number - pixel width of padding around tooltip text + tooltipYPadding: 6, + + // Number - pixel width of padding around tooltip text + tooltipXPadding: 6, + + // Number - Size of the caret on the tooltip + tooltipCaretSize: 8, + + // Number - Pixel radius of the tooltip border + tooltipCornerRadius: 6, + + // Number - Pixel offset from point x to tooltip edge + tooltipXOffset: 10, + + // String - Template string for single tooltips + tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>", + + // String - Template string for single tooltips + multiTooltipTemplate: "<%= value %>", + + // String - Colour behind the legend colour block + multiTooltipKeyBackground: '#fff', + + // Function - Will fire on animation progression. + onAnimationProgress: function(){}, + + // Function - Will fire on animation completion. + onAnimationComplete: function(){} + + } + }; + + //Create a dictionary of chart types, to allow for extension of existing types + Chart.types = {}; + + //Global Chart helpers object for utility methods and classes + var helpers = Chart.helpers = {}; + + //-- Basic js utility methods + var each = helpers.each = function(loopable,callback,self){ + var additionalArgs = Array.prototype.slice.call(arguments, 3); + // Check to see if null or undefined firstly. + if (loopable){ + if (loopable.length === +loopable.length){ + var i; + for (i=0; i= 0; i--) { + var currentItem = arrayToSearch[i]; + if (filterCallback(currentItem)){ + return currentItem; + } + } + }, + inherits = helpers.inherits = function(extensions){ + //Basic javascript inheritance based on the model created in Backbone.js + var parent = this; + var ChartElement = (extensions && extensions.hasOwnProperty("constructor")) ? extensions.constructor : function(){ return parent.apply(this, arguments); }; + + var Surrogate = function(){ this.constructor = ChartElement;}; + Surrogate.prototype = parent.prototype; + ChartElement.prototype = new Surrogate(); + + ChartElement.extend = inherits; + + if (extensions) extend(ChartElement.prototype, extensions); + + ChartElement.__super__ = parent.prototype; + + return ChartElement; + }, + noop = helpers.noop = function(){}, + uid = helpers.uid = (function(){ + var id=0; + return function(){ + return "chart-" + id++; + }; + })(), + warn = helpers.warn = function(str){ + //Method for warning of errors + if (window.console && typeof window.console.warn == "function") console.warn(str); + }, + amd = helpers.amd = (typeof define == 'function' && define.amd), + //-- Math methods + isNumber = helpers.isNumber = function(n){ + return !isNaN(parseFloat(n)) && isFinite(n); + }, + max = helpers.max = function(array){ + return Math.max.apply( Math, array ); + }, + min = helpers.min = function(array){ + return Math.min.apply( Math, array ); + }, + cap = helpers.cap = function(valueToCap,maxValue,minValue){ + if(isNumber(maxValue)) { + if( valueToCap > maxValue ) { + return maxValue; + } + } + else if(isNumber(minValue)){ + if ( valueToCap < minValue ){ + return minValue; + } + } + return valueToCap; + }, + getDecimalPlaces = helpers.getDecimalPlaces = function(num){ + if (num%1!==0 && isNumber(num)){ + return num.toString().split(".")[1].length; + } + else { + return 0; + } + }, + toRadians = helpers.radians = function(degrees){ + return degrees * (Math.PI/180); + }, + // Gets the angle from vertical upright to the point about a centre. + getAngleFromPoint = helpers.getAngleFromPoint = function(centrePoint, anglePoint){ + var distanceFromXCenter = anglePoint.x - centrePoint.x, + distanceFromYCenter = anglePoint.y - centrePoint.y, + radialDistanceFromCenter = Math.sqrt( distanceFromXCenter * distanceFromXCenter + distanceFromYCenter * distanceFromYCenter); + + + var angle = Math.PI * 2 + Math.atan2(distanceFromYCenter, distanceFromXCenter); + + //If the segment is in the top left quadrant, we need to add another rotation to the angle + if (distanceFromXCenter < 0 && distanceFromYCenter < 0){ + angle += Math.PI*2; + } + + return { + angle: angle, + distance: radialDistanceFromCenter + }; + }, + aliasPixel = helpers.aliasPixel = function(pixelWidth){ + return (pixelWidth % 2 === 0) ? 0 : 0.5; + }, + splineCurve = helpers.splineCurve = function(FirstPoint,MiddlePoint,AfterPoint,t){ + //Props to Rob Spencer at scaled innovation for his post on splining between points + //http://scaledinnovation.com/analytics/splines/aboutSplines.html + var d01=Math.sqrt(Math.pow(MiddlePoint.x-FirstPoint.x,2)+Math.pow(MiddlePoint.y-FirstPoint.y,2)), + d12=Math.sqrt(Math.pow(AfterPoint.x-MiddlePoint.x,2)+Math.pow(AfterPoint.y-MiddlePoint.y,2)), + fa=t*d01/(d01+d12),// scaling factor for triangle Ta + fb=t*d12/(d01+d12); + return { + inner : { + x : MiddlePoint.x-fa*(AfterPoint.x-FirstPoint.x), + y : MiddlePoint.y-fa*(AfterPoint.y-FirstPoint.y) + }, + outer : { + x: MiddlePoint.x+fb*(AfterPoint.x-FirstPoint.x), + y : MiddlePoint.y+fb*(AfterPoint.y-FirstPoint.y) + } + }; + }, + calculateOrderOfMagnitude = helpers.calculateOrderOfMagnitude = function(val){ + return Math.floor(Math.log(val) / Math.LN10); + }, + calculateScaleRange = helpers.calculateScaleRange = function(valuesArray, drawingSize, textSize, startFromZero, integersOnly){ + + //Set a minimum step of two - a point at the top of the graph, and a point at the base + var minSteps = 2, + maxSteps = Math.floor(drawingSize/(textSize * 1.5)), + skipFitting = (minSteps >= maxSteps); + + var maxValue = max(valuesArray), + minValue = min(valuesArray); + + // We need some degree of seperation here to calculate the scales if all the values are the same + // Adding/minusing 0.5 will give us a range of 1. + if (maxValue === minValue){ + maxValue += 0.5; + // So we don't end up with a graph with a negative start value if we've said always start from zero + if (minValue >= 0.5 && !startFromZero){ + minValue -= 0.5; + } + else{ + // Make up a whole number above the values + maxValue += 0.5; + } + } + + var valueRange = Math.abs(maxValue - minValue), + rangeOrderOfMagnitude = calculateOrderOfMagnitude(valueRange), + graphMax = Math.ceil(maxValue / (1 * Math.pow(10, rangeOrderOfMagnitude))) * Math.pow(10, rangeOrderOfMagnitude), + graphMin = (startFromZero) ? 0 : Math.floor(minValue / (1 * Math.pow(10, rangeOrderOfMagnitude))) * Math.pow(10, rangeOrderOfMagnitude), + graphRange = graphMax - graphMin, + stepValue = Math.pow(10, rangeOrderOfMagnitude), + numberOfSteps = Math.round(graphRange / stepValue); + + //If we have more space on the graph we'll use it to give more definition to the data + while((numberOfSteps > maxSteps || (numberOfSteps * 2) < maxSteps) && !skipFitting) { + if(numberOfSteps > maxSteps){ + stepValue *=2; + numberOfSteps = Math.round(graphRange/stepValue); + // Don't ever deal with a decimal number of steps - cancel fitting and just use the minimum number of steps. + if (numberOfSteps % 1 !== 0){ + skipFitting = true; + } + } + //We can fit in double the amount of scale points on the scale + else{ + //If user has declared ints only, and the step value isn't a decimal + if (integersOnly && rangeOrderOfMagnitude >= 0){ + //If the user has said integers only, we need to check that making the scale more granular wouldn't make it a float + if(stepValue/2 % 1 === 0){ + stepValue /=2; + numberOfSteps = Math.round(graphRange/stepValue); + } + //If it would make it a float break out of the loop + else{ + break; + } + } + //If the scale doesn't have to be an int, make the scale more granular anyway. + else{ + stepValue /=2; + numberOfSteps = Math.round(graphRange/stepValue); + } + + } + } + + if (skipFitting){ + numberOfSteps = minSteps; + stepValue = graphRange / numberOfSteps; + } + + return { + steps : numberOfSteps, + stepValue : stepValue, + min : graphMin, + max : graphMin + (numberOfSteps * stepValue) + }; + + }, + /* jshint ignore:start */ + // Blows up jshint errors based on the new Function constructor + //Templating methods + //Javascript micro templating by John Resig - source at http://ejohn.org/blog/javascript-micro-templating/ + template = helpers.template = function(templateString, valuesObject){ + + // If templateString is function rather than string-template - call the function for valuesObject + + if(templateString instanceof Function){ + return templateString(valuesObject); + } + + var cache = {}; + function tmpl(str, data){ + // Figure out if we're getting a template, or if we need to + // load the template - and be sure to cache the result. + var fn = !/\W/.test(str) ? + cache[str] = cache[str] : + + // Generate a reusable function that will serve as a template + // generator (and which will be cached). + new Function("obj", + "var p=[],print=function(){p.push.apply(p,arguments);};" + + + // Introduce the data as local variables using with(){} + "with(obj){p.push('" + + + // Convert the template into pure JavaScript + str + .replace(/[\r\t\n]/g, " ") + .split("<%").join("\t") + .replace(/((^|%>)[^\t]*)'/g, "$1\r") + .replace(/\t=(.*?)%>/g, "',$1,'") + .split("\t").join("');") + .split("%>").join("p.push('") + .split("\r").join("\\'") + + "');}return p.join('');" + ); + + // Provide some basic currying to the user + return data ? fn( data ) : fn; + } + return tmpl(templateString,valuesObject); + }, + /* jshint ignore:end */ + generateLabels = helpers.generateLabels = function(templateString,numberOfSteps,graphMin,stepValue){ + var labelsArray = new Array(numberOfSteps); + if (labelTemplateString){ + each(labelsArray,function(val,index){ + labelsArray[index] = template(templateString,{value: (graphMin + (stepValue*(index+1)))}); + }); + } + return labelsArray; + }, + //--Animation methods + //Easing functions adapted from Robert Penner's easing equations + //http://www.robertpenner.com/easing/ + easingEffects = helpers.easingEffects = { + linear: function (t) { + return t; + }, + easeInQuad: function (t) { + return t * t; + }, + easeOutQuad: function (t) { + return -1 * t * (t - 2); + }, + easeInOutQuad: function (t) { + if ((t /= 1 / 2) < 1) return 1 / 2 * t * t; + return -1 / 2 * ((--t) * (t - 2) - 1); + }, + easeInCubic: function (t) { + return t * t * t; + }, + easeOutCubic: function (t) { + return 1 * ((t = t / 1 - 1) * t * t + 1); + }, + easeInOutCubic: function (t) { + if ((t /= 1 / 2) < 1) return 1 / 2 * t * t * t; + return 1 / 2 * ((t -= 2) * t * t + 2); + }, + easeInQuart: function (t) { + return t * t * t * t; + }, + easeOutQuart: function (t) { + return -1 * ((t = t / 1 - 1) * t * t * t - 1); + }, + easeInOutQuart: function (t) { + if ((t /= 1 / 2) < 1) return 1 / 2 * t * t * t * t; + return -1 / 2 * ((t -= 2) * t * t * t - 2); + }, + easeInQuint: function (t) { + return 1 * (t /= 1) * t * t * t * t; + }, + easeOutQuint: function (t) { + return 1 * ((t = t / 1 - 1) * t * t * t * t + 1); + }, + easeInOutQuint: function (t) { + if ((t /= 1 / 2) < 1) return 1 / 2 * t * t * t * t * t; + return 1 / 2 * ((t -= 2) * t * t * t * t + 2); + }, + easeInSine: function (t) { + return -1 * Math.cos(t / 1 * (Math.PI / 2)) + 1; + }, + easeOutSine: function (t) { + return 1 * Math.sin(t / 1 * (Math.PI / 2)); + }, + easeInOutSine: function (t) { + return -1 / 2 * (Math.cos(Math.PI * t / 1) - 1); + }, + easeInExpo: function (t) { + return (t === 0) ? 1 : 1 * Math.pow(2, 10 * (t / 1 - 1)); + }, + easeOutExpo: function (t) { + return (t === 1) ? 1 : 1 * (-Math.pow(2, -10 * t / 1) + 1); + }, + easeInOutExpo: function (t) { + if (t === 0) return 0; + if (t === 1) return 1; + if ((t /= 1 / 2) < 1) return 1 / 2 * Math.pow(2, 10 * (t - 1)); + return 1 / 2 * (-Math.pow(2, -10 * --t) + 2); + }, + easeInCirc: function (t) { + if (t >= 1) return t; + return -1 * (Math.sqrt(1 - (t /= 1) * t) - 1); + }, + easeOutCirc: function (t) { + return 1 * Math.sqrt(1 - (t = t / 1 - 1) * t); + }, + easeInOutCirc: function (t) { + if ((t /= 1 / 2) < 1) return -1 / 2 * (Math.sqrt(1 - t * t) - 1); + return 1 / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1); + }, + easeInElastic: function (t) { + var s = 1.70158; + var p = 0; + var a = 1; + if (t === 0) return 0; + if ((t /= 1) == 1) return 1; + if (!p) p = 1 * 0.3; + if (a < Math.abs(1)) { + a = 1; + s = p / 4; + } else s = p / (2 * Math.PI) * Math.asin(1 / a); + return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * 1 - s) * (2 * Math.PI) / p)); + }, + easeOutElastic: function (t) { + var s = 1.70158; + var p = 0; + var a = 1; + if (t === 0) return 0; + if ((t /= 1) == 1) return 1; + if (!p) p = 1 * 0.3; + if (a < Math.abs(1)) { + a = 1; + s = p / 4; + } else s = p / (2 * Math.PI) * Math.asin(1 / a); + return a * Math.pow(2, -10 * t) * Math.sin((t * 1 - s) * (2 * Math.PI) / p) + 1; + }, + easeInOutElastic: function (t) { + var s = 1.70158; + var p = 0; + var a = 1; + if (t === 0) return 0; + if ((t /= 1 / 2) == 2) return 1; + if (!p) p = 1 * (0.3 * 1.5); + if (a < Math.abs(1)) { + a = 1; + s = p / 4; + } else s = p / (2 * Math.PI) * Math.asin(1 / a); + if (t < 1) return -0.5 * (a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * 1 - s) * (2 * Math.PI) / p)); + return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * 1 - s) * (2 * Math.PI) / p) * 0.5 + 1; + }, + easeInBack: function (t) { + var s = 1.70158; + return 1 * (t /= 1) * t * ((s + 1) * t - s); + }, + easeOutBack: function (t) { + var s = 1.70158; + return 1 * ((t = t / 1 - 1) * t * ((s + 1) * t + s) + 1); + }, + easeInOutBack: function (t) { + var s = 1.70158; + if ((t /= 1 / 2) < 1) return 1 / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)); + return 1 / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2); + }, + easeInBounce: function (t) { + return 1 - easingEffects.easeOutBounce(1 - t); + }, + easeOutBounce: function (t) { + if ((t /= 1) < (1 / 2.75)) { + return 1 * (7.5625 * t * t); + } else if (t < (2 / 2.75)) { + return 1 * (7.5625 * (t -= (1.5 / 2.75)) * t + 0.75); + } else if (t < (2.5 / 2.75)) { + return 1 * (7.5625 * (t -= (2.25 / 2.75)) * t + 0.9375); + } else { + return 1 * (7.5625 * (t -= (2.625 / 2.75)) * t + 0.984375); + } + }, + easeInOutBounce: function (t) { + if (t < 1 / 2) return easingEffects.easeInBounce(t * 2) * 0.5; + return easingEffects.easeOutBounce(t * 2 - 1) * 0.5 + 1 * 0.5; + } + }, + //Request animation polyfill - http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/ + requestAnimFrame = helpers.requestAnimFrame = (function(){ + return window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame || + function(callback) { + return window.setTimeout(callback, 1000 / 60); + }; + })(), + cancelAnimFrame = helpers.cancelAnimFrame = (function(){ + return window.cancelAnimationFrame || + window.webkitCancelAnimationFrame || + window.mozCancelAnimationFrame || + window.oCancelAnimationFrame || + window.msCancelAnimationFrame || + function(callback) { + return window.clearTimeout(callback, 1000 / 60); + }; + })(), + animationLoop = helpers.animationLoop = function(callback,totalSteps,easingString,onProgress,onComplete,chartInstance){ + + var currentStep = 0, + easingFunction = easingEffects[easingString] || easingEffects.linear; + + var animationFrame = function(){ + currentStep++; + var stepDecimal = currentStep/totalSteps; + var easeDecimal = easingFunction(stepDecimal); + + callback.call(chartInstance,easeDecimal,stepDecimal, currentStep); + onProgress.call(chartInstance,easeDecimal,stepDecimal); + if (currentStep < totalSteps){ + chartInstance.animationFrame = requestAnimFrame(animationFrame); + } else{ + onComplete.apply(chartInstance); + } + }; + requestAnimFrame(animationFrame); + }, + //-- DOM methods + getRelativePosition = helpers.getRelativePosition = function(evt){ + var mouseX, mouseY; + var e = evt.originalEvent || evt, + canvas = evt.currentTarget || evt.srcElement, + boundingRect = canvas.getBoundingClientRect(); + + if (e.touches){ + mouseX = e.touches[0].clientX - boundingRect.left; + mouseY = e.touches[0].clientY - boundingRect.top; + + } + else{ + mouseX = e.clientX - boundingRect.left; + mouseY = e.clientY - boundingRect.top; + } + + return { + x : mouseX, + y : mouseY + }; + + }, + addEvent = helpers.addEvent = function(node,eventType,method){ + if (node.addEventListener){ + node.addEventListener(eventType,method); + } else if (node.attachEvent){ + node.attachEvent("on"+eventType, method); + } else { + node["on"+eventType] = method; + } + }, + removeEvent = helpers.removeEvent = function(node, eventType, handler){ + if (node.removeEventListener){ + node.removeEventListener(eventType, handler, false); + } else if (node.detachEvent){ + node.detachEvent("on"+eventType,handler); + } else{ + node["on" + eventType] = noop; + } + }, + bindEvents = helpers.bindEvents = function(chartInstance, arrayOfEvents, handler){ + // Create the events object if it's not already present + if (!chartInstance.events) chartInstance.events = {}; + + each(arrayOfEvents,function(eventName){ + chartInstance.events[eventName] = function(){ + handler.apply(chartInstance, arguments); + }; + addEvent(chartInstance.chart.canvas,eventName,chartInstance.events[eventName]); + }); + }, + unbindEvents = helpers.unbindEvents = function (chartInstance, arrayOfEvents) { + each(arrayOfEvents, function(handler,eventName){ + removeEvent(chartInstance.chart.canvas, eventName, handler); + }); + }, + getMaximumWidth = helpers.getMaximumWidth = function(domNode){ + var container = domNode.parentNode; + // TODO = check cross browser stuff with this. + return container.clientWidth; + }, + getMaximumHeight = helpers.getMaximumHeight = function(domNode){ + var container = domNode.parentNode; + // TODO = check cross browser stuff with this. + return container.clientHeight; + }, + getMaximumSize = helpers.getMaximumSize = helpers.getMaximumWidth, // legacy support + retinaScale = helpers.retinaScale = function(chart){ + var ctx = chart.ctx, + width = chart.canvas.width, + height = chart.canvas.height; + + if (window.devicePixelRatio) { + ctx.canvas.style.width = width + "px"; + ctx.canvas.style.height = height + "px"; + ctx.canvas.height = height * window.devicePixelRatio; + ctx.canvas.width = width * window.devicePixelRatio; + ctx.scale(window.devicePixelRatio, window.devicePixelRatio); + } + }, + //-- Canvas methods + clear = helpers.clear = function(chart){ + chart.ctx.clearRect(0,0,chart.width,chart.height); + }, + fontString = helpers.fontString = function(pixelSize,fontStyle,fontFamily){ + return fontStyle + " " + pixelSize+"px " + fontFamily; + }, + longestText = helpers.longestText = function(ctx,font,arrayOfStrings){ + ctx.font = font; + var longest = 0; + each(arrayOfStrings,function(string){ + var textWidth = ctx.measureText(string).width; + longest = (textWidth > longest) ? textWidth : longest; + }); + return longest; + }, + drawRoundedRectangle = helpers.drawRoundedRectangle = function(ctx,x,y,width,height,radius){ + ctx.beginPath(); + ctx.moveTo(x + radius, y); + ctx.lineTo(x + width - radius, y); + ctx.quadraticCurveTo(x + width, y, x + width, y + radius); + ctx.lineTo(x + width, y + height - radius); + ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height); + ctx.lineTo(x + radius, y + height); + ctx.quadraticCurveTo(x, y + height, x, y + height - radius); + ctx.lineTo(x, y + radius); + ctx.quadraticCurveTo(x, y, x + radius, y); + ctx.closePath(); + }; + + + //Store a reference to each instance - allowing us to globally resize chart instances on window resize. + //Destroy method on the chart will remove the instance of the chart from this reference. + Chart.instances = {}; + + Chart.Type = function(data,options,chart){ + this.options = options; + this.chart = chart; + this.id = uid(); + //Add the chart instance to the global namespace + Chart.instances[this.id] = this; + + // Initialize is always called when a chart type is created + // By default it is a no op, but it should be extended + if (options.responsive){ + this.resize(); + } + this.initialize.call(this,data); + }; + + //Core methods that'll be a part of every chart type + extend(Chart.Type.prototype,{ + initialize : function(){return this;}, + clear : function(){ + clear(this.chart); + return this; + }, + stop : function(){ + // Stops any current animation loop occuring + cancelAnimFrame(this.animationFrame); + return this; + }, + resize : function(callback){ + this.stop(); + var canvas = this.chart.canvas, + newWidth = getMaximumWidth(this.chart.canvas), + newHeight = this.options.maintainAspectRatio ? newWidth / this.chart.aspectRatio : getMaximumHeight(this.chart.canvas); + + canvas.width = this.chart.width = newWidth; + canvas.height = this.chart.height = newHeight; + + retinaScale(this.chart); + + if (typeof callback === "function"){ + callback.apply(this, Array.prototype.slice.call(arguments, 1)); + } + return this; + }, + reflow : noop, + render : function(reflow){ + if (reflow){ + this.reflow(); + } + if (this.options.animation && !reflow){ + helpers.animationLoop( + this.draw, + this.options.animationSteps, + this.options.animationEasing, + this.options.onAnimationProgress, + this.options.onAnimationComplete, + this + ); + } + else{ + this.draw(); + this.options.onAnimationComplete.call(this); + } + return this; + }, + generateLegend : function(){ + return template(this.options.legendTemplate,this); + }, + destroy : function(){ + this.clear(); + unbindEvents(this, this.events); + var canvas = this.chart.canvas; + + // Reset canvas height/width attributes starts a fresh with the canvas context + canvas.width = this.chart.width; + canvas.height = this.chart.height; + + // < IE9 doesn't support removeProperty + if (canvas.style.removeProperty) { + canvas.style.removeProperty('width'); + canvas.style.removeProperty('height'); + } else { + canvas.style.removeAttribute('width'); + canvas.style.removeAttribute('height'); + } + + delete Chart.instances[this.id]; + }, + showTooltip : function(ChartElements, forceRedraw){ + // Only redraw the chart if we've actually changed what we're hovering on. + if (typeof this.activeElements === 'undefined') this.activeElements = []; + + var isChanged = (function(Elements){ + var changed = false; + + if (Elements.length !== this.activeElements.length){ + changed = true; + return changed; + } + + each(Elements, function(element, index){ + if (element !== this.activeElements[index]){ + changed = true; + } + }, this); + return changed; + }).call(this, ChartElements); + + if (!isChanged && !forceRedraw){ + return; + } + else{ + this.activeElements = ChartElements; + } + this.draw(); + if(this.options.customTooltips){ + this.options.customTooltips(false); + } + if (ChartElements.length > 0){ + // If we have multiple datasets, show a MultiTooltip for all of the data points at that index + if (this.datasets && this.datasets.length > 1) { + var dataArray, + dataIndex; + + for (var i = this.datasets.length - 1; i >= 0; i--) { + dataArray = this.datasets[i].points || this.datasets[i].bars || this.datasets[i].segments; + dataIndex = indexOf(dataArray, ChartElements[0]); + if (dataIndex !== -1){ + break; + } + } + var tooltipLabels = [], + tooltipColors = [], + medianPosition = (function(index) { + + // Get all the points at that particular index + var Elements = [], + dataCollection, + xPositions = [], + yPositions = [], + xMax, + yMax, + xMin, + yMin; + helpers.each(this.datasets, function(dataset){ + dataCollection = dataset.points || dataset.bars || dataset.segments; + if (dataCollection[dataIndex] && dataCollection[dataIndex].hasValue()){ + Elements.push(dataCollection[dataIndex]); + } + }); + + helpers.each(Elements, function(element) { + xPositions.push(element.x); + yPositions.push(element.y); + + + //Include any colour information about the element + tooltipLabels.push(helpers.template(this.options.multiTooltipTemplate, element)); + tooltipColors.push({ + fill: element._saved.fillColor || element.fillColor, + stroke: element._saved.strokeColor || element.strokeColor + }); + + }, this); + + yMin = min(yPositions); + yMax = max(yPositions); + + xMin = min(xPositions); + xMax = max(xPositions); + + return { + x: (xMin > this.chart.width/2) ? xMin : xMax, + y: (yMin + yMax)/2 + }; + }).call(this, dataIndex); + + new Chart.MultiTooltip({ + x: medianPosition.x, + y: medianPosition.y, + xPadding: this.options.tooltipXPadding, + yPadding: this.options.tooltipYPadding, + xOffset: this.options.tooltipXOffset, + fillColor: this.options.tooltipFillColor, + textColor: this.options.tooltipFontColor, + fontFamily: this.options.tooltipFontFamily, + fontStyle: this.options.tooltipFontStyle, + fontSize: this.options.tooltipFontSize, + titleTextColor: this.options.tooltipTitleFontColor, + titleFontFamily: this.options.tooltipTitleFontFamily, + titleFontStyle: this.options.tooltipTitleFontStyle, + titleFontSize: this.options.tooltipTitleFontSize, + cornerRadius: this.options.tooltipCornerRadius, + labels: tooltipLabels, + legendColors: tooltipColors, + legendColorBackground : this.options.multiTooltipKeyBackground, + title: ChartElements[0].label, + chart: this.chart, + ctx: this.chart.ctx, + custom: this.options.customTooltips + }).draw(); + + } else { + each(ChartElements, function(Element) { + var tooltipPosition = Element.tooltipPosition(); + new Chart.Tooltip({ + x: Math.round(tooltipPosition.x), + y: Math.round(tooltipPosition.y), + xPadding: this.options.tooltipXPadding, + yPadding: this.options.tooltipYPadding, + fillColor: this.options.tooltipFillColor, + textColor: this.options.tooltipFontColor, + fontFamily: this.options.tooltipFontFamily, + fontStyle: this.options.tooltipFontStyle, + fontSize: this.options.tooltipFontSize, + caretHeight: this.options.tooltipCaretSize, + cornerRadius: this.options.tooltipCornerRadius, + text: template(this.options.tooltipTemplate, Element), + chart: this.chart, + custom: this.options.customTooltips + }).draw(); + }, this); + } + } + return this; + }, + toBase64Image : function(){ + return this.chart.canvas.toDataURL.apply(this.chart.canvas, arguments); + } + }); + + Chart.Type.extend = function(extensions){ + + var parent = this; + + var ChartType = function(){ + return parent.apply(this,arguments); + }; + + //Copy the prototype object of the this class + ChartType.prototype = clone(parent.prototype); + //Now overwrite some of the properties in the base class with the new extensions + extend(ChartType.prototype, extensions); + + ChartType.extend = Chart.Type.extend; + + if (extensions.name || parent.prototype.name){ + + var chartName = extensions.name || parent.prototype.name; + //Assign any potential default values of the new chart type + + //If none are defined, we'll use a clone of the chart type this is being extended from. + //I.e. if we extend a line chart, we'll use the defaults from the line chart if our new chart + //doesn't define some defaults of their own. + + var baseDefaults = (Chart.defaults[parent.prototype.name]) ? clone(Chart.defaults[parent.prototype.name]) : {}; + + Chart.defaults[chartName] = extend(baseDefaults,extensions.defaults); + + Chart.types[chartName] = ChartType; + + //Register this new chart type in the Chart prototype + Chart.prototype[chartName] = function(data,options){ + var config = merge(Chart.defaults.global, Chart.defaults[chartName], options || {}); + return new ChartType(data,config,this); + }; + } else{ + warn("Name not provided for this chart, so it hasn't been registered"); + } + return parent; + }; + + Chart.Element = function(configuration){ + extend(this,configuration); + this.initialize.apply(this,arguments); + this.save(); + }; + extend(Chart.Element.prototype,{ + initialize : function(){}, + restore : function(props){ + if (!props){ + extend(this,this._saved); + } else { + each(props,function(key){ + this[key] = this._saved[key]; + },this); + } + return this; + }, + save : function(){ + this._saved = clone(this); + delete this._saved._saved; + return this; + }, + update : function(newProps){ + each(newProps,function(value,key){ + this._saved[key] = this[key]; + this[key] = value; + },this); + return this; + }, + transition : function(props,ease){ + each(props,function(value,key){ + this[key] = ((value - this._saved[key]) * ease) + this._saved[key]; + },this); + return this; + }, + tooltipPosition : function(){ + return { + x : this.x, + y : this.y + }; + }, + hasValue: function(){ + return isNumber(this.value); + } + }); + + Chart.Element.extend = inherits; + + + Chart.Point = Chart.Element.extend({ + display: true, + inRange: function(chartX,chartY){ + var hitDetectionRange = this.hitDetectionRadius + this.radius; + return ((Math.pow(chartX-this.x, 2)+Math.pow(chartY-this.y, 2)) < Math.pow(hitDetectionRange,2)); + }, + draw : function(){ + if (this.display){ + var ctx = this.ctx; + ctx.beginPath(); + + ctx.arc(this.x, this.y, this.radius, 0, Math.PI*2); + ctx.closePath(); + + ctx.strokeStyle = this.strokeColor; + ctx.lineWidth = this.strokeWidth; + + ctx.fillStyle = this.fillColor; + + ctx.fill(); + ctx.stroke(); + } + + + //Quick debug for bezier curve splining + //Highlights control points and the line between them. + //Handy for dev - stripped in the min version. + + // ctx.save(); + // ctx.fillStyle = "black"; + // ctx.strokeStyle = "black" + // ctx.beginPath(); + // ctx.arc(this.controlPoints.inner.x,this.controlPoints.inner.y, 2, 0, Math.PI*2); + // ctx.fill(); + + // ctx.beginPath(); + // ctx.arc(this.controlPoints.outer.x,this.controlPoints.outer.y, 2, 0, Math.PI*2); + // ctx.fill(); + + // ctx.moveTo(this.controlPoints.inner.x,this.controlPoints.inner.y); + // ctx.lineTo(this.x, this.y); + // ctx.lineTo(this.controlPoints.outer.x,this.controlPoints.outer.y); + // ctx.stroke(); + + // ctx.restore(); + + + + } + }); + + Chart.Arc = Chart.Element.extend({ + inRange : function(chartX,chartY){ + + var pointRelativePosition = helpers.getAngleFromPoint(this, { + x: chartX, + y: chartY + }); + + //Check if within the range of the open/close angle + var betweenAngles = (pointRelativePosition.angle >= this.startAngle && pointRelativePosition.angle <= this.endAngle), + withinRadius = (pointRelativePosition.distance >= this.innerRadius && pointRelativePosition.distance <= this.outerRadius); + + return (betweenAngles && withinRadius); + //Ensure within the outside of the arc centre, but inside arc outer + }, + tooltipPosition : function(){ + var centreAngle = this.startAngle + ((this.endAngle - this.startAngle) / 2), + rangeFromCentre = (this.outerRadius - this.innerRadius) / 2 + this.innerRadius; + return { + x : this.x + (Math.cos(centreAngle) * rangeFromCentre), + y : this.y + (Math.sin(centreAngle) * rangeFromCentre) + }; + }, + draw : function(animationPercent){ + + var easingDecimal = animationPercent || 1; + + var ctx = this.ctx; + + ctx.beginPath(); + + ctx.arc(this.x, this.y, this.outerRadius, this.startAngle, this.endAngle); + + ctx.arc(this.x, this.y, this.innerRadius, this.endAngle, this.startAngle, true); + + ctx.closePath(); + ctx.strokeStyle = this.strokeColor; + ctx.lineWidth = this.strokeWidth; + + ctx.fillStyle = this.fillColor; + + ctx.fill(); + ctx.lineJoin = 'bevel'; + + if (this.showStroke){ + ctx.stroke(); + } + } + }); + + Chart.Rectangle = Chart.Element.extend({ + draw : function(){ + var ctx = this.ctx, + halfWidth = this.width/2, + leftX = this.x - halfWidth, + rightX = this.x + halfWidth, + top = this.base - (this.base - this.y), + halfStroke = this.strokeWidth / 2; + + // Canvas doesn't allow us to stroke inside the width so we can + // adjust the sizes to fit if we're setting a stroke on the line + if (this.showStroke){ + leftX += halfStroke; + rightX -= halfStroke; + top += halfStroke; + } + + ctx.beginPath(); + + ctx.fillStyle = this.fillColor; + ctx.strokeStyle = this.strokeColor; + ctx.lineWidth = this.strokeWidth; + + // It'd be nice to keep this class totally generic to any rectangle + // and simply specify which border to miss out. + ctx.moveTo(leftX, this.base); + ctx.lineTo(leftX, top); + ctx.lineTo(rightX, top); + ctx.lineTo(rightX, this.base); + ctx.fill(); + if (this.showStroke){ + ctx.stroke(); + } + }, + height : function(){ + return this.base - this.y; + }, + inRange : function(chartX,chartY){ + return (chartX >= this.x - this.width/2 && chartX <= this.x + this.width/2) && (chartY >= this.y && chartY <= this.base); + } + }); + + Chart.Tooltip = Chart.Element.extend({ + draw : function(){ + + var ctx = this.chart.ctx; + + ctx.font = fontString(this.fontSize,this.fontStyle,this.fontFamily); + + this.xAlign = "center"; + this.yAlign = "above"; + + //Distance between the actual element.y position and the start of the tooltip caret + var caretPadding = this.caretPadding = 2; + + var tooltipWidth = ctx.measureText(this.text).width + 2*this.xPadding, + tooltipRectHeight = this.fontSize + 2*this.yPadding, + tooltipHeight = tooltipRectHeight + this.caretHeight + caretPadding; + + if (this.x + tooltipWidth/2 >this.chart.width){ + this.xAlign = "left"; + } else if (this.x - tooltipWidth/2 < 0){ + this.xAlign = "right"; + } + + if (this.y - tooltipHeight < 0){ + this.yAlign = "below"; + } + + + var tooltipX = this.x - tooltipWidth/2, + tooltipY = this.y - tooltipHeight; + + ctx.fillStyle = this.fillColor; + + // Custom Tooltips + if(this.custom){ + this.custom(this); + } + else{ + switch(this.yAlign) + { + case "above": + //Draw a caret above the x/y + ctx.beginPath(); + ctx.moveTo(this.x,this.y - caretPadding); + ctx.lineTo(this.x + this.caretHeight, this.y - (caretPadding + this.caretHeight)); + ctx.lineTo(this.x - this.caretHeight, this.y - (caretPadding + this.caretHeight)); + ctx.closePath(); + ctx.fill(); + break; + case "below": + tooltipY = this.y + caretPadding + this.caretHeight; + //Draw a caret below the x/y + ctx.beginPath(); + ctx.moveTo(this.x, this.y + caretPadding); + ctx.lineTo(this.x + this.caretHeight, this.y + caretPadding + this.caretHeight); + ctx.lineTo(this.x - this.caretHeight, this.y + caretPadding + this.caretHeight); + ctx.closePath(); + ctx.fill(); + break; + } + + switch(this.xAlign) + { + case "left": + tooltipX = this.x - tooltipWidth + (this.cornerRadius + this.caretHeight); + break; + case "right": + tooltipX = this.x - (this.cornerRadius + this.caretHeight); + break; + } + + drawRoundedRectangle(ctx,tooltipX,tooltipY,tooltipWidth,tooltipRectHeight,this.cornerRadius); + + ctx.fill(); + + ctx.fillStyle = this.textColor; + ctx.textAlign = "center"; + ctx.textBaseline = "middle"; + ctx.fillText(this.text, tooltipX + tooltipWidth/2, tooltipY + tooltipRectHeight/2); + } + } + }); + + Chart.MultiTooltip = Chart.Element.extend({ + initialize : function(){ + this.font = fontString(this.fontSize,this.fontStyle,this.fontFamily); + + this.titleFont = fontString(this.titleFontSize,this.titleFontStyle,this.titleFontFamily); + + this.height = (this.labels.length * this.fontSize) + ((this.labels.length-1) * (this.fontSize/2)) + (this.yPadding*2) + this.titleFontSize *1.5; + + this.ctx.font = this.titleFont; + + var titleWidth = this.ctx.measureText(this.title).width, + //Label has a legend square as well so account for this. + labelWidth = longestText(this.ctx,this.font,this.labels) + this.fontSize + 3, + longestTextWidth = max([labelWidth,titleWidth]); + + this.width = longestTextWidth + (this.xPadding*2); + + + var halfHeight = this.height/2; + + //Check to ensure the height will fit on the canvas + if (this.y - halfHeight < 0 ){ + this.y = halfHeight; + } else if (this.y + halfHeight > this.chart.height){ + this.y = this.chart.height - halfHeight; + } + + //Decide whether to align left or right based on position on canvas + if (this.x > this.chart.width/2){ + this.x -= this.xOffset + this.width; + } else { + this.x += this.xOffset; + } + + + }, + getLineHeight : function(index){ + var baseLineHeight = this.y - (this.height/2) + this.yPadding, + afterTitleIndex = index-1; + + //If the index is zero, we're getting the title + if (index === 0){ + return baseLineHeight + this.titleFontSize/2; + } else{ + return baseLineHeight + ((this.fontSize*1.5*afterTitleIndex) + this.fontSize/2) + this.titleFontSize * 1.5; + } + + }, + draw : function(){ + // Custom Tooltips + if(this.custom){ + this.custom(this); + } + else{ + drawRoundedRectangle(this.ctx,this.x,this.y - this.height/2,this.width,this.height,this.cornerRadius); + var ctx = this.ctx; + ctx.fillStyle = this.fillColor; + ctx.fill(); + ctx.closePath(); + + ctx.textAlign = "left"; + ctx.textBaseline = "middle"; + ctx.fillStyle = this.titleTextColor; + ctx.font = this.titleFont; + + ctx.fillText(this.title,this.x + this.xPadding, this.getLineHeight(0)); + + ctx.font = this.font; + helpers.each(this.labels,function(label,index){ + ctx.fillStyle = this.textColor; + ctx.fillText(label,this.x + this.xPadding + this.fontSize + 3, this.getLineHeight(index + 1)); + + //A bit gnarly, but clearing this rectangle breaks when using explorercanvas (clears whole canvas) + //ctx.clearRect(this.x + this.xPadding, this.getLineHeight(index + 1) - this.fontSize/2, this.fontSize, this.fontSize); + //Instead we'll make a white filled block to put the legendColour palette over. + + ctx.fillStyle = this.legendColorBackground; + ctx.fillRect(this.x + this.xPadding, this.getLineHeight(index + 1) - this.fontSize/2, this.fontSize, this.fontSize); + + ctx.fillStyle = this.legendColors[index].fill; + ctx.fillRect(this.x + this.xPadding, this.getLineHeight(index + 1) - this.fontSize/2, this.fontSize, this.fontSize); + + + },this); + } + } + }); + + Chart.Scale = Chart.Element.extend({ + initialize : function(){ + this.fit(); + }, + buildYLabels : function(){ + this.yLabels = []; + + var stepDecimalPlaces = getDecimalPlaces(this.stepValue); + + for (var i=0; i<=this.steps; i++){ + this.yLabels.push(template(this.templateString,{value:(this.min + (i * this.stepValue)).toFixed(stepDecimalPlaces)})); + } + this.yLabelWidth = (this.display && this.showLabels) ? longestText(this.ctx,this.font,this.yLabels) : 0; + }, + addXLabel : function(label){ + this.xLabels.push(label); + this.valuesCount++; + this.fit(); + }, + removeXLabel : function(){ + this.xLabels.shift(); + this.valuesCount--; + this.fit(); + }, + // Fitting loop to rotate x Labels and figure out what fits there, and also calculate how many Y steps to use + fit: function(){ + // First we need the width of the yLabels, assuming the xLabels aren't rotated + + // To do that we need the base line at the top and base of the chart, assuming there is no x label rotation + this.startPoint = (this.display) ? this.fontSize : 0; + this.endPoint = (this.display) ? this.height - (this.fontSize * 1.5) - 5 : this.height; // -5 to pad labels + + // Apply padding settings to the start and end point. + this.startPoint += this.padding; + this.endPoint -= this.padding; + + // Cache the starting height, so can determine if we need to recalculate the scale yAxis + var cachedHeight = this.endPoint - this.startPoint, + cachedYLabelWidth; + + // Build the current yLabels so we have an idea of what size they'll be to start + /* + * This sets what is returned from calculateScaleRange as static properties of this class: + * + this.steps; + this.stepValue; + this.min; + this.max; + * + */ + this.calculateYRange(cachedHeight); + + // With these properties set we can now build the array of yLabels + // and also the width of the largest yLabel + this.buildYLabels(); + + this.calculateXLabelRotation(); + + while((cachedHeight > this.endPoint - this.startPoint)){ + cachedHeight = this.endPoint - this.startPoint; + cachedYLabelWidth = this.yLabelWidth; + + this.calculateYRange(cachedHeight); + this.buildYLabels(); + + // Only go through the xLabel loop again if the yLabel width has changed + if (cachedYLabelWidth < this.yLabelWidth){ + this.calculateXLabelRotation(); + } + } + + }, + calculateXLabelRotation : function(){ + //Get the width of each grid by calculating the difference + //between x offsets between 0 and 1. + + this.ctx.font = this.font; + + var firstWidth = this.ctx.measureText(this.xLabels[0]).width, + lastWidth = this.ctx.measureText(this.xLabels[this.xLabels.length - 1]).width, + firstRotated, + lastRotated; + + + this.xScalePaddingRight = lastWidth/2 + 3; + this.xScalePaddingLeft = (firstWidth/2 > this.yLabelWidth + 10) ? firstWidth/2 : this.yLabelWidth + 10; + + this.xLabelRotation = 0; + if (this.display){ + var originalLabelWidth = longestText(this.ctx,this.font,this.xLabels), + cosRotation, + firstRotatedWidth; + this.xLabelWidth = originalLabelWidth; + //Allow 3 pixels x2 padding either side for label readability + var xGridWidth = Math.floor(this.calculateX(1) - this.calculateX(0)) - 6; + + //Max label rotate should be 90 - also act as a loop counter + while ((this.xLabelWidth > xGridWidth && this.xLabelRotation === 0) || (this.xLabelWidth > xGridWidth && this.xLabelRotation <= 90 && this.xLabelRotation > 0)){ + cosRotation = Math.cos(toRadians(this.xLabelRotation)); + + firstRotated = cosRotation * firstWidth; + lastRotated = cosRotation * lastWidth; + + // We're right aligning the text now. + if (firstRotated + this.fontSize / 2 > this.yLabelWidth + 8){ + this.xScalePaddingLeft = firstRotated + this.fontSize / 2; + } + this.xScalePaddingRight = this.fontSize/2; + + + this.xLabelRotation++; + this.xLabelWidth = cosRotation * originalLabelWidth; + + } + if (this.xLabelRotation > 0){ + this.endPoint -= Math.sin(toRadians(this.xLabelRotation))*originalLabelWidth + 3; + } + } + else{ + this.xLabelWidth = 0; + this.xScalePaddingRight = this.padding; + this.xScalePaddingLeft = this.padding; + } + + }, + // Needs to be overidden in each Chart type + // Otherwise we need to pass all the data into the scale class + calculateYRange: noop, + drawingArea: function(){ + return this.startPoint - this.endPoint; + }, + calculateY : function(value){ + var scalingFactor = this.drawingArea() / (this.min - this.max); + return this.endPoint - (scalingFactor * (value - this.min)); + }, + calculateX : function(index){ + var isRotated = (this.xLabelRotation > 0), + // innerWidth = (this.offsetGridLines) ? this.width - offsetLeft - this.padding : this.width - (offsetLeft + halfLabelWidth * 2) - this.padding, + innerWidth = this.width - (this.xScalePaddingLeft + this.xScalePaddingRight), + valueWidth = innerWidth/Math.max((this.valuesCount - ((this.offsetGridLines) ? 0 : 1)), 1), + valueOffset = (valueWidth * index) + this.xScalePaddingLeft; + + if (this.offsetGridLines){ + valueOffset += (valueWidth/2); + } + + return Math.round(valueOffset); + }, + update : function(newProps){ + helpers.extend(this, newProps); + this.fit(); + }, + draw : function(){ + var ctx = this.ctx, + yLabelGap = (this.endPoint - this.startPoint) / this.steps, + xStart = Math.round(this.xScalePaddingLeft); + if (this.display){ + ctx.fillStyle = this.textColor; + ctx.font = this.font; + each(this.yLabels,function(labelString,index){ + var yLabelCenter = this.endPoint - (yLabelGap * index), + linePositionY = Math.round(yLabelCenter), + drawHorizontalLine = this.showHorizontalLines; + + ctx.textAlign = "right"; + ctx.textBaseline = "middle"; + if (this.showLabels){ + ctx.fillText(labelString,xStart - 10,yLabelCenter); + } + + // This is X axis, so draw it + if (index === 0 && !drawHorizontalLine){ + drawHorizontalLine = true; + } + + if (drawHorizontalLine){ + ctx.beginPath(); + } + + if (index > 0){ + // This is a grid line in the centre, so drop that + ctx.lineWidth = this.gridLineWidth; + ctx.strokeStyle = this.gridLineColor; + } else { + // This is the first line on the scale + ctx.lineWidth = this.lineWidth; + ctx.strokeStyle = this.lineColor; + } + + linePositionY += helpers.aliasPixel(ctx.lineWidth); + + if(drawHorizontalLine){ + ctx.moveTo(xStart, linePositionY); + ctx.lineTo(this.width, linePositionY); + ctx.stroke(); + ctx.closePath(); + } + + ctx.lineWidth = this.lineWidth; + ctx.strokeStyle = this.lineColor; + ctx.beginPath(); + ctx.moveTo(xStart - 5, linePositionY); + ctx.lineTo(xStart, linePositionY); + ctx.stroke(); + ctx.closePath(); + + },this); + + each(this.xLabels,function(label,index){ + var xPos = this.calculateX(index) + aliasPixel(this.lineWidth), + // Check to see if line/bar here and decide where to place the line + linePos = this.calculateX(index - (this.offsetGridLines ? 0.5 : 0)) + aliasPixel(this.lineWidth), + isRotated = (this.xLabelRotation > 0), + drawVerticalLine = this.showVerticalLines; + + // This is Y axis, so draw it + if (index === 0 && !drawVerticalLine){ + drawVerticalLine = true; + } + + if (drawVerticalLine){ + ctx.beginPath(); + } + + if (index > 0){ + // This is a grid line in the centre, so drop that + ctx.lineWidth = this.gridLineWidth; + ctx.strokeStyle = this.gridLineColor; + } else { + // This is the first line on the scale + ctx.lineWidth = this.lineWidth; + ctx.strokeStyle = this.lineColor; + } + + if (drawVerticalLine){ + ctx.moveTo(linePos,this.endPoint); + ctx.lineTo(linePos,this.startPoint - 3); + ctx.stroke(); + ctx.closePath(); + } + + + ctx.lineWidth = this.lineWidth; + ctx.strokeStyle = this.lineColor; + + + // Small lines at the bottom of the base grid line + ctx.beginPath(); + ctx.moveTo(linePos,this.endPoint); + ctx.lineTo(linePos,this.endPoint + 5); + ctx.stroke(); + ctx.closePath(); + + ctx.save(); + ctx.translate(xPos,(isRotated) ? this.endPoint + 12 : this.endPoint + 8); + ctx.rotate(toRadians(this.xLabelRotation)*-1); + ctx.font = this.font; + ctx.textAlign = (isRotated) ? "right" : "center"; + ctx.textBaseline = (isRotated) ? "middle" : "top"; + ctx.fillText(label, 0, 0); + ctx.restore(); + },this); + + } + } + + }); + + Chart.RadialScale = Chart.Element.extend({ + initialize: function(){ + this.size = min([this.height, this.width]); + this.drawingArea = (this.display) ? (this.size/2) - (this.fontSize/2 + this.backdropPaddingY) : (this.size/2); + }, + calculateCenterOffset: function(value){ + // Take into account half font size + the yPadding of the top value + var scalingFactor = this.drawingArea / (this.max - this.min); + + return (value - this.min) * scalingFactor; + }, + update : function(){ + if (!this.lineArc){ + this.setScaleSize(); + } else { + this.drawingArea = (this.display) ? (this.size/2) - (this.fontSize/2 + this.backdropPaddingY) : (this.size/2); + } + this.buildYLabels(); + }, + buildYLabels: function(){ + this.yLabels = []; + + var stepDecimalPlaces = getDecimalPlaces(this.stepValue); + + for (var i=0; i<=this.steps; i++){ + this.yLabels.push(template(this.templateString,{value:(this.min + (i * this.stepValue)).toFixed(stepDecimalPlaces)})); + } + }, + getCircumference : function(){ + return ((Math.PI*2) / this.valuesCount); + }, + setScaleSize: function(){ + /* + * Right, this is really confusing and there is a lot of maths going on here + * The gist of the problem is here: https://gist.github.com/nnnick/696cc9c55f4b0beb8fe9 + * + * Reaction: https://dl.dropboxusercontent.com/u/34601363/toomuchscience.gif + * + * Solution: + * + * We assume the radius of the polygon is half the size of the canvas at first + * at each index we check if the text overlaps. + * + * Where it does, we store that angle and that index. + * + * After finding the largest index and angle we calculate how much we need to remove + * from the shape radius to move the point inwards by that x. + * + * We average the left and right distances to get the maximum shape radius that can fit in the box + * along with labels. + * + * Once we have that, we can find the centre point for the chart, by taking the x text protrusion + * on each side, removing that from the size, halving it and adding the left x protrusion width. + * + * This will mean we have a shape fitted to the canvas, as large as it can be with the labels + * and position it in the most space efficient manner + * + * https://dl.dropboxusercontent.com/u/34601363/yeahscience.gif + */ + + + // Get maximum radius of the polygon. Either half the height (minus the text width) or half the width. + // Use this to calculate the offset + change. - Make sure L/R protrusion is at least 0 to stop issues with centre points + var largestPossibleRadius = min([(this.height/2 - this.pointLabelFontSize - 5), this.width/2]), + pointPosition, + i, + textWidth, + halfTextWidth, + furthestRight = this.width, + furthestRightIndex, + furthestRightAngle, + furthestLeft = 0, + furthestLeftIndex, + furthestLeftAngle, + xProtrusionLeft, + xProtrusionRight, + radiusReductionRight, + radiusReductionLeft, + maxWidthRadius; + this.ctx.font = fontString(this.pointLabelFontSize,this.pointLabelFontStyle,this.pointLabelFontFamily); + for (i=0;i furthestRight) { + furthestRight = pointPosition.x + halfTextWidth; + furthestRightIndex = i; + } + if (pointPosition.x - halfTextWidth < furthestLeft) { + furthestLeft = pointPosition.x - halfTextWidth; + furthestLeftIndex = i; + } + } + else if (i < this.valuesCount/2) { + // Less than half the values means we'll left align the text + if (pointPosition.x + textWidth > furthestRight) { + furthestRight = pointPosition.x + textWidth; + furthestRightIndex = i; + } + } + else if (i > this.valuesCount/2){ + // More than half the values means we'll right align the text + if (pointPosition.x - textWidth < furthestLeft) { + furthestLeft = pointPosition.x - textWidth; + furthestLeftIndex = i; + } + } + } + + xProtrusionLeft = furthestLeft; + + xProtrusionRight = Math.ceil(furthestRight - this.width); + + furthestRightAngle = this.getIndexAngle(furthestRightIndex); + + furthestLeftAngle = this.getIndexAngle(furthestLeftIndex); + + radiusReductionRight = xProtrusionRight / Math.sin(furthestRightAngle + Math.PI/2); + + radiusReductionLeft = xProtrusionLeft / Math.sin(furthestLeftAngle + Math.PI/2); + + // Ensure we actually need to reduce the size of the chart + radiusReductionRight = (isNumber(radiusReductionRight)) ? radiusReductionRight : 0; + radiusReductionLeft = (isNumber(radiusReductionLeft)) ? radiusReductionLeft : 0; + + this.drawingArea = largestPossibleRadius - (radiusReductionLeft + radiusReductionRight)/2; + + //this.drawingArea = min([maxWidthRadius, (this.height - (2 * (this.pointLabelFontSize + 5)))/2]) + this.setCenterPoint(radiusReductionLeft, radiusReductionRight); + + }, + setCenterPoint: function(leftMovement, rightMovement){ + + var maxRight = this.width - rightMovement - this.drawingArea, + maxLeft = leftMovement + this.drawingArea; + + this.xCenter = (maxLeft + maxRight)/2; + // Always vertically in the centre as the text height doesn't change + this.yCenter = (this.height/2); + }, + + getIndexAngle : function(index){ + var angleMultiplier = (Math.PI * 2) / this.valuesCount; + // Start from the top instead of right, so remove a quarter of the circle + + return index * angleMultiplier - (Math.PI/2); + }, + getPointPosition : function(index, distanceFromCenter){ + var thisAngle = this.getIndexAngle(index); + return { + x : (Math.cos(thisAngle) * distanceFromCenter) + this.xCenter, + y : (Math.sin(thisAngle) * distanceFromCenter) + this.yCenter + }; + }, + draw: function(){ + if (this.display){ + var ctx = this.ctx; + each(this.yLabels, function(label, index){ + // Don't draw a centre value + if (index > 0){ + var yCenterOffset = index * (this.drawingArea/this.steps), + yHeight = this.yCenter - yCenterOffset, + pointPosition; + + // Draw circular lines around the scale + if (this.lineWidth > 0){ + ctx.strokeStyle = this.lineColor; + ctx.lineWidth = this.lineWidth; + + if(this.lineArc){ + ctx.beginPath(); + ctx.arc(this.xCenter, this.yCenter, yCenterOffset, 0, Math.PI*2); + ctx.closePath(); + ctx.stroke(); + } else{ + ctx.beginPath(); + for (var i=0;i= 0; i--) { + if (this.angleLineWidth > 0){ + var outerPosition = this.getPointPosition(i, this.calculateCenterOffset(this.max)); + ctx.beginPath(); + ctx.moveTo(this.xCenter, this.yCenter); + ctx.lineTo(outerPosition.x, outerPosition.y); + ctx.stroke(); + ctx.closePath(); + } + // Extra 3px out for some label spacing + var pointLabelPosition = this.getPointPosition(i, this.calculateCenterOffset(this.max) + 5); + ctx.font = fontString(this.pointLabelFontSize,this.pointLabelFontStyle,this.pointLabelFontFamily); + ctx.fillStyle = this.pointLabelFontColor; + + var labelsCount = this.labels.length, + halfLabelsCount = this.labels.length/2, + quarterLabelsCount = halfLabelsCount/2, + upperHalf = (i < quarterLabelsCount || i > labelsCount - quarterLabelsCount), + exactQuarter = (i === quarterLabelsCount || i === labelsCount - quarterLabelsCount); + if (i === 0){ + ctx.textAlign = 'center'; + } else if(i === halfLabelsCount){ + ctx.textAlign = 'center'; + } else if (i < halfLabelsCount){ + ctx.textAlign = 'left'; + } else { + ctx.textAlign = 'right'; + } + + // Set the correct text baseline based on outer positioning + if (exactQuarter){ + ctx.textBaseline = 'middle'; + } else if (upperHalf){ + ctx.textBaseline = 'bottom'; + } else { + ctx.textBaseline = 'top'; + } + + ctx.fillText(this.labels[i], pointLabelPosition.x, pointLabelPosition.y); + } + } + } + } + }); + + // Attach global event to resize each chart instance when the browser resizes + helpers.addEvent(window, "resize", (function(){ + // Basic debounce of resize function so it doesn't hurt performance when resizing browser. + var timeout; + return function(){ + clearTimeout(timeout); + timeout = setTimeout(function(){ + each(Chart.instances,function(instance){ + // If the responsive flag is set in the chart instance config + // Cascade the resize event down to the chart. + if (instance.options.responsive){ + instance.resize(instance.render, true); + } + }); + }, 50); + }; + })()); + + + if (amd) { + define(function(){ + return Chart; + }); + } else if (typeof module === 'object' && module.exports) { + module.exports = Chart; + } + + root.Chart = Chart; + + Chart.noConflict = function(){ + root.Chart = previous; + return Chart; + }; + +}).call(this); + +(function(){ + "use strict"; + + var root = this, + Chart = root.Chart, + helpers = Chart.helpers; + + + var defaultConfig = { + //Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value + scaleBeginAtZero : true, + + //Boolean - Whether grid lines are shown across the chart + scaleShowGridLines : true, + + //String - Colour of the grid lines + scaleGridLineColor : "rgba(0,0,0,.05)", + + //Number - Width of the grid lines + scaleGridLineWidth : 1, + + //Boolean - Whether to show horizontal lines (except X axis) + scaleShowHorizontalLines: true, + + //Boolean - Whether to show vertical lines (except Y axis) + scaleShowVerticalLines: true, + + //Boolean - If there is a stroke on each bar + barShowStroke : true, + + //Number - Pixel width of the bar stroke + barStrokeWidth : 2, + + //Number - Spacing between each of the X value sets + barValueSpacing : 5, + + //Number - Spacing between data sets within X values + barDatasetSpacing : 1, + + //String - A legend template + legendTemplate : "
    -legend\"><% for (var i=0; i
  • \"><%if(datasets[i].label){%><%=datasets[i].label%><%}%>
    • <%}%>
" + + }; + + + Chart.Type.extend({ + name: "Bar", + defaults : defaultConfig, + initialize: function(data){ + + //Expose options as a scope variable here so we can access it in the ScaleClass + var options = this.options; + + this.ScaleClass = Chart.Scale.extend({ + offsetGridLines : true, + calculateBarX : function(datasetCount, datasetIndex, barIndex){ + //Reusable method for calculating the xPosition of a given bar based on datasetIndex & width of the bar + var xWidth = this.calculateBaseWidth(), + xAbsolute = this.calculateX(barIndex) - (xWidth/2), + barWidth = this.calculateBarWidth(datasetCount); + + return xAbsolute + (barWidth * datasetIndex) + (datasetIndex * options.barDatasetSpacing) + barWidth/2; + }, + calculateBaseWidth : function(){ + return (this.calculateX(1) - this.calculateX(0)) - (2*options.barValueSpacing); + }, + calculateBarWidth : function(datasetCount){ + //The padding between datasets is to the right of each bar, providing that there are more than 1 dataset + var baseWidth = this.calculateBaseWidth() - ((datasetCount - 1) * options.barDatasetSpacing); + + return (baseWidth / datasetCount); + } + }); + + this.datasets = []; + + //Set up tooltip events on the chart + if (this.options.showTooltips){ + helpers.bindEvents(this, this.options.tooltipEvents, function(evt){ + var activeBars = (evt.type !== 'mouseout') ? this.getBarsAtEvent(evt) : []; + + this.eachBars(function(bar){ + bar.restore(['fillColor', 'strokeColor']); + }); + helpers.each(activeBars, function(activeBar){ + activeBar.fillColor = activeBar.highlightFill; + activeBar.strokeColor = activeBar.highlightStroke; + }); + this.showTooltip(activeBars); + }); + } + + //Declare the extension of the default point, to cater for the options passed in to the constructor + this.BarClass = Chart.Rectangle.extend({ + strokeWidth : this.options.barStrokeWidth, + showStroke : this.options.barShowStroke, + ctx : this.chart.ctx + }); + + //Iterate through each of the datasets, and build this into a property of the chart + helpers.each(data.datasets,function(dataset,datasetIndex){ + + var datasetObject = { + label : dataset.label || null, + fillColor : dataset.fillColor, + strokeColor : dataset.strokeColor, + bars : [] + }; + + this.datasets.push(datasetObject); + + helpers.each(dataset.data,function(dataPoint,index){ + //Add a new point for each piece of data, passing any required data to draw. + datasetObject.bars.push(new this.BarClass({ + value : dataPoint, + label : data.labels[index], + datasetLabel: dataset.label, + strokeColor : dataset.strokeColor, + fillColor : dataset.fillColor, + highlightFill : dataset.highlightFill || dataset.fillColor, + highlightStroke : dataset.highlightStroke || dataset.strokeColor + })); + },this); + + },this); + + this.buildScale(data.labels); + + this.BarClass.prototype.base = this.scale.endPoint; + + this.eachBars(function(bar, index, datasetIndex){ + helpers.extend(bar, { + width : this.scale.calculateBarWidth(this.datasets.length), + x: this.scale.calculateBarX(this.datasets.length, datasetIndex, index), + y: this.scale.endPoint + }); + bar.save(); + }, this); + + this.render(); + }, + update : function(){ + this.scale.update(); + // Reset any highlight colours before updating. + helpers.each(this.activeElements, function(activeElement){ + activeElement.restore(['fillColor', 'strokeColor']); + }); + + this.eachBars(function(bar){ + bar.save(); + }); + this.render(); + }, + eachBars : function(callback){ + helpers.each(this.datasets,function(dataset, datasetIndex){ + helpers.each(dataset.bars, callback, this, datasetIndex); + },this); + }, + getBarsAtEvent : function(e){ + var barsArray = [], + eventPosition = helpers.getRelativePosition(e), + datasetIterator = function(dataset){ + barsArray.push(dataset.bars[barIndex]); + }, + barIndex; + + for (var datasetIndex = 0; datasetIndex < this.datasets.length; datasetIndex++) { + for (barIndex = 0; barIndex < this.datasets[datasetIndex].bars.length; barIndex++) { + if (this.datasets[datasetIndex].bars[barIndex].inRange(eventPosition.x,eventPosition.y)){ + helpers.each(this.datasets, datasetIterator); + return barsArray; + } + } + } + + return barsArray; + }, + buildScale : function(labels){ + var self = this; + + var dataTotal = function(){ + var values = []; + self.eachBars(function(bar){ + values.push(bar.value); + }); + return values; + }; + + var scaleOptions = { + templateString : this.options.scaleLabel, + height : this.chart.height, + width : this.chart.width, + ctx : this.chart.ctx, + textColor : this.options.scaleFontColor, + fontSize : this.options.scaleFontSize, + fontStyle : this.options.scaleFontStyle, + fontFamily : this.options.scaleFontFamily, + valuesCount : labels.length, + beginAtZero : this.options.scaleBeginAtZero, + integersOnly : this.options.scaleIntegersOnly, + calculateYRange: function(currentHeight){ + var updatedRanges = helpers.calculateScaleRange( + dataTotal(), + currentHeight, + this.fontSize, + this.beginAtZero, + this.integersOnly + ); + helpers.extend(this, updatedRanges); + }, + xLabels : labels, + font : helpers.fontString(this.options.scaleFontSize, this.options.scaleFontStyle, this.options.scaleFontFamily), + lineWidth : this.options.scaleLineWidth, + lineColor : this.options.scaleLineColor, + showHorizontalLines : this.options.scaleShowHorizontalLines, + showVerticalLines : this.options.scaleShowVerticalLines, + gridLineWidth : (this.options.scaleShowGridLines) ? this.options.scaleGridLineWidth : 0, + gridLineColor : (this.options.scaleShowGridLines) ? this.options.scaleGridLineColor : "rgba(0,0,0,0)", + padding : (this.options.showScale) ? 0 : (this.options.barShowStroke) ? this.options.barStrokeWidth : 0, + showLabels : this.options.scaleShowLabels, + display : this.options.showScale + }; + + if (this.options.scaleOverride){ + helpers.extend(scaleOptions, { + calculateYRange: helpers.noop, + steps: this.options.scaleSteps, + stepValue: this.options.scaleStepWidth, + min: this.options.scaleStartValue, + max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth) + }); + } + + this.scale = new this.ScaleClass(scaleOptions); + }, + addData : function(valuesArray,label){ + //Map the values array for each of the datasets + helpers.each(valuesArray,function(value,datasetIndex){ + //Add a new point for each piece of data, passing any required data to draw. + this.datasets[datasetIndex].bars.push(new this.BarClass({ + value : value, + label : label, + x: this.scale.calculateBarX(this.datasets.length, datasetIndex, this.scale.valuesCount+1), + y: this.scale.endPoint, + width : this.scale.calculateBarWidth(this.datasets.length), + base : this.scale.endPoint, + strokeColor : this.datasets[datasetIndex].strokeColor, + fillColor : this.datasets[datasetIndex].fillColor + })); + },this); + + this.scale.addXLabel(label); + //Then re-render the chart. + this.update(); + }, + removeData : function(){ + this.scale.removeXLabel(); + //Then re-render the chart. + helpers.each(this.datasets,function(dataset){ + dataset.bars.shift(); + },this); + this.update(); + }, + reflow : function(){ + helpers.extend(this.BarClass.prototype,{ + y: this.scale.endPoint, + base : this.scale.endPoint + }); + var newScaleProps = helpers.extend({ + height : this.chart.height, + width : this.chart.width + }); + this.scale.update(newScaleProps); + }, + draw : function(ease){ + var easingDecimal = ease || 1; + this.clear(); + + var ctx = this.chart.ctx; + + this.scale.draw(easingDecimal); + + //Draw all the bars for each dataset + helpers.each(this.datasets,function(dataset,datasetIndex){ + helpers.each(dataset.bars,function(bar,index){ + if (bar.hasValue()){ + bar.base = this.scale.endPoint; + //Transition then draw + bar.transition({ + x : this.scale.calculateBarX(this.datasets.length, datasetIndex, index), + y : this.scale.calculateY(bar.value), + width : this.scale.calculateBarWidth(this.datasets.length) + }, easingDecimal).draw(); + } + },this); + + },this); + } + }); + + +}).call(this); + +(function(){ + "use strict"; + + var root = this, + Chart = root.Chart, + //Cache a local reference to Chart.helpers + helpers = Chart.helpers; + + var defaultConfig = { + //Boolean - Whether we should show a stroke on each segment + segmentShowStroke : true, + + //String - The colour of each segment stroke + segmentStrokeColor : "#fff", + + //Number - The width of each segment stroke + segmentStrokeWidth : 2, + + //The percentage of the chart that we cut out of the middle. + percentageInnerCutout : 50, + + //Number - Amount of animation steps + animationSteps : 100, + + //String - Animation easing effect + animationEasing : "easeOutBounce", + + //Boolean - Whether we animate the rotation of the Doughnut + animateRotate : true, + + //Boolean - Whether we animate scaling the Doughnut from the centre + animateScale : false, + + //String - A legend template + legendTemplate : "
    -legend\"><% for (var i=0; i
  • \"><%if(segments[i].label){%><%=segments[i].label%><%}%>
    • <%}%>
" + + }; + + + Chart.Type.extend({ + //Passing in a name registers this chart in the Chart namespace + name: "Doughnut", + //Providing a defaults will also register the deafults in the chart namespace + defaults : defaultConfig, + //Initialize is fired when the chart is initialized - Data is passed in as a parameter + //Config is automatically merged by the core of Chart.js, and is available at this.options + initialize: function(data){ + + //Declare segments as a static property to prevent inheriting across the Chart type prototype + this.segments = []; + this.outerRadius = (helpers.min([this.chart.width,this.chart.height]) - this.options.segmentStrokeWidth/2)/2; + + this.SegmentArc = Chart.Arc.extend({ + ctx : this.chart.ctx, + x : this.chart.width/2, + y : this.chart.height/2 + }); + + //Set up tooltip events on the chart + if (this.options.showTooltips){ + helpers.bindEvents(this, this.options.tooltipEvents, function(evt){ + var activeSegments = (evt.type !== 'mouseout') ? this.getSegmentsAtEvent(evt) : []; + + helpers.each(this.segments,function(segment){ + segment.restore(["fillColor"]); + }); + helpers.each(activeSegments,function(activeSegment){ + activeSegment.fillColor = activeSegment.highlightColor; + }); + this.showTooltip(activeSegments); + }); + } + this.calculateTotal(data); + + helpers.each(data,function(datapoint, index){ + this.addData(datapoint, index, true); + },this); + + this.render(); + }, + getSegmentsAtEvent : function(e){ + var segmentsArray = []; + + var location = helpers.getRelativePosition(e); + + helpers.each(this.segments,function(segment){ + if (segment.inRange(location.x,location.y)) segmentsArray.push(segment); + },this); + return segmentsArray; + }, + addData : function(segment, atIndex, silent){ + var index = atIndex || this.segments.length; + this.segments.splice(index, 0, new this.SegmentArc({ + value : segment.value, + outerRadius : (this.options.animateScale) ? 0 : this.outerRadius, + innerRadius : (this.options.animateScale) ? 0 : (this.outerRadius/100) * this.options.percentageInnerCutout, + fillColor : segment.color, + highlightColor : segment.highlight || segment.color, + showStroke : this.options.segmentShowStroke, + strokeWidth : this.options.segmentStrokeWidth, + strokeColor : this.options.segmentStrokeColor, + startAngle : Math.PI * 1.5, + circumference : (this.options.animateRotate) ? 0 : this.calculateCircumference(segment.value), + label : segment.label + })); + if (!silent){ + this.reflow(); + this.update(); + } + }, + calculateCircumference : function(value){ + return (Math.PI*2)*(Math.abs(value) / this.total); + }, + calculateTotal : function(data){ + this.total = 0; + helpers.each(data,function(segment){ + this.total += Math.abs(segment.value); + },this); + }, + update : function(){ + this.calculateTotal(this.segments); + + // Reset any highlight colours before updating. + helpers.each(this.activeElements, function(activeElement){ + activeElement.restore(['fillColor']); + }); + + helpers.each(this.segments,function(segment){ + segment.save(); + }); + this.render(); + }, + + removeData: function(atIndex){ + var indexToDelete = (helpers.isNumber(atIndex)) ? atIndex : this.segments.length-1; + this.segments.splice(indexToDelete, 1); + this.reflow(); + this.update(); + }, + + reflow : function(){ + helpers.extend(this.SegmentArc.prototype,{ + x : this.chart.width/2, + y : this.chart.height/2 + }); + this.outerRadius = (helpers.min([this.chart.width,this.chart.height]) - this.options.segmentStrokeWidth/2)/2; + helpers.each(this.segments, function(segment){ + segment.update({ + outerRadius : this.outerRadius, + innerRadius : (this.outerRadius/100) * this.options.percentageInnerCutout + }); + }, this); + }, + draw : function(easeDecimal){ + var animDecimal = (easeDecimal) ? easeDecimal : 1; + this.clear(); + helpers.each(this.segments,function(segment,index){ + segment.transition({ + circumference : this.calculateCircumference(segment.value), + outerRadius : this.outerRadius, + innerRadius : (this.outerRadius/100) * this.options.percentageInnerCutout + },animDecimal); + + segment.endAngle = segment.startAngle + segment.circumference; + + segment.draw(); + if (index === 0){ + segment.startAngle = Math.PI * 1.5; + } + //Check to see if it's the last segment, if not get the next and update the start angle + if (index < this.segments.length-1){ + this.segments[index+1].startAngle = segment.endAngle; + } + },this); + + } + }); + + Chart.types.Doughnut.extend({ + name : "Pie", + defaults : helpers.merge(defaultConfig,{percentageInnerCutout : 0}) + }); + +}).call(this); +(function(){ + "use strict"; + + var root = this, + Chart = root.Chart, + helpers = Chart.helpers; + + var defaultConfig = { + + ///Boolean - Whether grid lines are shown across the chart + scaleShowGridLines : true, + + //String - Colour of the grid lines + scaleGridLineColor : "rgba(0,0,0,.05)", + + //Number - Width of the grid lines + scaleGridLineWidth : 1, + + //Boolean - Whether to show horizontal lines (except X axis) + scaleShowHorizontalLines: true, + + //Boolean - Whether to show vertical lines (except Y axis) + scaleShowVerticalLines: true, + + //Boolean - Whether the line is curved between points + bezierCurve : true, + + //Number - Tension of the bezier curve between points + bezierCurveTension : 0.4, + + //Boolean - Whether to show a dot for each point + pointDot : true, + + //Number - Radius of each point dot in pixels + pointDotRadius : 4, + + //Number - Pixel width of point dot stroke + pointDotStrokeWidth : 1, + + //Number - amount extra to add to the radius to cater for hit detection outside the drawn point + pointHitDetectionRadius : 20, + + //Boolean - Whether to show a stroke for datasets + datasetStroke : true, + + //Number - Pixel width of dataset stroke + datasetStrokeWidth : 2, + + //Boolean - Whether to fill the dataset with a colour + datasetFill : true, + + //String - A legend template + legendTemplate : "
    -legend\"><% for (var i=0; i
  • \"><%if(datasets[i].label){%><%=datasets[i].label%><%}%>
    • <%}%>
" + + }; + + + Chart.Type.extend({ + name: "Line", + defaults : defaultConfig, + initialize: function(data){ + //Declare the extension of the default point, to cater for the options passed in to the constructor + this.PointClass = Chart.Point.extend({ + strokeWidth : this.options.pointDotStrokeWidth, + radius : this.options.pointDotRadius, + display: this.options.pointDot, + hitDetectionRadius : this.options.pointHitDetectionRadius, + ctx : this.chart.ctx, + inRange : function(mouseX){ + return (Math.pow(mouseX-this.x, 2) < Math.pow(this.radius + this.hitDetectionRadius,2)); + } + }); + + this.datasets = []; + + //Set up tooltip events on the chart + if (this.options.showTooltips){ + helpers.bindEvents(this, this.options.tooltipEvents, function(evt){ + var activePoints = (evt.type !== 'mouseout') ? this.getPointsAtEvent(evt) : []; + this.eachPoints(function(point){ + point.restore(['fillColor', 'strokeColor']); + }); + helpers.each(activePoints, function(activePoint){ + activePoint.fillColor = activePoint.highlightFill; + activePoint.strokeColor = activePoint.highlightStroke; + }); + this.showTooltip(activePoints); + }); + } + + //Iterate through each of the datasets, and build this into a property of the chart + helpers.each(data.datasets,function(dataset){ + + var datasetObject = { + label : dataset.label || null, + fillColor : dataset.fillColor, + strokeColor : dataset.strokeColor, + pointColor : dataset.pointColor, + pointStrokeColor : dataset.pointStrokeColor, + points : [] + }; + + this.datasets.push(datasetObject); + + + helpers.each(dataset.data,function(dataPoint,index){ + //Add a new point for each piece of data, passing any required data to draw. + datasetObject.points.push(new this.PointClass({ + value : dataPoint, + label : data.labels[index], + datasetLabel: dataset.label, + strokeColor : dataset.pointStrokeColor, + fillColor : dataset.pointColor, + highlightFill : dataset.pointHighlightFill || dataset.pointColor, + highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor + })); + },this); + + this.buildScale(data.labels); + + + this.eachPoints(function(point, index){ + helpers.extend(point, { + x: this.scale.calculateX(index), + y: this.scale.endPoint + }); + point.save(); + }, this); + + },this); + + + this.render(); + }, + update : function(){ + this.scale.update(); + // Reset any highlight colours before updating. + helpers.each(this.activeElements, function(activeElement){ + activeElement.restore(['fillColor', 'strokeColor']); + }); + this.eachPoints(function(point){ + point.save(); + }); + this.render(); + }, + eachPoints : function(callback){ + helpers.each(this.datasets,function(dataset){ + helpers.each(dataset.points,callback,this); + },this); + }, + getPointsAtEvent : function(e){ + var pointsArray = [], + eventPosition = helpers.getRelativePosition(e); + helpers.each(this.datasets,function(dataset){ + helpers.each(dataset.points,function(point){ + if (point.inRange(eventPosition.x,eventPosition.y)) pointsArray.push(point); + }); + },this); + return pointsArray; + }, + buildScale : function(labels){ + var self = this; + + var dataTotal = function(){ + var values = []; + self.eachPoints(function(point){ + values.push(point.value); + }); + + return values; + }; + + var scaleOptions = { + templateString : this.options.scaleLabel, + height : this.chart.height, + width : this.chart.width, + ctx : this.chart.ctx, + textColor : this.options.scaleFontColor, + fontSize : this.options.scaleFontSize, + fontStyle : this.options.scaleFontStyle, + fontFamily : this.options.scaleFontFamily, + valuesCount : labels.length, + beginAtZero : this.options.scaleBeginAtZero, + integersOnly : this.options.scaleIntegersOnly, + calculateYRange : function(currentHeight){ + var updatedRanges = helpers.calculateScaleRange( + dataTotal(), + currentHeight, + this.fontSize, + this.beginAtZero, + this.integersOnly + ); + helpers.extend(this, updatedRanges); + }, + xLabels : labels, + font : helpers.fontString(this.options.scaleFontSize, this.options.scaleFontStyle, this.options.scaleFontFamily), + lineWidth : this.options.scaleLineWidth, + lineColor : this.options.scaleLineColor, + showHorizontalLines : this.options.scaleShowHorizontalLines, + showVerticalLines : this.options.scaleShowVerticalLines, + gridLineWidth : (this.options.scaleShowGridLines) ? this.options.scaleGridLineWidth : 0, + gridLineColor : (this.options.scaleShowGridLines) ? this.options.scaleGridLineColor : "rgba(0,0,0,0)", + padding: (this.options.showScale) ? 0 : this.options.pointDotRadius + this.options.pointDotStrokeWidth, + showLabels : this.options.scaleShowLabels, + display : this.options.showScale + }; + + if (this.options.scaleOverride){ + helpers.extend(scaleOptions, { + calculateYRange: helpers.noop, + steps: this.options.scaleSteps, + stepValue: this.options.scaleStepWidth, + min: this.options.scaleStartValue, + max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth) + }); + } + + + this.scale = new Chart.Scale(scaleOptions); + }, + addData : function(valuesArray,label){ + //Map the values array for each of the datasets + + helpers.each(valuesArray,function(value,datasetIndex){ + //Add a new point for each piece of data, passing any required data to draw. + this.datasets[datasetIndex].points.push(new this.PointClass({ + value : value, + label : label, + x: this.scale.calculateX(this.scale.valuesCount+1), + y: this.scale.endPoint, + strokeColor : this.datasets[datasetIndex].pointStrokeColor, + fillColor : this.datasets[datasetIndex].pointColor + })); + },this); + + this.scale.addXLabel(label); + //Then re-render the chart. + this.update(); + }, + removeData : function(){ + this.scale.removeXLabel(); + //Then re-render the chart. + helpers.each(this.datasets,function(dataset){ + dataset.points.shift(); + },this); + this.update(); + }, + reflow : function(){ + var newScaleProps = helpers.extend({ + height : this.chart.height, + width : this.chart.width + }); + this.scale.update(newScaleProps); + }, + draw : function(ease){ + var easingDecimal = ease || 1; + this.clear(); + + var ctx = this.chart.ctx; + + // Some helper methods for getting the next/prev points + var hasValue = function(item){ + return item.value !== null; + }, + nextPoint = function(point, collection, index){ + return helpers.findNextWhere(collection, hasValue, index) || point; + }, + previousPoint = function(point, collection, index){ + return helpers.findPreviousWhere(collection, hasValue, index) || point; + }; + + this.scale.draw(easingDecimal); + + + helpers.each(this.datasets,function(dataset){ + var pointsWithValues = helpers.where(dataset.points, hasValue); + + //Transition each point first so that the line and point drawing isn't out of sync + //We can use this extra loop to calculate the control points of this dataset also in this loop + + helpers.each(dataset.points, function(point, index){ + if (point.hasValue()){ + point.transition({ + y : this.scale.calculateY(point.value), + x : this.scale.calculateX(index) + }, easingDecimal); + } + },this); + + + // Control points need to be calculated in a seperate loop, because we need to know the current x/y of the point + // This would cause issues when there is no animation, because the y of the next point would be 0, so beziers would be skewed + if (this.options.bezierCurve){ + helpers.each(pointsWithValues, function(point, index){ + var tension = (index > 0 && index < pointsWithValues.length - 1) ? this.options.bezierCurveTension : 0; + point.controlPoints = helpers.splineCurve( + previousPoint(point, pointsWithValues, index), + point, + nextPoint(point, pointsWithValues, index), + tension + ); + + // Prevent the bezier going outside of the bounds of the graph + + // Cap puter bezier handles to the upper/lower scale bounds + if (point.controlPoints.outer.y > this.scale.endPoint){ + point.controlPoints.outer.y = this.scale.endPoint; + } + else if (point.controlPoints.outer.y < this.scale.startPoint){ + point.controlPoints.outer.y = this.scale.startPoint; + } + + // Cap inner bezier handles to the upper/lower scale bounds + if (point.controlPoints.inner.y > this.scale.endPoint){ + point.controlPoints.inner.y = this.scale.endPoint; + } + else if (point.controlPoints.inner.y < this.scale.startPoint){ + point.controlPoints.inner.y = this.scale.startPoint; + } + },this); + } + + + //Draw the line between all the points + ctx.lineWidth = this.options.datasetStrokeWidth; + ctx.strokeStyle = dataset.strokeColor; + ctx.beginPath(); + + helpers.each(pointsWithValues, function(point, index){ + if (index === 0){ + ctx.moveTo(point.x, point.y); + } + else{ + if(this.options.bezierCurve){ + var previous = previousPoint(point, pointsWithValues, index); + + ctx.bezierCurveTo( + previous.controlPoints.outer.x, + previous.controlPoints.outer.y, + point.controlPoints.inner.x, + point.controlPoints.inner.y, + point.x, + point.y + ); + } + else{ + ctx.lineTo(point.x,point.y); + } + } + }, this); + + ctx.stroke(); + + if (this.options.datasetFill && pointsWithValues.length > 0){ + //Round off the line by going to the base of the chart, back to the start, then fill. + ctx.lineTo(pointsWithValues[pointsWithValues.length - 1].x, this.scale.endPoint); + ctx.lineTo(pointsWithValues[0].x, this.scale.endPoint); + ctx.fillStyle = dataset.fillColor; + ctx.closePath(); + ctx.fill(); + } + + //Now draw the points over the line + //A little inefficient double looping, but better than the line + //lagging behind the point positions + helpers.each(pointsWithValues,function(point){ + point.draw(); + }); + },this); + } + }); + + +}).call(this); + +(function(){ + "use strict"; + + var root = this, + Chart = root.Chart, + //Cache a local reference to Chart.helpers + helpers = Chart.helpers; + + var defaultConfig = { + //Boolean - Show a backdrop to the scale label + scaleShowLabelBackdrop : true, + + //String - The colour of the label backdrop + scaleBackdropColor : "rgba(255,255,255,0.75)", + + // Boolean - Whether the scale should begin at zero + scaleBeginAtZero : true, + + //Number - The backdrop padding above & below the label in pixels + scaleBackdropPaddingY : 2, + + //Number - The backdrop padding to the side of the label in pixels + scaleBackdropPaddingX : 2, + + //Boolean - Show line for each value in the scale + scaleShowLine : true, + + //Boolean - Stroke a line around each segment in the chart + segmentShowStroke : true, + + //String - The colour of the stroke on each segement. + segmentStrokeColor : "#fff", + + //Number - The width of the stroke value in pixels + segmentStrokeWidth : 2, + + //Number - Amount of animation steps + animationSteps : 100, + + //String - Animation easing effect. + animationEasing : "easeOutBounce", + + //Boolean - Whether to animate the rotation of the chart + animateRotate : true, + + //Boolean - Whether to animate scaling the chart from the centre + animateScale : false, + + //String - A legend template + legendTemplate : "
    -legend\"><% for (var i=0; i
  • \"><%if(segments[i].label){%><%=segments[i].label%><%}%>
    • <%}%>
" + }; + + + Chart.Type.extend({ + //Passing in a name registers this chart in the Chart namespace + name: "PolarArea", + //Providing a defaults will also register the deafults in the chart namespace + defaults : defaultConfig, + //Initialize is fired when the chart is initialized - Data is passed in as a parameter + //Config is automatically merged by the core of Chart.js, and is available at this.options + initialize: function(data){ + this.segments = []; + //Declare segment class as a chart instance specific class, so it can share props for this instance + this.SegmentArc = Chart.Arc.extend({ + showStroke : this.options.segmentShowStroke, + strokeWidth : this.options.segmentStrokeWidth, + strokeColor : this.options.segmentStrokeColor, + ctx : this.chart.ctx, + innerRadius : 0, + x : this.chart.width/2, + y : this.chart.height/2 + }); + this.scale = new Chart.RadialScale({ + display: this.options.showScale, + fontStyle: this.options.scaleFontStyle, + fontSize: this.options.scaleFontSize, + fontFamily: this.options.scaleFontFamily, + fontColor: this.options.scaleFontColor, + showLabels: this.options.scaleShowLabels, + showLabelBackdrop: this.options.scaleShowLabelBackdrop, + backdropColor: this.options.scaleBackdropColor, + backdropPaddingY : this.options.scaleBackdropPaddingY, + backdropPaddingX: this.options.scaleBackdropPaddingX, + lineWidth: (this.options.scaleShowLine) ? this.options.scaleLineWidth : 0, + lineColor: this.options.scaleLineColor, + lineArc: true, + width: this.chart.width, + height: this.chart.height, + xCenter: this.chart.width/2, + yCenter: this.chart.height/2, + ctx : this.chart.ctx, + templateString: this.options.scaleLabel, + valuesCount: data.length + }); + + this.updateScaleRange(data); + + this.scale.update(); + + helpers.each(data,function(segment,index){ + this.addData(segment,index,true); + },this); + + //Set up tooltip events on the chart + if (this.options.showTooltips){ + helpers.bindEvents(this, this.options.tooltipEvents, function(evt){ + var activeSegments = (evt.type !== 'mouseout') ? this.getSegmentsAtEvent(evt) : []; + helpers.each(this.segments,function(segment){ + segment.restore(["fillColor"]); + }); + helpers.each(activeSegments,function(activeSegment){ + activeSegment.fillColor = activeSegment.highlightColor; + }); + this.showTooltip(activeSegments); + }); + } + + this.render(); + }, + getSegmentsAtEvent : function(e){ + var segmentsArray = []; + + var location = helpers.getRelativePosition(e); + + helpers.each(this.segments,function(segment){ + if (segment.inRange(location.x,location.y)) segmentsArray.push(segment); + },this); + return segmentsArray; + }, + addData : function(segment, atIndex, silent){ + var index = atIndex || this.segments.length; + + this.segments.splice(index, 0, new this.SegmentArc({ + fillColor: segment.color, + highlightColor: segment.highlight || segment.color, + label: segment.label, + value: segment.value, + outerRadius: (this.options.animateScale) ? 0 : this.scale.calculateCenterOffset(segment.value), + circumference: (this.options.animateRotate) ? 0 : this.scale.getCircumference(), + startAngle: Math.PI * 1.5 + })); + if (!silent){ + this.reflow(); + this.update(); + } + }, + removeData: function(atIndex){ + var indexToDelete = (helpers.isNumber(atIndex)) ? atIndex : this.segments.length-1; + this.segments.splice(indexToDelete, 1); + this.reflow(); + this.update(); + }, + calculateTotal: function(data){ + this.total = 0; + helpers.each(data,function(segment){ + this.total += segment.value; + },this); + this.scale.valuesCount = this.segments.length; + }, + updateScaleRange: function(datapoints){ + var valuesArray = []; + helpers.each(datapoints,function(segment){ + valuesArray.push(segment.value); + }); + + var scaleSizes = (this.options.scaleOverride) ? + { + steps: this.options.scaleSteps, + stepValue: this.options.scaleStepWidth, + min: this.options.scaleStartValue, + max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth) + } : + helpers.calculateScaleRange( + valuesArray, + helpers.min([this.chart.width, this.chart.height])/2, + this.options.scaleFontSize, + this.options.scaleBeginAtZero, + this.options.scaleIntegersOnly + ); + + helpers.extend( + this.scale, + scaleSizes, + { + size: helpers.min([this.chart.width, this.chart.height]), + xCenter: this.chart.width/2, + yCenter: this.chart.height/2 + } + ); + + }, + update : function(){ + this.calculateTotal(this.segments); + + helpers.each(this.segments,function(segment){ + segment.save(); + }); + + this.reflow(); + this.render(); + }, + reflow : function(){ + helpers.extend(this.SegmentArc.prototype,{ + x : this.chart.width/2, + y : this.chart.height/2 + }); + this.updateScaleRange(this.segments); + this.scale.update(); + + helpers.extend(this.scale,{ + xCenter: this.chart.width/2, + yCenter: this.chart.height/2 + }); + + helpers.each(this.segments, function(segment){ + segment.update({ + outerRadius : this.scale.calculateCenterOffset(segment.value) + }); + }, this); + + }, + draw : function(ease){ + var easingDecimal = ease || 1; + //Clear & draw the canvas + this.clear(); + helpers.each(this.segments,function(segment, index){ + segment.transition({ + circumference : this.scale.getCircumference(), + outerRadius : this.scale.calculateCenterOffset(segment.value) + },easingDecimal); + + segment.endAngle = segment.startAngle + segment.circumference; + + // If we've removed the first segment we need to set the first one to + // start at the top. + if (index === 0){ + segment.startAngle = Math.PI * 1.5; + } + + //Check to see if it's the last segment, if not get the next and update the start angle + if (index < this.segments.length - 1){ + this.segments[index+1].startAngle = segment.endAngle; + } + segment.draw(); + }, this); + this.scale.draw(); + } + }); + +}).call(this); +(function(){ + "use strict"; + + var root = this, + Chart = root.Chart, + helpers = Chart.helpers; + + + + Chart.Type.extend({ + name: "Radar", + defaults:{ + //Boolean - Whether to show lines for each scale point + scaleShowLine : true, + + //Boolean - Whether we show the angle lines out of the radar + angleShowLineOut : true, + + //Boolean - Whether to show labels on the scale + scaleShowLabels : false, + + // Boolean - Whether the scale should begin at zero + scaleBeginAtZero : true, + + //String - Colour of the angle line + angleLineColor : "rgba(0,0,0,.1)", + + //Number - Pixel width of the angle line + angleLineWidth : 1, + + //String - Point label font declaration + pointLabelFontFamily : "'Arial'", + + //String - Point label font weight + pointLabelFontStyle : "normal", + + //Number - Point label font size in pixels + pointLabelFontSize : 10, + + //String - Point label font colour + pointLabelFontColor : "#666", + + //Boolean - Whether to show a dot for each point + pointDot : true, + + //Number - Radius of each point dot in pixels + pointDotRadius : 3, + + //Number - Pixel width of point dot stroke + pointDotStrokeWidth : 1, + + //Number - amount extra to add to the radius to cater for hit detection outside the drawn point + pointHitDetectionRadius : 20, + + //Boolean - Whether to show a stroke for datasets + datasetStroke : true, + + //Number - Pixel width of dataset stroke + datasetStrokeWidth : 2, + + //Boolean - Whether to fill the dataset with a colour + datasetFill : true, + + //String - A legend template + legendTemplate : "
    -legend\"><% for (var i=0; i
  • \"><%if(datasets[i].label){%><%=datasets[i].label%><%}%>
    • <%}%>
" + + }, + + initialize: function(data){ + this.PointClass = Chart.Point.extend({ + strokeWidth : this.options.pointDotStrokeWidth, + radius : this.options.pointDotRadius, + display: this.options.pointDot, + hitDetectionRadius : this.options.pointHitDetectionRadius, + ctx : this.chart.ctx + }); + + this.datasets = []; + + this.buildScale(data); + + //Set up tooltip events on the chart + if (this.options.showTooltips){ + helpers.bindEvents(this, this.options.tooltipEvents, function(evt){ + var activePointsCollection = (evt.type !== 'mouseout') ? this.getPointsAtEvent(evt) : []; + + this.eachPoints(function(point){ + point.restore(['fillColor', 'strokeColor']); + }); + helpers.each(activePointsCollection, function(activePoint){ + activePoint.fillColor = activePoint.highlightFill; + activePoint.strokeColor = activePoint.highlightStroke; + }); + + this.showTooltip(activePointsCollection); + }); + } + + //Iterate through each of the datasets, and build this into a property of the chart + helpers.each(data.datasets,function(dataset){ + + var datasetObject = { + label: dataset.label || null, + fillColor : dataset.fillColor, + strokeColor : dataset.strokeColor, + pointColor : dataset.pointColor, + pointStrokeColor : dataset.pointStrokeColor, + points : [] + }; + + this.datasets.push(datasetObject); + + helpers.each(dataset.data,function(dataPoint,index){ + //Add a new point for each piece of data, passing any required data to draw. + var pointPosition; + if (!this.scale.animation){ + pointPosition = this.scale.getPointPosition(index, this.scale.calculateCenterOffset(dataPoint)); + } + datasetObject.points.push(new this.PointClass({ + value : dataPoint, + label : data.labels[index], + datasetLabel: dataset.label, + x: (this.options.animation) ? this.scale.xCenter : pointPosition.x, + y: (this.options.animation) ? this.scale.yCenter : pointPosition.y, + strokeColor : dataset.pointStrokeColor, + fillColor : dataset.pointColor, + highlightFill : dataset.pointHighlightFill || dataset.pointColor, + highlightStroke : dataset.pointHighlightStroke || dataset.pointStrokeColor + })); + },this); + + },this); + + this.render(); + }, + eachPoints : function(callback){ + helpers.each(this.datasets,function(dataset){ + helpers.each(dataset.points,callback,this); + },this); + }, + + getPointsAtEvent : function(evt){ + var mousePosition = helpers.getRelativePosition(evt), + fromCenter = helpers.getAngleFromPoint({ + x: this.scale.xCenter, + y: this.scale.yCenter + }, mousePosition); + + var anglePerIndex = (Math.PI * 2) /this.scale.valuesCount, + pointIndex = Math.round((fromCenter.angle - Math.PI * 1.5) / anglePerIndex), + activePointsCollection = []; + + // If we're at the top, make the pointIndex 0 to get the first of the array. + if (pointIndex >= this.scale.valuesCount || pointIndex < 0){ + pointIndex = 0; + } + + if (fromCenter.distance <= this.scale.drawingArea){ + helpers.each(this.datasets, function(dataset){ + activePointsCollection.push(dataset.points[pointIndex]); + }); + } + + return activePointsCollection; + }, + + buildScale : function(data){ + this.scale = new Chart.RadialScale({ + display: this.options.showScale, + fontStyle: this.options.scaleFontStyle, + fontSize: this.options.scaleFontSize, + fontFamily: this.options.scaleFontFamily, + fontColor: this.options.scaleFontColor, + showLabels: this.options.scaleShowLabels, + showLabelBackdrop: this.options.scaleShowLabelBackdrop, + backdropColor: this.options.scaleBackdropColor, + backdropPaddingY : this.options.scaleBackdropPaddingY, + backdropPaddingX: this.options.scaleBackdropPaddingX, + lineWidth: (this.options.scaleShowLine) ? this.options.scaleLineWidth : 0, + lineColor: this.options.scaleLineColor, + angleLineColor : this.options.angleLineColor, + angleLineWidth : (this.options.angleShowLineOut) ? this.options.angleLineWidth : 0, + // Point labels at the edge of each line + pointLabelFontColor : this.options.pointLabelFontColor, + pointLabelFontSize : this.options.pointLabelFontSize, + pointLabelFontFamily : this.options.pointLabelFontFamily, + pointLabelFontStyle : this.options.pointLabelFontStyle, + height : this.chart.height, + width: this.chart.width, + xCenter: this.chart.width/2, + yCenter: this.chart.height/2, + ctx : this.chart.ctx, + templateString: this.options.scaleLabel, + labels: data.labels, + valuesCount: data.datasets[0].data.length + }); + + this.scale.setScaleSize(); + this.updateScaleRange(data.datasets); + this.scale.buildYLabels(); + }, + updateScaleRange: function(datasets){ + var valuesArray = (function(){ + var totalDataArray = []; + helpers.each(datasets,function(dataset){ + if (dataset.data){ + totalDataArray = totalDataArray.concat(dataset.data); + } + else { + helpers.each(dataset.points, function(point){ + totalDataArray.push(point.value); + }); + } + }); + return totalDataArray; + })(); + + + var scaleSizes = (this.options.scaleOverride) ? + { + steps: this.options.scaleSteps, + stepValue: this.options.scaleStepWidth, + min: this.options.scaleStartValue, + max: this.options.scaleStartValue + (this.options.scaleSteps * this.options.scaleStepWidth) + } : + helpers.calculateScaleRange( + valuesArray, + helpers.min([this.chart.width, this.chart.height])/2, + this.options.scaleFontSize, + this.options.scaleBeginAtZero, + this.options.scaleIntegersOnly + ); + + helpers.extend( + this.scale, + scaleSizes + ); + + }, + addData : function(valuesArray,label){ + //Map the values array for each of the datasets + this.scale.valuesCount++; + helpers.each(valuesArray,function(value,datasetIndex){ + var pointPosition = this.scale.getPointPosition(this.scale.valuesCount, this.scale.calculateCenterOffset(value)); + this.datasets[datasetIndex].points.push(new this.PointClass({ + value : value, + label : label, + x: pointPosition.x, + y: pointPosition.y, + strokeColor : this.datasets[datasetIndex].pointStrokeColor, + fillColor : this.datasets[datasetIndex].pointColor + })); + },this); + + this.scale.labels.push(label); + + this.reflow(); + + this.update(); + }, + removeData : function(){ + this.scale.valuesCount--; + this.scale.labels.shift(); + helpers.each(this.datasets,function(dataset){ + dataset.points.shift(); + },this); + this.reflow(); + this.update(); + }, + update : function(){ + this.eachPoints(function(point){ + point.save(); + }); + this.reflow(); + this.render(); + }, + reflow: function(){ + helpers.extend(this.scale, { + width : this.chart.width, + height: this.chart.height, + size : helpers.min([this.chart.width, this.chart.height]), + xCenter: this.chart.width/2, + yCenter: this.chart.height/2 + }); + this.updateScaleRange(this.datasets); + this.scale.setScaleSize(); + this.scale.buildYLabels(); + }, + draw : function(ease){ + var easeDecimal = ease || 1, + ctx = this.chart.ctx; + this.clear(); + this.scale.draw(); + + helpers.each(this.datasets,function(dataset){ + + //Transition each point first so that the line and point drawing isn't out of sync + helpers.each(dataset.points,function(point,index){ + if (point.hasValue()){ + point.transition(this.scale.getPointPosition(index, this.scale.calculateCenterOffset(point.value)), easeDecimal); + } + },this); + + + + //Draw the line between all the points + ctx.lineWidth = this.options.datasetStrokeWidth; + ctx.strokeStyle = dataset.strokeColor; + ctx.beginPath(); + helpers.each(dataset.points,function(point,index){ + if (index === 0){ + ctx.moveTo(point.x,point.y); + } + else{ + ctx.lineTo(point.x,point.y); + } + },this); + ctx.closePath(); + ctx.stroke(); + + ctx.fillStyle = dataset.fillColor; + ctx.fill(); + + //Now draw the points over the line + //A little inefficient double looping, but better than the line + //lagging behind the point positions + helpers.each(dataset.points,function(point){ + if (point.hasValue()){ + point.draw(); + } + }); + + },this); + + } + + }); + + + + + +}).call(this); \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/app.css b/templates/js/libs/angular-chart.js-0.7.2/examples/app.css new file mode 100644 index 0000000..8b18814 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/app.css @@ -0,0 +1,80 @@ +body { padding-top: 50px; } + +.nav, .pagination, .carousel, .panel-title a { cursor: pointer; } + +#hero-bar { + position: absolute; + left: 0; + top: 0; + z-index: 1; + padding-right: 0; +} + +.container-fluid { + padding-left: 0; + padding-right: 0; +} + +.aspect-ratio { + width: 100%; + padding-bottom: 25%; + position: relative; +} + +.header { + position: absolute; + left: 0; + width: 100%; + top: 50%; + font-size: larger; + z-index: 500; +} + +.panel-heading { + font-weight: bold; +} + +.code .nav-tabs>li.active>a, .code .nav-tabs>li.active>a:hover, .code .nav-tabs>li.active>a:focus { + background-color: #f8f8f8; + border: 1px solid #ccc; + border-bottom-color: transparent; +} + +.code pre, .code code { + background-color: #f8f8f8; + border-top: none; + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.settings > a, .settings { + background-color: white ! important; +} + +.nav-tabs > li > a { + border-bottom: 1px solid #ccc; + margin-right: 0; +} + +.settings > a.active { + border: 1px solid transparent; +} + +div.settings { + border: 1px solid #ccc; + border-top: 0; + padding: 9.5px; + margin: 0 0 10px +} + +div.settings > code { + border-top: 1px solid #eaeaea; +} + +.footer { + text-align: center; + padding: 30px 0; + margin-top: 70px; + border-top: 1px solid #e5e5e5; + background-color: #f5f5f5; +} \ No newline at end of file diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/app.js b/templates/js/libs/angular-chart.js-0.7.2/examples/app.js new file mode 100644 index 0000000..f0dc636 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/app.js @@ -0,0 +1,185 @@ +(function () { + 'use strict'; + + var app = angular.module('examples', ['chart.js', 'ui.bootstrap']); + + app.config(function (ChartJsProvider) { + // Configure all charts + ChartJsProvider.setOptions({ + colours: ['#97BBCD', '#DCDCDC', '#F7464A', '#46BFBD', '#FDB45C', '#949FB1', '#4D5360'], + responsive: true + }); + // Configure all doughnut charts + ChartJsProvider.setOptions('Doughnut', { + animateScale: true + }); + }); + + app.controller('MenuCtrl', function ($scope) { + $scope.isCollapsed = true; + $scope.charts = ['Line', 'Bar', 'Doughnut', 'Pie', 'Polar Area', 'Radar', 'Base']; + }); + + app.controller('LineCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + $scope.series = ['Series A', 'Series B']; + $scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + $scope.onClick = function (points, evt) { + console.log(points, evt); + }; + $scope.onHover = function (points) { + if (points.length > 0) { + console.log('Point', points[0].value); + } else { + console.log('No point'); + } + }; + + $timeout(function () { + $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + $scope.data = [ + [28, 48, 40, 19, 86, 27, 90], + [65, 59, 80, 81, 56, 55, 40] + ]; + $scope.series = ['Series C', 'Series D']; + }, 3000); + }]); + + app.controller('BarCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.options = { scaleShowVerticalLines: false }; + $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012']; + $scope.series = ['Series A', 'Series B']; + $scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + $timeout(function () { + $scope.options = { scaleShowVerticalLines: true }; + }, 3000); + }]); + + app.controller('DoughnutCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail-Order Sales']; + $scope.data = [0, 0, 0]; + + $timeout(function () { + $scope.data = [350, 450, 100]; + }, 500); + }]); + + app.controller('PieCtrl', function ($scope) { + $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail Sales']; + $scope.data = [300, 500, 100]; + }); + + app.controller('PolarAreaCtrl', function ($scope) { + $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail Sales', 'Telesales', 'Corporate Sales']; + $scope.data = [300, 500, 100, 40, 120]; + }); + + app.controller('BaseCtrl', function ($scope) { + $scope.labels = ['Download Sales', 'Store Sales', 'Mail Sales', 'Telesales', 'Corporate Sales']; + $scope.data = [300, 500, 100, 40, 120]; + $scope.type = 'PolarArea'; + + $scope.toggle = function () { + $scope.type = $scope.type === 'PolarArea' ? 'Pie' : 'PolarArea'; + }; + }); + + app.controller('RadarCtrl', function ($scope) { + $scope.labels = ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running']; + + $scope.data = [ + [65, 59, 90, 81, 56, 55, 40], + [28, 48, 40, 19, 96, 27, 100] + ]; + + $scope.onClick = function (points, evt) { + console.log(points, evt); + }; + }); + + app.controller('StackedBarCtrl', function ($scope) { + $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + $scope.type = 'StackedBar'; + + $scope.data = [ + [65, 59, 90, 81, 56, 55, 40], + [28, 48, 40, 19, 96, 27, 100] + ]; + }); + + app.controller('DataTablesCtrl', function ($scope) { + $scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + $scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + $scope.colours = [ + { // grey + fillColor: 'rgba(148,159,177,0.2)', + strokeColor: 'rgba(148,159,177,1)', + pointColor: 'rgba(148,159,177,1)', + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(148,159,177,0.8)' + }, + { // dark grey + fillColor: 'rgba(77,83,96,0.2)', + strokeColor: 'rgba(77,83,96,1)', + pointColor: 'rgba(77,83,96,1)', + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(77,83,96,1)' + } + ]; + $scope.randomize = function () { + $scope.data = $scope.data.map(function (data) { + return data.map(function (y) { + y = y + Math.random() * 10 - 5; + return parseInt(y < 0 ? 0 : y > 100 ? 100 : y); + }); + }); + }; + }); + + app.controller('TicksCtrl', ['$scope', '$interval', function ($scope, $interval) { + var maximum = document.getElementById('container').clientWidth / 2 || 300; + $scope.data = [[]]; + $scope.labels = []; + $scope.options = { + animation: false, + showScale: false, + showTooltips: false, + pointDot: false, + datasetStrokeWidth: 0.5 + }; + + // Update the dataset at 25FPS for a smoothly-animating chart + $interval(function () { + getLiveChartData(); + }, 40); + + function getLiveChartData () { + if ($scope.data[0].length) { + $scope.labels = $scope.labels.slice(1); + $scope.data[0] = $scope.data[0].slice(1); + } + + while ($scope.data[0].length < maximum) { + $scope.labels.push(''); + $scope.data[0].push(getRandomValue($scope.data[0])); + } + } + }]); + + function getRandomValue (data) { + var l = data.length, previous = l ? data[l - 1] : 50; + var y = previous + Math.random() * 10 - 5; + return y < 0 ? 0 : y > 100 ? 100 : y; + } +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/bootstrap.css b/templates/js/libs/angular-chart.js-0.7.2/examples/bootstrap.css new file mode 100644 index 0000000..7f36651 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/bootstrap.css @@ -0,0 +1,5785 @@ +/*! + * Bootstrap v3.1.1 (http://getbootstrap.com) + * Copyright 2011-2014 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ + +/*! normalize.css v3.0.0 | MIT License | git.io/normalize */ +html { + font-family: sans-serif; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +body { + margin: 0; +} +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +nav, +section, +summary { + display: block; +} +audio, +canvas, +progress, +video { + display: inline-block; + vertical-align: baseline; +} +audio:not([controls]) { + display: none; + height: 0; +} +[hidden], +template { + display: none; +} +a { + background: transparent; +} +a:active, +a:hover { + outline: 0; +} +abbr[title] { + border-bottom: 1px dotted; +} +b, +strong { + font-weight: bold; +} +dfn { + font-style: italic; +} +h1 { + margin: .67em 0; + font-size: 2em; +} +mark { + color: #000; + background: #ff0; +} +small { + font-size: 80%; +} +sub, +sup { + position: relative; + font-size: 75%; + line-height: 0; + vertical-align: baseline; +} +sup { + top: -.5em; +} +sub { + bottom: -.25em; +} +img { + border: 0; +} +svg:not(:root) { + overflow: hidden; +} +figure { + margin: 1em 40px; +} +hr { + height: 0; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +pre { + overflow: auto; +} +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} +button, +input, +optgroup, +select, +textarea { + margin: 0; + font: inherit; + color: inherit; +} +button { + overflow: visible; +} +button, +select { + text-transform: none; +} +button, +html input[type="button"], +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; + cursor: pointer; +} +button[disabled], +html input[disabled] { + cursor: default; +} +button::-moz-focus-inner, +input::-moz-focus-inner { + padding: 0; + border: 0; +} +input { + line-height: normal; +} +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; + padding: 0; +} +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} +input[type="search"] { + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + -webkit-appearance: textfield; +} +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} +fieldset { + padding: .35em .625em .75em; + margin: 0 2px; + border: 1px solid #c0c0c0; +} +legend { + padding: 0; + border: 0; +} +textarea { + overflow: auto; +} +optgroup { + font-weight: bold; +} +table { + border-spacing: 0; + border-collapse: collapse; +} +td, +th { + padding: 0; +} +@media print { + * { + color: #000 !important; + text-shadow: none !important; + background: transparent !important; + box-shadow: none !important; + } + a, + a:visited { + text-decoration: underline; + } + a[href]:after { + content: " (" attr(href) ")"; + } + abbr[title]:after { + content: " (" attr(title) ")"; + } + a[href^="javascript:"]:after, + a[href^="#"]:after { + content: ""; + } + pre, + blockquote { + border: 1px solid #999; + + page-break-inside: avoid; + } + thead { + display: table-header-group; + } + tr, + img { + page-break-inside: avoid; + } + img { + max-width: 100% !important; + } + p, + h2, + h3 { + orphans: 3; + widows: 3; + } + h2, + h3 { + page-break-after: avoid; + } + select { + background: #fff !important; + } + .navbar { + display: none; + } + .table td, + .table th { + background-color: #fff !important; + } + .btn > .caret, + .dropup > .btn > .caret { + border-top-color: #000 !important; + } + .label { + border: 1px solid #000; + } + .table { + border-collapse: collapse !important; + } + .table-bordered th, + .table-bordered td { + border: 1px solid #ddd !important; + } +} +* { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +*:before, +*:after { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +html { + font-size: 62.5%; + + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); +} +body { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 14px; + line-height: 1.42857143; + color: #333; + background-color: #fff; +} +input, +button, +select, +textarea { + font-family: inherit; + font-size: inherit; + line-height: inherit; +} +a { + color: #428bca; + text-decoration: none; +} +a:hover, +a:focus { + color: #2a6496; + text-decoration: underline; +} +a:focus { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} +figure { + margin: 0; +} +img { + vertical-align: middle; +} +.img-responsive, +.thumbnail > img, +.thumbnail a > img, +.carousel-inner > .item > img, +.carousel-inner > .item > a > img { + display: block; + max-width: 100%; + height: auto; +} +.img-rounded { + border-radius: 6px; +} +.img-thumbnail { + display: inline-block; + max-width: 100%; + height: auto; + padding: 4px; + line-height: 1.42857143; + background-color: #fff; + border: 1px solid #ddd; + border-radius: 4px; + -webkit-transition: all .2s ease-in-out; + transition: all .2s ease-in-out; +} +.img-circle { + border-radius: 50%; +} +hr { + margin-top: 20px; + margin-bottom: 20px; + border: 0; + border-top: 1px solid #eee; +} +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + font-family: inherit; + font-weight: 500; + line-height: 1.1; + color: inherit; +} +h1 small, +h2 small, +h3 small, +h4 small, +h5 small, +h6 small, +.h1 small, +.h2 small, +.h3 small, +.h4 small, +.h5 small, +.h6 small, +h1 .small, +h2 .small, +h3 .small, +h4 .small, +h5 .small, +h6 .small, +.h1 .small, +.h2 .small, +.h3 .small, +.h4 .small, +.h5 .small, +.h6 .small { + font-weight: normal; + line-height: 1; + color: #999; +} +h1, +.h1, +h2, +.h2, +h3, +.h3 { + margin-top: 20px; + margin-bottom: 10px; +} +h1 small, +.h1 small, +h2 small, +.h2 small, +h3 small, +.h3 small, +h1 .small, +.h1 .small, +h2 .small, +.h2 .small, +h3 .small, +.h3 .small { + font-size: 65%; +} +h4, +.h4, +h5, +.h5, +h6, +.h6 { + margin-top: 10px; + margin-bottom: 10px; +} +h4 small, +.h4 small, +h5 small, +.h5 small, +h6 small, +.h6 small, +h4 .small, +.h4 .small, +h5 .small, +.h5 .small, +h6 .small, +.h6 .small { + font-size: 75%; +} +h1, +.h1 { + font-size: 36px; +} +h2, +.h2 { + font-size: 30px; +} +h3, +.h3 { + font-size: 24px; +} +h4, +.h4 { + font-size: 18px; +} +h5, +.h5 { + font-size: 14px; +} +h6, +.h6 { + font-size: 12px; +} +p { + margin: 0 0 10px; +} +.lead { + margin-bottom: 20px; + font-size: 16px; + font-weight: 200; + line-height: 1.4; +} +@media (min-width: 768px) { + .lead { + font-size: 21px; + } +} +small, +.small { + font-size: 85%; +} +cite { + font-style: normal; +} +.text-left { + text-align: left; +} +.text-right { + text-align: right; +} +.text-center { + text-align: center; +} +.text-justify { + text-align: justify; +} +.text-muted { + color: #999; +} +.text-primary { + color: #428bca; +} +a.text-primary:hover { + color: #3071a9; +} +.text-success { + color: #3c763d; +} +a.text-success:hover { + color: #2b542c; +} +.text-info { + color: #31708f; +} +a.text-info:hover { + color: #245269; +} +.text-warning { + color: #8a6d3b; +} +a.text-warning:hover { + color: #66512c; +} +.text-danger { + color: #a94442; +} +a.text-danger:hover { + color: #843534; +} +.bg-primary { + color: #fff; + background-color: #428bca; +} +a.bg-primary:hover { + background-color: #3071a9; +} +.bg-success { + background-color: #dff0d8; +} +a.bg-success:hover { + background-color: #c1e2b3; +} +.bg-info { + background-color: #d9edf7; +} +a.bg-info:hover { + background-color: #afd9ee; +} +.bg-warning { + background-color: #fcf8e3; +} +a.bg-warning:hover { + background-color: #f7ecb5; +} +.bg-danger { + background-color: #f2dede; +} +a.bg-danger:hover { + background-color: #e4b9b9; +} +.page-header { + padding-bottom: 9px; + margin: 40px 0 20px; + border-bottom: 1px solid #eee; +} +ul, +ol { + margin-top: 0; + margin-bottom: 10px; +} +ul ul, +ol ul, +ul ol, +ol ol { + margin-bottom: 0; +} +.list-unstyled { + padding-left: 0; + list-style: none; +} +.list-inline { + padding-left: 0; + margin-left: -5px; + list-style: none; +} +.list-inline > li { + display: inline-block; + padding-right: 5px; + padding-left: 5px; +} +dl { + margin-top: 0; + margin-bottom: 20px; +} +dt, +dd { + line-height: 1.42857143; +} +dt { + font-weight: bold; +} +dd { + margin-left: 0; +} +@media (min-width: 768px) { + .dl-horizontal dt { + float: left; + width: 160px; + overflow: hidden; + clear: left; + text-align: right; + text-overflow: ellipsis; + white-space: nowrap; + } + .dl-horizontal dd { + margin-left: 180px; + } +} +abbr[title], +abbr[data-original-title] { + cursor: help; + border-bottom: 1px dotted #999; +} +.initialism { + font-size: 90%; + text-transform: uppercase; +} +blockquote { + padding: 10px 20px; + margin: 0 0 20px; + font-size: 17.5px; + border-left: 5px solid #eee; +} +blockquote p:last-child, +blockquote ul:last-child, +blockquote ol:last-child { + margin-bottom: 0; +} +blockquote footer, +blockquote small, +blockquote .small { + display: block; + font-size: 80%; + line-height: 1.42857143; + color: #999; +} +blockquote footer:before, +blockquote small:before, +blockquote .small:before { + content: '\2014 \00A0'; +} +.blockquote-reverse, +blockquote.pull-right { + padding-right: 15px; + padding-left: 0; + text-align: right; + border-right: 5px solid #eee; + border-left: 0; +} +.blockquote-reverse footer:before, +blockquote.pull-right footer:before, +.blockquote-reverse small:before, +blockquote.pull-right small:before, +.blockquote-reverse .small:before, +blockquote.pull-right .small:before { + content: ''; +} +.blockquote-reverse footer:after, +blockquote.pull-right footer:after, +.blockquote-reverse small:after, +blockquote.pull-right small:after, +.blockquote-reverse .small:after, +blockquote.pull-right .small:after { + content: '\00A0 \2014'; +} +blockquote:before, +blockquote:after { + content: ""; +} +address { + margin-bottom: 20px; + font-style: normal; + line-height: 1.42857143; +} +code, +kbd, +pre, +samp { + font-family: Menlo, Monaco, Consolas, "Courier New", monospace; +} +code { + padding: 2px 4px; + font-size: 90%; + color: #c7254e; + white-space: nowrap; + background-color: #f9f2f4; + border-radius: 4px; +} +kbd { + padding: 2px 4px; + font-size: 90%; + color: #fff; + background-color: #333; + border-radius: 3px; + box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25); +} +pre { + display: block; + padding: 9.5px; + margin: 0 0 10px; + font-size: 13px; + line-height: 1.42857143; + color: #333; + word-break: break-all; + word-wrap: break-word; + background-color: #f5f5f5; + border: 1px solid #ccc; + border-radius: 4px; +} +pre code { + padding: 0; + font-size: inherit; + color: inherit; + white-space: pre-wrap; + background-color: transparent; + border-radius: 0; +} +.pre-scrollable { + max-height: 340px; + overflow-y: scroll; +} +.container { + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; +} +@media (min-width: 768px) { + .container { + width: 750px; + } +} +@media (min-width: 992px) { + .container { + width: 970px; + } +} +@media (min-width: 1200px) { + .container { + width: 1170px; + } +} +.container-fluid { + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; +} +.row { + margin-right: -15px; + margin-left: -15px; +} +.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { + position: relative; + min-height: 1px; + padding-right: 15px; + padding-left: 15px; +} +.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { + float: left; +} +.col-xs-12 { + width: 100%; +} +.col-xs-11 { + width: 91.66666667%; +} +.col-xs-10 { + width: 83.33333333%; +} +.col-xs-9 { + width: 75%; +} +.col-xs-8 { + width: 66.66666667%; +} +.col-xs-7 { + width: 58.33333333%; +} +.col-xs-6 { + width: 50%; +} +.col-xs-5 { + width: 41.66666667%; +} +.col-xs-4 { + width: 33.33333333%; +} +.col-xs-3 { + width: 25%; +} +.col-xs-2 { + width: 16.66666667%; +} +.col-xs-1 { + width: 8.33333333%; +} +.col-xs-pull-12 { + right: 100%; +} +.col-xs-pull-11 { + right: 91.66666667%; +} +.col-xs-pull-10 { + right: 83.33333333%; +} +.col-xs-pull-9 { + right: 75%; +} +.col-xs-pull-8 { + right: 66.66666667%; +} +.col-xs-pull-7 { + right: 58.33333333%; +} +.col-xs-pull-6 { + right: 50%; +} +.col-xs-pull-5 { + right: 41.66666667%; +} +.col-xs-pull-4 { + right: 33.33333333%; +} +.col-xs-pull-3 { + right: 25%; +} +.col-xs-pull-2 { + right: 16.66666667%; +} +.col-xs-pull-1 { + right: 8.33333333%; +} +.col-xs-pull-0 { + right: 0; +} +.col-xs-push-12 { + left: 100%; +} +.col-xs-push-11 { + left: 91.66666667%; +} +.col-xs-push-10 { + left: 83.33333333%; +} +.col-xs-push-9 { + left: 75%; +} +.col-xs-push-8 { + left: 66.66666667%; +} +.col-xs-push-7 { + left: 58.33333333%; +} +.col-xs-push-6 { + left: 50%; +} +.col-xs-push-5 { + left: 41.66666667%; +} +.col-xs-push-4 { + left: 33.33333333%; +} +.col-xs-push-3 { + left: 25%; +} +.col-xs-push-2 { + left: 16.66666667%; +} +.col-xs-push-1 { + left: 8.33333333%; +} +.col-xs-push-0 { + left: 0; +} +.col-xs-offset-12 { + margin-left: 100%; +} +.col-xs-offset-11 { + margin-left: 91.66666667%; +} +.col-xs-offset-10 { + margin-left: 83.33333333%; +} +.col-xs-offset-9 { + margin-left: 75%; +} +.col-xs-offset-8 { + margin-left: 66.66666667%; +} +.col-xs-offset-7 { + margin-left: 58.33333333%; +} +.col-xs-offset-6 { + margin-left: 50%; +} +.col-xs-offset-5 { + margin-left: 41.66666667%; +} +.col-xs-offset-4 { + margin-left: 33.33333333%; +} +.col-xs-offset-3 { + margin-left: 25%; +} +.col-xs-offset-2 { + margin-left: 16.66666667%; +} +.col-xs-offset-1 { + margin-left: 8.33333333%; +} +.col-xs-offset-0 { + margin-left: 0; +} +@media (min-width: 768px) { + .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { + float: left; + } + .col-sm-12 { + width: 100%; + } + .col-sm-11 { + width: 91.66666667%; + } + .col-sm-10 { + width: 83.33333333%; + } + .col-sm-9 { + width: 75%; + } + .col-sm-8 { + width: 66.66666667%; + } + .col-sm-7 { + width: 58.33333333%; + } + .col-sm-6 { + width: 50%; + } + .col-sm-5 { + width: 41.66666667%; + } + .col-sm-4 { + width: 33.33333333%; + } + .col-sm-3 { + width: 25%; + } + .col-sm-2 { + width: 16.66666667%; + } + .col-sm-1 { + width: 8.33333333%; + } + .col-sm-pull-12 { + right: 100%; + } + .col-sm-pull-11 { + right: 91.66666667%; + } + .col-sm-pull-10 { + right: 83.33333333%; + } + .col-sm-pull-9 { + right: 75%; + } + .col-sm-pull-8 { + right: 66.66666667%; + } + .col-sm-pull-7 { + right: 58.33333333%; + } + .col-sm-pull-6 { + right: 50%; + } + .col-sm-pull-5 { + right: 41.66666667%; + } + .col-sm-pull-4 { + right: 33.33333333%; + } + .col-sm-pull-3 { + right: 25%; + } + .col-sm-pull-2 { + right: 16.66666667%; + } + .col-sm-pull-1 { + right: 8.33333333%; + } + .col-sm-pull-0 { + right: 0; + } + .col-sm-push-12 { + left: 100%; + } + .col-sm-push-11 { + left: 91.66666667%; + } + .col-sm-push-10 { + left: 83.33333333%; + } + .col-sm-push-9 { + left: 75%; + } + .col-sm-push-8 { + left: 66.66666667%; + } + .col-sm-push-7 { + left: 58.33333333%; + } + .col-sm-push-6 { + left: 50%; + } + .col-sm-push-5 { + left: 41.66666667%; + } + .col-sm-push-4 { + left: 33.33333333%; + } + .col-sm-push-3 { + left: 25%; + } + .col-sm-push-2 { + left: 16.66666667%; + } + .col-sm-push-1 { + left: 8.33333333%; + } + .col-sm-push-0 { + left: 0; + } + .col-sm-offset-12 { + margin-left: 100%; + } + .col-sm-offset-11 { + margin-left: 91.66666667%; + } + .col-sm-offset-10 { + margin-left: 83.33333333%; + } + .col-sm-offset-9 { + margin-left: 75%; + } + .col-sm-offset-8 { + margin-left: 66.66666667%; + } + .col-sm-offset-7 { + margin-left: 58.33333333%; + } + .col-sm-offset-6 { + margin-left: 50%; + } + .col-sm-offset-5 { + margin-left: 41.66666667%; + } + .col-sm-offset-4 { + margin-left: 33.33333333%; + } + .col-sm-offset-3 { + margin-left: 25%; + } + .col-sm-offset-2 { + margin-left: 16.66666667%; + } + .col-sm-offset-1 { + margin-left: 8.33333333%; + } + .col-sm-offset-0 { + margin-left: 0; + } +} +@media (min-width: 992px) { + .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { + float: left; + } + .col-md-12 { + width: 100%; + } + .col-md-11 { + width: 91.66666667%; + } + .col-md-10 { + width: 83.33333333%; + } + .col-md-9 { + width: 75%; + } + .col-md-8 { + width: 66.66666667%; + } + .col-md-7 { + width: 58.33333333%; + } + .col-md-6 { + width: 50%; + } + .col-md-5 { + width: 41.66666667%; + } + .col-md-4 { + width: 33.33333333%; + } + .col-md-3 { + width: 25%; + } + .col-md-2 { + width: 16.66666667%; + } + .col-md-1 { + width: 8.33333333%; + } + .col-md-pull-12 { + right: 100%; + } + .col-md-pull-11 { + right: 91.66666667%; + } + .col-md-pull-10 { + right: 83.33333333%; + } + .col-md-pull-9 { + right: 75%; + } + .col-md-pull-8 { + right: 66.66666667%; + } + .col-md-pull-7 { + right: 58.33333333%; + } + .col-md-pull-6 { + right: 50%; + } + .col-md-pull-5 { + right: 41.66666667%; + } + .col-md-pull-4 { + right: 33.33333333%; + } + .col-md-pull-3 { + right: 25%; + } + .col-md-pull-2 { + right: 16.66666667%; + } + .col-md-pull-1 { + right: 8.33333333%; + } + .col-md-pull-0 { + right: 0; + } + .col-md-push-12 { + left: 100%; + } + .col-md-push-11 { + left: 91.66666667%; + } + .col-md-push-10 { + left: 83.33333333%; + } + .col-md-push-9 { + left: 75%; + } + .col-md-push-8 { + left: 66.66666667%; + } + .col-md-push-7 { + left: 58.33333333%; + } + .col-md-push-6 { + left: 50%; + } + .col-md-push-5 { + left: 41.66666667%; + } + .col-md-push-4 { + left: 33.33333333%; + } + .col-md-push-3 { + left: 25%; + } + .col-md-push-2 { + left: 16.66666667%; + } + .col-md-push-1 { + left: 8.33333333%; + } + .col-md-push-0 { + left: 0; + } + .col-md-offset-12 { + margin-left: 100%; + } + .col-md-offset-11 { + margin-left: 91.66666667%; + } + .col-md-offset-10 { + margin-left: 83.33333333%; + } + .col-md-offset-9 { + margin-left: 75%; + } + .col-md-offset-8 { + margin-left: 66.66666667%; + } + .col-md-offset-7 { + margin-left: 58.33333333%; + } + .col-md-offset-6 { + margin-left: 50%; + } + .col-md-offset-5 { + margin-left: 41.66666667%; + } + .col-md-offset-4 { + margin-left: 33.33333333%; + } + .col-md-offset-3 { + margin-left: 25%; + } + .col-md-offset-2 { + margin-left: 16.66666667%; + } + .col-md-offset-1 { + margin-left: 8.33333333%; + } + .col-md-offset-0 { + margin-left: 0; + } +} +@media (min-width: 1200px) { + .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { + float: left; + } + .col-lg-12 { + width: 100%; + } + .col-lg-11 { + width: 91.66666667%; + } + .col-lg-10 { + width: 83.33333333%; + } + .col-lg-9 { + width: 75%; + } + .col-lg-8 { + width: 66.66666667%; + } + .col-lg-7 { + width: 58.33333333%; + } + .col-lg-6 { + width: 50%; + } + .col-lg-5 { + width: 41.66666667%; + } + .col-lg-4 { + width: 33.33333333%; + } + .col-lg-3 { + width: 25%; + } + .col-lg-2 { + width: 16.66666667%; + } + .col-lg-1 { + width: 8.33333333%; + } + .col-lg-pull-12 { + right: 100%; + } + .col-lg-pull-11 { + right: 91.66666667%; + } + .col-lg-pull-10 { + right: 83.33333333%; + } + .col-lg-pull-9 { + right: 75%; + } + .col-lg-pull-8 { + right: 66.66666667%; + } + .col-lg-pull-7 { + right: 58.33333333%; + } + .col-lg-pull-6 { + right: 50%; + } + .col-lg-pull-5 { + right: 41.66666667%; + } + .col-lg-pull-4 { + right: 33.33333333%; + } + .col-lg-pull-3 { + right: 25%; + } + .col-lg-pull-2 { + right: 16.66666667%; + } + .col-lg-pull-1 { + right: 8.33333333%; + } + .col-lg-pull-0 { + right: 0; + } + .col-lg-push-12 { + left: 100%; + } + .col-lg-push-11 { + left: 91.66666667%; + } + .col-lg-push-10 { + left: 83.33333333%; + } + .col-lg-push-9 { + left: 75%; + } + .col-lg-push-8 { + left: 66.66666667%; + } + .col-lg-push-7 { + left: 58.33333333%; + } + .col-lg-push-6 { + left: 50%; + } + .col-lg-push-5 { + left: 41.66666667%; + } + .col-lg-push-4 { + left: 33.33333333%; + } + .col-lg-push-3 { + left: 25%; + } + .col-lg-push-2 { + left: 16.66666667%; + } + .col-lg-push-1 { + left: 8.33333333%; + } + .col-lg-push-0 { + left: 0; + } + .col-lg-offset-12 { + margin-left: 100%; + } + .col-lg-offset-11 { + margin-left: 91.66666667%; + } + .col-lg-offset-10 { + margin-left: 83.33333333%; + } + .col-lg-offset-9 { + margin-left: 75%; + } + .col-lg-offset-8 { + margin-left: 66.66666667%; + } + .col-lg-offset-7 { + margin-left: 58.33333333%; + } + .col-lg-offset-6 { + margin-left: 50%; + } + .col-lg-offset-5 { + margin-left: 41.66666667%; + } + .col-lg-offset-4 { + margin-left: 33.33333333%; + } + .col-lg-offset-3 { + margin-left: 25%; + } + .col-lg-offset-2 { + margin-left: 16.66666667%; + } + .col-lg-offset-1 { + margin-left: 8.33333333%; + } + .col-lg-offset-0 { + margin-left: 0; + } +} +table { + max-width: 100%; + background-color: transparent; +} +th { + text-align: left; +} +.table { + width: 100%; + margin-bottom: 20px; +} +.table > thead > tr > th, +.table > tbody > tr > th, +.table > tfoot > tr > th, +.table > thead > tr > td, +.table > tbody > tr > td, +.table > tfoot > tr > td { + padding: 8px; + line-height: 1.42857143; + vertical-align: top; + border-top: 1px solid #ddd; +} +.table > thead > tr > th { + vertical-align: bottom; + border-bottom: 2px solid #ddd; +} +.table > caption + thead > tr:first-child > th, +.table > colgroup + thead > tr:first-child > th, +.table > thead:first-child > tr:first-child > th, +.table > caption + thead > tr:first-child > td, +.table > colgroup + thead > tr:first-child > td, +.table > thead:first-child > tr:first-child > td { + border-top: 0; +} +.table > tbody + tbody { + border-top: 2px solid #ddd; +} +.table .table { + background-color: #fff; +} +.table-condensed > thead > tr > th, +.table-condensed > tbody > tr > th, +.table-condensed > tfoot > tr > th, +.table-condensed > thead > tr > td, +.table-condensed > tbody > tr > td, +.table-condensed > tfoot > tr > td { + padding: 5px; +} +.table-bordered { + border: 1px solid #ddd; +} +.table-bordered > thead > tr > th, +.table-bordered > tbody > tr > th, +.table-bordered > tfoot > tr > th, +.table-bordered > thead > tr > td, +.table-bordered > tbody > tr > td, +.table-bordered > tfoot > tr > td { + border: 1px solid #ddd; +} +.table-bordered > thead > tr > th, +.table-bordered > thead > tr > td { + border-bottom-width: 2px; +} +.table-striped > tbody > tr:nth-child(odd) > td, +.table-striped > tbody > tr:nth-child(odd) > th { + background-color: #f9f9f9; +} +.table-hover > tbody > tr:hover > td, +.table-hover > tbody > tr:hover > th { + background-color: #f5f5f5; +} +table col[class*="col-"] { + position: static; + display: table-column; + float: none; +} +table td[class*="col-"], +table th[class*="col-"] { + position: static; + display: table-cell; + float: none; +} +.table > thead > tr > td.active, +.table > tbody > tr > td.active, +.table > tfoot > tr > td.active, +.table > thead > tr > th.active, +.table > tbody > tr > th.active, +.table > tfoot > tr > th.active, +.table > thead > tr.active > td, +.table > tbody > tr.active > td, +.table > tfoot > tr.active > td, +.table > thead > tr.active > th, +.table > tbody > tr.active > th, +.table > tfoot > tr.active > th { + background-color: #f5f5f5; +} +.table-hover > tbody > tr > td.active:hover, +.table-hover > tbody > tr > th.active:hover, +.table-hover > tbody > tr.active:hover > td, +.table-hover > tbody > tr.active:hover > th { + background-color: #e8e8e8; +} +.table > thead > tr > td.success, +.table > tbody > tr > td.success, +.table > tfoot > tr > td.success, +.table > thead > tr > th.success, +.table > tbody > tr > th.success, +.table > tfoot > tr > th.success, +.table > thead > tr.success > td, +.table > tbody > tr.success > td, +.table > tfoot > tr.success > td, +.table > thead > tr.success > th, +.table > tbody > tr.success > th, +.table > tfoot > tr.success > th { + background-color: #dff0d8; +} +.table-hover > tbody > tr > td.success:hover, +.table-hover > tbody > tr > th.success:hover, +.table-hover > tbody > tr.success:hover > td, +.table-hover > tbody > tr.success:hover > th { + background-color: #d0e9c6; +} +.table > thead > tr > td.info, +.table > tbody > tr > td.info, +.table > tfoot > tr > td.info, +.table > thead > tr > th.info, +.table > tbody > tr > th.info, +.table > tfoot > tr > th.info, +.table > thead > tr.info > td, +.table > tbody > tr.info > td, +.table > tfoot > tr.info > td, +.table > thead > tr.info > th, +.table > tbody > tr.info > th, +.table > tfoot > tr.info > th { + background-color: #d9edf7; +} +.table-hover > tbody > tr > td.info:hover, +.table-hover > tbody > tr > th.info:hover, +.table-hover > tbody > tr.info:hover > td, +.table-hover > tbody > tr.info:hover > th { + background-color: #c4e3f3; +} +.table > thead > tr > td.warning, +.table > tbody > tr > td.warning, +.table > tfoot > tr > td.warning, +.table > thead > tr > th.warning, +.table > tbody > tr > th.warning, +.table > tfoot > tr > th.warning, +.table > thead > tr.warning > td, +.table > tbody > tr.warning > td, +.table > tfoot > tr.warning > td, +.table > thead > tr.warning > th, +.table > tbody > tr.warning > th, +.table > tfoot > tr.warning > th { + background-color: #fcf8e3; +} +.table-hover > tbody > tr > td.warning:hover, +.table-hover > tbody > tr > th.warning:hover, +.table-hover > tbody > tr.warning:hover > td, +.table-hover > tbody > tr.warning:hover > th { + background-color: #faf2cc; +} +.table > thead > tr > td.danger, +.table > tbody > tr > td.danger, +.table > tfoot > tr > td.danger, +.table > thead > tr > th.danger, +.table > tbody > tr > th.danger, +.table > tfoot > tr > th.danger, +.table > thead > tr.danger > td, +.table > tbody > tr.danger > td, +.table > tfoot > tr.danger > td, +.table > thead > tr.danger > th, +.table > tbody > tr.danger > th, +.table > tfoot > tr.danger > th { + background-color: #f2dede; +} +.table-hover > tbody > tr > td.danger:hover, +.table-hover > tbody > tr > th.danger:hover, +.table-hover > tbody > tr.danger:hover > td, +.table-hover > tbody > tr.danger:hover > th { + background-color: #ebcccc; +} +@media (max-width: 767px) { + .table-responsive { + width: 100%; + margin-bottom: 15px; + overflow-x: scroll; + overflow-y: hidden; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + border: 1px solid #ddd; + } + .table-responsive > .table { + margin-bottom: 0; + } + .table-responsive > .table > thead > tr > th, + .table-responsive > .table > tbody > tr > th, + .table-responsive > .table > tfoot > tr > th, + .table-responsive > .table > thead > tr > td, + .table-responsive > .table > tbody > tr > td, + .table-responsive > .table > tfoot > tr > td { + white-space: nowrap; + } + .table-responsive > .table-bordered { + border: 0; + } + .table-responsive > .table-bordered > thead > tr > th:first-child, + .table-responsive > .table-bordered > tbody > tr > th:first-child, + .table-responsive > .table-bordered > tfoot > tr > th:first-child, + .table-responsive > .table-bordered > thead > tr > td:first-child, + .table-responsive > .table-bordered > tbody > tr > td:first-child, + .table-responsive > .table-bordered > tfoot > tr > td:first-child { + border-left: 0; + } + .table-responsive > .table-bordered > thead > tr > th:last-child, + .table-responsive > .table-bordered > tbody > tr > th:last-child, + .table-responsive > .table-bordered > tfoot > tr > th:last-child, + .table-responsive > .table-bordered > thead > tr > td:last-child, + .table-responsive > .table-bordered > tbody > tr > td:last-child, + .table-responsive > .table-bordered > tfoot > tr > td:last-child { + border-right: 0; + } + .table-responsive > .table-bordered > tbody > tr:last-child > th, + .table-responsive > .table-bordered > tfoot > tr:last-child > th, + .table-responsive > .table-bordered > tbody > tr:last-child > td, + .table-responsive > .table-bordered > tfoot > tr:last-child > td { + border-bottom: 0; + } +} +fieldset { + min-width: 0; + padding: 0; + margin: 0; + border: 0; +} +legend { + display: block; + width: 100%; + padding: 0; + margin-bottom: 20px; + font-size: 21px; + line-height: inherit; + color: #333; + border: 0; + border-bottom: 1px solid #e5e5e5; +} +label { + display: inline-block; + margin-bottom: 5px; + font-weight: bold; +} +input[type="search"] { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} +input[type="radio"], +input[type="checkbox"] { + margin: 4px 0 0; + margin-top: 1px \9; + /* IE8-9 */ + line-height: normal; +} +input[type="file"] { + display: block; +} +input[type="range"] { + display: block; + width: 100%; +} +select[multiple], +select[size] { + height: auto; +} +input[type="file"]:focus, +input[type="radio"]:focus, +input[type="checkbox"]:focus { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} +output { + display: block; + padding-top: 7px; + font-size: 14px; + line-height: 1.42857143; + color: #555; +} +.form-control { + display: block; + width: 100%; + height: 34px; + padding: 6px 12px; + font-size: 14px; + line-height: 1.42857143; + color: #555; + background-color: #fff; + background-image: none; + border: 1px solid #ccc; + border-radius: 4px; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); + -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; + transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; +} +.form-control:focus { + border-color: #66afe9; + outline: 0; + -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6); + box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6); +} +.form-control::-moz-placeholder { + color: #999; + opacity: 1; +} +.form-control:-ms-input-placeholder { + color: #999; +} +.form-control::-webkit-input-placeholder { + color: #999; +} +.form-control[disabled], +.form-control[readonly], +fieldset[disabled] .form-control { + cursor: not-allowed; + background-color: #eee; + opacity: 1; +} +textarea.form-control { + height: auto; +} +input[type="search"] { + -webkit-appearance: none; +} +input[type="date"] { + line-height: 34px; +} +.form-group { + margin-bottom: 15px; +} +.radio, +.checkbox { + display: block; + min-height: 20px; + padding-left: 20px; + margin-top: 10px; + margin-bottom: 10px; +} +.radio label, +.checkbox label { + display: inline; + font-weight: normal; + cursor: pointer; +} +.radio input[type="radio"], +.radio-inline input[type="radio"], +.checkbox input[type="checkbox"], +.checkbox-inline input[type="checkbox"] { + float: left; + margin-left: -20px; +} +.radio + .radio, +.checkbox + .checkbox { + margin-top: -5px; +} +.radio-inline, +.checkbox-inline { + display: inline-block; + padding-left: 20px; + margin-bottom: 0; + font-weight: normal; + vertical-align: middle; + cursor: pointer; +} +.radio-inline + .radio-inline, +.checkbox-inline + .checkbox-inline { + margin-top: 0; + margin-left: 10px; +} +input[type="radio"][disabled], +input[type="checkbox"][disabled], +.radio[disabled], +.radio-inline[disabled], +.checkbox[disabled], +.checkbox-inline[disabled], +fieldset[disabled] input[type="radio"], +fieldset[disabled] input[type="checkbox"], +fieldset[disabled] .radio, +fieldset[disabled] .radio-inline, +fieldset[disabled] .checkbox, +fieldset[disabled] .checkbox-inline { + cursor: not-allowed; +} +.input-sm { + height: 30px; + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 3px; +} +select.input-sm { + height: 30px; + line-height: 30px; +} +textarea.input-sm, +select[multiple].input-sm { + height: auto; +} +.input-lg { + height: 46px; + padding: 10px 16px; + font-size: 18px; + line-height: 1.33; + border-radius: 6px; +} +select.input-lg { + height: 46px; + line-height: 46px; +} +textarea.input-lg, +select[multiple].input-lg { + height: auto; +} +.has-feedback { + position: relative; +} +.has-feedback .form-control { + padding-right: 42.5px; +} +.has-feedback .form-control-feedback { + position: absolute; + top: 25px; + right: 0; + display: block; + width: 34px; + height: 34px; + line-height: 34px; + text-align: center; +} +.has-success .help-block, +.has-success .control-label, +.has-success .radio, +.has-success .checkbox, +.has-success .radio-inline, +.has-success .checkbox-inline { + color: #3c763d; +} +.has-success .form-control { + border-color: #3c763d; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); +} +.has-success .form-control:focus { + border-color: #2b542c; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #67b168; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #67b168; +} +.has-success .input-group-addon { + color: #3c763d; + background-color: #dff0d8; + border-color: #3c763d; +} +.has-success .form-control-feedback { + color: #3c763d; +} +.has-warning .help-block, +.has-warning .control-label, +.has-warning .radio, +.has-warning .checkbox, +.has-warning .radio-inline, +.has-warning .checkbox-inline { + color: #8a6d3b; +} +.has-warning .form-control { + border-color: #8a6d3b; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); +} +.has-warning .form-control:focus { + border-color: #66512c; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #c0a16b; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #c0a16b; +} +.has-warning .input-group-addon { + color: #8a6d3b; + background-color: #fcf8e3; + border-color: #8a6d3b; +} +.has-warning .form-control-feedback { + color: #8a6d3b; +} +.has-error .help-block, +.has-error .control-label, +.has-error .radio, +.has-error .checkbox, +.has-error .radio-inline, +.has-error .checkbox-inline { + color: #a94442; +} +.has-error .form-control { + border-color: #a94442; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); +} +.has-error .form-control:focus { + border-color: #843534; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 6px #ce8483; +} +.has-error .input-group-addon { + color: #a94442; + background-color: #f2dede; + border-color: #a94442; +} +.has-error .form-control-feedback { + color: #a94442; +} +.form-control-static { + margin-bottom: 0; +} +.help-block { + display: block; + margin-top: 5px; + margin-bottom: 10px; + color: #737373; +} +@media (min-width: 768px) { + .form-inline .form-group { + display: inline-block; + margin-bottom: 0; + vertical-align: middle; + } + .form-inline .form-control { + display: inline-block; + width: auto; + vertical-align: middle; + } + .form-inline .input-group > .form-control { + width: 100%; + } + .form-inline .control-label { + margin-bottom: 0; + vertical-align: middle; + } + .form-inline .radio, + .form-inline .checkbox { + display: inline-block; + padding-left: 0; + margin-top: 0; + margin-bottom: 0; + vertical-align: middle; + } + .form-inline .radio input[type="radio"], + .form-inline .checkbox input[type="checkbox"] { + float: none; + margin-left: 0; + } + .form-inline .has-feedback .form-control-feedback { + top: 0; + } +} +.form-horizontal .control-label, +.form-horizontal .radio, +.form-horizontal .checkbox, +.form-horizontal .radio-inline, +.form-horizontal .checkbox-inline { + padding-top: 7px; + margin-top: 0; + margin-bottom: 0; +} +.form-horizontal .radio, +.form-horizontal .checkbox { + min-height: 27px; +} +.form-horizontal .form-group { + margin-right: -15px; + margin-left: -15px; +} +.form-horizontal .form-control-static { + padding-top: 7px; +} +@media (min-width: 768px) { + .form-horizontal .control-label { + text-align: right; + } +} +.form-horizontal .has-feedback .form-control-feedback { + top: 0; + right: 15px; +} +.btn { + display: inline-block; + padding: 6px 12px; + margin-bottom: 0; + font-size: 14px; + font-weight: normal; + line-height: 1.42857143; + text-align: center; + white-space: nowrap; + vertical-align: middle; + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + background-image: none; + border: 1px solid transparent; + border-radius: 4px; +} +.btn:focus, +.btn:active:focus, +.btn.active:focus { + outline: thin dotted; + outline: 5px auto -webkit-focus-ring-color; + outline-offset: -2px; +} +.btn:hover, +.btn:focus { + color: #333; + text-decoration: none; +} +.btn:active, +.btn.active { + background-image: none; + outline: 0; + -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); + box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); +} +.btn.disabled, +.btn[disabled], +fieldset[disabled] .btn { + pointer-events: none; + cursor: not-allowed; + filter: alpha(opacity=65); + -webkit-box-shadow: none; + box-shadow: none; + opacity: .65; +} +.btn-default { + color: #333; + background-color: #fff; + border-color: #ccc; +} +.btn-default:hover, +.btn-default:focus, +.btn-default:active, +.btn-default.active, +.open .dropdown-toggle.btn-default { + color: #333; + background-color: #ebebeb; + border-color: #adadad; +} +.btn-default:active, +.btn-default.active, +.open .dropdown-toggle.btn-default { + background-image: none; +} +.btn-default.disabled, +.btn-default[disabled], +fieldset[disabled] .btn-default, +.btn-default.disabled:hover, +.btn-default[disabled]:hover, +fieldset[disabled] .btn-default:hover, +.btn-default.disabled:focus, +.btn-default[disabled]:focus, +fieldset[disabled] .btn-default:focus, +.btn-default.disabled:active, +.btn-default[disabled]:active, +fieldset[disabled] .btn-default:active, +.btn-default.disabled.active, +.btn-default[disabled].active, +fieldset[disabled] .btn-default.active { + background-color: #fff; + border-color: #ccc; +} +.btn-default .badge { + color: #fff; + background-color: #333; +} +.btn-primary { + color: #fff; + background-color: #428bca; + border-color: #357ebd; +} +.btn-primary:hover, +.btn-primary:focus, +.btn-primary:active, +.btn-primary.active, +.open .dropdown-toggle.btn-primary { + color: #fff; + background-color: #3276b1; + border-color: #285e8e; +} +.btn-primary:active, +.btn-primary.active, +.open .dropdown-toggle.btn-primary { + background-image: none; +} +.btn-primary.disabled, +.btn-primary[disabled], +fieldset[disabled] .btn-primary, +.btn-primary.disabled:hover, +.btn-primary[disabled]:hover, +fieldset[disabled] .btn-primary:hover, +.btn-primary.disabled:focus, +.btn-primary[disabled]:focus, +fieldset[disabled] .btn-primary:focus, +.btn-primary.disabled:active, +.btn-primary[disabled]:active, +fieldset[disabled] .btn-primary:active, +.btn-primary.disabled.active, +.btn-primary[disabled].active, +fieldset[disabled] .btn-primary.active { + background-color: #428bca; + border-color: #357ebd; +} +.btn-primary .badge { + color: #428bca; + background-color: #fff; +} +.btn-success { + color: #fff; + background-color: #5cb85c; + border-color: #4cae4c; +} +.btn-success:hover, +.btn-success:focus, +.btn-success:active, +.btn-success.active, +.open .dropdown-toggle.btn-success { + color: #fff; + background-color: #47a447; + border-color: #398439; +} +.btn-success:active, +.btn-success.active, +.open .dropdown-toggle.btn-success { + background-image: none; +} +.btn-success.disabled, +.btn-success[disabled], +fieldset[disabled] .btn-success, +.btn-success.disabled:hover, +.btn-success[disabled]:hover, +fieldset[disabled] .btn-success:hover, +.btn-success.disabled:focus, +.btn-success[disabled]:focus, +fieldset[disabled] .btn-success:focus, +.btn-success.disabled:active, +.btn-success[disabled]:active, +fieldset[disabled] .btn-success:active, +.btn-success.disabled.active, +.btn-success[disabled].active, +fieldset[disabled] .btn-success.active { + background-color: #5cb85c; + border-color: #4cae4c; +} +.btn-success .badge { + color: #5cb85c; + background-color: #fff; +} +.btn-info { + color: #fff; + background-color: #5bc0de; + border-color: #46b8da; +} +.btn-info:hover, +.btn-info:focus, +.btn-info:active, +.btn-info.active, +.open .dropdown-toggle.btn-info { + color: #fff; + background-color: #39b3d7; + border-color: #269abc; +} +.btn-info:active, +.btn-info.active, +.open .dropdown-toggle.btn-info { + background-image: none; +} +.btn-info.disabled, +.btn-info[disabled], +fieldset[disabled] .btn-info, +.btn-info.disabled:hover, +.btn-info[disabled]:hover, +fieldset[disabled] .btn-info:hover, +.btn-info.disabled:focus, +.btn-info[disabled]:focus, +fieldset[disabled] .btn-info:focus, +.btn-info.disabled:active, +.btn-info[disabled]:active, +fieldset[disabled] .btn-info:active, +.btn-info.disabled.active, +.btn-info[disabled].active, +fieldset[disabled] .btn-info.active { + background-color: #5bc0de; + border-color: #46b8da; +} +.btn-info .badge { + color: #5bc0de; + background-color: #fff; +} +.btn-warning { + color: #fff; + background-color: #f0ad4e; + border-color: #eea236; +} +.btn-warning:hover, +.btn-warning:focus, +.btn-warning:active, +.btn-warning.active, +.open .dropdown-toggle.btn-warning { + color: #fff; + background-color: #ed9c28; + border-color: #d58512; +} +.btn-warning:active, +.btn-warning.active, +.open .dropdown-toggle.btn-warning { + background-image: none; +} +.btn-warning.disabled, +.btn-warning[disabled], +fieldset[disabled] .btn-warning, +.btn-warning.disabled:hover, +.btn-warning[disabled]:hover, +fieldset[disabled] .btn-warning:hover, +.btn-warning.disabled:focus, +.btn-warning[disabled]:focus, +fieldset[disabled] .btn-warning:focus, +.btn-warning.disabled:active, +.btn-warning[disabled]:active, +fieldset[disabled] .btn-warning:active, +.btn-warning.disabled.active, +.btn-warning[disabled].active, +fieldset[disabled] .btn-warning.active { + background-color: #f0ad4e; + border-color: #eea236; +} +.btn-warning .badge { + color: #f0ad4e; + background-color: #fff; +} +.btn-danger { + color: #fff; + background-color: #d9534f; + border-color: #d43f3a; +} +.btn-danger:hover, +.btn-danger:focus, +.btn-danger:active, +.btn-danger.active, +.open .dropdown-toggle.btn-danger { + color: #fff; + background-color: #d2322d; + border-color: #ac2925; +} +.btn-danger:active, +.btn-danger.active, +.open .dropdown-toggle.btn-danger { + background-image: none; +} +.btn-danger.disabled, +.btn-danger[disabled], +fieldset[disabled] .btn-danger, +.btn-danger.disabled:hover, +.btn-danger[disabled]:hover, +fieldset[disabled] .btn-danger:hover, +.btn-danger.disabled:focus, +.btn-danger[disabled]:focus, +fieldset[disabled] .btn-danger:focus, +.btn-danger.disabled:active, +.btn-danger[disabled]:active, +fieldset[disabled] .btn-danger:active, +.btn-danger.disabled.active, +.btn-danger[disabled].active, +fieldset[disabled] .btn-danger.active { + background-color: #d9534f; + border-color: #d43f3a; +} +.btn-danger .badge { + color: #d9534f; + background-color: #fff; +} +.btn-link { + font-weight: normal; + color: #428bca; + cursor: pointer; + border-radius: 0; +} +.btn-link, +.btn-link:active, +.btn-link[disabled], +fieldset[disabled] .btn-link { + background-color: transparent; + -webkit-box-shadow: none; + box-shadow: none; +} +.btn-link, +.btn-link:hover, +.btn-link:focus, +.btn-link:active { + border-color: transparent; +} +.btn-link:hover, +.btn-link:focus { + color: #2a6496; + text-decoration: underline; + background-color: transparent; +} +.btn-link[disabled]:hover, +fieldset[disabled] .btn-link:hover, +.btn-link[disabled]:focus, +fieldset[disabled] .btn-link:focus { + color: #999; + text-decoration: none; +} +.btn-lg, +.btn-group-lg > .btn { + padding: 10px 16px; + font-size: 18px; + line-height: 1.33; + border-radius: 6px; +} +.btn-sm, +.btn-group-sm > .btn { + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 3px; +} +.btn-xs, +.btn-group-xs > .btn { + padding: 1px 5px; + font-size: 12px; + line-height: 1.5; + border-radius: 3px; +} +.btn-block { + display: block; + width: 100%; + padding-right: 0; + padding-left: 0; +} +.btn-block + .btn-block { + margin-top: 5px; +} +input[type="submit"].btn-block, +input[type="reset"].btn-block, +input[type="button"].btn-block { + width: 100%; +} +.fade { + opacity: 0; + -webkit-transition: opacity .15s linear; + transition: opacity .15s linear; +} +.fade.in { + opacity: 1; +} +.collapse { + display: none; +} +.collapse.in { + display: block; +} +.collapsing { + position: relative; + height: 0; + overflow: hidden; + -webkit-transition: height .35s ease; + transition: height .35s ease; +} +@font-face { + font-family: 'Glyphicons Halflings'; + + src: url('../fonts/glyphicons-halflings-regular.eot'); + src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg'); +} +.glyphicon { + position: relative; + top: 1px; + display: inline-block; + font-family: 'Glyphicons Halflings'; + font-style: normal; + font-weight: normal; + line-height: 1; + + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +.glyphicon-asterisk:before { + content: "\2a"; +} +.glyphicon-plus:before { + content: "\2b"; +} +.glyphicon-euro:before { + content: "\20ac"; +} +.glyphicon-minus:before { + content: "\2212"; +} +.glyphicon-cloud:before { + content: "\2601"; +} +.glyphicon-envelope:before { + content: "\2709"; +} +.glyphicon-pencil:before { + content: "\270f"; +} +.glyphicon-glass:before { + content: "\e001"; +} +.glyphicon-music:before { + content: "\e002"; +} +.glyphicon-search:before { + content: "\e003"; +} +.glyphicon-heart:before { + content: "\e005"; +} +.glyphicon-star:before { + content: "\e006"; +} +.glyphicon-star-empty:before { + content: "\e007"; +} +.glyphicon-user:before { + content: "\e008"; +} +.glyphicon-film:before { + content: "\e009"; +} +.glyphicon-th-large:before { + content: "\e010"; +} +.glyphicon-th:before { + content: "\e011"; +} +.glyphicon-th-list:before { + content: "\e012"; +} +.glyphicon-ok:before { + content: "\e013"; +} +.glyphicon-remove:before { + content: "\e014"; +} +.glyphicon-zoom-in:before { + content: "\e015"; +} +.glyphicon-zoom-out:before { + content: "\e016"; +} +.glyphicon-off:before { + content: "\e017"; +} +.glyphicon-signal:before { + content: "\e018"; +} +.glyphicon-cog:before { + content: "\e019"; +} +.glyphicon-trash:before { + content: "\e020"; +} +.glyphicon-home:before { + content: "\e021"; +} +.glyphicon-file:before { + content: "\e022"; +} +.glyphicon-time:before { + content: "\e023"; +} +.glyphicon-road:before { + content: "\e024"; +} +.glyphicon-download-alt:before { + content: "\e025"; +} +.glyphicon-download:before { + content: "\e026"; +} +.glyphicon-upload:before { + content: "\e027"; +} +.glyphicon-inbox:before { + content: "\e028"; +} +.glyphicon-play-circle:before { + content: "\e029"; +} +.glyphicon-repeat:before { + content: "\e030"; +} +.glyphicon-refresh:before { + content: "\e031"; +} +.glyphicon-list-alt:before { + content: "\e032"; +} +.glyphicon-lock:before { + content: "\e033"; +} +.glyphicon-flag:before { + content: "\e034"; +} +.glyphicon-headphones:before { + content: "\e035"; +} +.glyphicon-volume-off:before { + content: "\e036"; +} +.glyphicon-volume-down:before { + content: "\e037"; +} +.glyphicon-volume-up:before { + content: "\e038"; +} +.glyphicon-qrcode:before { + content: "\e039"; +} +.glyphicon-barcode:before { + content: "\e040"; +} +.glyphicon-tag:before { + content: "\e041"; +} +.glyphicon-tags:before { + content: "\e042"; +} +.glyphicon-book:before { + content: "\e043"; +} +.glyphicon-bookmark:before { + content: "\e044"; +} +.glyphicon-print:before { + content: "\e045"; +} +.glyphicon-camera:before { + content: "\e046"; +} +.glyphicon-font:before { + content: "\e047"; +} +.glyphicon-bold:before { + content: "\e048"; +} +.glyphicon-italic:before { + content: "\e049"; +} +.glyphicon-text-height:before { + content: "\e050"; +} +.glyphicon-text-width:before { + content: "\e051"; +} +.glyphicon-align-left:before { + content: "\e052"; +} +.glyphicon-align-center:before { + content: "\e053"; +} +.glyphicon-align-right:before { + content: "\e054"; +} +.glyphicon-align-justify:before { + content: "\e055"; +} +.glyphicon-list:before { + content: "\e056"; +} +.glyphicon-indent-left:before { + content: "\e057"; +} +.glyphicon-indent-right:before { + content: "\e058"; +} +.glyphicon-facetime-video:before { + content: "\e059"; +} +.glyphicon-picture:before { + content: "\e060"; +} +.glyphicon-map-marker:before { + content: "\e062"; +} +.glyphicon-adjust:before { + content: "\e063"; +} +.glyphicon-tint:before { + content: "\e064"; +} +.glyphicon-edit:before { + content: "\e065"; +} +.glyphicon-share:before { + content: "\e066"; +} +.glyphicon-check:before { + content: "\e067"; +} +.glyphicon-move:before { + content: "\e068"; +} +.glyphicon-step-backward:before { + content: "\e069"; +} +.glyphicon-fast-backward:before { + content: "\e070"; +} +.glyphicon-backward:before { + content: "\e071"; +} +.glyphicon-play:before { + content: "\e072"; +} +.glyphicon-pause:before { + content: "\e073"; +} +.glyphicon-stop:before { + content: "\e074"; +} +.glyphicon-forward:before { + content: "\e075"; +} +.glyphicon-fast-forward:before { + content: "\e076"; +} +.glyphicon-step-forward:before { + content: "\e077"; +} +.glyphicon-eject:before { + content: "\e078"; +} +.glyphicon-chevron-left:before { + content: "\e079"; +} +.glyphicon-chevron-right:before { + content: "\e080"; +} +.glyphicon-plus-sign:before { + content: "\e081"; +} +.glyphicon-minus-sign:before { + content: "\e082"; +} +.glyphicon-remove-sign:before { + content: "\e083"; +} +.glyphicon-ok-sign:before { + content: "\e084"; +} +.glyphicon-question-sign:before { + content: "\e085"; +} +.glyphicon-info-sign:before { + content: "\e086"; +} +.glyphicon-screenshot:before { + content: "\e087"; +} +.glyphicon-remove-circle:before { + content: "\e088"; +} +.glyphicon-ok-circle:before { + content: "\e089"; +} +.glyphicon-ban-circle:before { + content: "\e090"; +} +.glyphicon-arrow-left:before { + content: "\e091"; +} +.glyphicon-arrow-right:before { + content: "\e092"; +} +.glyphicon-arrow-up:before { + content: "\e093"; +} +.glyphicon-arrow-down:before { + content: "\e094"; +} +.glyphicon-share-alt:before { + content: "\e095"; +} +.glyphicon-resize-full:before { + content: "\e096"; +} +.glyphicon-resize-small:before { + content: "\e097"; +} +.glyphicon-exclamation-sign:before { + content: "\e101"; +} +.glyphicon-gift:before { + content: "\e102"; +} +.glyphicon-leaf:before { + content: "\e103"; +} +.glyphicon-fire:before { + content: "\e104"; +} +.glyphicon-eye-open:before { + content: "\e105"; +} +.glyphicon-eye-close:before { + content: "\e106"; +} +.glyphicon-warning-sign:before { + content: "\e107"; +} +.glyphicon-plane:before { + content: "\e108"; +} +.glyphicon-calendar:before { + content: "\e109"; +} +.glyphicon-random:before { + content: "\e110"; +} +.glyphicon-comment:before { + content: "\e111"; +} +.glyphicon-magnet:before { + content: "\e112"; +} +.glyphicon-chevron-up:before { + content: "\e113"; +} +.glyphicon-chevron-down:before { + content: "\e114"; +} +.glyphicon-retweet:before { + content: "\e115"; +} +.glyphicon-shopping-cart:before { + content: "\e116"; +} +.glyphicon-folder-close:before { + content: "\e117"; +} +.glyphicon-folder-open:before { + content: "\e118"; +} +.glyphicon-resize-vertical:before { + content: "\e119"; +} +.glyphicon-resize-horizontal:before { + content: "\e120"; +} +.glyphicon-hdd:before { + content: "\e121"; +} +.glyphicon-bullhorn:before { + content: "\e122"; +} +.glyphicon-bell:before { + content: "\e123"; +} +.glyphicon-certificate:before { + content: "\e124"; +} +.glyphicon-thumbs-up:before { + content: "\e125"; +} +.glyphicon-thumbs-down:before { + content: "\e126"; +} +.glyphicon-hand-right:before { + content: "\e127"; +} +.glyphicon-hand-left:before { + content: "\e128"; +} +.glyphicon-hand-up:before { + content: "\e129"; +} +.glyphicon-hand-down:before { + content: "\e130"; +} +.glyphicon-circle-arrow-right:before { + content: "\e131"; +} +.glyphicon-circle-arrow-left:before { + content: "\e132"; +} +.glyphicon-circle-arrow-up:before { + content: "\e133"; +} +.glyphicon-circle-arrow-down:before { + content: "\e134"; +} +.glyphicon-globe:before { + content: "\e135"; +} +.glyphicon-wrench:before { + content: "\e136"; +} +.glyphicon-tasks:before { + content: "\e137"; +} +.glyphicon-filter:before { + content: "\e138"; +} +.glyphicon-briefcase:before { + content: "\e139"; +} +.glyphicon-fullscreen:before { + content: "\e140"; +} +.glyphicon-dashboard:before { + content: "\e141"; +} +.glyphicon-paperclip:before { + content: "\e142"; +} +.glyphicon-heart-empty:before { + content: "\e143"; +} +.glyphicon-link:before { + content: "\e144"; +} +.glyphicon-phone:before { + content: "\e145"; +} +.glyphicon-pushpin:before { + content: "\e146"; +} +.glyphicon-usd:before { + content: "\e148"; +} +.glyphicon-gbp:before { + content: "\e149"; +} +.glyphicon-sort:before { + content: "\e150"; +} +.glyphicon-sort-by-alphabet:before { + content: "\e151"; +} +.glyphicon-sort-by-alphabet-alt:before { + content: "\e152"; +} +.glyphicon-sort-by-order:before { + content: "\e153"; +} +.glyphicon-sort-by-order-alt:before { + content: "\e154"; +} +.glyphicon-sort-by-attributes:before { + content: "\e155"; +} +.glyphicon-sort-by-attributes-alt:before { + content: "\e156"; +} +.glyphicon-unchecked:before { + content: "\e157"; +} +.glyphicon-expand:before { + content: "\e158"; +} +.glyphicon-collapse-down:before { + content: "\e159"; +} +.glyphicon-collapse-up:before { + content: "\e160"; +} +.glyphicon-log-in:before { + content: "\e161"; +} +.glyphicon-flash:before { + content: "\e162"; +} +.glyphicon-log-out:before { + content: "\e163"; +} +.glyphicon-new-window:before { + content: "\e164"; +} +.glyphicon-record:before { + content: "\e165"; +} +.glyphicon-save:before { + content: "\e166"; +} +.glyphicon-open:before { + content: "\e167"; +} +.glyphicon-saved:before { + content: "\e168"; +} +.glyphicon-import:before { + content: "\e169"; +} +.glyphicon-export:before { + content: "\e170"; +} +.glyphicon-send:before { + content: "\e171"; +} +.glyphicon-floppy-disk:before { + content: "\e172"; +} +.glyphicon-floppy-saved:before { + content: "\e173"; +} +.glyphicon-floppy-remove:before { + content: "\e174"; +} +.glyphicon-floppy-save:before { + content: "\e175"; +} +.glyphicon-floppy-open:before { + content: "\e176"; +} +.glyphicon-credit-card:before { + content: "\e177"; +} +.glyphicon-transfer:before { + content: "\e178"; +} +.glyphicon-cutlery:before { + content: "\e179"; +} +.glyphicon-header:before { + content: "\e180"; +} +.glyphicon-compressed:before { + content: "\e181"; +} +.glyphicon-earphone:before { + content: "\e182"; +} +.glyphicon-phone-alt:before { + content: "\e183"; +} +.glyphicon-tower:before { + content: "\e184"; +} +.glyphicon-stats:before { + content: "\e185"; +} +.glyphicon-sd-video:before { + content: "\e186"; +} +.glyphicon-hd-video:before { + content: "\e187"; +} +.glyphicon-subtitles:before { + content: "\e188"; +} +.glyphicon-sound-stereo:before { + content: "\e189"; +} +.glyphicon-sound-dolby:before { + content: "\e190"; +} +.glyphicon-sound-5-1:before { + content: "\e191"; +} +.glyphicon-sound-6-1:before { + content: "\e192"; +} +.glyphicon-sound-7-1:before { + content: "\e193"; +} +.glyphicon-copyright-mark:before { + content: "\e194"; +} +.glyphicon-registration-mark:before { + content: "\e195"; +} +.glyphicon-cloud-download:before { + content: "\e197"; +} +.glyphicon-cloud-upload:before { + content: "\e198"; +} +.glyphicon-tree-conifer:before { + content: "\e199"; +} +.glyphicon-tree-deciduous:before { + content: "\e200"; +} +.caret { + display: inline-block; + width: 0; + height: 0; + margin-left: 2px; + vertical-align: middle; + border-top: 4px solid; + border-right: 4px solid transparent; + border-left: 4px solid transparent; +} +.dropdown { + position: relative; +} +.dropdown-toggle:focus { + outline: 0; +} +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + z-index: 1000; + display: none; + float: left; + min-width: 160px; + padding: 5px 0; + margin: 2px 0 0; + font-size: 14px; + list-style: none; + background-color: #fff; + background-clip: padding-box; + border: 1px solid #ccc; + border: 1px solid rgba(0, 0, 0, .15); + border-radius: 4px; + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); + box-shadow: 0 6px 12px rgba(0, 0, 0, .175); +} +.dropdown-menu.pull-right { + right: 0; + left: auto; +} +.dropdown-menu .divider { + height: 1px; + margin: 9px 0; + overflow: hidden; + background-color: #e5e5e5; +} +.dropdown-menu > li > a { + display: block; + padding: 3px 20px; + clear: both; + font-weight: normal; + line-height: 1.42857143; + color: #333; + white-space: nowrap; +} +.dropdown-menu > li > a:hover, +.dropdown-menu > li > a:focus { + color: #262626; + text-decoration: none; + background-color: #f5f5f5; +} +.dropdown-menu > .active > a, +.dropdown-menu > .active > a:hover, +.dropdown-menu > .active > a:focus { + color: #fff; + text-decoration: none; + background-color: #428bca; + outline: 0; +} +.dropdown-menu > .disabled > a, +.dropdown-menu > .disabled > a:hover, +.dropdown-menu > .disabled > a:focus { + color: #999; +} +.dropdown-menu > .disabled > a:hover, +.dropdown-menu > .disabled > a:focus { + text-decoration: none; + cursor: not-allowed; + background-color: transparent; + background-image: none; + filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); +} +.open > .dropdown-menu { + display: block; +} +.open > a { + outline: 0; +} +.dropdown-menu-right { + right: 0; + left: auto; +} +.dropdown-menu-left { + right: auto; + left: 0; +} +.dropdown-header { + display: block; + padding: 3px 20px; + font-size: 12px; + line-height: 1.42857143; + color: #999; +} +.dropdown-backdrop { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 990; +} +.pull-right > .dropdown-menu { + right: 0; + left: auto; +} +.dropup .caret, +.navbar-fixed-bottom .dropdown .caret { + content: ""; + border-top: 0; + border-bottom: 4px solid; +} +.dropup .dropdown-menu, +.navbar-fixed-bottom .dropdown .dropdown-menu { + top: auto; + bottom: 100%; + margin-bottom: 1px; +} +@media (min-width: 768px) { + .navbar-right .dropdown-menu { + right: 0; + left: auto; + } + .navbar-right .dropdown-menu-left { + right: auto; + left: 0; + } +} +.btn-group, +.btn-group-vertical { + position: relative; + display: inline-block; + vertical-align: middle; +} +.btn-group > .btn, +.btn-group-vertical > .btn { + position: relative; + float: left; +} +.btn-group > .btn:hover, +.btn-group-vertical > .btn:hover, +.btn-group > .btn:focus, +.btn-group-vertical > .btn:focus, +.btn-group > .btn:active, +.btn-group-vertical > .btn:active, +.btn-group > .btn.active, +.btn-group-vertical > .btn.active { + z-index: 2; +} +.btn-group > .btn:focus, +.btn-group-vertical > .btn:focus { + outline: none; +} +.btn-group .btn + .btn, +.btn-group .btn + .btn-group, +.btn-group .btn-group + .btn, +.btn-group .btn-group + .btn-group { + margin-left: -1px; +} +.btn-toolbar { + margin-left: -5px; +} +.btn-toolbar .btn-group, +.btn-toolbar .input-group { + float: left; +} +.btn-toolbar > .btn, +.btn-toolbar > .btn-group, +.btn-toolbar > .input-group { + margin-left: 5px; +} +.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { + border-radius: 0; +} +.btn-group > .btn:first-child { + margin-left: 0; +} +.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.btn-group > .btn:last-child:not(:first-child), +.btn-group > .dropdown-toggle:not(:first-child) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group > .btn-group { + float: left; +} +.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group > .btn-group:first-child > .btn:last-child, +.btn-group > .btn-group:first-child > .dropdown-toggle { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.btn-group > .btn-group:last-child > .btn:first-child { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group .dropdown-toggle:active, +.btn-group.open .dropdown-toggle { + outline: 0; +} +.btn-group > .btn + .dropdown-toggle { + padding-right: 8px; + padding-left: 8px; +} +.btn-group > .btn-lg + .dropdown-toggle { + padding-right: 12px; + padding-left: 12px; +} +.btn-group.open .dropdown-toggle { + -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); + box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); +} +.btn-group.open .dropdown-toggle.btn-link { + -webkit-box-shadow: none; + box-shadow: none; +} +.btn .caret { + margin-left: 0; +} +.btn-lg .caret { + border-width: 5px 5px 0; + border-bottom-width: 0; +} +.dropup .btn-lg .caret { + border-width: 0 5px 5px; +} +.btn-group-vertical > .btn, +.btn-group-vertical > .btn-group, +.btn-group-vertical > .btn-group > .btn { + display: block; + float: none; + width: 100%; + max-width: 100%; +} +.btn-group-vertical > .btn-group > .btn { + float: none; +} +.btn-group-vertical > .btn + .btn, +.btn-group-vertical > .btn + .btn-group, +.btn-group-vertical > .btn-group + .btn, +.btn-group-vertical > .btn-group + .btn-group { + margin-top: -1px; + margin-left: 0; +} +.btn-group-vertical > .btn:not(:first-child):not(:last-child) { + border-radius: 0; +} +.btn-group-vertical > .btn:first-child:not(:last-child) { + border-top-right-radius: 4px; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group-vertical > .btn:last-child:not(:first-child) { + border-top-left-radius: 0; + border-top-right-radius: 0; + border-bottom-left-radius: 4px; +} +.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { + border-radius: 0; +} +.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child, +.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; +} +.btn-group-justified { + display: table; + width: 100%; + table-layout: fixed; + border-collapse: separate; +} +.btn-group-justified > .btn, +.btn-group-justified > .btn-group { + display: table-cell; + float: none; + width: 1%; +} +.btn-group-justified > .btn-group .btn { + width: 100%; +} +[data-toggle="buttons"] > .btn > input[type="radio"], +[data-toggle="buttons"] > .btn > input[type="checkbox"] { + display: none; +} +.input-group { + position: relative; + display: table; + border-collapse: separate; +} +.input-group[class*="col-"] { + float: none; + padding-right: 0; + padding-left: 0; +} +.input-group .form-control { + position: relative; + z-index: 2; + float: left; + width: 100%; + margin-bottom: 0; +} +.input-group-lg > .form-control, +.input-group-lg > .input-group-addon, +.input-group-lg > .input-group-btn > .btn { + height: 46px; + padding: 10px 16px; + font-size: 18px; + line-height: 1.33; + border-radius: 6px; +} +select.input-group-lg > .form-control, +select.input-group-lg > .input-group-addon, +select.input-group-lg > .input-group-btn > .btn { + height: 46px; + line-height: 46px; +} +textarea.input-group-lg > .form-control, +textarea.input-group-lg > .input-group-addon, +textarea.input-group-lg > .input-group-btn > .btn, +select[multiple].input-group-lg > .form-control, +select[multiple].input-group-lg > .input-group-addon, +select[multiple].input-group-lg > .input-group-btn > .btn { + height: auto; +} +.input-group-sm > .form-control, +.input-group-sm > .input-group-addon, +.input-group-sm > .input-group-btn > .btn { + height: 30px; + padding: 5px 10px; + font-size: 12px; + line-height: 1.5; + border-radius: 3px; +} +select.input-group-sm > .form-control, +select.input-group-sm > .input-group-addon, +select.input-group-sm > .input-group-btn > .btn { + height: 30px; + line-height: 30px; +} +textarea.input-group-sm > .form-control, +textarea.input-group-sm > .input-group-addon, +textarea.input-group-sm > .input-group-btn > .btn, +select[multiple].input-group-sm > .form-control, +select[multiple].input-group-sm > .input-group-addon, +select[multiple].input-group-sm > .input-group-btn > .btn { + height: auto; +} +.input-group-addon, +.input-group-btn, +.input-group .form-control { + display: table-cell; +} +.input-group-addon:not(:first-child):not(:last-child), +.input-group-btn:not(:first-child):not(:last-child), +.input-group .form-control:not(:first-child):not(:last-child) { + border-radius: 0; +} +.input-group-addon, +.input-group-btn { + width: 1%; + white-space: nowrap; + vertical-align: middle; +} +.input-group-addon { + padding: 6px 12px; + font-size: 14px; + font-weight: normal; + line-height: 1; + color: #555; + text-align: center; + background-color: #eee; + border: 1px solid #ccc; + border-radius: 4px; +} +.input-group-addon.input-sm { + padding: 5px 10px; + font-size: 12px; + border-radius: 3px; +} +.input-group-addon.input-lg { + padding: 10px 16px; + font-size: 18px; + border-radius: 6px; +} +.input-group-addon input[type="radio"], +.input-group-addon input[type="checkbox"] { + margin-top: 0; +} +.input-group .form-control:first-child, +.input-group-addon:first-child, +.input-group-btn:first-child > .btn, +.input-group-btn:first-child > .btn-group > .btn, +.input-group-btn:first-child > .dropdown-toggle, +.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle), +.input-group-btn:last-child > .btn-group:not(:last-child) > .btn { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} +.input-group-addon:first-child { + border-right: 0; +} +.input-group .form-control:last-child, +.input-group-addon:last-child, +.input-group-btn:last-child > .btn, +.input-group-btn:last-child > .btn-group > .btn, +.input-group-btn:last-child > .dropdown-toggle, +.input-group-btn:first-child > .btn:not(:first-child), +.input-group-btn:first-child > .btn-group:not(:first-child) > .btn { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} +.input-group-addon:last-child { + border-left: 0; +} +.input-group-btn { + position: relative; + font-size: 0; + white-space: nowrap; +} +.input-group-btn > .btn { + position: relative; +} +.input-group-btn > .btn + .btn { + margin-left: -1px; +} +.input-group-btn > .btn:hover, +.input-group-btn > .btn:focus, +.input-group-btn > .btn:active { + z-index: 2; +} +.input-group-btn:first-child > .btn, +.input-group-btn:first-child > .btn-group { + margin-right: -1px; +} +.input-group-btn:last-child > .btn, +.input-group-btn:last-child > .btn-group { + margin-left: -1px; +} +.nav { + padding-left: 0; + margin-bottom: 0; + list-style: none; +} +.nav > li { + position: relative; + display: block; +} +.nav > li > a { + position: relative; + display: block; + padding: 10px 15px; +} +.nav > li > a:hover, +.nav > li > a:focus { + text-decoration: none; + background-color: #eee; +} +.nav > li.disabled > a { + color: #999; +} +.nav > li.disabled > a:hover, +.nav > li.disabled > a:focus { + color: #999; + text-decoration: none; + cursor: not-allowed; + background-color: transparent; +} +.nav .open > a, +.nav .open > a:hover, +.nav .open > a:focus { + background-color: #eee; + border-color: #428bca; +} +.nav .nav-divider { + height: 1px; + margin: 9px 0; + overflow: hidden; + background-color: #e5e5e5; +} +.nav > li > a > img { + max-width: none; +} +.nav-tabs { + border-bottom: 1px solid #ddd; +} +.nav-tabs > li { + float: left; + margin-bottom: -1px; +} +.nav-tabs > li > a { + margin-right: 2px; + line-height: 1.42857143; + border: 1px solid transparent; + border-radius: 4px 4px 0 0; +} +.nav-tabs > li > a:hover { + border-color: #eee #eee #ddd; +} +.nav-tabs > li.active > a, +.nav-tabs > li.active > a:hover, +.nav-tabs > li.active > a:focus { + color: #555; + cursor: default; + background-color: #fff; + border: 1px solid #ddd; + border-bottom-color: transparent; +} +.nav-tabs.nav-justified { + width: 100%; + border-bottom: 0; +} +.nav-tabs.nav-justified > li { + float: none; +} +.nav-tabs.nav-justified > li > a { + margin-bottom: 5px; + text-align: center; +} +.nav-tabs.nav-justified > .dropdown .dropdown-menu { + top: auto; + left: auto; +} +@media (min-width: 768px) { + .nav-tabs.nav-justified > li { + display: table-cell; + width: 1%; + } + .nav-tabs.nav-justified > li > a { + margin-bottom: 0; + } +} +.nav-tabs.nav-justified > li > a { + margin-right: 0; + border-radius: 4px; +} +.nav-tabs.nav-justified > .active > a, +.nav-tabs.nav-justified > .active > a:hover, +.nav-tabs.nav-justified > .active > a:focus { + border: 1px solid #ddd; +} +@media (min-width: 768px) { + .nav-tabs.nav-justified > li > a { + border-bottom: 1px solid #ddd; + border-radius: 4px 4px 0 0; + } + .nav-tabs.nav-justified > .active > a, + .nav-tabs.nav-justified > .active > a:hover, + .nav-tabs.nav-justified > .active > a:focus { + border-bottom-color: #fff; + } +} +.nav-pills > li { + float: left; +} +.nav-pills > li > a { + border-radius: 4px; +} +.nav-pills > li + li { + margin-left: 2px; +} +.nav-pills > li.active > a, +.nav-pills > li.active > a:hover, +.nav-pills > li.active > a:focus { + color: #fff; + background-color: #428bca; +} +.nav-stacked > li { + float: none; +} +.nav-stacked > li + li { + margin-top: 2px; + margin-left: 0; +} +.nav-justified { + width: 100%; +} +.nav-justified > li { + float: none; +} +.nav-justified > li > a { + margin-bottom: 5px; + text-align: center; +} +.nav-justified > .dropdown .dropdown-menu { + top: auto; + left: auto; +} +@media (min-width: 768px) { + .nav-justified > li { + display: table-cell; + width: 1%; + } + .nav-justified > li > a { + margin-bottom: 0; + } +} +.nav-tabs-justified { + border-bottom: 0; +} +.nav-tabs-justified > li > a { + margin-right: 0; + border-radius: 4px; +} +.nav-tabs-justified > .active > a, +.nav-tabs-justified > .active > a:hover, +.nav-tabs-justified > .active > a:focus { + border: 1px solid #ddd; +} +@media (min-width: 768px) { + .nav-tabs-justified > li > a { + border-bottom: 1px solid #ddd; + border-radius: 4px 4px 0 0; + } + .nav-tabs-justified > .active > a, + .nav-tabs-justified > .active > a:hover, + .nav-tabs-justified > .active > a:focus { + border-bottom-color: #fff; + } +} +.tab-content > .tab-pane { + display: none; +} +.tab-content > .active { + display: block; +} +.nav-tabs .dropdown-menu { + margin-top: -1px; + border-top-left-radius: 0; + border-top-right-radius: 0; +} +.navbar { + position: relative; + min-height: 50px; + margin-bottom: 20px; + border: 1px solid transparent; +} +@media (min-width: 768px) { + .navbar { + border-radius: 4px; + } +} +@media (min-width: 768px) { + .navbar-header { + float: left; + } +} +.navbar-collapse { + max-height: 340px; + padding-right: 15px; + padding-left: 15px; + overflow-x: visible; + -webkit-overflow-scrolling: touch; + border-top: 1px solid transparent; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); +} +.navbar-collapse.in { + overflow-y: auto; +} +@media (min-width: 768px) { + .navbar-collapse { + width: auto; + border-top: 0; + box-shadow: none; + } + .navbar-collapse.collapse { + display: block !important; + height: auto !important; + padding-bottom: 0; + overflow: visible !important; + } + .navbar-collapse.in { + overflow-y: visible; + } + .navbar-fixed-top .navbar-collapse, + .navbar-static-top .navbar-collapse, + .navbar-fixed-bottom .navbar-collapse { + padding-right: 0; + padding-left: 0; + } +} +.container > .navbar-header, +.container-fluid > .navbar-header, +.container > .navbar-collapse, +.container-fluid > .navbar-collapse { + margin-right: -15px; + margin-left: -15px; +} +@media (min-width: 768px) { + .container > .navbar-header, + .container-fluid > .navbar-header, + .container > .navbar-collapse, + .container-fluid > .navbar-collapse { + margin-right: 0; + margin-left: 0; + } +} +.navbar-static-top { + z-index: 1000; + border-width: 0 0 1px; +} +@media (min-width: 768px) { + .navbar-static-top { + border-radius: 0; + } +} +.navbar-fixed-top, +.navbar-fixed-bottom { + position: fixed; + right: 0; + left: 0; + z-index: 1030; +} +@media (min-width: 768px) { + .navbar-fixed-top, + .navbar-fixed-bottom { + border-radius: 0; + } +} +.navbar-fixed-top { + top: 0; + border-width: 0 0 1px; +} +.navbar-fixed-bottom { + bottom: 0; + margin-bottom: 0; + border-width: 1px 0 0; +} +.navbar-brand { + float: left; + height: 50px; + padding: 15px 15px; + font-size: 18px; + line-height: 20px; +} +.navbar-brand:hover, +.navbar-brand:focus { + text-decoration: none; +} +@media (min-width: 768px) { + .navbar > .container .navbar-brand, + .navbar > .container-fluid .navbar-brand { + margin-left: -15px; + } +} +.navbar-toggle { + position: relative; + float: right; + padding: 9px 10px; + margin-top: 8px; + margin-right: 15px; + margin-bottom: 8px; + background-color: transparent; + background-image: none; + border: 1px solid transparent; + border-radius: 4px; +} +.navbar-toggle:focus { + outline: none; +} +.navbar-toggle .icon-bar { + display: block; + width: 22px; + height: 2px; + border-radius: 1px; +} +.navbar-toggle .icon-bar + .icon-bar { + margin-top: 4px; +} +@media (min-width: 768px) { + .navbar-toggle { + display: none; + } +} +.navbar-nav { + margin: 7.5px -15px; +} +.navbar-nav > li > a { + padding-top: 10px; + padding-bottom: 10px; + line-height: 20px; +} +@media (max-width: 767px) { + .navbar-nav .open .dropdown-menu { + position: static; + float: none; + width: auto; + margin-top: 0; + background-color: transparent; + border: 0; + box-shadow: none; + } + .navbar-nav .open .dropdown-menu > li > a, + .navbar-nav .open .dropdown-menu .dropdown-header { + padding: 5px 15px 5px 25px; + } + .navbar-nav .open .dropdown-menu > li > a { + line-height: 20px; + } + .navbar-nav .open .dropdown-menu > li > a:hover, + .navbar-nav .open .dropdown-menu > li > a:focus { + background-image: none; + } +} +@media (min-width: 768px) { + .navbar-nav { + float: left; + margin: 0; + } + .navbar-nav > li { + float: left; + } + .navbar-nav > li > a { + padding-top: 15px; + padding-bottom: 15px; + } + .navbar-nav.navbar-right:last-child { + margin-right: -15px; + } +} +@media (min-width: 768px) { + .navbar-left { + float: left !important; + } + .navbar-right { + float: right !important; + } +} +.navbar-form { + padding: 10px 15px; + margin-top: 8px; + margin-right: -15px; + margin-bottom: 8px; + margin-left: -15px; + border-top: 1px solid transparent; + border-bottom: 1px solid transparent; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1); + box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1); +} +@media (min-width: 768px) { + .navbar-form .form-group { + display: inline-block; + margin-bottom: 0; + vertical-align: middle; + } + .navbar-form .form-control { + display: inline-block; + width: auto; + vertical-align: middle; + } + .navbar-form .input-group > .form-control { + width: 100%; + } + .navbar-form .control-label { + margin-bottom: 0; + vertical-align: middle; + } + .navbar-form .radio, + .navbar-form .checkbox { + display: inline-block; + padding-left: 0; + margin-top: 0; + margin-bottom: 0; + vertical-align: middle; + } + .navbar-form .radio input[type="radio"], + .navbar-form .checkbox input[type="checkbox"] { + float: none; + margin-left: 0; + } + .navbar-form .has-feedback .form-control-feedback { + top: 0; + } +} +@media (max-width: 767px) { + .navbar-form .form-group { + margin-bottom: 5px; + } +} +@media (min-width: 768px) { + .navbar-form { + width: auto; + padding-top: 0; + padding-bottom: 0; + margin-right: 0; + margin-left: 0; + border: 0; + -webkit-box-shadow: none; + box-shadow: none; + } + .navbar-form.navbar-right:last-child { + margin-right: -15px; + } +} +.navbar-nav > li > .dropdown-menu { + margin-top: 0; + border-top-left-radius: 0; + border-top-right-radius: 0; +} +.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} +.navbar-btn { + margin-top: 8px; + margin-bottom: 8px; +} +.navbar-btn.btn-sm { + margin-top: 10px; + margin-bottom: 10px; +} +.navbar-btn.btn-xs { + margin-top: 14px; + margin-bottom: 14px; +} +.navbar-text { + margin-top: 15px; + margin-bottom: 15px; +} +@media (min-width: 768px) { + .navbar-text { + float: left; + margin-right: 15px; + margin-left: 15px; + } + .navbar-text.navbar-right:last-child { + margin-right: 0; + } +} +.navbar-default { + background-color: #f8f8f8; + border-color: #e7e7e7; +} +.navbar-default .navbar-brand { + color: #777; +} +.navbar-default .navbar-brand:hover, +.navbar-default .navbar-brand:focus { + color: #5e5e5e; + background-color: transparent; +} +.navbar-default .navbar-text { + color: #777; +} +.navbar-default .navbar-nav > li > a { + color: #777; +} +.navbar-default .navbar-nav > li > a:hover, +.navbar-default .navbar-nav > li > a:focus { + color: #333; + background-color: transparent; +} +.navbar-default .navbar-nav > .active > a, +.navbar-default .navbar-nav > .active > a:hover, +.navbar-default .navbar-nav > .active > a:focus { + color: #555; + background-color: #e7e7e7; +} +.navbar-default .navbar-nav > .disabled > a, +.navbar-default .navbar-nav > .disabled > a:hover, +.navbar-default .navbar-nav > .disabled > a:focus { + color: #ccc; + background-color: transparent; +} +.navbar-default .navbar-toggle { + border-color: #ddd; +} +.navbar-default .navbar-toggle:hover, +.navbar-default .navbar-toggle:focus { + background-color: #ddd; +} +.navbar-default .navbar-toggle .icon-bar { + background-color: #888; +} +.navbar-default .navbar-collapse, +.navbar-default .navbar-form { + border-color: #e7e7e7; +} +.navbar-default .navbar-nav > .open > a, +.navbar-default .navbar-nav > .open > a:hover, +.navbar-default .navbar-nav > .open > a:focus { + color: #555; + background-color: #e7e7e7; +} +@media (max-width: 767px) { + .navbar-default .navbar-nav .open .dropdown-menu > li > a { + color: #777; + } + .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, + .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { + color: #333; + background-color: transparent; + } + .navbar-default .navbar-nav .open .dropdown-menu > .active > a, + .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, + .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { + color: #555; + background-color: #e7e7e7; + } + .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, + .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, + .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { + color: #ccc; + background-color: transparent; + } +} +.navbar-default .navbar-link { + color: #777; +} +.navbar-default .navbar-link:hover { + color: #333; +} +.navbar-inverse { + background-color: #222; + border-color: #080808; +} +.navbar-inverse .navbar-brand { + color: #999; +} +.navbar-inverse .navbar-brand:hover, +.navbar-inverse .navbar-brand:focus { + color: #fff; + background-color: transparent; +} +.navbar-inverse .navbar-text { + color: #999; +} +.navbar-inverse .navbar-nav > li > a { + color: #999; +} +.navbar-inverse .navbar-nav > li > a:hover, +.navbar-inverse .navbar-nav > li > a:focus { + color: #fff; + background-color: transparent; +} +.navbar-inverse .navbar-nav > .active > a, +.navbar-inverse .navbar-nav > .active > a:hover, +.navbar-inverse .navbar-nav > .active > a:focus { + color: #fff; + background-color: #080808; +} +.navbar-inverse .navbar-nav > .disabled > a, +.navbar-inverse .navbar-nav > .disabled > a:hover, +.navbar-inverse .navbar-nav > .disabled > a:focus { + color: #444; + background-color: transparent; +} +.navbar-inverse .navbar-toggle { + border-color: #333; +} +.navbar-inverse .navbar-toggle:hover, +.navbar-inverse .navbar-toggle:focus { + background-color: #333; +} +.navbar-inverse .navbar-toggle .icon-bar { + background-color: #fff; +} +.navbar-inverse .navbar-collapse, +.navbar-inverse .navbar-form { + border-color: #101010; +} +.navbar-inverse .navbar-nav > .open > a, +.navbar-inverse .navbar-nav > .open > a:hover, +.navbar-inverse .navbar-nav > .open > a:focus { + color: #fff; + background-color: #080808; +} +@media (max-width: 767px) { + .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header { + border-color: #080808; + } + .navbar-inverse .navbar-nav .open .dropdown-menu .divider { + background-color: #080808; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > li > a { + color: #999; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, + .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus { + color: #fff; + background-color: transparent; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, + .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, + .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus { + color: #fff; + background-color: #080808; + } + .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, + .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, + .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus { + color: #444; + background-color: transparent; + } +} +.navbar-inverse .navbar-link { + color: #999; +} +.navbar-inverse .navbar-link:hover { + color: #fff; +} +.breadcrumb { + padding: 8px 15px; + margin-bottom: 20px; + list-style: none; + background-color: #f5f5f5; + border-radius: 4px; +} +.breadcrumb > li { + display: inline-block; +} +.breadcrumb > li + li:before { + padding: 0 5px; + color: #ccc; + content: "/\00a0"; +} +.breadcrumb > .active { + color: #999; +} +.pagination { + display: inline-block; + padding-left: 0; + margin: 20px 0; + border-radius: 4px; +} +.pagination > li { + display: inline; +} +.pagination > li > a, +.pagination > li > span { + position: relative; + float: left; + padding: 6px 12px; + margin-left: -1px; + line-height: 1.42857143; + color: #428bca; + text-decoration: none; + background-color: #fff; + border: 1px solid #ddd; +} +.pagination > li:first-child > a, +.pagination > li:first-child > span { + margin-left: 0; + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; +} +.pagination > li:last-child > a, +.pagination > li:last-child > span { + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; +} +.pagination > li > a:hover, +.pagination > li > span:hover, +.pagination > li > a:focus, +.pagination > li > span:focus { + color: #2a6496; + background-color: #eee; + border-color: #ddd; +} +.pagination > .active > a, +.pagination > .active > span, +.pagination > .active > a:hover, +.pagination > .active > span:hover, +.pagination > .active > a:focus, +.pagination > .active > span:focus { + z-index: 2; + color: #fff; + cursor: default; + background-color: #428bca; + border-color: #428bca; +} +.pagination > .disabled > span, +.pagination > .disabled > span:hover, +.pagination > .disabled > span:focus, +.pagination > .disabled > a, +.pagination > .disabled > a:hover, +.pagination > .disabled > a:focus { + color: #999; + cursor: not-allowed; + background-color: #fff; + border-color: #ddd; +} +.pagination-lg > li > a, +.pagination-lg > li > span { + padding: 10px 16px; + font-size: 18px; +} +.pagination-lg > li:first-child > a, +.pagination-lg > li:first-child > span { + border-top-left-radius: 6px; + border-bottom-left-radius: 6px; +} +.pagination-lg > li:last-child > a, +.pagination-lg > li:last-child > span { + border-top-right-radius: 6px; + border-bottom-right-radius: 6px; +} +.pagination-sm > li > a, +.pagination-sm > li > span { + padding: 5px 10px; + font-size: 12px; +} +.pagination-sm > li:first-child > a, +.pagination-sm > li:first-child > span { + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; +} +.pagination-sm > li:last-child > a, +.pagination-sm > li:last-child > span { + border-top-right-radius: 3px; + border-bottom-right-radius: 3px; +} +.pager { + padding-left: 0; + margin: 20px 0; + text-align: center; + list-style: none; +} +.pager li { + display: inline; +} +.pager li > a, +.pager li > span { + display: inline-block; + padding: 5px 14px; + background-color: #fff; + border: 1px solid #ddd; + border-radius: 15px; +} +.pager li > a:hover, +.pager li > a:focus { + text-decoration: none; + background-color: #eee; +} +.pager .next > a, +.pager .next > span { + float: right; +} +.pager .previous > a, +.pager .previous > span { + float: left; +} +.pager .disabled > a, +.pager .disabled > a:hover, +.pager .disabled > a:focus, +.pager .disabled > span { + color: #999; + cursor: not-allowed; + background-color: #fff; +} +.label { + display: inline; + padding: .2em .6em .3em; + font-size: 75%; + font-weight: bold; + line-height: 1; + color: #fff; + text-align: center; + white-space: nowrap; + vertical-align: baseline; + border-radius: .25em; +} +.label[href]:hover, +.label[href]:focus { + color: #fff; + text-decoration: none; + cursor: pointer; +} +.label:empty { + display: none; +} +.btn .label { + position: relative; + top: -1px; +} +.label-default { + background-color: #999; +} +.label-default[href]:hover, +.label-default[href]:focus { + background-color: #808080; +} +.label-primary { + background-color: #428bca; +} +.label-primary[href]:hover, +.label-primary[href]:focus { + background-color: #3071a9; +} +.label-success { + background-color: #5cb85c; +} +.label-success[href]:hover, +.label-success[href]:focus { + background-color: #449d44; +} +.label-info { + background-color: #5bc0de; +} +.label-info[href]:hover, +.label-info[href]:focus { + background-color: #31b0d5; +} +.label-warning { + background-color: #f0ad4e; +} +.label-warning[href]:hover, +.label-warning[href]:focus { + background-color: #ec971f; +} +.label-danger { + background-color: #d9534f; +} +.label-danger[href]:hover, +.label-danger[href]:focus { + background-color: #c9302c; +} +.badge { + display: inline-block; + min-width: 10px; + padding: 3px 7px; + font-size: 12px; + font-weight: bold; + line-height: 1; + color: #fff; + text-align: center; + white-space: nowrap; + vertical-align: baseline; + background-color: #999; + border-radius: 10px; +} +.badge:empty { + display: none; +} +.btn .badge { + position: relative; + top: -1px; +} +.btn-xs .badge { + top: 0; + padding: 1px 5px; +} +a.badge:hover, +a.badge:focus { + color: #fff; + text-decoration: none; + cursor: pointer; +} +a.list-group-item.active > .badge, +.nav-pills > .active > a > .badge { + color: #428bca; + background-color: #fff; +} +.nav-pills > li > a > .badge { + margin-left: 3px; +} +.jumbotron { + padding: 30px; + margin-bottom: 30px; + color: inherit; + background-color: #eee; +} +.jumbotron h1, +.jumbotron .h1 { + color: inherit; +} +.jumbotron p { + margin-bottom: 15px; + font-size: 21px; + font-weight: 200; +} +.container .jumbotron { + border-radius: 6px; +} +.jumbotron .container { + max-width: 100%; +} +@media screen and (min-width: 768px) { + .jumbotron { + padding-top: 48px; + padding-bottom: 48px; + } + .container .jumbotron { + padding-right: 60px; + padding-left: 60px; + } + .jumbotron h1, + .jumbotron .h1 { + font-size: 63px; + } +} +.thumbnail { + display: block; + padding: 4px; + margin-bottom: 20px; + line-height: 1.42857143; + background-color: #fff; + border: 1px solid #ddd; + border-radius: 4px; + -webkit-transition: all .2s ease-in-out; + transition: all .2s ease-in-out; +} +.thumbnail > img, +.thumbnail a > img { + margin-right: auto; + margin-left: auto; +} +a.thumbnail:hover, +a.thumbnail:focus, +a.thumbnail.active { + border-color: #428bca; +} +.thumbnail .caption { + padding: 9px; + color: #333; +} +.alert { + padding: 15px; + margin-bottom: 20px; + border: 1px solid transparent; + border-radius: 4px; +} +.alert h4 { + margin-top: 0; + color: inherit; +} +.alert .alert-link { + font-weight: bold; +} +.alert > p, +.alert > ul { + margin-bottom: 0; +} +.alert > p + p { + margin-top: 5px; +} +.alert-dismissable { + padding-right: 35px; +} +.alert-dismissable .close { + position: relative; + top: -2px; + right: -21px; + color: inherit; +} +.alert-success { + color: #3c763d; + background-color: #dff0d8; + border-color: #d6e9c6; +} +.alert-success hr { + border-top-color: #c9e2b3; +} +.alert-success .alert-link { + color: #2b542c; +} +.alert-info { + color: #31708f; + background-color: #d9edf7; + border-color: #bce8f1; +} +.alert-info hr { + border-top-color: #a6e1ec; +} +.alert-info .alert-link { + color: #245269; +} +.alert-warning { + color: #8a6d3b; + background-color: #fcf8e3; + border-color: #faebcc; +} +.alert-warning hr { + border-top-color: #f7e1b5; +} +.alert-warning .alert-link { + color: #66512c; +} +.alert-danger { + color: #a94442; + background-color: #f2dede; + border-color: #ebccd1; +} +.alert-danger hr { + border-top-color: #e4b9c0; +} +.alert-danger .alert-link { + color: #843534; +} +@-webkit-keyframes progress-bar-stripes { + from { + background-position: 40px 0; + } + to { + background-position: 0 0; + } +} +@keyframes progress-bar-stripes { + from { + background-position: 40px 0; + } + to { + background-position: 0 0; + } +} +.progress { + height: 20px; + margin-bottom: 20px; + overflow: hidden; + background-color: #f5f5f5; + border-radius: 4px; + -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1); +} +.progress-bar { + float: left; + width: 0; + height: 100%; + font-size: 12px; + line-height: 20px; + color: #fff; + text-align: center; + background-color: #428bca; + -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15); + box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15); + -webkit-transition: width .6s ease; + transition: width .6s ease; +} +.progress-striped .progress-bar { + background-image: -webkit-linear-gradient(45deg, 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(45deg, 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-size: 40px 40px; +} +.progress.active .progress-bar { + -webkit-animation: progress-bar-stripes 2s linear infinite; + animation: progress-bar-stripes 2s linear infinite; +} +.progress-bar-success { + background-color: #5cb85c; +} +.progress-striped .progress-bar-success { + background-image: -webkit-linear-gradient(45deg, 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(45deg, 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); +} +.progress-bar-info { + background-color: #5bc0de; +} +.progress-striped .progress-bar-info { + background-image: -webkit-linear-gradient(45deg, 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(45deg, 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); +} +.progress-bar-warning { + background-color: #f0ad4e; +} +.progress-striped .progress-bar-warning { + background-image: -webkit-linear-gradient(45deg, 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(45deg, 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); +} +.progress-bar-danger { + background-color: #d9534f; +} +.progress-striped .progress-bar-danger { + background-image: -webkit-linear-gradient(45deg, 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(45deg, 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); +} +.media, +.media-body { + overflow: hidden; + zoom: 1; +} +.media, +.media .media { + margin-top: 15px; +} +.media:first-child { + margin-top: 0; +} +.media-object { + display: block; +} +.media-heading { + margin: 0 0 5px; +} +.media > .pull-left { + margin-right: 10px; +} +.media > .pull-right { + margin-left: 10px; +} +.media-list { + padding-left: 0; + list-style: none; +} +.list-group { + padding-left: 0; + margin-bottom: 20px; +} +.list-group-item { + position: relative; + display: block; + padding: 10px 15px; + margin-bottom: -1px; + background-color: #fff; + border: 1px solid #ddd; +} +.list-group-item:first-child { + border-top-left-radius: 4px; + border-top-right-radius: 4px; +} +.list-group-item:last-child { + margin-bottom: 0; + border-bottom-right-radius: 4px; + border-bottom-left-radius: 4px; +} +.list-group-item > .badge { + float: right; +} +.list-group-item > .badge + .badge { + margin-right: 5px; +} +a.list-group-item { + color: #555; +} +a.list-group-item .list-group-item-heading { + color: #333; +} +a.list-group-item:hover, +a.list-group-item:focus { + text-decoration: none; + background-color: #f5f5f5; +} +a.list-group-item.active, +a.list-group-item.active:hover, +a.list-group-item.active:focus { + z-index: 2; + color: #fff; + background-color: #428bca; + border-color: #428bca; +} +a.list-group-item.active .list-group-item-heading, +a.list-group-item.active:hover .list-group-item-heading, +a.list-group-item.active:focus .list-group-item-heading { + color: inherit; +} +a.list-group-item.active .list-group-item-text, +a.list-group-item.active:hover .list-group-item-text, +a.list-group-item.active:focus .list-group-item-text { + color: #e1edf7; +} +.list-group-item-success { + color: #3c763d; + background-color: #dff0d8; +} +a.list-group-item-success { + color: #3c763d; +} +a.list-group-item-success .list-group-item-heading { + color: inherit; +} +a.list-group-item-success:hover, +a.list-group-item-success:focus { + color: #3c763d; + background-color: #d0e9c6; +} +a.list-group-item-success.active, +a.list-group-item-success.active:hover, +a.list-group-item-success.active:focus { + color: #fff; + background-color: #3c763d; + border-color: #3c763d; +} +.list-group-item-info { + color: #31708f; + background-color: #d9edf7; +} +a.list-group-item-info { + color: #31708f; +} +a.list-group-item-info .list-group-item-heading { + color: inherit; +} +a.list-group-item-info:hover, +a.list-group-item-info:focus { + color: #31708f; + background-color: #c4e3f3; +} +a.list-group-item-info.active, +a.list-group-item-info.active:hover, +a.list-group-item-info.active:focus { + color: #fff; + background-color: #31708f; + border-color: #31708f; +} +.list-group-item-warning { + color: #8a6d3b; + background-color: #fcf8e3; +} +a.list-group-item-warning { + color: #8a6d3b; +} +a.list-group-item-warning .list-group-item-heading { + color: inherit; +} +a.list-group-item-warning:hover, +a.list-group-item-warning:focus { + color: #8a6d3b; + background-color: #faf2cc; +} +a.list-group-item-warning.active, +a.list-group-item-warning.active:hover, +a.list-group-item-warning.active:focus { + color: #fff; + background-color: #8a6d3b; + border-color: #8a6d3b; +} +.list-group-item-danger { + color: #a94442; + background-color: #f2dede; +} +a.list-group-item-danger { + color: #a94442; +} +a.list-group-item-danger .list-group-item-heading { + color: inherit; +} +a.list-group-item-danger:hover, +a.list-group-item-danger:focus { + color: #a94442; + background-color: #ebcccc; +} +a.list-group-item-danger.active, +a.list-group-item-danger.active:hover, +a.list-group-item-danger.active:focus { + color: #fff; + background-color: #a94442; + border-color: #a94442; +} +.list-group-item-heading { + margin-top: 0; + margin-bottom: 5px; +} +.list-group-item-text { + margin-bottom: 0; + line-height: 1.3; +} +.panel { + margin-bottom: 20px; + background-color: #fff; + border: 1px solid transparent; + border-radius: 4px; + -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); + box-shadow: 0 1px 1px rgba(0, 0, 0, .05); +} +.panel-body { + padding: 15px; +} +.panel-heading { + padding: 10px 15px; + border-bottom: 1px solid transparent; + border-top-left-radius: 3px; + border-top-right-radius: 3px; +} +.panel-heading > .dropdown .dropdown-toggle { + color: inherit; +} +.panel-title { + margin-top: 0; + margin-bottom: 0; + font-size: 16px; + color: inherit; +} +.panel-title > a { + color: inherit; +} +.panel-footer { + padding: 10px 15px; + background-color: #f5f5f5; + border-top: 1px solid #ddd; + border-bottom-right-radius: 3px; + border-bottom-left-radius: 3px; +} +.panel > .list-group { + margin-bottom: 0; +} +.panel > .list-group .list-group-item { + border-width: 1px 0; + border-radius: 0; +} +.panel > .list-group:first-child .list-group-item:first-child { + border-top: 0; + border-top-left-radius: 3px; + border-top-right-radius: 3px; +} +.panel > .list-group:last-child .list-group-item:last-child { + border-bottom: 0; + border-bottom-right-radius: 3px; + border-bottom-left-radius: 3px; +} +.panel-heading + .list-group .list-group-item:first-child { + border-top-width: 0; +} +.panel > .table, +.panel > .table-responsive > .table { + margin-bottom: 0; +} +.panel > .table:first-child, +.panel > .table-responsive:first-child > .table:first-child { + border-top-left-radius: 3px; + border-top-right-radius: 3px; +} +.panel > .table:first-child > thead:first-child > tr:first-child td:first-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child, +.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child, +.panel > .table:first-child > thead:first-child > tr:first-child th:first-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child, +.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child { + border-top-left-radius: 3px; +} +.panel > .table:first-child > thead:first-child > tr:first-child td:last-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child, +.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child, +.panel > .table:first-child > thead:first-child > tr:first-child th:last-child, +.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child, +.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child, +.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child { + border-top-right-radius: 3px; +} +.panel > .table:last-child, +.panel > .table-responsive:last-child > .table:last-child { + border-bottom-right-radius: 3px; + border-bottom-left-radius: 3px; +} +.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child, +.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child { + border-bottom-left-radius: 3px; +} +.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child, +.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child, +.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child, +.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child, +.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child { + border-bottom-right-radius: 3px; +} +.panel > .panel-body + .table, +.panel > .panel-body + .table-responsive { + border-top: 1px solid #ddd; +} +.panel > .table > tbody:first-child > tr:first-child th, +.panel > .table > tbody:first-child > tr:first-child td { + border-top: 0; +} +.panel > .table-bordered, +.panel > .table-responsive > .table-bordered { + border: 0; +} +.panel > .table-bordered > thead > tr > th:first-child, +.panel > .table-responsive > .table-bordered > thead > tr > th:first-child, +.panel > .table-bordered > tbody > tr > th:first-child, +.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child, +.panel > .table-bordered > tfoot > tr > th:first-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child, +.panel > .table-bordered > thead > tr > td:first-child, +.panel > .table-responsive > .table-bordered > thead > tr > td:first-child, +.panel > .table-bordered > tbody > tr > td:first-child, +.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child, +.panel > .table-bordered > tfoot > tr > td:first-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child { + border-left: 0; +} +.panel > .table-bordered > thead > tr > th:last-child, +.panel > .table-responsive > .table-bordered > thead > tr > th:last-child, +.panel > .table-bordered > tbody > tr > th:last-child, +.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child, +.panel > .table-bordered > tfoot > tr > th:last-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child, +.panel > .table-bordered > thead > tr > td:last-child, +.panel > .table-responsive > .table-bordered > thead > tr > td:last-child, +.panel > .table-bordered > tbody > tr > td:last-child, +.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child, +.panel > .table-bordered > tfoot > tr > td:last-child, +.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child { + border-right: 0; +} +.panel > .table-bordered > thead > tr:first-child > td, +.panel > .table-responsive > .table-bordered > thead > tr:first-child > td, +.panel > .table-bordered > tbody > tr:first-child > td, +.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td, +.panel > .table-bordered > thead > tr:first-child > th, +.panel > .table-responsive > .table-bordered > thead > tr:first-child > th, +.panel > .table-bordered > tbody > tr:first-child > th, +.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th { + border-bottom: 0; +} +.panel > .table-bordered > tbody > tr:last-child > td, +.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td, +.panel > .table-bordered > tfoot > tr:last-child > td, +.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td, +.panel > .table-bordered > tbody > tr:last-child > th, +.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th, +.panel > .table-bordered > tfoot > tr:last-child > th, +.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th { + border-bottom: 0; +} +.panel > .table-responsive { + margin-bottom: 0; + border: 0; +} +.panel-group { + margin-bottom: 20px; +} +.panel-group .panel { + margin-bottom: 0; + overflow: hidden; + border-radius: 4px; +} +.panel-group .panel + .panel { + margin-top: 5px; +} +.panel-group .panel-heading { + border-bottom: 0; +} +.panel-group .panel-heading + .panel-collapse .panel-body { + border-top: 1px solid #ddd; +} +.panel-group .panel-footer { + border-top: 0; +} +.panel-group .panel-footer + .panel-collapse .panel-body { + border-bottom: 1px solid #ddd; +} +.panel-default { + border-color: #ddd; +} +.panel-default > .panel-heading { + color: #333; + background-color: #f5f5f5; + border-color: #ddd; +} +.panel-default > .panel-heading + .panel-collapse .panel-body { + border-top-color: #ddd; +} +.panel-default > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: #ddd; +} +.panel-primary { + border-color: #428bca; +} +.panel-primary > .panel-heading { + color: #fff; + background-color: #428bca; + border-color: #428bca; +} +.panel-primary > .panel-heading + .panel-collapse .panel-body { + border-top-color: #428bca; +} +.panel-primary > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: #428bca; +} +.panel-success { + border-color: #d6e9c6; +} +.panel-success > .panel-heading { + color: #3c763d; + background-color: #dff0d8; + border-color: #d6e9c6; +} +.panel-success > .panel-heading + .panel-collapse .panel-body { + border-top-color: #d6e9c6; +} +.panel-success > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: #d6e9c6; +} +.panel-info { + border-color: #bce8f1; +} +.panel-info > .panel-heading { + color: #31708f; + background-color: #d9edf7; + border-color: #bce8f1; +} +.panel-info > .panel-heading + .panel-collapse .panel-body { + border-top-color: #bce8f1; +} +.panel-info > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: #bce8f1; +} +.panel-warning { + border-color: #faebcc; +} +.panel-warning > .panel-heading { + color: #8a6d3b; + background-color: #fcf8e3; + border-color: #faebcc; +} +.panel-warning > .panel-heading + .panel-collapse .panel-body { + border-top-color: #faebcc; +} +.panel-warning > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: #faebcc; +} +.panel-danger { + border-color: #ebccd1; +} +.panel-danger > .panel-heading { + color: #a94442; + background-color: #f2dede; + border-color: #ebccd1; +} +.panel-danger > .panel-heading + .panel-collapse .panel-body { + border-top-color: #ebccd1; +} +.panel-danger > .panel-footer + .panel-collapse .panel-body { + border-bottom-color: #ebccd1; +} +.well { + min-height: 20px; + padding: 19px; + margin-bottom: 20px; + background-color: #f5f5f5; + border: 1px solid #e3e3e3; + border-radius: 4px; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); +} +.well blockquote { + border-color: #ddd; + border-color: rgba(0, 0, 0, .15); +} +.well-lg { + padding: 24px; + border-radius: 6px; +} +.well-sm { + padding: 9px; + border-radius: 3px; +} +.close { + float: right; + font-size: 21px; + font-weight: bold; + line-height: 1; + color: #000; + text-shadow: 0 1px 0 #fff; + filter: alpha(opacity=20); + opacity: .2; +} +.close:hover, +.close:focus { + color: #000; + text-decoration: none; + cursor: pointer; + filter: alpha(opacity=50); + opacity: .5; +} +button.close { + -webkit-appearance: none; + padding: 0; + cursor: pointer; + background: transparent; + border: 0; +} +.modal-open { + overflow: hidden; +} +.modal { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1050; + display: none; + overflow: auto; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; + outline: 0; +} +.modal.fade .modal-dialog { + -webkit-transition: -webkit-transform .3s ease-out; + -moz-transition: -moz-transform .3s ease-out; + -o-transition: -o-transform .3s ease-out; + transition: transform .3s ease-out; + -webkit-transform: translate(0, -25%); + -ms-transform: translate(0, -25%); + transform: translate(0, -25%); +} +.modal.in .modal-dialog { + -webkit-transform: translate(0, 0); + -ms-transform: translate(0, 0); + transform: translate(0, 0); +} +.modal-dialog { + position: relative; + width: auto; + margin: 10px; +} +.modal-content { + position: relative; + background-color: #fff; + background-clip: padding-box; + border: 1px solid #999; + border: 1px solid rgba(0, 0, 0, .2); + border-radius: 6px; + outline: none; + -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5); + box-shadow: 0 3px 9px rgba(0, 0, 0, .5); +} +.modal-backdrop { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: 1040; + background-color: #000; +} +.modal-backdrop.fade { + filter: alpha(opacity=0); + opacity: 0; +} +.modal-backdrop.in { + filter: alpha(opacity=50); + opacity: .5; +} +.modal-header { + min-height: 16.42857143px; + padding: 15px; + border-bottom: 1px solid #e5e5e5; +} +.modal-header .close { + margin-top: -2px; +} +.modal-title { + margin: 0; + line-height: 1.42857143; +} +.modal-body { + position: relative; + padding: 20px; +} +.modal-footer { + padding: 19px 20px 20px; + margin-top: 15px; + text-align: right; + border-top: 1px solid #e5e5e5; +} +.modal-footer .btn + .btn { + margin-bottom: 0; + margin-left: 5px; +} +.modal-footer .btn-group .btn + .btn { + margin-left: -1px; +} +.modal-footer .btn-block + .btn-block { + margin-left: 0; +} +@media (min-width: 768px) { + .modal-dialog { + width: 600px; + margin: 30px auto; + } + .modal-content { + -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5); + box-shadow: 0 5px 15px rgba(0, 0, 0, .5); + } + .modal-sm { + width: 300px; + } +} +@media (min-width: 992px) { + .modal-lg { + width: 900px; + } +} +.tooltip { + position: absolute; + z-index: 1030; + display: block; + font-size: 12px; + line-height: 1.4; + visibility: visible; + filter: alpha(opacity=0); + opacity: 0; +} +.tooltip.in { + filter: alpha(opacity=90); + opacity: .9; +} +.tooltip.top { + padding: 5px 0; + margin-top: -3px; +} +.tooltip.right { + padding: 0 5px; + margin-left: 3px; +} +.tooltip.bottom { + padding: 5px 0; + margin-top: 3px; +} +.tooltip.left { + padding: 0 5px; + margin-left: -3px; +} +.tooltip-inner { + max-width: 200px; + padding: 3px 8px; + color: #fff; + text-align: center; + text-decoration: none; + background-color: #000; + border-radius: 4px; +} +.tooltip-arrow { + position: absolute; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.tooltip.top .tooltip-arrow { + bottom: 0; + left: 50%; + margin-left: -5px; + border-width: 5px 5px 0; + border-top-color: #000; +} +.tooltip.top-left .tooltip-arrow { + bottom: 0; + left: 5px; + border-width: 5px 5px 0; + border-top-color: #000; +} +.tooltip.top-right .tooltip-arrow { + right: 5px; + bottom: 0; + border-width: 5px 5px 0; + border-top-color: #000; +} +.tooltip.right .tooltip-arrow { + top: 50%; + left: 0; + margin-top: -5px; + border-width: 5px 5px 5px 0; + border-right-color: #000; +} +.tooltip.left .tooltip-arrow { + top: 50%; + right: 0; + margin-top: -5px; + border-width: 5px 0 5px 5px; + border-left-color: #000; +} +.tooltip.bottom .tooltip-arrow { + top: 0; + left: 50%; + margin-left: -5px; + border-width: 0 5px 5px; + border-bottom-color: #000; +} +.tooltip.bottom-left .tooltip-arrow { + top: 0; + left: 5px; + border-width: 0 5px 5px; + border-bottom-color: #000; +} +.tooltip.bottom-right .tooltip-arrow { + top: 0; + right: 5px; + border-width: 0 5px 5px; + border-bottom-color: #000; +} +.popover { + position: absolute; + top: 0; + left: 0; + z-index: 1010; + display: none; + max-width: 276px; + padding: 1px; + text-align: left; + white-space: normal; + background-color: #fff; + background-clip: padding-box; + border: 1px solid #ccc; + border: 1px solid rgba(0, 0, 0, .2); + border-radius: 6px; + -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2); + box-shadow: 0 5px 10px rgba(0, 0, 0, .2); +} +.popover.top { + margin-top: -10px; +} +.popover.right { + margin-left: 10px; +} +.popover.bottom { + margin-top: 10px; +} +.popover.left { + margin-left: -10px; +} +.popover-title { + padding: 8px 14px; + margin: 0; + font-size: 14px; + font-weight: normal; + line-height: 18px; + background-color: #f7f7f7; + border-bottom: 1px solid #ebebeb; + border-radius: 5px 5px 0 0; +} +.popover-content { + padding: 9px 14px; +} +.popover > .arrow, +.popover > .arrow:after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid; +} +.popover > .arrow { + border-width: 11px; +} +.popover > .arrow:after { + content: ""; + border-width: 10px; +} +.popover.top > .arrow { + bottom: -11px; + left: 50%; + margin-left: -11px; + border-top-color: #999; + border-top-color: rgba(0, 0, 0, .25); + border-bottom-width: 0; +} +.popover.top > .arrow:after { + bottom: 1px; + margin-left: -10px; + content: " "; + border-top-color: #fff; + border-bottom-width: 0; +} +.popover.right > .arrow { + top: 50%; + left: -11px; + margin-top: -11px; + border-right-color: #999; + border-right-color: rgba(0, 0, 0, .25); + border-left-width: 0; +} +.popover.right > .arrow:after { + bottom: -10px; + left: 1px; + content: " "; + border-right-color: #fff; + border-left-width: 0; +} +.popover.bottom > .arrow { + top: -11px; + left: 50%; + margin-left: -11px; + border-top-width: 0; + border-bottom-color: #999; + border-bottom-color: rgba(0, 0, 0, .25); +} +.popover.bottom > .arrow:after { + top: 1px; + margin-left: -10px; + content: " "; + border-top-width: 0; + border-bottom-color: #fff; +} +.popover.left > .arrow { + top: 50%; + right: -11px; + margin-top: -11px; + border-right-width: 0; + border-left-color: #999; + border-left-color: rgba(0, 0, 0, .25); +} +.popover.left > .arrow:after { + right: 1px; + bottom: -10px; + content: " "; + border-right-width: 0; + border-left-color: #fff; +} +.carousel { + position: relative; +} +.carousel-inner { + position: relative; + width: 100%; + overflow: hidden; +} +.carousel-inner > .item { + position: relative; + display: none; + -webkit-transition: .6s ease-in-out left; + transition: .6s ease-in-out left; +} +.carousel-inner > .item > img, +.carousel-inner > .item > a > img { + line-height: 1; +} +.carousel-inner > .active, +.carousel-inner > .next, +.carousel-inner > .prev { + display: block; +} +.carousel-inner > .active { + left: 0; +} +.carousel-inner > .next, +.carousel-inner > .prev { + position: absolute; + top: 0; + width: 100%; +} +.carousel-inner > .next { + left: 100%; +} +.carousel-inner > .prev { + left: -100%; +} +.carousel-inner > .next.left, +.carousel-inner > .prev.right { + left: 0; +} +.carousel-inner > .active.left { + left: -100%; +} +.carousel-inner > .active.right { + left: 100%; +} +.carousel-control { + position: absolute; + top: 0; + bottom: 0; + left: 0; + width: 15%; + font-size: 20px; + color: #fff; + text-align: center; + text-shadow: 0 1px 2px rgba(0, 0, 0, .6); + filter: alpha(opacity=50); + opacity: .5; +} +.carousel-control.left { + background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, .5) 0%), color-stop(rgba(0, 0, 0, .0001) 100%)); + background-image: linear-gradient(to right, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1); + background-repeat: repeat-x; +} +.carousel-control.right { + right: 0; + left: auto; + background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, .0001) 0%), color-stop(rgba(0, 0, 0, .5) 100%)); + background-image: linear-gradient(to right, rgba(0, 0, 0, .0001) 0%, rgba(0, 0, 0, .5) 100%); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1); + background-repeat: repeat-x; +} +.carousel-control:hover, +.carousel-control:focus { + color: #fff; + text-decoration: none; + filter: alpha(opacity=90); + outline: none; + opacity: .9; +} +.carousel-control .icon-prev, +.carousel-control .icon-next, +.carousel-control .glyphicon-chevron-left, +.carousel-control .glyphicon-chevron-right { + position: absolute; + top: 50%; + z-index: 5; + display: inline-block; +} +.carousel-control .icon-prev, +.carousel-control .glyphicon-chevron-left { + left: 50%; +} +.carousel-control .icon-next, +.carousel-control .glyphicon-chevron-right { + right: 50%; +} +.carousel-control .icon-prev, +.carousel-control .icon-next { + width: 20px; + height: 20px; + margin-top: -10px; + margin-left: -10px; + font-family: serif; +} +.carousel-control .icon-prev:before { + content: '\2039'; +} +.carousel-control .icon-next:before { + content: '\203a'; +} +.carousel-indicators { + position: absolute; + bottom: 10px; + left: 50%; + z-index: 15; + width: 60%; + padding-left: 0; + margin-left: -30%; + text-align: center; + list-style: none; +} +.carousel-indicators li { + display: inline-block; + width: 10px; + height: 10px; + margin: 1px; + text-indent: -999px; + cursor: pointer; + background-color: #000 \9; + background-color: rgba(0, 0, 0, 0); + border: 1px solid #fff; + border-radius: 10px; +} +.carousel-indicators .active { + width: 12px; + height: 12px; + margin: 0; + background-color: #fff; +} +.carousel-caption { + position: absolute; + right: 15%; + bottom: 20px; + left: 15%; + z-index: 10; + padding-top: 20px; + padding-bottom: 20px; + color: #fff; + text-align: center; + text-shadow: 0 1px 2px rgba(0, 0, 0, .6); +} +.carousel-caption .btn { + text-shadow: none; +} +@media screen and (min-width: 768px) { + .carousel-control .glyphicon-chevron-left, + .carousel-control .glyphicon-chevron-right, + .carousel-control .icon-prev, + .carousel-control .icon-next { + width: 30px; + height: 30px; + margin-top: -15px; + margin-left: -15px; + font-size: 30px; + } + .carousel-caption { + right: 20%; + left: 20%; + padding-bottom: 30px; + } + .carousel-indicators { + bottom: 20px; + } +} +.clearfix:before, +.clearfix:after, +.container:before, +.container:after, +.container-fluid:before, +.container-fluid:after, +.row:before, +.row:after, +.form-horizontal .form-group:before, +.form-horizontal .form-group:after, +.btn-toolbar:before, +.btn-toolbar:after, +.btn-group-vertical > .btn-group:before, +.btn-group-vertical > .btn-group:after, +.nav:before, +.nav:after, +.navbar:before, +.navbar:after, +.navbar-header:before, +.navbar-header:after, +.navbar-collapse:before, +.navbar-collapse:after, +.pager:before, +.pager:after, +.panel-body:before, +.panel-body:after, +.modal-footer:before, +.modal-footer:after { + display: table; + content: " "; +} +.clearfix:after, +.container:after, +.container-fluid:after, +.row:after, +.form-horizontal .form-group:after, +.btn-toolbar:after, +.btn-group-vertical > .btn-group:after, +.nav:after, +.navbar:after, +.navbar-header:after, +.navbar-collapse:after, +.pager:after, +.panel-body:after, +.modal-footer:after { + clear: both; +} +.center-block { + display: block; + margin-right: auto; + margin-left: auto; +} +.pull-right { + float: right !important; +} +.pull-left { + float: left !important; +} +.hide { + display: none !important; +} +.show { + display: block !important; +} +.invisible { + visibility: hidden; +} +.text-hide { + font: 0/0 a; + color: transparent; + text-shadow: none; + background-color: transparent; + border: 0; +} +.hidden { + display: none !important; + visibility: hidden !important; +} +.affix { + position: fixed; +} +@-ms-viewport { + width: device-width; +} +.visible-xs, +.visible-sm, +.visible-md, +.visible-lg { + display: none !important; +} +@media (max-width: 767px) { + .visible-xs { + display: block !important; + } + table.visible-xs { + display: table; + } + tr.visible-xs { + display: table-row !important; + } + th.visible-xs, + td.visible-xs { + display: table-cell !important; + } +} +@media (min-width: 768px) and (max-width: 991px) { + .visible-sm { + display: block !important; + } + table.visible-sm { + display: table; + } + tr.visible-sm { + display: table-row !important; + } + th.visible-sm, + td.visible-sm { + display: table-cell !important; + } +} +@media (min-width: 992px) and (max-width: 1199px) { + .visible-md { + display: block !important; + } + table.visible-md { + display: table; + } + tr.visible-md { + display: table-row !important; + } + th.visible-md, + td.visible-md { + display: table-cell !important; + } +} +@media (min-width: 1200px) { + .visible-lg { + display: block !important; + } + table.visible-lg { + display: table; + } + tr.visible-lg { + display: table-row !important; + } + th.visible-lg, + td.visible-lg { + display: table-cell !important; + } +} +@media (max-width: 767px) { + .hidden-xs { + display: none !important; + } +} +@media (min-width: 768px) and (max-width: 991px) { + .hidden-sm { + display: none !important; + } +} +@media (min-width: 992px) and (max-width: 1199px) { + .hidden-md { + display: none !important; + } +} +@media (min-width: 1200px) { + .hidden-lg { + display: none !important; + } +} +.visible-print { + display: none !important; +} +@media print { + .visible-print { + display: block !important; + } + table.visible-print { + display: table; + } + tr.visible-print { + display: table-row !important; + } + th.visible-print, + td.visible-print { + display: table-cell !important; + } +} +@media print { + .hidden-print { + display: none !important; + } +} +/*# sourceMappingURL=bootstrap.css.map */ diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/charts.html b/templates/js/libs/angular-chart.js-0.7.2/examples/charts.html new file mode 100644 index 0000000..b9e141b --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/charts.html @@ -0,0 +1,462 @@ + + + + + Charts + + + + + + + +
+
+
+ + Angular Charts +
+ + +
+
+
+
+ +
+

+ Angular Chart +

+ +

Reactive, responsive, beautiful charts for AngularJS based on Chart.js

+ +

+ Code on Github + + Download (0.7.2) + +

+
+
+
+
+
+
+

Getting started

+
+

Dependencies

+

+ This repository contains a set of native AngularJS directives for Chart.js. The only required dependencies are: +

+
    +
  • AngularJS (tested with 1.2.20 and 1.3.10 although it probably works with older versions)
    • +
  • Chart.js (requires Chart.js 1.0, tested with version 1.0.1-beta.2, 1.0.1-beta.4, and and 1.0.1).
    • +
+

Files to download

+

+ The easiest is to download with bower: + 

bower install angular-chart.js --save
+ Alternatively files can be downloaded downloaded from Github. +

+

Whichever method you choose the good news is that the overall size is very small: + <5kb for all directives (~1kb with gzip compression!)

+

Installation

+ 

<script src="bower_components/dist/angular-chart.js"></script>
+

As soon as you've got all the files downloaded and included in your page you just need to declare + a dependency on the chart.js module:
+ 

angular.module('myModule', ['chart.js']);
+

+

CSS

+

You need to include a link to the css file in your page.

+ 

<link rel="stylesheet" href="bower_components/dist/angular-chart.css">
+

+

Colours

+

Series have beautiful pre-sets colours (to a maximum of 7 series, after that colours will be randomly generated). + They can be overwritten using Chart.defaults.global.colours.

+
    +
  1. Blue
    2. +
  2. Light grey
    3. +
  3. Red
    4. +
  4. Green
    5. +
  5. Yellow
    6. +
  6. Grey
    7. +
  7. Dark Grey
    8. +
+
+
+
+

Directives

+
+
+
+
+
Line Chart
+
+ +
+
+
+
+ + +
+ .chart-line +
    +
  • data: series data
    • +
  • labels: x axis labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • series (default: []): series labels
    • +
  • click (optional): onclick event handler
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="line" class="chart chart-line" data="data"
+  labels="labels" legend="true" series="series"
+  click="onClick">
+</canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("LineCtrl", function ($scope) {
+
+  $scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
+  $scope.series = ['Series A', 'Series B'];
+  $scope.data = [
+    [65, 59, 80, 81, 56, 55, 40],
+    [28, 48, 40, 19, 86, 27, 90]
+  ];
+  $scope.onClick = function (points, evt) {
+    console.log(points, evt);
+  };
+});
+
+ + +
+
+
+
+ + +
+ .chart-bar +
    +
  • data: series data
    • +
  • labels: x axis labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • series (default: []): series labels
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="bar" class="chart chart-bar" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope) {
+  $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
+  $scope.series = ['Series A', 'Series B'];
+
+  $scope.data = [
+    [65, 59, 80, 81, 56, 55, 40],
+    [28, 48, 40, 19, 86, 27, 90]
+  ];
+});
+
+ + +
+
+
+
Bar Chart
+
+ +
+
+
+
+
+
+
+
Doughnut Chart
+
+ +
+
+
+
+ + +
+ .chart-doughnut +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="doughnut" class="chart chart-doughnut" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("DoughnutCtrl", function ($scope) {
+  $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"];
+  $scope.data = [300, 500, 100];
+});
+
+ + +
+
+
+
+ + +
+ .chart-radar +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • series (default: []): series labels
    • +
  • click (optional): onclick event handler
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="radar" class="chart chart-radar" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("RadarCtrl", function ($scope) {
+  $scope.labels =["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"];
+
+  $scope.data = [
+    [65, 59, 90, 81, 56, 55, 40],
+    [28, 48, 40, 19, 96, 27, 100]
+  ];
+});
+
+ + +
+
+
+
Radar Chart
+
+ +
+
+
+
+
+
+
+
Pie Chart
+
+ +
+
+
+
+ + +
+ .chart-pie +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="pie" class="chart chart-pie" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("PieCtrl", function ($scope) {
+  $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"];
+  $scope.data = [300, 500, 100];
+});
+
+ + +
+
+
+
+ + +
+ .chart-polar-area +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="polar-area" class="chart chart-polar-area" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("PolarAreaCtrl", function ($scope) {
+  $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales", "Tele Sales", "Corporate Sales"];
+  $scope.data = [300, 500, 100, 40, 120];
+});
+
+ + +
+
+
+
Polar Area Chart
+
+ +
+
+
+
+
+
+
+
Dynamic Chart
+
+ +
+
+ +
+
+ + +
+ .chart-base +
    +
  • chart-type: chart type e.g. Bar, PolarArea, etc. or other plugins
    • +
  • other options according to chart type
    • +
+
+ + + 
<canvas id="base" class="chart-base" chart-type="type" data="data"
+  labels="labels" legend="true"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("BaseCtrl",
+  function ($scope) {
+    $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales", "Tele Sales", "Corporate Sales"];
+    $scope.data = [300, 500, 100, 40, 120];
+    $scope.type = 'PolarArea';
+
+    $scope.toggle = function () {
+      $scope.type = $scope.type === 'PolarArea' ?
+        'Pie' : 'PolarArea';
+    };
+});
+
+ + +
+
+
+
+
+

Reactive

+

All charts are reactive and will update automatically when data changes.

+
+
+
+
+
Chart Data
+
+ + + + + + + +
{{label}}
{{data[$parent.$index][$index]}}
+ +
+
+
+
+
+
Reactive Chart
+
+ +
+
+
+
+
+
+ + + + + + + + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/charts.template.html b/templates/js/libs/angular-chart.js-0.7.2/examples/charts.template.html new file mode 100644 index 0000000..9850286 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/charts.template.html @@ -0,0 +1,462 @@ + + + + + Charts + + + + + + + +
+
+
+ + Angular Charts +
+ + +
+
+
+
+ +
+

+ Angular Chart +

+ +

Reactive, responsive, beautiful charts for AngularJS based on Chart.js

+ +

+ Code on Github + + Download () + +

+
+
+
+
+
+
+

Getting started

+
+

Dependencies

+

+ This repository contains a set of native AngularJS directives for Chart.js. The only required dependencies are: +

+
    +
  • AngularJS (tested with 1.2.20 and 1.3.10 although it probably works with older versions)
    • +
  • Chart.js (requires Chart.js 1.0, tested with version 1.0.1-beta.2, 1.0.1-beta.4, and and 1.0.1).
    • +
+

Files to download

+

+ The easiest is to download with bower: + 

bower install angular-chart.js --save
+ Alternatively files can be downloaded downloaded from Github. +

+

Whichever method you choose the good news is that the overall size is very small: + <5kb for all directives (~1kb with gzip compression!)

+

Installation

+ 

<script src="bower_components/dist/angular-chart.js"></script>
+

As soon as you've got all the files downloaded and included in your page you just need to declare + a dependency on the chart.js module:
+ 

angular.module('myModule', ['chart.js']);
+

+

CSS

+

You need to include a link to the css file in your page.

+ 

<link rel="stylesheet" href="bower_components/dist/angular-chart.css">
+

+

Colours

+

Series have beautiful pre-sets colours (to a maximum of 7 series, after that colours will be randomly generated). + They can be overwritten using Chart.defaults.global.colours.

+
    +
  1. Blue
    2. +
  2. Light grey
    3. +
  3. Red
    4. +
  4. Green
    5. +
  5. Yellow
    6. +
  6. Grey
    7. +
  7. Dark Grey
    8. +
+
+
+
+

Directives

+
+
+
+
+
Line Chart
+
+ +
+
+
+
+ + +
+ .chart-line +
    +
  • data: series data
    • +
  • labels: x axis labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • series (default: []): series labels
    • +
  • click (optional): onclick event handler
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="line" class="chart chart-line" data="data"
+  labels="labels" legend="true" series="series"
+  click="onClick">
+</canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("LineCtrl", function ($scope) {
+
+  $scope.labels = ["January", "February", "March", "April", "May", "June", "July"];
+  $scope.series = ['Series A', 'Series B'];
+  $scope.data = [
+    [65, 59, 80, 81, 56, 55, 40],
+    [28, 48, 40, 19, 86, 27, 90]
+  ];
+  $scope.onClick = function (points, evt) {
+    console.log(points, evt);
+  };
+});
+
+ + +
+
+
+
+ + +
+ .chart-bar +
    +
  • data: series data
    • +
  • labels: x axis labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • series (default: []): series labels
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="bar" class="chart chart-bar" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope) {
+  $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
+  $scope.series = ['Series A', 'Series B'];
+
+  $scope.data = [
+    [65, 59, 80, 81, 56, 55, 40],
+    [28, 48, 40, 19, 86, 27, 90]
+  ];
+});
+
+ + +
+
+
+
Bar Chart
+
+ +
+
+
+
+
+
+
+
Doughnut Chart
+
+ +
+
+
+
+ + +
+ .chart-doughnut +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="doughnut" class="chart chart-doughnut" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("DoughnutCtrl", function ($scope) {
+  $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"];
+  $scope.data = [300, 500, 100];
+});
+
+ + +
+
+
+
+ + +
+ .chart-radar +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • series (default: []): series labels
    • +
  • click (optional): onclick event handler
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="radar" class="chart chart-radar" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("RadarCtrl", function ($scope) {
+  $scope.labels =["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"];
+
+  $scope.data = [
+    [65, 59, 90, 81, 56, 55, 40],
+    [28, 48, 40, 19, 96, 27, 100]
+  ];
+});
+
+ + +
+
+
+
Radar Chart
+
+ +
+
+
+
+
+
+
+
Pie Chart
+
+ +
+
+
+
+ + +
+ .chart-pie +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="pie" class="chart chart-pie" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("PieCtrl", function ($scope) {
+  $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales"];
+  $scope.data = [300, 500, 100];
+});
+
+ + +
+
+
+
+ + +
+ .chart-polar-area +
    +
  • data: series data
    • +
  • labels: series labels
    • +
  • legend (default: false): show legend below the chart
    • +
  • options (default: {}): Chart.js options
    • +
  • colours (default to global colours): colours for the chart
    • +
+
+ + + 
<canvas id="polar-area" class="chart chart-polar-area" data="data"
+  labels="labels"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("PolarAreaCtrl", function ($scope) {
+  $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales", "Tele Sales", "Corporate Sales"];
+  $scope.data = [300, 500, 100, 40, 120];
+});
+
+ + +
+
+
+
Polar Area Chart
+
+ +
+
+
+
+
+
+
+
Dynamic Chart
+
+ +
+
+ +
+
+ + +
+ .chart-base +
    +
  • chart-type: chart type e.g. Bar, PolarArea, etc. or other plugins
    • +
  • other options according to chart type
    • +
+
+ + + 
<canvas id="base" class="chart-base" chart-type="type" data="data"
+  labels="labels" legend="true"></canvas>
+ + + 
angular.module("app", ["chart.js"]).controller("BaseCtrl",
+  function ($scope) {
+    $scope.labels = ["Download Sales", "In-Store Sales", "Mail-Order Sales", "Tele Sales", "Corporate Sales"];
+    $scope.data = [300, 500, 100, 40, 120];
+    $scope.type = 'PolarArea';
+
+    $scope.toggle = function () {
+      $scope.type = $scope.type === 'PolarArea' ?
+        'Pie' : 'PolarArea';
+    };
+});
+
+ + +
+
+
+
+
+

Reactive

+

All charts are reactive and will update automatically when data changes.

+
+
+
+
+
Chart Data
+
+ + + + + + + +
{{label}}
{{data[$parent.$index][$index]}}
+ +
+
+
+
+
+
Reactive Chart
+
+ +
+
+
+
+
+
+ + + + + + + + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/smoothscroll.min.js b/templates/js/libs/angular-chart.js-0.7.2/examples/smoothscroll.min.js new file mode 100644 index 0000000..631953c --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/smoothscroll.min.js @@ -0,0 +1 @@ +window.smoothScroll=function(){if(document.querySelectorAll===void 0||window.pageYOffset===void 0||history.pushState===void 0){return}var e=function(e){if(e.nodeName==="HTML")return-window.pageYOffset;return e.getBoundingClientRect().top+window.pageYOffset};var t=function(e){return e<.5?4*e*e*e:(e-1)*(2*e-2)*(2*e-2)+1};var n=function(e,n,r,i){if(r>i)return n;return e+(n-e)*t(r/i)};var r=function(t,r,i){r=r||500;var s=window.pageYOffset;if(typeof t==="number"){var o=parseInt(t)}else{var o=e(t)}var u=Date.now();var a=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||function(e){window.setTimeout(e,15)};var f=function(){var e=Date.now()-u;window.scroll(0,n(s,o,e,r));if(e>r){if(typeof i==="function"){i(t)}}else{a(f)}};f()};var i=function(e){e.preventDefault();if(location.hash!==this.hash)window.history.pushState(null,null,this.hash);r(document.getElementById(this.hash.substring(1)),500,function(e){location.replace("#"+e.id)})};document.addEventListener("DOMContentLoaded",function(){var e=document.querySelectorAll('a[href^="#"]'),t;for(var n=e.length;t=e[--n];){t.addEventListener("click",i,false)}});return r}() diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/stacked-bars-directive.html b/templates/js/libs/angular-chart.js-0.7.2/examples/stacked-bars-directive.html new file mode 100644 index 0000000..bec90e8 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/stacked-bars-directive.html @@ -0,0 +1,39 @@ + + + + + Stacked Bar chart + + + + +
+
+
+
+
+
+
Stacked Bar Chart
+
+ +
+
+
+
+
+ + + + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/stacked-bars.html b/templates/js/libs/angular-chart.js-0.7.2/examples/stacked-bars.html new file mode 100644 index 0000000..dbcca28 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/stacked-bars.html @@ -0,0 +1,32 @@ + + + + + Stacked Bar chart + + + + +
+
+
+
+
+
+
Stacked Bar Chart
+
+ +
+
+
+
+
+ + + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/tables.html b/templates/js/libs/angular-chart.js-0.7.2/examples/tables.html new file mode 100644 index 0000000..4c0296c --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/tables.html @@ -0,0 +1,46 @@ + + + + + Data tables + + + + +
+
+
+
+
+
Chart Data
+
+ + + + + + + +
{{label}}
{{data[$parent.$index][$index]}}
+ +
+
+
+
+
+
Reactive Chart
+
+ +
+
+
+
+
+ + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/examples/ticks.html b/templates/js/libs/angular-chart.js-0.7.2/examples/ticks.html new file mode 100644 index 0000000..0355cb6 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/examples/ticks.html @@ -0,0 +1,30 @@ + + + + + Realtime ticks + + + + +
+
+
+
+
+
Ticks Chart
+
+ +
+
+
+
+
+ + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/gulpfile.js b/templates/js/libs/angular-chart.js-0.7.2/gulpfile.js new file mode 100644 index 0000000..bdbbe02 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/gulpfile.js @@ -0,0 +1,135 @@ +(function () { + 'use strict'; + + var gulp = require('gulp'); + var less = require('gulp-less'); + var sourcemaps = require('gulp-sourcemaps'); + var uglify = require('gulp-uglify'); + var csso = require('gulp-csso'); + var jshint = require('gulp-jshint'); + var stylish = require('jshint-stylish'); + var jscs = require('gulp-jscs'); + var mocha = require('gulp-spawn-mocha'); + var tar = require('gulp-tar'); + var gzip = require('gulp-gzip'); + var bumper = require('gulp-bump'); + var git = require('gulp-git'); + var shell = require('gulp-shell'); + var rename = require('gulp-rename'); + var fs = require('fs'); + var sequence = require('gulp-sequence'); + var ngAnnotate = require('gulp-ng-annotate'); + + gulp.task('less', function () { + return gulp.src('./*.less') + .pipe(sourcemaps.init()) + .pipe(less()) + .pipe(csso()) + .pipe(sourcemaps.write('./')) + .pipe(gulp.dest('./dist')); + }); + + gulp.task('lint', function () { + return gulp.src('**/*.js') + .pipe(jshint()) + .pipe(jshint.reporter(stylish)); + }); + + gulp.task('style', function () { + return gulp.src('**/*.js') + .pipe(jscs()); + }); + + gulp.task('unit', shell.task([ + ' ./node_modules/mocha-phantomjs/bin/mocha-phantomjs -R spec test/index.html ' + ])); + + gulp.task('integration', function () { + return gulp.src('test/test.integration.js', {read: false}) + .pipe(mocha({ reporter: 'list', timeout: 10000, require: 'test/support/setup.js' })); + }); + + gulp.task('bump-patch', bump('patch')); + gulp.task('bump-minor', bump('minor')); + gulp.task('bump-major', bump('major')); + + gulp.task('bower', function () { + return gulp.src('./angular-chart.js') + .pipe(ngAnnotate({single_quotes: true})) + .pipe(gulp.dest('./dist')); + }); + + gulp.task('js', ['lint', 'style', 'bower'], function () { + return gulp.src('./angular-chart.js') + .pipe(rename('angular-chart.min.js')) + .pipe(ngAnnotate({single_quotes: true})) + .pipe(sourcemaps.init()) + .pipe(uglify()) + .pipe(sourcemaps.write('./')) + .pipe(gulp.dest('./dist')); + }); + + gulp.task('build', function () { + return gulp.src(['dist/*', '!./dist/*.tar.gz']) + .pipe(tar('angular-chart.js.tar')) + .pipe(gzip({ gzipOptions: { level: 9 } })) + .pipe(gulp.dest('dist/')); + }); + + gulp.task('update', function (cb) { + fs.readFile('./examples/charts.template.html', 'utf8', function (err, file) { + if (err) return cb(err); + file = file.replace('', version()); + fs.writeFile('./examples/charts.html', file, cb); + }); + }); + + gulp.task('git-commit', function () { + var v = version(); + gulp.src(['./dist/*', './package.json', './bower.json', './examples/charts.html']) + .pipe(git.add()) + .pipe(git.commit(v)) + ; + }); + + gulp.task('git-push', function (cb) { + var v = version(); + git.push('origin', 'master', function (err) { + if (err) return cb(err); + git.tag(v, v, function (err) { + if (err) return cb(err); + git.push('origin', 'master', {args: '--tags' }, cb); + }); + }); + }); + + gulp.task('npm', shell.task([ + 'npm publish' + ])); + + gulp.task('watch', function () { + gulp.watch('./*.js', ['js']); + gulp.watch('./*.less', ['less']); + return true; + }); + + function bump (level) { + return function () { + return gulp.src(['./package.json', './bower.json']) + .pipe(bumper({type: level})) + .pipe(gulp.dest('./')); + }; + } + + function version () { + return JSON.parse(fs.readFileSync('package.json', 'utf8')).version; + } + + gulp.task('default', sequence('check', ['less', 'js'], 'build')); + gulp.task('test', sequence('unit', 'integration')); + gulp.task('check', sequence(['lint', 'style'], 'test')); + gulp.task('deploy-patch', sequence('default', 'bump-patch', 'update', 'git-commit', 'git-push', 'npm')); + gulp.task('deploy-minor', sequence('default', 'bump-minor', 'update', 'git-commit', 'git-push', 'npm')); + gulp.task('deploy-major', sequence('default', 'bump-patch', 'update', 'git-commit', 'git-push', 'npm')); + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/package.json b/templates/js/libs/angular-chart.js-0.7.2/package.json new file mode 100644 index 0000000..53cc23a --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/package.json @@ -0,0 +1,51 @@ +{ + "name": "angular-chart.js", + "version": "0.7.2", + "description": "An angular.js wrapper for Chart.js", + "main": "dist/angular-chart.js", + "directories": { + "example": "examples" + }, + "scripts": { + "test": "gulp check" + }, + "author": "Jerome Touffe-Blin ", + "repository": { + "type": "git", + "url": "git://github.com/jtblin/angular-chart.js.git" + }, + "license": "BSD", + "devDependencies": { + "chai": "^1.10.0", + "chai-string": "^1.1.1", + "cp": "^0.2.0", + "gm": "^1.17.0", + "gulp": "^3.8.6", + "gulp-bump": "^0.1.11", + "gulp-csso": "^0.2.9", + "gulp-git": "^0.5.6", + "gulp-gzip": "0.0.8", + "gulp-jscs": "^1.4.0", + "gulp-jshint": "^1.9.2", + "gulp-less": "^1.3.1", + "gulp-ng-annotate": "^0.5.2", + "gulp-rename": "^1.2.0", + "gulp-sequence": "^0.3.1", + "gulp-shell": "^0.2.11", + "gulp-sourcemaps": "^1.0.0", + "gulp-spawn-mocha": "^2.0.1", + "gulp-tar": "^0.5.0", + "gulp-uglify": "^0.3.1", + "imgur-node-api": "^0.1.0", + "jshint-stylish": "^1.0.0", + "less": "^1.7.3", + "mkdirp": "^0.5.0", + "mocha": "^2.1.0", + "mocha-phantomjs": "^3.5.3", + "sinon": "^1.12.2", + "sinon-chai": "^2.7.0", + "testatic": "^0.1.0", + "tmp-sync": "jtblin/node-tmp-sync", + "webshot": "^0.15.3" + } +} diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.html b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.html new file mode 100644 index 0000000..5064fec --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.html @@ -0,0 +1,36 @@ + + + + + Pie update colours + + + + +
+
+
+

Charts

+
+
+
+
+
Pie Chart
+
+ +
+

+ https://github.com/jtblin/angular-chart.js/issues/51 +

+
+
+
+
+
+ + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.js b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.js new file mode 100644 index 0000000..784fbbf --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.js @@ -0,0 +1,30 @@ +(function () { + 'use strict'; + + var app = angular.module('pie', ['chart.js']); + app.controller('PieCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['Series A', 'Series B']; + $scope.data = [65, 59]; + $scope.colours = [{ // red + fillColor: 'rgba(247,70,74,0.2)', + strokeColor: 'rgba(247,70,74,1)', + pointColor: 'rgba(247,70,74,1)', + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(247,70,74,0.8)' + }, + { // green + fillColor: 'rgba(70,191,189,0.2)', + strokeColor: 'rgba(70,191,189,1)', + pointColor: 'rgba(70,191,189,1)', + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(70,191,189,0.8)' + }]; + + $timeout(function () { + $scope.data = [49, 65]; + }, 0); + }]); + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.png b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.png new file mode 100644 index 0000000..86b7d88 Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/51-pie-update-colours.png differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.html b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.html new file mode 100644 index 0000000..82ac4e6 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.html @@ -0,0 +1,37 @@ + + + + + Not enough colours + + + + +
+
+
+

Charts

+
+
+
+
+
Pie Chart
+
+ +
+

+ https://github.com/jtblin/angular-chart.js/issues/54 +

+
+
+
+
+
+ + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.js b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.js new file mode 100644 index 0000000..b8601d6 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.js @@ -0,0 +1,32 @@ +(function () { + 'use strict'; + + var app = angular.module('pie', ['chart.js']); + app.controller('PieCtrl', ['$scope', function ($scope) { + var cnt = 0; + $scope.colours = []; + $scope.labels = ['Series A', 'Series B']; + $scope.getColour = function () { + return ++cnt % 2 > 0 ? + { // red + fillColor: 'rgba(247,70,74,0.2)', + strokeColor: 'rgba(247,70,74,1)', + pointColor: 'rgba(247,70,74,1)', + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(247,70,74,0.8)' + } + : + { // green + fillColor: 'rgba(70,191,189,0.2)', + strokeColor: 'rgba(70,191,189,1)', + pointColor: 'rgba(70,191,189,1)', + pointStrokeColor: '#fff', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(70,191,189,0.8)' + }; + }; + $scope.data = [49, 65]; + }]); + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.png b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.png new file mode 100644 index 0000000..86b7d88 Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/54-not-enough-colours.png differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.html b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.html new file mode 100644 index 0000000..143a59e --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.html @@ -0,0 +1,36 @@ + + + + + Hex colours + + + + +
+
+
+

Charts

+
+
+
+
+
Pie Chart
+
+ +
+

+ https://github.com/jtblin/angular-chart.js/issues/57 +

+
+
+
+
+
+ + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.js b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.js new file mode 100644 index 0000000..a6d9d02 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.js @@ -0,0 +1,11 @@ +(function () { + 'use strict'; + + var app = angular.module('pie', ['chart.js']); + app.controller('PieCtrl', ['$scope', function ($scope) { + $scope.labels = ['Series A', 'Series B']; + $scope.colours = ['#9AFEFF', '#D1D0CE']; + $scope.data = [49, 65]; + }]); + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.png b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.png new file mode 100644 index 0000000..fb1c382 Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/57-hex-colours.png differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.html b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.html new file mode 100644 index 0000000..aef98b2 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.html @@ -0,0 +1,78 @@ + + + + + Charts + + + + +
+
+
+

Charts

+
+
+
+
+
Line Chart
+
+ +
+
+
+
+
+
Bar Chart
+
+ +
+
+
+
+
+
Doughnut Chart
+
+ +
+
+
+
+
+
+
+
Radar Chart
+
+ +
+
+
+
+
+
Pie Chart
+
+ +
+
+
+
+
+
Polar Area Chart
+
+ +
+
+
+
+
+
+
+
+ + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.js b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.js new file mode 100644 index 0000000..ed9813d --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.js @@ -0,0 +1,61 @@ +(function () { + 'use strict'; + + var app = angular.module('charts', ['chart.js']); + + app.controller('LineCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + $scope.series = ['Series A', 'Series B']; + $scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + $timeout(function () { + $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + $scope.data = [ + [28, 48, 40, 19, 86, 27, 90], + [65, 59, 80, 81, 56, 55, 40] + ]; + $scope.series = ['Series C', 'Series D']; + }, 0); + }]); + + app.controller('BarCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.options = { scaleShowVerticalLines: false }; + $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012']; + $scope.series = ['Series A', 'Series B']; + $scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + $timeout(function () { + $scope.options = { scaleShowVerticalLines: true }; + }, 0); + }]); + + app.controller('DoughnutCtrl', function ($scope) { + $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail-Order Sales']; + $scope.data = [350, 450, 100]; + }); + + app.controller('PieCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail Sales']; + $scope.data = [0, 0, 0]; + $timeout(function () { + $scope.data = [350, 450, 100]; + }, 0); + }]); + + app.controller('PolarAreaCtrl', function ($scope) { + $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail Sales', 'Telesales', 'Corporate Sales']; + $scope.data = [300, 500, 100, 40, 120]; + }); + + app.controller('RadarCtrl', function ($scope) { + $scope.labels = ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running']; + $scope.data = [ + [65, 59, 90, 81, 56, 55, 40], + [28, 48, 40, 19, 96, 27, 100] + ]; + }); +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.png b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.png new file mode 100644 index 0000000..cdbbbee Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/charts.png differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.html b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.html new file mode 100644 index 0000000..21b220f --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.html @@ -0,0 +1,33 @@ + + + + + Pie update colours + + + + +
+
+
+

Charts

+
+
+
+
+
Line Chart
+
+ +
+
+
+
+
+
+ + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.js b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.js new file mode 100644 index 0000000..ffde2f7 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.js @@ -0,0 +1,32 @@ +(function () { + 'use strict'; + + var app = angular.module('line', ['chart.js']); + + app.config(function (ChartJsProvider) { + // Configure all charts + ChartJsProvider.setOptions({ + colours: ['#FF5252', '#FF8A80'], + responsive: false + }); + // Configure all line charts + ChartJsProvider.setOptions('Line', { + datasetFill: false + }); + }); + + app.controller('LineCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['Series A', 'Series B']; + $scope.data = [[15, 23], [59, 80]]; + + // Configure only this instance + $scope.options = { + scaleLineWidth: 5 + }; + + $timeout(function () { + $scope.data = [[15, 23], [59, 80]]; + }, 0); + }]); + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.png b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.png new file mode 100644 index 0000000..fd047c3 Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/configure-line-chart.png differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.html b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.html new file mode 100644 index 0000000..9457779 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.html @@ -0,0 +1,33 @@ + + + + + Pie update colours + + + + +
+
+
+

Charts

+
+
+
+
+
Pie Chart
+
+ +
+
+
+
+
+
+ + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.js b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.js new file mode 100644 index 0000000..68c666f --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.js @@ -0,0 +1,17 @@ +(function () { + 'use strict'; + + var app = angular.module('pie', ['chart.js']); + + app.directive('mySpecialPie', function (ChartJsFactory) { return new ChartJsFactory('Pie'); }); + + app.controller('PieCtrl', ['$scope', '$timeout', function ($scope, $timeout) { + $scope.labels = ['Series A', 'Series B']; + $scope.data = [5, 59]; + + $timeout(function () { + $scope.data = [5, 65]; + }, 0); + }]); + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.png b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.png new file mode 100644 index 0000000..383cfcf Binary files /dev/null and b/templates/js/libs/angular-chart.js-0.7.2/test/fixtures/custom-directive.png differ diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/index.html b/templates/js/libs/angular-chart.js-0.7.2/test/index.html new file mode 100644 index 0000000..9c8ad6b --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/index.html @@ -0,0 +1,30 @@ + + + + Mocha Tests + + + +
+ + + + + + + + + + + + + + diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/mocha.opts b/templates/js/libs/angular-chart.js-0.7.2/test/mocha.opts new file mode 100644 index 0000000..0cfde2d --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/mocha.opts @@ -0,0 +1,4 @@ +--slow 20 +--growl +--reporter spec +--require test/support/setup diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/support/setup.js b/templates/js/libs/angular-chart.js-0.7.2/test/support/setup.js new file mode 100644 index 0000000..de98414 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/support/setup.js @@ -0,0 +1,11 @@ +/*jshint node:true*/ +(function () { + 'use strict'; + + var chai = require('chai'); + global.chai = chai; + global.should = chai.should(); + global.expect = chai.expect; + global.assert = chai.assert; + +})(); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/test.integration.js b/templates/js/libs/angular-chart.js-0.7.2/test/test.integration.js new file mode 100644 index 0000000..e694fc9 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/test.integration.js @@ -0,0 +1,69 @@ +/*jshint node:true*/ +/*jshint mocha:true*/ +/*global assert:true*/ +describe('integration', function () { + 'use strict'; + + var webshot = require('webshot'), + gm = require('gm'), + tmp = require('tmp-sync'), + mkdirp = require('mkdirp').sync, + cp = require('cp').sync, + imgur = require('imgur-node-api'), + server = require('testatic')(), + WEBSHOT_OPTIONS = { renderDelay: process.env.DELAY || 2500, windowSize: { width: 1366, height: 768 }}, + WEBSHOT_FAILED_DIR = 'test/fixtures/shots/', + dir; + + beforeEach(function () { + dir = tmp.in() + '/'; + }); + + afterEach(function () { + tmp.clean(); + }); + + after(function () { + server.close(); + }); + + mkdirp(WEBSHOT_FAILED_DIR); + + [ + '57-hex-colours', + '54-not-enough-colours', + '51-pie-update-colours', + 'configure-line-chart', + 'custom-directive', + 'charts' + ].forEach(function (name) { + it('compares screenshots for: ' + name, function (done) { + var image = dir + name + '.png', + url = 'http://localhost:8080/test/fixtures/' + name + '.html', + expected = 'test/fixtures/' + name + '.png'; + + webshot(url, image, WEBSHOT_OPTIONS, function (err) { + if (err) return done(err); + gm.compare(expected, image, process.env.TOLERANCE || 0.0001, function (err, isEqual) { + if (err) return done(err); + if (! isEqual) { + var failed = WEBSHOT_FAILED_DIR + name + '-failed.png', + msg = 'Expected screenshots to be similar. Screenshot saved to ' + failed; + cp(image, failed); + if (process.env.CI && process.env.IMGUR_ID) { + imgur.setClientID(process.env.IMGUR_ID); + imgur.upload(image, function (err, res) { + if (err) return done(err); + assert.fail(isEqual, true, msg + ', uploaded to ' + res.data.link); + }); + } else { + assert.fail(isEqual, true, msg); + } + return; + } + done(); + }); + }); + }); + }); +}); diff --git a/templates/js/libs/angular-chart.js-0.7.2/test/test.unit.js b/templates/js/libs/angular-chart.js-0.7.2/test/test.unit.js new file mode 100644 index 0000000..7e1e5b4 --- /dev/null +++ b/templates/js/libs/angular-chart.js-0.7.2/test/test.unit.js @@ -0,0 +1,372 @@ +/*jshint mocha:true*/ +/*global module:true*/ +/*global inject:true*/ +/*global expect:true*/ +/*global sinon:true*/ +describe('Unit testing', function () { + 'use strict'; + + var $compile, scope, sandbox, ChartJs, ChartJsProvider; + + beforeEach(module('chart.js', function (_ChartJsProvider_) { + ChartJsProvider = _ChartJsProvider_; + })); + + beforeEach(inject(function (_$compile_, _$rootScope_, _ChartJs_) { + // The injector unwraps the underscores (_) from around the parameter names when matching + $compile = _$compile_; + scope = _$rootScope_; + ChartJs = _ChartJs_; + sandbox = sinon.sandbox.create(); + })); + + afterEach(function () { + sandbox.restore(); + }); + + describe('base', function () { + it('replaces the element with the appropriate content', function () { + var markup = '
' + + '
'; + + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + + var element = $compile(markup)(scope); + scope.$digest(); + + expect(element.html()).to.startWith('
'; + + scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + + if (['Line', 'Bar', 'Radar'].indexOf(type) > - 1) + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + else + scope.data = [300, 500, 100]; + + var mock = sandbox.mock(Chart.prototype); + mock.expects(type); + + $compile(markup)(scope); + scope.$digest(); + + mock.verify(); + }); + + it('creates a ' + type + ' chart using the "chart-type" attribute"', function () { + var markup = '
' + + '
'; + + scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + scope.type = type; + + if (['Line', 'Bar', 'Radar'].indexOf(type) > - 1) + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + else + scope.data = [300, 500, 100]; + + var mock = sandbox.mock(Chart.prototype); + mock.expects(type); + + $compile(markup)(scope); + scope.$digest(); + + mock.verify(); + }); + }); + }); + + it('generates the legend', function () { + var markup = '
' + + '
'; + + scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + + var element = $compile(markup)(scope); + scope.$digest(); + + expect(element.html()).to.have.string(''); + }); + }); + + describe('lifecycle', function () { + it('watches the attributes of the chart', function () { + var markup = '
' + + '
'; + + scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + + var mock = sandbox.mock(scope); + // cannot get a hold of the child scope as it isn't created yet + // so cannot be more precise on expectations + mock.expects('$watch').atLeast(6); + + $compile(markup)(scope); + + mock.verify(); + }); + + it('creates the chart only once', function () { + var markup = '
' + + '
'; + var count = 0; + + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + scope.series = ['Series A', 'Series B']; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + scope.$on('create', function () { + count++; + }); + + $compile(markup)(scope); + scope.$digest(); + + expect(count).to.equal(1); + }); + + it('updates the chart', function () { + var markup = '
' + + '
'; + var count = 0; + + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + scope.series = ['Series A', 'Series B']; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + + scope.$on('update', function () { + count++; + }); + + $compile(markup)(scope); + scope.$digest(); + + scope.data = [ + [28, 48, 40, 19, 86, 27, 90], + [65, 59, 80, 81, 56, 55, 40] + ]; + scope.$digest(); + + expect(count).to.equal(1); + }); + + it('re-create the chart if data added or removed', function () { + var markup = '
' + + '
'; + var countCreate = 0, countUpdate = 0; + + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + + scope.$on('create', function () { + countCreate++; + }); + + scope.$on('update', function () { + countUpdate++; + }); + + $compile(markup)(scope); + scope.$digest(); + + scope.data = [ + [28, 48, 40, 19, 86, 27, 90], + [65, 59, 80, 81, 56, 55, 40], + [65, 59, 80, 81, 56, 55, 40] + ]; + scope.$digest(); + + expect(countCreate).to.equal(2); + expect(countUpdate).to.equal(0); + }); + + it('should allow to set a configuration', function () { + ChartJsProvider.setOptions({responsive: false}); + expect(ChartJs.getOptions().responsive).to.equal(false); + expect(ChartJs.getOptions('Line').responsive).to.equal(false); + ChartJsProvider.setOptions({responsive: true}); + expect(ChartJs.getOptions().responsive).to.equal(true); + expect(ChartJs.getOptions('Line').responsive).to.equal(true); + }); + + it('should allow to set a configuration for a chart type', function () { + ChartJsProvider.setOptions('Line', {responsive: false}); + expect(ChartJs.getOptions('Line').responsive).to.equal(false); + ChartJsProvider.setOptions('Line', {responsive: true}); + expect(ChartJs.getOptions('Line').responsive).to.equal(true); + }); + + ['labels', 'colours', 'series', 'options'].forEach(function (attr) { + it('re-creates the chart on ' + attr + ' changes', function () { + var markup = '
' + + '
'; + var count = 0; + + scope.options = { scaleShowVerticalLines: false }; + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + scope.series = ['Series A', 'Series B']; + scope.colours = [{ + fillColor: 'rgba(127,253,31,0.2)', + pointColor: 'rgba(127,253,31,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(127,253,31,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(127,253,31,1)' + }, { + fillColor: 'rgba(104,240,0,0.2)', + pointColor: 'rgba(104,240,0,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(104,240,0,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(104,240,0,1)' + }]; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + scope.$on('create', function () { + count++; + }); + + $compile(markup)(scope); + scope.$digest(); + + switch (attr) { + case 'labels': + scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + break; + case 'colours': + scope.colours = [{ + fillColor: 'rgba(253,31,94,0.2)', + pointColor: 'rgba(253,31,94,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(253,31,94,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(253,31,94,1)' + }, { + fillColor: 'rgba(30,249,161,0.2)', + pointColor: 'rgba(30,249,161,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(30,249,161,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(30,249,161,1)' + }]; + break; + case 'series': + scope.series = ['Series C', 'Series D']; + break; + case 'options': + scope.options = { scaleShowVerticalLines: true }; + break; + } + scope.$digest(); + + expect(count).to.equal(2); + }); + }); + + ['labels', 'colours', 'series', 'options'].forEach(function (attr) { + it('does not re-create the chart on ' + attr + ' not changed', function () { + var markup = '
' + + '
'; + var count = 0; + + scope.options = { scaleShowVerticalLines: false }; + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + scope.series = ['Series A', 'Series B']; + scope.colours = [{ + fillColor: 'rgba(127,253,31,0.2)', + pointColor: 'rgba(127,253,31,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(127,253,31,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(127,253,31,1)' + }, { + fillColor: 'rgba(104,240,0,0.2)', + pointColor: 'rgba(104,240,0,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(104,240,0,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(104,240,0,1)' + }]; + scope.data = [ + [65, 59, 80, 81, 56, 55, 40], + [28, 48, 40, 19, 86, 27, 90] + ]; + scope.$on('create', function () { + count++; + }); + + $compile(markup)(scope); + scope.$digest(); + + switch (attr) { + case 'labels': + scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July']; + break; + case 'colours': + scope.colours = [{ + fillColor: 'rgba(127,253,31,0.2)', + pointColor: 'rgba(127,253,31,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(127,253,31,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(127,253,31,1)' + }, { + fillColor: 'rgba(104,240,0,0.2)', + pointColor: 'rgba(104,240,0,1)', + pointHighlightFill: '#fff', + pointHighlightStroke: 'rgba(104,240,0,0.8)', + pointStrokeColor: '#fff', + strokeColor: 'rgba(104,240,0,1)' + }]; + break; + case 'series': + scope.series = ['Series A', 'Series B']; + break; + case 'options': + scope.options = { scaleShowVerticalLines: false }; + break; + } + scope.$digest(); + + expect(count).to.equal(1); + }); + }); + }); +}); diff --git a/templates/js/services/dataService.js b/templates/js/services/dataService.js new file mode 100644 index 0000000..af915c7 --- /dev/null +++ b/templates/js/services/dataService.js @@ -0,0 +1,21 @@ +var DEBUG = true; + +angular.module('seHub.services'). + +factory('dataService', ['$http', function($http) { + var scope = null; + + + return { + initService: function(mainScope) { + // this.token = user.seToken; + // this.user = user; + scope = mainScope; + }, + userBrodcast: function(user) { + scope.user = JSON.parse(JSON.stringify(user)); + } + + + }; +}]); \ No newline at end of file diff --git a/templates/views/home.html b/templates/views/home.html index 881bf23..b312bf7 100644 --- a/templates/views/home.html +++ b/templates/views/home.html @@ -3,7 +3,7 @@ - +
@@ -15,12 +15,59 @@

Welcome To SE-Hub

-

- This Is your Home Page -

+

Software Engineering Course Made Easy

+ v1.0
+ + + +
+ + + +

Messages

+ + In The Future Will Enter Wanted MESSAGES Text Here + + + +

Tasks

+ + +
+ For Task 3 Press: Task #3 +
=====================
+ For Task 4 Press: Task #4 +
+ + + +
+ + + + + + + + + + +
\ No newline at end of file diff --git a/templates/views/index.html b/templates/views/index.html index cd629d1..f1fef9e 100644 --- a/templates/views/index.html +++ b/templates/views/index.html @@ -6,6 +6,10 @@ + + + + @@ -79,8 +83,17 @@ + + + + + + + + + diff --git a/templates/views/settings.html b/templates/views/settings.html index 0c4b980..8121fb4 100644 --- a/templates/views/settings.html +++ b/templates/views/settings.html @@ -5,6 +5,112 @@

{{title}}

+
+
+ +
+ +
+
+ +
+
+ + {{profileMode}} + +
+
+
+ +
+
+

{{user.name}}

+
+
+ Email: {{user.email}} +
+
+ I Am a: {{(user.isLecturer) ? "Lecturer" : "Student"}} +
+
+ + +
+
+ + + + +
+
+ + + + +
+
+ + I Am a: {{(user.isLecturer) ? "Lecturer" : "Student"}} + +
+
+ + + +
+ +
+ +

My Classes

+
+
+
+
+ {{ person.name }} +
+
+ {{ course.courseName }} - IN {{course.campusName}} +
+
+
+ + X + +
+ +
+
+
+ +

My Campuses

+ +
+
+
+
+ {{ person.name }} +
+
+ {{ campus.title }} - +
+
+
+ + X + +
+ +
+
+
+ +
+ +
+ + + \ No newline at end of file