├── .gitignore ├── test ├── mocha.opts ├── fixtures │ ├── clock.js │ └── clock.html ├── support │ └── setup.js ├── index.html ├── test.integration.js └── test.unit.js ├── dist ├── angular-clock.js.tar.gz ├── angular-clock.css ├── angular-clock.css.map ├── angular-clock.min.js ├── angular-clock.js └── angular-clock.min.js.map ├── .jshintignore ├── demo ├── lib │ ├── fonts │ │ ├── fontawesome-webfont.eot │ │ ├── fontawesome-webfont.ttf │ │ └── fontawesome-webfont.woff │ ├── js │ │ ├── smoothscroll.min.js │ │ ├── generic.js │ │ ├── html.js │ │ ├── rainbow.min.js │ │ └── javascript.js │ └── css │ │ ├── github.css │ │ └── font-awesome.min.css ├── app.js └── app.css ├── .travis.yml ├── .vscode └── settings.json ├── .editorconfig ├── .gitattributes ├── .jshintrc ├── angular-clock.less ├── bower.json ├── package.json ├── .jscsrc ├── README.md ├── gulpfile.js ├── angular-clock.js └── index.html /.gitignore: -------------------------------------------------------------------------------- 1 | .idea/ 2 | node_modules/ 3 | test/fixtures/shots/ 4 | bower_components/ 5 | -------------------------------------------------------------------------------- /test/mocha.opts: -------------------------------------------------------------------------------- 1 | --slow 20 2 | --growl 3 | --reporter spec 4 | --require test/support/setup 5 | -------------------------------------------------------------------------------- /dist/angular-clock.js.tar.gz: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/deepu105/angular-clock/HEAD/dist/angular-clock.js.tar.gz -------------------------------------------------------------------------------- /.jshintignore: -------------------------------------------------------------------------------- 1 | bower_components/ 2 | node_modules/ 3 | dist/ 4 | tmp/ 5 | examples/smoothscroll.min.js 6 | demo/lib/ 7 | -------------------------------------------------------------------------------- /demo/lib/fonts/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/deepu105/angular-clock/HEAD/demo/lib/fonts/fontawesome-webfont.eot -------------------------------------------------------------------------------- /demo/lib/fonts/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/deepu105/angular-clock/HEAD/demo/lib/fonts/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /demo/lib/fonts/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/deepu105/angular-clock/HEAD/demo/lib/fonts/fontawesome-webfont.woff -------------------------------------------------------------------------------- /test/fixtures/clock.js: -------------------------------------------------------------------------------- 1 | (function () { 2 | 'use strict'; 3 | 4 | var app = angular.module('clocks', ['ds-clock']); 5 | 6 | app.controller('BaseCtrl', ['$scope', function ($scope) { 7 | 8 | }]); 9 | 10 | })(); 11 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | os: 2 | - linux 3 | language: node_js 4 | node_js: 5 | - "6.11.3" 6 | before_install: 7 | - npm -g install bower gulp-cli 8 | install: 9 | - npm install 10 | - bower install 11 | script: 12 | - gulp default 13 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "files.exclude": { 3 | ".idea/": "explorerExcludedFiles", 4 | "node_modules/": "explorerExcludedFiles", 5 | "test/fixtures/shots/": "explorerExcludedFiles", 6 | "bower_components/": "explorerExcludedFiles" 7 | } 8 | } -------------------------------------------------------------------------------- /test/support/setup.js: -------------------------------------------------------------------------------- 1 | /*jshint node:true*/ 2 | (function () { 3 | 'use strict'; 4 | 5 | var chai = require('chai'); 6 | global.chai = chai; 7 | global.should = chai.should(); 8 | global.expect = chai.expect; 9 | global.assert = chai.assert; 10 | 11 | })(); 12 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # This file is for unifying the coding style for different editors and IDEs 2 | # editorconfig.org 3 | 4 | root = true 5 | 6 | [*] 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | # Tabs in JS unless otherwise specified 13 | [**.js] 14 | indent_style = space 15 | indent_size = 2 16 | 17 | [*.md] 18 | trim_trailing_whitespace = false 19 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | 4 | # Custom for Visual Studio 5 | *.cs diff=csharp 6 | 7 | # Standard to msysgit 8 | *.doc diff=astextplain 9 | *.DOC diff=astextplain 10 | *.docx diff=astextplain 11 | *.DOCX diff=astextplain 12 | *.dot diff=astextplain 13 | *.DOT diff=astextplain 14 | *.pdf diff=astextplain 15 | *.PDF diff=astextplain 16 | *.rtf diff=astextplain 17 | *.RTF diff=astextplain 18 | -------------------------------------------------------------------------------- /demo/app.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | var app = angular.module('examples', ['ds.clock', 'ui.bootstrap']); 5 | 6 | app.controller('MenuCtrl', function($scope) { 7 | $scope.isCollapsed = true; 8 | }); 9 | 10 | 11 | 12 | app.controller('HeadCtrl', ['$scope', 13 | function($scope) { 14 | $scope.theme = 'blue-light'; 15 | $scope.digital = true; 16 | 17 | } 18 | ]); 19 | app.controller('BaseCtrl', ['$scope', 20 | function($scope) { 21 | $scope.gmtValue = 5.45; 22 | $scope.startTimeValue = 1430990693334; 23 | $scope.format = 'dd-MMM-yyyy hh:mm:ss a'; 24 | 25 | } 26 | ]); 27 | 28 | })(); 29 | -------------------------------------------------------------------------------- /dist/angular-clock.css: -------------------------------------------------------------------------------- 1 | .widget-clock .digital{text-align:center}.widget-clock .time{font-family:'Syncopate',sans-serif;font-size:2.5em;margin:0}.widget-clock .square{position:relative;width:100%;height:0;padding-bottom:100%}.widget-clock svg{position:absolute;width:100%;height:100%;left:0}.widget-clock .clock-face{stroke:#333;fill:#fff}.widget-clock .minor{stroke:#999;stroke-width:.5}.widget-clock .major{stroke:#333;stroke-width:1}.widget-clock .hour{stroke:#333}.widget-clock .minute{stroke:#666}.widget-clock .second{stroke:#1076ed}.widget-clock .second-counterweight{stroke:#1076ed;stroke-width:3}.widget-clock.dark .clock-face{fill:#111}.widget-clock.dark .hour{stroke:#666}.widget-clock.dark .minute{stroke:#999} 2 | /*# sourceMappingURL=angular-clock.css.map */ 3 | -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "strict" : true, // true: Requires all functions run in ES5 Strict Mode 3 | "undef" : true, // true: Require all non-global variables to be declared (prevents global leaks) 4 | "unused" : true, // true: Require all defined variables be used 5 | "noempty" : true, // Prohibit use of empty blocks 6 | "trailing" : true, // Prohibit trailing whitespaces. 7 | "white" : false, // Check against strict whitespace and indentation rules. 8 | "indent" : 2, // {int} Number of spaces to use for indentation 9 | "newcap" : true, // true: Require capitalization of all constructor functions e.g. `new F()` 10 | "quotmark" : "single", // Quotation mark consistency 11 | "-W058" : true, // Missing '()' invoking a constructor 12 | "browser" : true, // Standard browser globals e.g. `window`, `document`. 13 | "predef" : [ // Custom globals. 14 | "angular", 15 | "G_vmlCanvasManager", 16 | "require", 17 | "console" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /angular-clock.less: -------------------------------------------------------------------------------- 1 | /*Compiled into css*/ 2 | .widget-clock { 3 | .digital { 4 | text-align: center; 5 | } 6 | .time { 7 | font-family: 'Syncopate', sans-serif; 8 | font-size: 2.5em; 9 | margin: 0; 10 | } 11 | .square { 12 | position: relative; 13 | width: 100%; 14 | height: 0; 15 | padding-bottom: 100%; 16 | } 17 | svg { 18 | position: absolute; 19 | width: 100%; 20 | height: 100%; 21 | left: 0; 22 | } 23 | .clock-face { 24 | stroke: #333; 25 | fill: white; 26 | } 27 | .minor { 28 | stroke: #999; 29 | stroke-width: 0.5; 30 | } 31 | .major { 32 | stroke: #333; 33 | stroke-width: 1; 34 | } 35 | .hour { 36 | stroke: #333; 37 | } 38 | .minute { 39 | stroke: #666; 40 | } 41 | .second, 42 | .second-counterweight { 43 | stroke: rgb(16, 118, 237); 44 | } 45 | .second-counterweight { 46 | stroke-width: 3; 47 | } 48 | &.dark { 49 | .clock-face { 50 | fill: #111; 51 | } 52 | .hour { 53 | stroke: #666; 54 | } 55 | .minute { 56 | stroke: #999; 57 | } 58 | } 59 | } 60 | /* end clock less */ 61 | -------------------------------------------------------------------------------- /demo/lib/js/smoothscroll.min.js: -------------------------------------------------------------------------------- 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}() 2 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-ui-clock", 3 | "version": "0.7.0", 4 | "main": [ 5 | "./dist/angular-clock.js", 6 | "./dist/angular-clock.css" 7 | ], 8 | "authors": [ 9 | "Deepu K Sasidharan " 10 | ], 11 | "repository": { 12 | "type": "git", 13 | "url": "git://github.com/deepu105/angular-clock.git" 14 | }, 15 | "description": "An angular.js directive for clock svg widgets - reactive, responsive, beautiful.", 16 | "moduleType": [ 17 | "globals" 18 | ], 19 | "keywords": [ 20 | "angular", 21 | "angular.js", 22 | "clock", 23 | "time", 24 | "reactive", 25 | "responsive", 26 | "timer", 27 | "widget" 28 | ], 29 | "license": "MIT", 30 | "ignore": [ 31 | "**/.*", 32 | "node_modules", 33 | "bower_components", 34 | "test", 35 | "tests" 36 | ], 37 | "dependencies": { 38 | "angular": "1.4", 39 | "angular-bootstrap": "1.3", 40 | "font-awesome": "~4.1.0", 41 | "rainbow": "~1.1.9" 42 | }, 43 | "devDependencies": { 44 | "angular-mocks": "1.4" 45 | }, 46 | "resolutions": { 47 | "angular": "1.4", 48 | "angular-mocks": "1.4" 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /test/fixtures/clock.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Clocks 6 | 7 | 8 | 9 | 10 |
11 |
12 | 15 |
16 |
17 |
18 |
Default Clock
19 |
20 | 21 |
22 |
23 |
24 |
25 |
26 | 27 |
28 |
29 |
30 |
31 |
32 | 33 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /test/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Mocha Tests 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 21 | 22 | 23 | 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /dist/angular-clock.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["angular-clock.less"],"names":[],"mappings":";AACA,aACE;EACE,kBAAA;;AAFJ,aAIE;EACE,aAAa,uBAAb;EACA,gBAAA;EACA,SAAA;;AAPJ,aASE;EACE,kBAAA;EACA,WAAA;EACA,SAAA;EACA,oBAAA;;AAbJ,aAeE;EACE,kBAAA;EACA,WAAA;EACA,YAAA;EACA,OAAA;;AAnBJ,aAqBE;EACE,YAAA;EACA,WAAA;;AAvBJ,aAyBE;EACE,YAAA;EACA,iBAAA;;AA3BJ,aA6BE;EACE,YAAA;EACA,eAAA;;AA/BJ,aAiCE;EACE,YAAA;;AAlCJ,aAoCE;EACE,YAAA;;AArCJ,aAuCE;AAvCF,aAwCE;EACE,eAAA;;AAzCJ,aA2CE;EACE,eAAA;;AAEF,aAAC,KACC;EACE,UAAA;;AAFJ,aAAC,KAIC;EACE,YAAA;;AALJ,aAAC,KAOC;EACE,YAAA","file":"angular-clock.css","sourcesContent":["/*Compiled into css*/\n.widget-clock {\n .digital {\n text-align: center;\n }\n .time {\n font-family: 'Syncopate', sans-serif;\n font-size: 2.5em;\n margin: 0;\n }\n .square {\n position: relative;\n width: 100%;\n height: 0;\n padding-bottom: 100%;\n }\n svg {\n position: absolute;\n width: 100%;\n height: 100%;\n left: 0;\n }\n .clock-face {\n stroke: #333;\n fill: white;\n }\n .minor {\n stroke: #999;\n stroke-width: 0.5;\n }\n .major {\n stroke: #333;\n stroke-width: 1;\n }\n .hour {\n stroke: #333;\n }\n .minute {\n stroke: #666;\n }\n .second,\n .second-counterweight {\n stroke: rgb(16, 118, 237);\n }\n .second-counterweight {\n stroke-width: 3;\n }\n &.dark {\n .clock-face {\n fill: #111;\n }\n .hour {\n stroke: #666;\n }\n .minute {\n stroke: #999;\n }\n }\n}\n/* end clock less */\n"]} -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-clock", 3 | "version": "0.7.0", 4 | "description": "An angular.js clock widget", 5 | "main": "angular-clock.js", 6 | "directories": { 7 | "example": "examples" 8 | }, 9 | "scripts": { 10 | "test": "gulp check" 11 | }, 12 | "author": "Deepu K Sasidharan ", 13 | "repository": { 14 | "type": "git", 15 | "url": "git://github.com/deepu105/angular-clock.git" 16 | }, 17 | "license": "MIT", 18 | "devDependencies": { 19 | "chai": "^1.10.0", 20 | "chai-string": "^1.1.1", 21 | "cp": "^0.2.0", 22 | "gm": "^1.17.0", 23 | "gulp": "^3.8.6", 24 | "gulp-bump": "^0.1.11", 25 | "gulp-csso": "^0.2.9", 26 | "gulp-flatten": "^0.2.0", 27 | "gulp-git": "^0.5.6", 28 | "gulp-gzip": "0.0.8", 29 | "gulp-jscs": "^1.4.0", 30 | "gulp-jshint": "^1.9.2", 31 | "gulp-less": "^1.3.1", 32 | "gulp-mocha-phantomjs": "^0.6.1", 33 | "gulp-rename": "^1.2.0", 34 | "gulp-sequence": "^0.3.1", 35 | "gulp-shell": "^0.2.11", 36 | "gulp-sourcemaps": "^1.0.0", 37 | "gulp-spawn-mocha": "^2.0.1", 38 | "gulp-tar": "^0.5.0", 39 | "gulp-uglify": "^0.3.1", 40 | "imgur-node-api": "^0.1.0", 41 | "jshint-stylish": "^1.0.0", 42 | "less": "^1.7.3", 43 | "main-bower-files": "^2.11.1", 44 | "mkdirp": "^0.5.0", 45 | "mocha": "^2.1.0", 46 | "mocha-phantomjs": "^3.5.3", 47 | "sinon": "^1.12.2", 48 | "sinon-chai": "^2.7.0", 49 | "testatic": "^0.1.0", 50 | "tmp-sync": "kaelzhang/node-tmp-sync", 51 | "webshot": "^0.15.3" 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /.jscsrc: -------------------------------------------------------------------------------- 1 | { 2 | "requireCurlyBraces": [ 3 | "try", 4 | "catch", 5 | "do" 6 | ], 7 | "requireCamelCaseOrUpperCaseIdentifiers": "ignoreProperties", 8 | "requireCapitalizedConstructors": true, 9 | "validateIndentation": 2, 10 | "validateQuoteMarks": "'", 11 | 12 | "disallowQuotedKeysInObjects": true, 13 | "disallowSpaceAfterObjectKeys": true, 14 | 15 | "requireSpaceBeforeBinaryOperators": [ 16 | "=", "+=", "-=", "*=", "/=", "%=", "<<=", ">>=", ">>>=", 17 | "&=", "|=", "^=", "+=", 18 | 19 | "+", "-", "*", "/", "%", "<<", ">>", ">>>", "&", 20 | "|", "^", "&&", "||", "===", "==", ">=", 21 | "<=", "<", ">", "!=", "!==" 22 | ], 23 | "requireSpaceAfterBinaryOperators": true, 24 | "requireSpacesInConditionalExpression": true, 25 | "requireSpaceBeforeBlockStatements": true, 26 | "requireSpacesInForStatement": true, 27 | "requireLineFeedAtFileEnd": true, 28 | "requireSpacesInFunctionExpression": { 29 | "beforeOpeningCurlyBrace": true 30 | }, 31 | "requireDotNotation": true, 32 | "disallowSpacesInsideArrayBrackets": "all", 33 | "disallowSpacesInsideParentheses": true, 34 | 35 | 36 | "validateJSDoc": { 37 | "checkParamNames": true, 38 | "requireParamTypes": true 39 | }, 40 | 41 | "disallowMultipleLineBreaks": true, 42 | "disallowNewlineBeforeBlockStatements": true, 43 | "disallowKeywords": [ "with" ], 44 | 45 | "excludeFiles": [ 46 | "demo/**", 47 | "bower_components/**", 48 | "node_modules/**", 49 | "dist/**", 50 | "test/coverage/**", 51 | "examples/smoothscroll.min.js" 52 | ] 53 | } 54 | -------------------------------------------------------------------------------- /demo/lib/css/github.css: -------------------------------------------------------------------------------- 1 | /** 2 | * GitHub theme 3 | * 4 | * @author Craig Campbell 5 | * @version 1.0.4 6 | */ 7 | pre { 8 | border: 1px solid #ccc; 9 | word-wrap: break-word; 10 | padding: 6px 10px; 11 | line-height: 19px; 12 | margin-bottom: 20px; 13 | } 14 | 15 | code { 16 | border: 1px solid #eaeaea; 17 | margin: 0px 2px; 18 | padding: 0px 5px; 19 | font-size: 12px; 20 | } 21 | 22 | pre code { 23 | border: 0px; 24 | padding: 0px; 25 | margin: 0px; 26 | -moz-border-radius: 0px; 27 | -webkit-border-radius: 0px; 28 | border-radius: 0px; 29 | } 30 | 31 | pre, code { 32 | font-family: Consolas, 'Liberation Mono', Courier, monospace; 33 | color: #333; 34 | background: #f8f8f8; 35 | -moz-border-radius: 3px; 36 | -webkit-border-radius: 3px; 37 | border-radius: 3px; 38 | } 39 | 40 | pre, pre code { 41 | font-size: 13px; 42 | } 43 | 44 | pre .comment { 45 | color: #998; 46 | } 47 | 48 | pre .support { 49 | color: #0086B3; 50 | } 51 | 52 | pre .tag, pre .tag-name { 53 | color: navy; 54 | } 55 | 56 | pre .keyword, pre .css-property, pre .vendor-prefix, pre .sass, pre .class, pre .id, pre .css-value, pre .entity.function, pre .storage.function { 57 | font-weight: bold; 58 | } 59 | 60 | pre .css-property, pre .css-value, pre .vendor-prefix, pre .support.namespace { 61 | color: #333; 62 | } 63 | 64 | pre .constant.numeric, pre .keyword.unit, pre .hex-color { 65 | font-weight: normal; 66 | color: #099; 67 | } 68 | 69 | pre .entity.class { 70 | color: #458; 71 | } 72 | 73 | pre .entity.id, pre .entity.function { 74 | color: #900; 75 | } 76 | 77 | pre .attribute, pre .variable { 78 | color: teal; 79 | } 80 | 81 | pre .string, pre .support.value { 82 | font-weight: normal; 83 | color: #d14; 84 | } 85 | 86 | pre .regexp { 87 | color: #009926; 88 | } 89 | -------------------------------------------------------------------------------- /demo/lib/js/generic.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Generic language patterns 3 | * 4 | * @author Craig Campbell 5 | * @version 1.0.10 6 | */ 7 | Rainbow.extend([ 8 | { 9 | 'matches': { 10 | 1: { 11 | 'name': 'keyword.operator', 12 | 'pattern': /\=/g 13 | }, 14 | 2: { 15 | 'name': 'string', 16 | 'matches': { 17 | 'name': 'constant.character.escape', 18 | 'pattern': /\\('|"){1}/g 19 | } 20 | } 21 | }, 22 | 'pattern': /(\(|\s|\[|\=|:)(('|")([^\\\1]|\\.)*?(\3))/gm 23 | }, 24 | { 25 | 'name': 'comment', 26 | 'pattern': /\/\*[\s\S]*?\*\/|(\/\/|\#)[\s\S]*?$/gm 27 | }, 28 | { 29 | 'name': 'constant.numeric', 30 | 'pattern': /\b(\d+(\.\d+)?(e(\+|\-)?\d+)?(f|d)?|0x[\da-f]+)\b/gi 31 | }, 32 | { 33 | 'matches': { 34 | 1: 'keyword' 35 | }, 36 | 'pattern': /\b(and|array|as|b(ool(ean)?|reak)|c(ase|atch|har|lass|on(st|tinue))|d(ef|elete|o(uble)?)|e(cho|lse(if)?|xit|xtends|xcept)|f(inally|loat|or(each)?|unction)|global|if|import|int(eger)?|long|new|object|or|pr(int|ivate|otected)|public|return|self|st(ring|ruct|atic)|switch|th(en|is|row)|try|(un)?signed|var|void|while)(?=\(|\b)/gi 37 | }, 38 | { 39 | 'name': 'constant.language', 40 | 'pattern': /true|false|null/g 41 | }, 42 | { 43 | 'name': 'keyword.operator', 44 | 'pattern': /\+|\!|\-|&(gt|lt|amp);|\||\*|\=/g 45 | }, 46 | { 47 | 'matches': { 48 | 1: 'function.call' 49 | }, 50 | 'pattern': /(\w+?)(?=\()/g 51 | }, 52 | { 53 | 'matches': { 54 | 1: 'storage.function', 55 | 2: 'entity.name.function' 56 | }, 57 | 'pattern': /(function)\s(.*?)(?=\()/g 58 | } 59 | ]); 60 | -------------------------------------------------------------------------------- /demo/lib/js/html.js: -------------------------------------------------------------------------------- 1 | /** 2 | * HTML patterns 3 | * 4 | * @author Craig Campbell 5 | * @version 1.0.7 6 | */ 7 | Rainbow.extend('html', [ 8 | { 9 | 'name': 'source.php.embedded', 10 | 'matches': { 11 | 2: { 12 | 'language': 'php' 13 | } 14 | }, 15 | 'pattern': /<\?=?(?!xml)(php)?([\s\S]*?)(\?>)/gm 16 | }, 17 | { 18 | 'name': 'source.css.embedded', 19 | 'matches': { 20 | 0: { 21 | 'language': 'css' 22 | } 23 | }, 24 | 'pattern': /<style(.*?)>([\s\S]*?)<\/style>/gm 25 | }, 26 | { 27 | 'name': 'source.js.embedded', 28 | 'matches': { 29 | 0: { 30 | 'language': 'javascript' 31 | } 32 | }, 33 | 'pattern': /<script(?! src)(.*?)>([\s\S]*?)<\/script>/gm 34 | }, 35 | { 36 | 'name': 'comment.html', 37 | 'pattern': /<\!--[\S\s]*?-->/g 38 | }, 39 | { 40 | 'matches': { 41 | 1: 'support.tag.open', 42 | 2: 'support.tag.close' 43 | }, 44 | 'pattern': /(<)|(\/?\??>)/g 45 | }, 46 | { 47 | 'name': 'support.tag', 48 | 'matches': { 49 | 1: 'support.tag', 50 | 2: 'support.tag.special', 51 | 3: 'support.tag-name' 52 | }, 53 | 'pattern': /(<\??)(\/|\!?)(\w+)/g 54 | }, 55 | { 56 | 'matches': { 57 | 1: 'support.attribute' 58 | }, 59 | 'pattern': /([a-z-]+)(?=\=)/gi 60 | }, 61 | { 62 | 'matches': { 63 | 1: 'support.operator', 64 | 2: 'string.quote', 65 | 3: 'string.value', 66 | 4: 'string.quote' 67 | }, 68 | 'pattern': /(=)('|")(.*?)(\2)/g 69 | }, 70 | { 71 | 'matches': { 72 | 1: 'support.operator', 73 | 2: 'support.value' 74 | }, 75 | 'pattern': /(=)([a-zA-Z\-0-9]*)\b/g 76 | }, 77 | { 78 | 'matches': { 79 | 1: 'support.attribute' 80 | }, 81 | 'pattern': /\s(\w+)(?=\s|>)(?![\s\S]*<)/g 82 | } 83 | ], true); 84 | -------------------------------------------------------------------------------- /test/test.integration.js: -------------------------------------------------------------------------------- 1 | /*jshint node:true*/ 2 | /*jshint mocha:true*/ 3 | /*global assert:true*/ 4 | describe('integration', function () { 5 | 'use strict'; 6 | 7 | var webshot = require('webshot'), 8 | gm = require('gm'), 9 | tmp = require('tmp-sync'), 10 | mkdirp = require('mkdirp').sync, 11 | cp = require('cp').sync, 12 | imgur = require('imgur-node-api'), 13 | server = require('testatic')(), 14 | WEBSHOT_OPTIONS = { renderDelay: 5000, windowSize: { width: 1366, height: 768 }}, 15 | WEBSHOT_FAILED_DIR = 'test/fixtures/shots/', 16 | dir; 17 | 18 | beforeEach(function () { 19 | dir = tmp.in() + '/'; 20 | }); 21 | 22 | afterEach(function () { 23 | tmp.clean(); 24 | }); 25 | 26 | after(function () { 27 | server.close(); 28 | }); 29 | 30 | mkdirp(WEBSHOT_FAILED_DIR); 31 | 32 | [ 33 | '57-hex-colours', 34 | '54-not-enough-colours', 35 | '51-pie-update-colours', 36 | 'Clocks' 37 | ].forEach(function (name) { 38 | it('compares screenshots for: ' + name, function (done) { 39 | var image = dir + name + '.png', 40 | url = 'http://localhost:8080/test/fixtures/' + name + '.html', 41 | expected = 'test/fixtures/' + name + '.png'; 42 | 43 | webshot(url, image, WEBSHOT_OPTIONS, function (err) { 44 | if (err) return done(err); 45 | gm.compare(expected, image, 0.002, function (err, isEqual) { 46 | if (err) return done(err); 47 | if (! isEqual) { 48 | var failed = WEBSHOT_FAILED_DIR + name + '-failed.png', 49 | msg = 'Expected screenshots to be similar. Screenshot saved to ' + failed; 50 | cp(image, failed); 51 | if (process.env.CI && process.env.IMGUR_ID) { 52 | imgur.setClientID(process.env.IMGUR_ID); 53 | imgur.upload(image, function (err, res) { 54 | if (err) return done(err); 55 | assert.fail(isEqual, true, msg + ', uploaded to ' + res.data.link); 56 | }); 57 | } else { 58 | assert.fail(isEqual, true, msg); 59 | } 60 | return; 61 | } 62 | done(); 63 | }); 64 | }); 65 | }); 66 | }); 67 | }); 68 | -------------------------------------------------------------------------------- /demo/app.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 50px; 3 | } 4 | .nav, 5 | .pagination, 6 | .carousel, 7 | .panel-title a { 8 | cursor: pointer; 9 | } 10 | #hero-bar { 11 | position: absolute; 12 | left: 0; 13 | top: 0; 14 | z-index: 1; 15 | padding-right: 0; 16 | } 17 | .container-fluid { 18 | padding-left: 0; 19 | padding-right: 0; 20 | } 21 | .aspect-ratio { 22 | width: 100%; 23 | position: relative; 24 | } 25 | .header { 26 | width: 100%; 27 | font-size: larger; 28 | z-index: 500; 29 | } 30 | .panel-heading { 31 | font-weight: bold; 32 | } 33 | .code .nav-tabs>li.active>a, 34 | .code .nav-tabs>li.active>a:hover, 35 | .code .nav-tabs>li.active>a:focus { 36 | background-color: #f8f8f8; 37 | border: 1px solid #ccc; 38 | border-bottom-color: transparent; 39 | } 40 | .code pre, 41 | .code code { 42 | background-color: #f8f8f8; 43 | border-top: none; 44 | border-top-left-radius: 0; 45 | border-top-right-radius: 0; 46 | } 47 | .settings > a, 48 | .settings { 49 | background-color: white ! important; 50 | } 51 | .nav-tabs > li > a { 52 | border-bottom: 1px solid #ccc; 53 | margin-right: 0; 54 | } 55 | .settings > a.active { 56 | border: 1px solid transparent; 57 | } 58 | div.settings { 59 | border: 1px solid #ccc; 60 | border-top: 0; 61 | padding: 9.5px; 62 | margin: 0 0 10px 63 | } 64 | div.settings > code { 65 | border-top: 1px solid #eaeaea; 66 | } 67 | .footer { 68 | text-align: center; 69 | padding: 30px 0; 70 | margin-top: 70px; 71 | border-top: 1px solid #e5e5e5; 72 | background-color: #f5f5f5; 73 | } 74 | /* clock custom themes*/ 75 | 76 | .widget-clock.blue-light .clock-face { 77 | stroke: #153b6f; 78 | fill: #0e2434; 79 | } 80 | .widget-clock.blue-light .minor { 81 | stroke: #0089ff; 82 | stroke-width: 0.5; 83 | } 84 | .widget-clock.blue-light .major { 85 | stroke: rgba(119, 176, 242, 0.97); 86 | stroke-width: 0.5; 87 | } 88 | .widget-clock.blue-light .hour { 89 | stroke: rgba(119, 176, 242, 0.97); 90 | stroke-width: 1; 91 | } 92 | .widget-clock.blue-light .minute { 93 | stroke: #0089ff; 94 | stroke-width: 0.75; 95 | } 96 | .widget-clock.blue-light .second, 97 | .widget-clock.blue-light .second-counterweight { 98 | stroke: rgb(234, 31, 54); 99 | stroke-width: 0.5; 100 | } 101 | .widget-clock.blue-light .second-counterweight { 102 | stroke-width: 1.5; 103 | } 104 | /*digital clock custom theme*/ 105 | 106 | .widget-clock.blue-light .digital { 107 | text-align: center; 108 | } 109 | .widget-clock.blue-light .time { 110 | font-family: 'Rationale', sans-serif; 111 | font-size: 3.0em; 112 | color: #1da4eb; 113 | } 114 | -------------------------------------------------------------------------------- /demo/lib/js/rainbow.min.js: -------------------------------------------------------------------------------- 1 | /* Rainbow v1.1.9 rainbowco.de */ 2 | window.Rainbow=function(){function q(a){var b,c=a.getAttribute&&a.getAttribute("data-language")||0;if(!c){a=a.attributes;for(b=0;b=e[d][c])delete e[d][c],delete j[d][c];if(a>=c&&ac&&b'+b+""}function s(a,b,c,h){var f=a.exec(c);if(f){++t;!b.name&&"string"==typeof b.matches[0]&&(b.name=b.matches[0],delete b.matches[0]);var k=f[0],i=f.index,u=f[0].length+i,g=function(){function f(){s(a,b,c,h)}t%100>0?f():setTimeout(f,0)};if(C(i,u))g();else{var m=v(b.matches),l=function(a,c,h){if(a>=c.length)h(k);else{var d=f[c[a]];if(d){var e=b.matches[c[a]],i=e.language,g=e.name&&e.matches? 4 | e.matches:e,j=function(b,d,e){var i;i=0;var g;for(g=1;g/g,">").replace(/&(?![\w\#]+;)/g, 6 | "&"),b,c)}function o(a,b,c){if(b
{{digital}}
{{gmtInfo}}
',link:function(n,r,l){var g,m={},c=n.gmtOffset,f=n.digitalFormat?n.digitalFormat:"HH:mm:ss";m.showDigital=null!=n.showDigital?n.showDigital:void 0!==l.showDigital?!0:!1,m.showAnalog=null!=n.showAnalog?n.showAnalog:void 0!==l.showAnalog?!0:!1,m.showGmtInfo=void 0!==l.showGmtInfo?!0:!1,m.startTime=parseInt(n.startTime,10),n.themeClass=n.theme?n.theme:l.theme?l.theme:"light",m.showDigital||m.showAnalog||(m.showAnalog=!0,m.showDigital=!0),n.gmtInfo=!1,n.date=i(m),n.digital=m.showDigital?"Loading..":!1,n.analog=m.showAnalog,n.majors=l.majorsTotal?new Array(parseInt(l.majorsTotal)):new Array(12),n.minors=new Array(60);var h=null,d=function(){isNaN(m.startTime)||(m.startTime=m.startTime+1e3),h=i(m),n.date=h,m.showDigital&&(n.digital=o(h,f,s))};g=t(d,1e3),n.$watch("gmtOffset",function(t){c=t,m.gmtOffset=null!=c?a(c):!1,m.showGmtInfo&&m.gmtOffset!==!1&&(n.gmtInfo=e(m.gmtOffset)),d()}),n.$watch("digitalFormat",function(t,a){t!=a&&(f=t)}),n.$watch("startTime",function(t,a){t!=a&&(m.startTime=parseInt(t,10))}),n.$watch("showDigital",function(t,a){t!=a&&(m.showDigital=t,n.digital=m.showDigital?"Loading..":!1)}),n.$watch("showAnalog",function(t,a){t!=a&&(m.showAnalog=t,n.analog=t)}),n.$watch("theme",function(t,a){t!=a&&(n.themeClass=t?t:l.theme?l.theme:"light")}),r.on("$destroy",function(){t.cancel(g),g=null})}}}function a(t){t=parseFloat(t);var a=t>0?Math.floor(t):Math.ceil(t),e=t%1/.6;return a+e}function e(t){var a=t>0?Math.floor(t):Math.ceil(t),e=Math.round((t>0?t:-1*t)%1*60);return"GMT"+(0===t?"":(t>0?" +":" ")+s(a)+"."+n(e).substring(0,2))}function s(t){return 0>t?(t>-10?"-0":"-")+-1*t:(10>t?"0":"")+t}function n(t){return t+(10>t?"0":"")}function i(t){var a=isNaN(t.startTime)?new Date:new Date(t.startTime);if(null!==t.gmtOffset&&t.gmtOffset!==!1){var e=a.getTime()+6e4*a.getTimezoneOffset(),s=new Date(e+36e5*t.gmtOffset);return{hrs:s.getHours(),mins:s.getMinutes(),secs:s.getSeconds(),date:s}}return{hrs:a.getHours(),mins:a.getMinutes(),secs:a.getSeconds(),date:a}}function o(t,a,e){return e("date")(t.date,a)}angular.module("ds.clock",[]).directive("dsWidgetClock",["$interval","$filter",function(a,e){return t(a,e)}])}(); 2 | //# sourceMappingURL=angular-clock.min.js.map 3 | -------------------------------------------------------------------------------- /test/test.unit.js: -------------------------------------------------------------------------------- 1 | /*jshint mocha:true*/ 2 | /*global module:true*/ 3 | /*global inject:true*/ 4 | /*global expect:true*/ 5 | /*global sinon:true*/ 6 | 'use strict'; 7 | describe('Angular Clock Unit testing', function() { 8 | 9 | var $compile, scope, sandbox; 10 | 11 | beforeEach(module('ds.clock')); 12 | 13 | beforeEach(inject(function(_$compile_, _$rootScope_) { 14 | // The injector unwraps the underscores (_) from around the parameter names when matching 15 | $compile = _$compile_; 16 | scope = _$rootScope_; 17 | sandbox = sinon.sandbox.create(); 18 | })); 19 | 20 | afterEach(function() { 21 | sandbox.restore(); 22 | }); 23 | 24 | describe('base', function() { 25 | it('replaces the directive element with the appropriate content', function() { 26 | var markup = '
' + 27 | '
'; 28 | 29 | 30 | 31 | var element = $compile(markup)(scope); 32 | scope.$digest(); 33 | 34 | expect(element.html()).to.have.string('class="widget-clock'); 35 | }); 36 | 37 | describe('clock types', function() { 38 | [0, 8, 5.30, -5.30, -5.15, 5.45, -1].forEach(function(type) { 39 | it('creates a GMT ' + type + ' timezone clock using the directive', function() { 40 | var markup = '
'; 42 | 43 | 44 | //var mock = sandbox.mock(Chart.prototype); 45 | //mock.expects(type); 46 | 47 | var element = $compile(markup)(scope); 48 | scope.$digest(); 49 | 50 | //mock.verify(); GMT +5.0 51 | expect(element.html()).to.have.string('>' + getGMTText(type) + '<'); 52 | }); 53 | 54 | }); 55 | }); 56 | describe('clock theme', function() { 57 | it('replaces the element with the appropriate content for dark theme', function() { 58 | var markup = '
' + 59 | '
'; 60 | 61 | 62 | 63 | var element = $compile(markup)(scope); 64 | scope.$digest(); 65 | 66 | expect(element.html()).to.have.string('class="widget-clock ng-scope dark'); 67 | }); 68 | }); 69 | 70 | describe('clock set start time', function() { 71 | it('set a intial time and clock is base on this time to tick.', function() { 72 | var date = new Date(); 73 | var ms = date.getTime(); 74 | var markup = '
'; 76 | var element = $compile(markup)(scope); 77 | 78 | scope.$digest(); 79 | expect(element.html()).to.match(/'; 88 | 89 | var element = $compile(markup)(scope); 90 | scope.$digest(); 91 | 92 | expect(element.html()).to.match(/ 26 | 27 | ``` 28 | 29 | Whichever method you choose the good news is that the overall size is very small: < 4kb for all directives (~1kb with gzip compression!) 30 | 31 | 32 | As soon as you've got all the files downloaded and included in your page you just need to declare a dependency on the `ds.clock` [module](http://docs.angularjs.org/guide/module): 33 | 34 | ```javascript 35 | angular.module('myModule', ['ds.clock']); 36 | ``` 37 | 38 | ### CSS 39 | 40 | You need to include a link to the css file in your page. 41 | 42 | ```html 43 | 44 | ``` 45 | 46 | If you need the default digital clock font ```Syncopate```, include this. Else check styling section to use your own font 47 | ```html 48 | 49 | ``` 50 | 51 | ### Options 52 | 53 | There are several options that you can set as attributes on the directive element 54 | 55 | 1. `start-time` : init clock with specific time in milliseconds, (default: `undefined`) 56 | 2. `digital-format` : digital clock format in [angular date filter format](https://docs.angularjs.org/api/ng/filter/date) (default: `'HH-mm-ss'`). Pass as string enclosed in single quate 57 | 3. `gmt-offset` : shows time for the given [GMT offset](http://en.wikipedia.org/wiki/List_of_UTC_time_offsets) in clock, (default: `false`, shows local time) example: India -> 5.30, Singapore -> 8 , venezula -> -4.30, Nepal -> 5.45 58 | 4. `show-digital`: shows digital clock, (default: `true` if both show-analog &show-digital are not set) 59 | 5. `show-analog` : shows analog clock, (default: `true` if both show-analog &show-digital are not set) 60 | 6. `show-gmt-info` : shows GMT offset value, (default: `false`) 61 | 7. `theme` : analog clockface theme, (default: `light`) 62 | 63 | 64 | ## Browser compatibility 65 | 66 | For IE8 and older browsers, you will need SVG polyfills and Shims 67 | 68 | 69 | # Example 70 | 71 | ## Markup 72 | 73 | ```html 74 | 75 | ``` 76 | 77 | ## Reactive & Responsive 78 | 79 | angular clock widget is reactive and fully responsive 80 | 81 | 82 | # Issues 83 | 84 | Please check if issue exists and otherwise open issue in [github](https://github.com/deepu105/angular-clock/issues?state=open) 85 | 86 | **Please add a link to a plunker, jsbin, or equivalent.** 87 | 88 | # Contributing 89 | 90 | Pull requests welcome! 91 | 92 | 1. Fork the repo 93 | 2. Make your changes 94 | 3. Write unit tests under test directory 95 | 4. Update examples under examples directory 96 | 5. Run tests: `npm test`, `gulp test` 97 | 6. Submit pull request 98 | 99 | ## Contributors 100 | 101 | Thank you! 102 | 103 | 104 | # Author 105 | 106 | Designed and built by [Deepu K Sasidharan](https://github.com/jtblin) 107 | 108 | [Issues](https://github.com/deepu105/angular-clock/issues?state=open) 109 | 110 | Inspired from [this demo](https://gist.github.com/BinaryMuse/6100363). 111 | 112 | # License 113 | 114 | angular-clock.js is available under the [MIT license](http://opensource.org/licenses/MIT). 115 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | var gulp = require('gulp'); 5 | var less = require('gulp-less'); 6 | var sourcemaps = require('gulp-sourcemaps'); 7 | var uglify = require('gulp-uglify'); 8 | var csso = require('gulp-csso'); 9 | var jshint = require('gulp-jshint'); 10 | var stylish = require('jshint-stylish'); 11 | var jscs = require('gulp-jscs'); 12 | var mocha = require('gulp-spawn-mocha'); 13 | var mochaPhantomJS = require('gulp-mocha-phantomjs'); 14 | var tar = require('gulp-tar'); 15 | var gzip = require('gulp-gzip'); 16 | var bumper = require('gulp-bump'); 17 | var git = require('gulp-git'); 18 | var shell = require('gulp-shell'); 19 | var rename = require('gulp-rename'); 20 | var fs = require('fs'); 21 | var sequence = require('gulp-sequence'); 22 | var flatten = require('gulp-flatten'); 23 | 24 | gulp.task('less', function() { 25 | return gulp.src('./*.less') 26 | .pipe(sourcemaps.init()) 27 | .pipe(less()) 28 | .pipe(csso()) 29 | .pipe(sourcemaps.write('./')) 30 | .pipe(gulp.dest('./dist')); 31 | }); 32 | 33 | gulp.task('lint', function() { 34 | return gulp.src('**/*.js') 35 | .pipe(jshint()) 36 | .pipe(jshint.reporter(stylish)); 37 | }); 38 | 39 | gulp.task('unit', function() { 40 | return gulp 41 | .src('test/index.html') 42 | .pipe(mochaPhantomJS()); 43 | }); 44 | 45 | gulp.task('bump-patch', bump('patch')); 46 | gulp.task('bump-minor', bump('minor')); 47 | gulp.task('bump-major', bump('major')); 48 | 49 | gulp.task('bower', function() { 50 | return gulp.src('./angular-clock.js') 51 | .pipe(gulp.dest('./dist')); 52 | }); 53 | 54 | gulp.task('js', ['bower'], function() { 55 | return gulp.src('./angular-clock.js') 56 | .pipe(rename('angular-clock.min.js')) 57 | .pipe(sourcemaps.init()) 58 | .pipe(uglify()) 59 | .pipe(sourcemaps.write('./')) 60 | .pipe(gulp.dest('./dist')); 61 | }); 62 | 63 | gulp.task('build', function() { 64 | return gulp.src(['dist/*', '!./dist/*.tar.gz']) 65 | .pipe(tar('angular-clock.js.tar')) 66 | .pipe(gzip({ 67 | gzipOptions: { 68 | level: 9 69 | } 70 | })) 71 | .pipe(gulp.dest('dist/')); 72 | }); 73 | 74 | gulp.task('copy-js', function() { 75 | gulp.src(['bower_components/**/*.min.js','!bower_components/**/jquery-*', '!bower_components/**/ui-bootstrap.min.js','bower_components/**/generic.js','bower_components/**/javascript.js','bower_components/**/html.js']) 76 | .pipe(flatten()) 77 | .pipe(gulp.dest('demo/lib/js')); 78 | }); 79 | 80 | gulp.task('copy-css', function() { 81 | gulp.src(['bower_components/**/*.min.css','bower_components/**/github.css']) 82 | .pipe(flatten()) 83 | .pipe(gulp.dest('demo/lib/css')); 84 | }); 85 | 86 | gulp.task('copy-font', function() { 87 | gulp.src(['bower_components/**/*.{eot,svg,ttf,woff}']) 88 | .pipe(flatten()) 89 | .pipe(gulp.dest('demo/lib/fonts')); 90 | }); 91 | 92 | gulp.task('demo', ['copy-js', 'copy-css', 'copy-font']); 93 | 94 | gulp.task('git-commit', function() { 95 | var v = 'update to version ' + version(); 96 | gulp.src(['./dist/*', './examples/*', './test/*', './package.json', './bower.json', './angular-clock.js', './angular-clock.less']) 97 | .pipe(git.add()) 98 | .pipe(git.commit(v)); 99 | }); 100 | 101 | gulp.task('git-push', function (cb) { 102 | var v = 'v' + version(); 103 | git.push('origin', 'master', function (err) { 104 | if (err) return cb(err); 105 | git.tag(v, v, function (err) { 106 | if (err) return cb(err); 107 | git.push('origin', 'master', { 108 | args: '--tags' 109 | }, function(err){ 110 | if (err) return cb(err); 111 | git.checkout('gh-pages', function (err) { 112 | if (err) return cb(err); 113 | git.reset('master', { 114 | args: '--hard' 115 | }, function (err) { 116 | if (err) return cb(err); 117 | git.push('origin', 'gh-pages', function (err) { 118 | if (err) return cb(err); 119 | git.checkout('master', cb); 120 | }); 121 | }); 122 | }); 123 | }); 124 | }); 125 | }); 126 | }); 127 | 128 | gulp.task('git-demo', function (cb) { 129 | var v = 'v' + version(); 130 | git.checkout('gh-pages', function (err) { 131 | if (err) return cb(err); 132 | git.reset('master', { 133 | args: '--hard' 134 | }, function (err) { 135 | if (err) return cb(err); 136 | git.push('origin', 'gh-pages', function (err) { 137 | if (err) return cb(err); 138 | git.checkout('master', cb); 139 | }); 140 | }); 141 | }); 142 | }); 143 | 144 | gulp.task('npm', shell.task([ 145 | 'npm publish' 146 | ])); 147 | 148 | gulp.task('watch', function() { 149 | gulp.watch('./*.js', ['js']); 150 | gulp.watch('./*.less', ['less']); 151 | return true; 152 | }); 153 | 154 | function bump(level) { 155 | return function() { 156 | return gulp.src(['./package.json', './bower.json']) 157 | .pipe(bumper({ 158 | type: level 159 | })) 160 | .pipe(gulp.dest('./')); 161 | }; 162 | } 163 | 164 | function version() { 165 | return JSON.parse(fs.readFileSync('package.json', 'utf8')).version; 166 | } 167 | 168 | gulp.task('default', sequence('check', ['less', 'js'], 'build')); 169 | gulp.task('test', sequence('unit' /*, 'integration'*/ )); 170 | gulp.task('check', sequence(['lint' /*, 'style'*/ ], 'test')); 171 | gulp.task('deploy-patch', sequence('default', 'bump-patch', 'demo', 'git-commit', 'git-push', 'npm')); 172 | gulp.task('deploy-minor', sequence('default', 'bump-minor', 'demo', 'git-commit', 'git-push', 'npm')); 173 | gulp.task('deploy-major', sequence('default', 'bump-major', 'demo', 'git-commit', 'git-push', 'npm')); 174 | 175 | })(); 176 | -------------------------------------------------------------------------------- /angular-clock.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | /** 5 | * Usage pattern 6 | * 7 | */ 8 | var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']; 9 | var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; 10 | 11 | angular.module('ds.clock', []) 12 | .directive('dsWidgetClock', ['$interval', '$filter', 13 | function($interval, $filter) { 14 | return clock($interval, $filter); 15 | } 16 | ]); 17 | 18 | function clock($interval, $filter) { 19 | return { 20 | restrict: 'EA', 21 | scope: { 22 | gmtOffset: '=gmtOffset', 23 | digitalFormat: '=digitalFormat', 24 | showDigital: '=showDigital', 25 | showAnalog: '=showAnalog', 26 | startTime: '=startTime', 27 | theme: '=theme', 28 | majorsTotal: '=majorsTotal' 29 | }, 30 | template: '
{{digital}}
{{gmtInfo}}
', 31 | link: function(scope, element, attrs) { 32 | var format, // date format 33 | stopTime; // so that we can cancel the time updates 34 | var o = {}; 35 | var gmtOffset = scope.gmtOffset; 36 | var digitalFormat = scope.digitalFormat ? scope.digitalFormat : 'HH:mm:ss'; 37 | o.showDigital = scope.showDigital != null ? scope.showDigital : attrs.showDigital !== undefined ? true : false; 38 | o.showAnalog = scope.showAnalog != null ? scope.showAnalog : attrs.showAnalog !== undefined ? true : false; 39 | o.showGmtInfo = attrs.showGmtInfo !== undefined ? true : false; 40 | o.startTime = parseInt(scope.startTime, 10); // ms 41 | scope.themeClass = scope.theme ? scope.theme : attrs.theme ? attrs.theme : 'light'; 42 | if (!o.showDigital && !o.showAnalog) { 43 | o.showAnalog = true; 44 | o.showDigital = true; 45 | } 46 | scope.gmtInfo = false; 47 | 48 | scope.date = getDate(o); 49 | 50 | scope.digital = o.showDigital ? 'Loading..' : false; 51 | scope.analog = o.showAnalog; 52 | scope.majors = attrs.majorsTotal ? new Array(parseInt(attrs.majorsTotal)) : new Array(12); 53 | scope.minors = new Array(60); 54 | var date = null; 55 | var tick = function() { 56 | if (!isNaN(o.startTime)) { 57 | o.startTime = o.startTime + 1000; 58 | } 59 | date = getDate(o); 60 | scope.date = date; 61 | if (o.showDigital) { 62 | scope.digital = timeText(date, digitalFormat, $filter); 63 | } 64 | }; 65 | 66 | stopTime = $interval(tick, 1000); 67 | // watch the expression, and update the UI on change. 68 | scope.$watch('gmtOffset', function(value, old) { 69 | 70 | gmtOffset = value; 71 | o.gmtOffset = (gmtOffset != null) ? getGMTbase100(gmtOffset) : false; 72 | if (o.showGmtInfo && o.gmtOffset !== false) { 73 | scope.gmtInfo = getGMTText(o.gmtOffset); 74 | } 75 | 76 | tick(); 77 | }); 78 | scope.$watch('digitalFormat', function(value, old) { 79 | if(value != old){ 80 | digitalFormat = value; 81 | } 82 | }); 83 | scope.$watch('startTime', function(value, old) { 84 | if(value != old){ 85 | o.startTime = parseInt(value, 10); 86 | } 87 | }); 88 | scope.$watch('showDigital', function(value, old) { 89 | if(value != old){ 90 | o.showDigital = value; 91 | scope.digital = o.showDigital ? 'Loading..' : false;; 92 | } 93 | }); 94 | scope.$watch('showAnalog', function(value, old) { 95 | if(value != old){ 96 | o.showAnalog = value; 97 | scope.analog = value; 98 | } 99 | }); 100 | scope.$watch('theme', function(value, old) { 101 | if(value != old){ 102 | scope.themeClass = value ? value : attrs.theme ? attrs.theme : 'light'; 103 | } 104 | }); 105 | // listen on DOM destroy (removal) event, and cancel the next UI update 106 | // to prevent updating time after the DOM element was removed. 107 | element.on('$destroy', function() { 108 | $interval.cancel(stopTime); 109 | stopTime = null; 110 | }); 111 | 112 | } 113 | }; 114 | } 115 | 116 | function getGMTbase100(offset) { 117 | offset = parseFloat(offset); 118 | var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset), 119 | s = (offset % 1) / 0.6; 120 | 121 | return f + s; 122 | 123 | } 124 | 125 | function getGMTbase60(offset) { 126 | var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset), 127 | s = ((offset > 0 ? offset : offset * -1) % 1) * 60; 128 | return f + s; 129 | 130 | } 131 | 132 | function getGMTText(offset) { 133 | 134 | var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset), 135 | s = Math.round(((offset > 0 ? offset : offset * -1) % 1) * 60); 136 | 137 | return 'GMT' + (offset === 0 ? '' : ((offset > 0 ? ' +' : ' ') + lpad(f) + '.' + rpad(s).substring(0, 2))); 138 | 139 | } 140 | 141 | function lpad(num) { 142 | if (num < 0) { 143 | return (num > -10 ? '-0' : '-') + (num * -1); 144 | } else { 145 | return (num < 10 ? '0' : '') + num; 146 | } 147 | 148 | } 149 | 150 | function rpad(num) { 151 | return num + (num < 10 ? '0' : ''); 152 | } 153 | // Checkfor offset and get correct time 154 | function getDate(o) { 155 | var now = (!isNaN(o.startTime)) ? new Date(o.startTime) : new Date(); 156 | if (o.gmtOffset !== null && o.gmtOffset !== false) { 157 | /*Use GMT + gmtOffset 158 | convert to msec 159 | add local time zone offset 160 | get UTC time in msec*/ 161 | var utc = now.getTime() + (now.getTimezoneOffset() * 60000); 162 | // create new Date object for different city 163 | // using supplied offset 164 | var offsetNow = new Date(utc + (3600000 * o.gmtOffset)); 165 | return { 166 | hrs: offsetNow.getHours(), 167 | mins: offsetNow.getMinutes(), 168 | secs: offsetNow.getSeconds(), 169 | date: offsetNow 170 | }; 171 | } else { 172 | // Use local time 173 | return { 174 | hrs: now.getHours(), 175 | mins: now.getMinutes(), 176 | secs: now.getSeconds(), 177 | date: now 178 | }; 179 | } 180 | } 181 | 182 | function timeText(d, format, $filter) { 183 | return $filter('date')(d.date, format); 184 | } 185 | 186 | })(); 187 | -------------------------------------------------------------------------------- /dist/angular-clock.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | 'use strict'; 3 | 4 | /** 5 | * Usage pattern 6 | * 7 | */ 8 | var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']; 9 | var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; 10 | 11 | angular.module('ds.clock', []) 12 | .directive('dsWidgetClock', ['$interval', '$filter', 13 | function($interval, $filter) { 14 | return clock($interval, $filter); 15 | } 16 | ]); 17 | 18 | function clock($interval, $filter) { 19 | return { 20 | restrict: 'EA', 21 | scope: { 22 | gmtOffset: '=gmtOffset', 23 | digitalFormat: '=digitalFormat', 24 | showDigital: '=showDigital', 25 | showAnalog: '=showAnalog', 26 | startTime: '=startTime', 27 | theme: '=theme', 28 | majorsTotal: '=majorsTotal' 29 | }, 30 | template: '
{{digital}}
{{gmtInfo}}
', 31 | link: function(scope, element, attrs) { 32 | var format, // date format 33 | stopTime; // so that we can cancel the time updates 34 | var o = {}; 35 | var gmtOffset = scope.gmtOffset; 36 | var digitalFormat = scope.digitalFormat ? scope.digitalFormat : 'HH:mm:ss'; 37 | o.showDigital = scope.showDigital != null ? scope.showDigital : attrs.showDigital !== undefined ? true : false; 38 | o.showAnalog = scope.showAnalog != null ? scope.showAnalog : attrs.showAnalog !== undefined ? true : false; 39 | o.showGmtInfo = attrs.showGmtInfo !== undefined ? true : false; 40 | o.startTime = parseInt(scope.startTime, 10); // ms 41 | scope.themeClass = scope.theme ? scope.theme : attrs.theme ? attrs.theme : 'light'; 42 | if (!o.showDigital && !o.showAnalog) { 43 | o.showAnalog = true; 44 | o.showDigital = true; 45 | } 46 | scope.gmtInfo = false; 47 | 48 | scope.date = getDate(o); 49 | 50 | scope.digital = o.showDigital ? 'Loading..' : false; 51 | scope.analog = o.showAnalog; 52 | scope.majors = attrs.majorsTotal ? new Array(parseInt(attrs.majorsTotal)) : new Array(12); 53 | scope.minors = new Array(60); 54 | var date = null; 55 | var tick = function() { 56 | if (!isNaN(o.startTime)) { 57 | o.startTime = o.startTime + 1000; 58 | } 59 | date = getDate(o); 60 | scope.date = date; 61 | if (o.showDigital) { 62 | scope.digital = timeText(date, digitalFormat, $filter); 63 | } 64 | }; 65 | 66 | stopTime = $interval(tick, 1000); 67 | // watch the expression, and update the UI on change. 68 | scope.$watch('gmtOffset', function(value, old) { 69 | 70 | gmtOffset = value; 71 | o.gmtOffset = (gmtOffset != null) ? getGMTbase100(gmtOffset) : false; 72 | if (o.showGmtInfo && o.gmtOffset !== false) { 73 | scope.gmtInfo = getGMTText(o.gmtOffset); 74 | } 75 | 76 | tick(); 77 | }); 78 | scope.$watch('digitalFormat', function(value, old) { 79 | if(value != old){ 80 | digitalFormat = value; 81 | } 82 | }); 83 | scope.$watch('startTime', function(value, old) { 84 | if(value != old){ 85 | o.startTime = parseInt(value, 10); 86 | } 87 | }); 88 | scope.$watch('showDigital', function(value, old) { 89 | if(value != old){ 90 | o.showDigital = value; 91 | scope.digital = o.showDigital ? 'Loading..' : false;; 92 | } 93 | }); 94 | scope.$watch('showAnalog', function(value, old) { 95 | if(value != old){ 96 | o.showAnalog = value; 97 | scope.analog = value; 98 | } 99 | }); 100 | scope.$watch('theme', function(value, old) { 101 | if(value != old){ 102 | scope.themeClass = value ? value : attrs.theme ? attrs.theme : 'light'; 103 | } 104 | }); 105 | // listen on DOM destroy (removal) event, and cancel the next UI update 106 | // to prevent updating time after the DOM element was removed. 107 | element.on('$destroy', function() { 108 | $interval.cancel(stopTime); 109 | stopTime = null; 110 | }); 111 | 112 | } 113 | }; 114 | } 115 | 116 | function getGMTbase100(offset) { 117 | offset = parseFloat(offset); 118 | var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset), 119 | s = (offset % 1) / 0.6; 120 | 121 | return f + s; 122 | 123 | } 124 | 125 | function getGMTbase60(offset) { 126 | var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset), 127 | s = ((offset > 0 ? offset : offset * -1) % 1) * 60; 128 | return f + s; 129 | 130 | } 131 | 132 | function getGMTText(offset) { 133 | 134 | var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset), 135 | s = Math.round(((offset > 0 ? offset : offset * -1) % 1) * 60); 136 | 137 | return 'GMT' + (offset === 0 ? '' : ((offset > 0 ? ' +' : ' ') + lpad(f) + '.' + rpad(s).substring(0, 2))); 138 | 139 | } 140 | 141 | function lpad(num) { 142 | if (num < 0) { 143 | return (num > -10 ? '-0' : '-') + (num * -1); 144 | } else { 145 | return (num < 10 ? '0' : '') + num; 146 | } 147 | 148 | } 149 | 150 | function rpad(num) { 151 | return num + (num < 10 ? '0' : ''); 152 | } 153 | // Checkfor offset and get correct time 154 | function getDate(o) { 155 | var now = (!isNaN(o.startTime)) ? new Date(o.startTime) : new Date(); 156 | if (o.gmtOffset !== null && o.gmtOffset !== false) { 157 | /*Use GMT + gmtOffset 158 | convert to msec 159 | add local time zone offset 160 | get UTC time in msec*/ 161 | var utc = now.getTime() + (now.getTimezoneOffset() * 60000); 162 | // create new Date object for different city 163 | // using supplied offset 164 | var offsetNow = new Date(utc + (3600000 * o.gmtOffset)); 165 | return { 166 | hrs: offsetNow.getHours(), 167 | mins: offsetNow.getMinutes(), 168 | secs: offsetNow.getSeconds(), 169 | date: offsetNow 170 | }; 171 | } else { 172 | // Use local time 173 | return { 174 | hrs: now.getHours(), 175 | mins: now.getMinutes(), 176 | secs: now.getSeconds(), 177 | date: now 178 | }; 179 | } 180 | } 181 | 182 | function timeText(d, format, $filter) { 183 | return $filter('date')(d.date, format); 184 | } 185 | 186 | })(); 187 | -------------------------------------------------------------------------------- /dist/angular-clock.min.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["angular-clock.min.js"],"names":["clock","$interval","$filter","restrict","scope","gmtOffset","digitalFormat","showDigital","showAnalog","startTime","theme","majorsTotal","template","link","element","attrs","stopTime","o","undefined","showGmtInfo","parseInt","themeClass","gmtInfo","date","getDate","digital","analog","majors","Array","minors","tick","isNaN","timeText","$watch","value","getGMTbase100","getGMTText","old","on","cancel","offset","parseFloat","f","Math","floor","ceil","s","round","lpad","rpad","substring","num","now","Date","utc","getTime","getTimezoneOffset","offsetNow","hrs","getHours","mins","getMinutes","secs","getSeconds","d","format","angular","module","directive"],"mappings":"CAAA,WACE,YAgBA,SAASA,GAAMC,EAAWC,GACxB,OACEC,SAAU,KACVC,OACEC,UAAW,aACXC,cAAe,iBACfC,YAAa,eACbC,WAAY,cACZC,UAAW,aACXC,MAAO,SACPC,YAAa,gBAEfC,SAAU,4gCACVC,KAAM,SAAST,EAAOU,EAASC,GAC7B,GACEC,GACEC,KACAZ,EAAYD,EAAMC,UAClBC,EAAgBF,EAAME,cAAgBF,EAAME,cAAgB,UAChEW,GAAEV,YAAmC,MAArBH,EAAMG,YAAsBH,EAAMG,YAAoCW,SAAtBH,EAAMR,aAA4B,GAAO,EACzGU,EAAET,WAAiC,MAApBJ,EAAMI,WAAqBJ,EAAMI,WAAkCU,SAArBH,EAAMP,YAA2B,GAAO,EACrGS,EAAEE,YAAoCD,SAAtBH,EAAMI,aAA4B,GAAO,EACzDF,EAAER,UAAYW,SAAShB,EAAMK,UAAW,IACxCL,EAAMiB,WAAajB,EAAMM,MAAQN,EAAMM,MAAQK,EAAML,MAAQK,EAAML,MAAQ,QACtEO,EAAEV,aAAgBU,EAAET,aACvBS,EAAET,YAAa,EACfS,EAAEV,aAAc,GAElBH,EAAMkB,SAAU,EAEhBlB,EAAMmB,KAAOC,EAAQP,GAErBb,EAAMqB,QAAUR,EAAEV,YAAc,aAAc,EAC9CH,EAAMsB,OAAST,EAAET,WACjBJ,EAAMuB,OAASZ,EAAMJ,YAAc,GAAIiB,OAAMR,SAASL,EAAMJ,cAAgB,GAAIiB,OAAM,IACtFxB,EAAMyB,OAAS,GAAID,OAAM,GACzB,IAAIL,GAAO,KACPO,EAAO,WACJC,MAAMd,EAAER,aACXQ,EAAER,UAAYQ,EAAER,UAAY,KAE9Bc,EAAOC,EAAQP,GACfb,EAAMmB,KAAOA,EACTN,EAAEV,cACJH,EAAMqB,QAAUO,EAAST,EAAMjB,EAAeJ,IAIlDc,GAAWf,EAAU6B,EAAM,KAE3B1B,EAAM6B,OAAO,YAAa,SAASC,GAEjC7B,EAAY6B,EACZjB,EAAEZ,UAA0B,MAAbA,EAAqB8B,EAAc9B,IAAa,EAC3DY,EAAEE,aAAeF,EAAEZ,aAAc,IACnCD,EAAMkB,QAAUc,EAAWnB,EAAEZ,YAG/ByB,MAEF1B,EAAM6B,OAAO,gBAAiB,SAASC,EAAOG,GACzCH,GAASG,IACV/B,EAAgB4B,KAGpB9B,EAAM6B,OAAO,YAAa,SAASC,EAAOG,GACrCH,GAASG,IACVpB,EAAER,UAAYW,SAASc,EAAO,OAGlC9B,EAAM6B,OAAO,cAAe,SAASC,EAAOG,GACvCH,GAASG,IACVpB,EAAEV,YAAc2B,EAChB9B,EAAMqB,QAAUR,EAAEV,YAAc,aAAc,KAGlDH,EAAM6B,OAAO,aAAc,SAASC,EAAOG,GACtCH,GAASG,IACVpB,EAAET,WAAa0B,EACf9B,EAAMsB,OAASQ,KAGnB9B,EAAM6B,OAAO,QAAS,SAASC,EAAOG,GACjCH,GAASG,IACVjC,EAAMiB,WAAaa,EAAQA,EAAQnB,EAAML,MAAQK,EAAML,MAAQ,WAKnEI,EAAQwB,GAAG,WAAY,WACrBrC,EAAUsC,OAAOvB,GACjBA,EAAW,SAOnB,QAASmB,GAAcK,GACrBA,EAASC,WAAWD,EACpB,IAAIE,GAAIF,EAAS,EAAIG,KAAKC,MAAMJ,GAAUG,KAAKE,KAAKL,GAClDM,EAAKN,EAAS,EAAK,EAErB,OAAOE,GAAII,EAWb,QAASV,GAAWI,GAElB,GAAIE,GAAIF,EAAS,EAAIG,KAAKC,MAAMJ,GAAUG,KAAKE,KAAKL,GAClDM,EAAIH,KAAKI,OAAQP,EAAS,EAAIA,EAAkB,GAATA,GAAe,EAAK,GAE7D,OAAO,OAAoB,IAAXA,EAAe,IAAOA,EAAS,EAAI,KAAO,KAAOQ,EAAKN,GAAK,IAAMO,EAAKH,GAAGI,UAAU,EAAG,IAIxG,QAASF,GAAKG,GACZ,MAAU,GAANA,GACMA,EAAM,IAAM,KAAO,KAAc,GAANA,GAErB,GAANA,EAAW,IAAM,IAAMA,EAKnC,QAASF,GAAKE,GACZ,MAAOA,IAAa,GAANA,EAAW,IAAM,IAGjC,QAAS3B,GAAQP,GACf,GAAImC,GAAQrB,MAAMd,EAAER,WAAsC,GAAI4C,MAA5B,GAAIA,MAAKpC,EAAER,UAC7C,IAAoB,OAAhBQ,EAAEZ,WAAsBY,EAAEZ,aAAc,EAAO,CAKjD,GAAIiD,GAAMF,EAAIG,UAAuC,IAA1BH,EAAII,oBAG3BC,EAAY,GAAIJ,MAAKC,EAAO,KAAUrC,EAAEZ,UAC5C,QACEqD,IAAKD,EAAUE,WACfC,KAAMH,EAAUI,aAChBC,KAAML,EAAUM,aAChBxC,KAAMkC,GAIR,OACEC,IAAKN,EAAIO,WACTC,KAAMR,EAAIS,aACVC,KAAMV,EAAIW,aACVxC,KAAM6B,GAKZ,QAASpB,GAASgC,EAAGC,EAAQ/D,GAC3B,MAAOA,GAAQ,QAAQ8D,EAAEzC,KAAM0C,GA5KjCC,QAAQC,OAAO,eACZC,UAAU,iBAAkB,YAAa,UACxC,SAASnE,EAAWC,GAClB,MAAOF,GAAMC,EAAWC","file":"angular-clock.min.js","sourcesContent":["(function() {\n 'use strict';\n\n /**\n * Usage pattern\n * \n */\n var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];\n var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];\n\n angular.module('ds.clock', [])\n .directive('dsWidgetClock', ['$interval', '$filter',\n function($interval, $filter) {\n return clock($interval, $filter);\n }\n ]);\n\n function clock($interval, $filter) {\n return {\n restrict: 'EA',\n scope: {\n gmtOffset: '=gmtOffset',\n digitalFormat: '=digitalFormat',\n showDigital: '=showDigital',\n showAnalog: '=showAnalog',\n startTime: '=startTime',\n theme: '=theme',\n majorsTotal: '=majorsTotal'\n },\n template: '
{{digital}}
{{gmtInfo}}
',\n link: function(scope, element, attrs) {\n var format, // date format\n stopTime; // so that we can cancel the time updates\n var o = {};\n var gmtOffset = scope.gmtOffset;\n var digitalFormat = scope.digitalFormat ? scope.digitalFormat : 'HH:mm:ss';\n o.showDigital = scope.showDigital != null ? scope.showDigital : attrs.showDigital !== undefined ? true : false;\n o.showAnalog = scope.showAnalog != null ? scope.showAnalog : attrs.showAnalog !== undefined ? true : false;\n o.showGmtInfo = attrs.showGmtInfo !== undefined ? true : false;\n o.startTime = parseInt(scope.startTime, 10); // ms\n scope.themeClass = scope.theme ? scope.theme : attrs.theme ? attrs.theme : 'light';\n if (!o.showDigital && !o.showAnalog) {\n o.showAnalog = true;\n o.showDigital = true;\n }\n scope.gmtInfo = false;\n\n scope.date = getDate(o);\n\n scope.digital = o.showDigital ? 'Loading..' : false;\n scope.analog = o.showAnalog;\n scope.majors = attrs.majorsTotal ? new Array(parseInt(attrs.majorsTotal)) : new Array(12);\n scope.minors = new Array(60);\n var date = null;\n var tick = function() {\n if (!isNaN(o.startTime)) {\n o.startTime = o.startTime + 1000;\n }\n date = getDate(o);\n scope.date = date;\n if (o.showDigital) {\n scope.digital = timeText(date, digitalFormat, $filter);\n }\n };\n\n stopTime = $interval(tick, 1000);\n // watch the expression, and update the UI on change.\n scope.$watch('gmtOffset', function(value, old) {\n\n gmtOffset = value;\n o.gmtOffset = (gmtOffset != null) ? getGMTbase100(gmtOffset) : false;\n if (o.showGmtInfo && o.gmtOffset !== false) {\n scope.gmtInfo = getGMTText(o.gmtOffset);\n }\n\n tick();\n });\n scope.$watch('digitalFormat', function(value, old) {\n if(value != old){\n digitalFormat = value;\n }\n });\n scope.$watch('startTime', function(value, old) {\n if(value != old){\n o.startTime = parseInt(value, 10);\n }\n });\n scope.$watch('showDigital', function(value, old) {\n if(value != old){\n o.showDigital = value;\n scope.digital = o.showDigital ? 'Loading..' : false;;\n }\n });\n scope.$watch('showAnalog', function(value, old) {\n if(value != old){\n o.showAnalog = value;\n scope.analog = value;\n }\n });\n scope.$watch('theme', function(value, old) {\n if(value != old){\n scope.themeClass = value ? value : attrs.theme ? attrs.theme : 'light';\n }\n });\n // listen on DOM destroy (removal) event, and cancel the next UI update\n // to prevent updating time after the DOM element was removed.\n element.on('$destroy', function() {\n $interval.cancel(stopTime);\n stopTime = null;\n });\n\n }\n };\n }\n\n function getGMTbase100(offset) {\n offset = parseFloat(offset);\n var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset),\n s = (offset % 1) / 0.6;\n\n return f + s;\n\n }\n\n function getGMTbase60(offset) {\n var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset),\n s = ((offset > 0 ? offset : offset * -1) % 1) * 60;\n return f + s;\n\n }\n\n function getGMTText(offset) {\n\n var f = offset > 0 ? Math.floor(offset) : Math.ceil(offset),\n s = Math.round(((offset > 0 ? offset : offset * -1) % 1) * 60);\n\n return 'GMT' + (offset === 0 ? '' : ((offset > 0 ? ' +' : ' ') + lpad(f) + '.' + rpad(s).substring(0, 2)));\n\n }\n\n function lpad(num) {\n if (num < 0) {\n return (num > -10 ? '-0' : '-') + (num * -1);\n } else {\n return (num < 10 ? '0' : '') + num;\n }\n\n }\n\n function rpad(num) {\n return num + (num < 10 ? '0' : '');\n }\n // Checkfor offset and get correct time\n function getDate(o) {\n var now = (!isNaN(o.startTime)) ? new Date(o.startTime) : new Date();\n if (o.gmtOffset !== null && o.gmtOffset !== false) {\n /*Use GMT + gmtOffset\n convert to msec\n add local time zone offset\n get UTC time in msec*/\n var utc = now.getTime() + (now.getTimezoneOffset() * 60000);\n // create new Date object for different city\n // using supplied offset\n var offsetNow = new Date(utc + (3600000 * o.gmtOffset));\n return {\n hrs: offsetNow.getHours(),\n mins: offsetNow.getMinutes(),\n secs: offsetNow.getSeconds(),\n date: offsetNow\n };\n } else {\n // Use local time\n return {\n hrs: now.getHours(),\n mins: now.getMinutes(),\n secs: now.getSeconds(),\n date: now\n };\n }\n }\n\n function timeText(d, format, $filter) {\n return $filter('date')(d.date, format);\n }\n\n})();\n"]} -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Angular-Clock 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 55 |
56 |
57 |
58 | 59 | 64 | show digital 65 |
66 |
67 |

Angular Clock Widget

68 |

Responsive, beautiful clocks for AngularJS built using SVG 69 |

70 |

71 | Code on Github 72 | 73 | Download (latest) 74 | 75 |

76 |
77 |
78 |
79 |
80 |
81 | 84 |

Dependencies

85 |

86 | This repository contains native AngularJS directives to render a clock face. The only required dependencies are: 87 |

88 |
    89 |
  • AngularJS (tested with 1.3.14 although it probably works with older versions)
  • 90 |
91 |

Files to download

92 |

The easiest is to download with bower:

93 |
bower install angular-ui-clock --save 
94 |

Alternatively files can be downloaded downloaded from Github. 95 |

96 |

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

97 |

Installation

98 |
<script src="bower_components/dist/angular-clock.js"></script>
99 |

As soon as you've got all the files downloaded and included in your page you just need to declare a dependency on the ds.clock module: 100 |
101 |

angular.module('myModule', ['ds.clock']);
102 |

103 |

CSS

104 |

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

105 |
<link rel="stylesheet" href="bower_components/dist/angular-clock.css">
106 |

If you need the default digital clock font Syncopate, include this. Else check styling section to use your own font

107 |
<link href="//fonts.googleapis.com/css?family=Syncopate:400,700" rel="stylesheet" type="text/css">
108 | 109 |

Options

110 |

There are several options that you can set as attributes on the directive element(can use other angular flavors like data-*, ng-attr-*, x-* also)

111 |
    112 |
  1. start-time : init clock with specific time in milliseconds, (default: undefined)
  2. 113 |
  3. digital-format : digital clock format in angular date filter format (default: 'HH-mm-ss'). Pass as string enclosed in single quote or bound to a scope variable
  4. 114 |
  5. gmt-offset : shows time for the given GMT offset in clock, (default: false, shows local time) example: India -> 5.30, Singapore -> 8 , venezula -> -4.30, Nepal -> 5.45
  6. 115 |
  7. show-digital: shows digital clock, (default: true if both show-analog &show-digital are not set)
  8. 116 |
  9. show-analog : shows analog clock, (default: true if both show-analog &show-digital are not set)
  10. 117 |
  11. show-gmt-info : shows GMT offset value, (default: false) shows only if gmt-offset attribute is set
  12. 118 |
  13. theme : analog clockface theme, (default: light)
  14. 119 |
120 |

All clocks are responsive and reactive and will update automatically when data changes. start-time, digital-format, 121 | and gmt-offset are bound attributes and hence need to be set in the scope or using gmt-offset="'5.3'" format with extra single quotes.

122 |

show-digital, show-analog and theme can be used as bound attributes or as normal attributes

123 |
124 |
125 | 128 |
129 |
130 |
131 |
Default Clock
132 |
133 |
134 | 135 |
136 | 137 |
138 |
139 |
140 |
141 | 142 | 143 |
<ds-widget-clock></ds-widget-clock>
144 |
145 | 146 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
147 | 
148 | });
149 |               
150 |
151 |
152 |
153 |
154 |
155 |
156 |
157 |
Clock with Start Time
158 |
159 |
160 | 161 |
162 | 163 |
164 |
165 |
166 |
167 | 168 | 169 |
<ds-widget-clock start-time="startTimeValue"></ds-widget-clock>
171 |
172 | 173 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
174 |         $scope.startTimeValue = 1430990693334;
175 | 
176 | });
177 |               
178 |
179 |
180 |
181 |
182 |
183 |
184 |
185 |
Clock with Timezone Offset
186 |
187 |
188 | 190 | 232 |
233 |
234 | 235 |
236 | 237 |
238 |
239 |
240 |
241 | 242 | 243 |
<ds-widget-clock gmt-offset="gmtValue" show-gmt-info></ds-widget-clock>
244 |
245 | 246 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
247 |         $scope.gmtValue = 5.3;
248 | });
249 |               
250 |
251 |
252 |
253 |
254 |
255 |
256 |
257 |
Clock with AM/PM in Dark theme
258 |
259 |
260 | 261 |
262 | 263 |
264 |
265 |
266 |
267 | 268 | 269 |
<ds-widget-clock theme="dark" digital-format="'hh:mm:ss a'"></ds-widget-clock>
270 | or 271 |
<ds-widget-clock theme="theme" digital-format="'hh:mm:ss a'"></ds-widget-clock>
272 |
273 | 274 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
275 | 
276 |         $scope.theme = 'dark';
277 | 
278 | });
279 |               
280 |
281 |
282 |
283 |
284 |
285 |
286 |
287 |
Digital clocks
288 |
289 |
290 | 291 |
292 | 293 |
294 | 295 |
296 | 297 |
298 | 299 |
300 | 301 |
302 | 303 |
304 |
305 |
306 |
307 | 308 | 309 |

310 | <ds-widget-clock data-show-digital digital-format="'HH:mm'"></ds-widget-clock>
311 | <hr>
312 | <ds-widget-clock data-show-digital></ds-widget-clock>
313 | <hr>
314 | <ds-widget-clock show-digital digital-format="'hh:mm:ss a'">></ds-widget-clock>
315 | <hr>
316 | <ds-widget-clock show-digital digital-format="'hh:mm:ss a'"> gmt-offset="5.3" show-gmt-info></ds-widget-clock>
317 | <hr>
318 | <ds-widget-clock show-digital digital-format="format">></ds-widget-clock>
319 | <hr>
320 | <ds-widget-clock show-digital digital-format="'EEEE MMMM d,yyyy hh:mm:ss a Z'">></ds-widget-clock>
321 | 
322 |
323 | 324 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
325 |         $scope.format = 'dd-MMM-yyyy hh:mm:ss a';
326 | });
327 |               
328 |
329 |
330 |
331 |
332 |
333 |
334 |
335 |
Analog clock
336 |
337 |
338 | 339 |
340 | 341 |
342 |
343 |
344 |
345 | 346 | 347 |
<ds-widget-clock show-analog></ds-widget-clock>
348 |
349 | 350 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
351 | 
352 | });
353 |               
354 |
355 |
356 |
357 |
358 |
359 |
360 | 364 |
365 |
366 |
367 |
Custom Analog Clock Theme
368 |
369 |
370 | 371 |
372 | 373 |
374 |
375 |
376 |
377 | 378 | 379 |

380 | <!-- Theme blue-light is defined is css -->
381 | <ds-widget-clock show-analog theme="blue-light"></ds-widget-clock>
382 |
383 | 384 |

385 | .widget-clock.blue-light .clock-face {
386 |   stroke: #153b6f;
387 |   fill: #0e2434;
388 | }
389 | .widget-clock.blue-light .minor {
390 |   stroke: #0089ff;
391 |   stroke-width: 0.5;
392 | }
393 | .widget-clock.blue-light .major {
394 |   stroke: rgba(119, 176, 242, 0.97);
395 |   stroke-width: 0.5;
396 | }
397 | .widget-clock.blue-light .hour {
398 |   stroke: rgba(119, 176, 242, 0.97);
399 |   stroke-width: 1;
400 | }
401 | .widget-clock.blue-light .minute {
402 |   stroke: #0089ff;
403 |   stroke-width: 0.75;
404 | }
405 | .widget-clock.blue-light .second,
406 | .widget-clock.blue-light .second-counterweight {
407 |   stroke: rgb(234, 31, 54);
408 |   stroke-width: 0.5;
409 | }
410 | .widget-clock.blue-light .second-counterweight {
411 |   stroke-width: 1.5;
412 | }
413 |               
414 |
415 | 416 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
417 | 
418 | });
419 |               
420 |
421 |
422 |
423 |
424 |
425 |
426 |
427 |
Custom Digital Clock Theme
428 |
429 |
430 | 431 |
432 | 433 |
434 |
435 |
436 |
437 | 438 | 439 |

440 | <!-- Theme blue-light is defined is css -->
441 | <ds-widget-clock show-digital theme="blue-light" digital-format="'hh:mm:ss a'"></ds-widget-clock>
442 |
443 | 444 |

445 | @import url('http://fonts.googleapis.com/css?family=Rationale');
446 | /* this import should be first line in css file else add as <link> in html*/
447 | .widget-clock.blue-light .digital {
448 |   text-align: center;
449 | }
450 | .widget-clock.blue-light .time {
451 |   font-family: 'Rationale', sans-serif;
452 |   font-size: 3.0em;
453 |   color: #1da4eb;
454 | }
455 |               
456 |
457 | 458 |
angular.module("app", ["ds.clock"]).controller("AppCtrl", function ($scope) {
459 | 
460 | });
461 |               
462 |
463 |
464 |
465 |
466 |
467 |
468 | 478 | 479 | 480 | 481 | 482 | 483 | 484 | 485 | 486 | 487 | 488 | 498 | 499 | 500 | 501 | -------------------------------------------------------------------------------- /demo/lib/css/font-awesome.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome 3 | * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) 4 | */ 5 | /* FONT PATH 6 | * -------------------------- */ 7 | @font-face { 8 | font-family: 'FontAwesome'; 9 | src: url('../fonts/fontawesome-webfont.eot?v=4.1.0'); 10 | src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg'); 11 | font-weight: normal; 12 | font-style: normal; 13 | } 14 | .fa { 15 | display: inline-block; 16 | font-family: FontAwesome; 17 | font-style: normal; 18 | font-weight: normal; 19 | line-height: 1; 20 | -webkit-font-smoothing: antialiased; 21 | -moz-osx-font-smoothing: grayscale; 22 | } 23 | /* makes the font 33% larger relative to the icon container */ 24 | .fa-lg { 25 | font-size: 1.33333333em; 26 | line-height: 0.75em; 27 | vertical-align: -15%; 28 | } 29 | .fa-2x { 30 | font-size: 2em; 31 | } 32 | .fa-3x { 33 | font-size: 3em; 34 | } 35 | .fa-4x { 36 | font-size: 4em; 37 | } 38 | .fa-5x { 39 | font-size: 5em; 40 | } 41 | .fa-fw { 42 | width: 1.28571429em; 43 | text-align: center; 44 | } 45 | .fa-ul { 46 | padding-left: 0; 47 | margin-left: 2.14285714em; 48 | list-style-type: none; 49 | } 50 | .fa-ul > li { 51 | position: relative; 52 | } 53 | .fa-li { 54 | position: absolute; 55 | left: -2.14285714em; 56 | width: 2.14285714em; 57 | top: 0.14285714em; 58 | text-align: center; 59 | } 60 | .fa-li.fa-lg { 61 | left: -1.85714286em; 62 | } 63 | .fa-border { 64 | padding: .2em .25em .15em; 65 | border: solid 0.08em #eeeeee; 66 | border-radius: .1em; 67 | } 68 | .pull-right { 69 | float: right; 70 | } 71 | .pull-left { 72 | float: left; 73 | } 74 | .fa.pull-left { 75 | margin-right: .3em; 76 | } 77 | .fa.pull-right { 78 | margin-left: .3em; 79 | } 80 | .fa-spin { 81 | -webkit-animation: spin 2s infinite linear; 82 | -moz-animation: spin 2s infinite linear; 83 | -o-animation: spin 2s infinite linear; 84 | animation: spin 2s infinite linear; 85 | } 86 | @-moz-keyframes spin { 87 | 0% { 88 | -moz-transform: rotate(0deg); 89 | } 90 | 100% { 91 | -moz-transform: rotate(359deg); 92 | } 93 | } 94 | @-webkit-keyframes spin { 95 | 0% { 96 | -webkit-transform: rotate(0deg); 97 | } 98 | 100% { 99 | -webkit-transform: rotate(359deg); 100 | } 101 | } 102 | @-o-keyframes spin { 103 | 0% { 104 | -o-transform: rotate(0deg); 105 | } 106 | 100% { 107 | -o-transform: rotate(359deg); 108 | } 109 | } 110 | @keyframes spin { 111 | 0% { 112 | -webkit-transform: rotate(0deg); 113 | transform: rotate(0deg); 114 | } 115 | 100% { 116 | -webkit-transform: rotate(359deg); 117 | transform: rotate(359deg); 118 | } 119 | } 120 | .fa-rotate-90 { 121 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); 122 | -webkit-transform: rotate(90deg); 123 | -moz-transform: rotate(90deg); 124 | -ms-transform: rotate(90deg); 125 | -o-transform: rotate(90deg); 126 | transform: rotate(90deg); 127 | } 128 | .fa-rotate-180 { 129 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); 130 | -webkit-transform: rotate(180deg); 131 | -moz-transform: rotate(180deg); 132 | -ms-transform: rotate(180deg); 133 | -o-transform: rotate(180deg); 134 | transform: rotate(180deg); 135 | } 136 | .fa-rotate-270 { 137 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 138 | -webkit-transform: rotate(270deg); 139 | -moz-transform: rotate(270deg); 140 | -ms-transform: rotate(270deg); 141 | -o-transform: rotate(270deg); 142 | transform: rotate(270deg); 143 | } 144 | .fa-flip-horizontal { 145 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1); 146 | -webkit-transform: scale(-1, 1); 147 | -moz-transform: scale(-1, 1); 148 | -ms-transform: scale(-1, 1); 149 | -o-transform: scale(-1, 1); 150 | transform: scale(-1, 1); 151 | } 152 | .fa-flip-vertical { 153 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1); 154 | -webkit-transform: scale(1, -1); 155 | -moz-transform: scale(1, -1); 156 | -ms-transform: scale(1, -1); 157 | -o-transform: scale(1, -1); 158 | transform: scale(1, -1); 159 | } 160 | .fa-stack { 161 | position: relative; 162 | display: inline-block; 163 | width: 2em; 164 | height: 2em; 165 | line-height: 2em; 166 | vertical-align: middle; 167 | } 168 | .fa-stack-1x, 169 | .fa-stack-2x { 170 | position: absolute; 171 | left: 0; 172 | width: 100%; 173 | text-align: center; 174 | } 175 | .fa-stack-1x { 176 | line-height: inherit; 177 | } 178 | .fa-stack-2x { 179 | font-size: 2em; 180 | } 181 | .fa-inverse { 182 | color: #ffffff; 183 | } 184 | /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen 185 | readers do not read off random characters that represent icons */ 186 | .fa-glass:before { 187 | content: "\f000"; 188 | } 189 | .fa-music:before { 190 | content: "\f001"; 191 | } 192 | .fa-search:before { 193 | content: "\f002"; 194 | } 195 | .fa-envelope-o:before { 196 | content: "\f003"; 197 | } 198 | .fa-heart:before { 199 | content: "\f004"; 200 | } 201 | .fa-star:before { 202 | content: "\f005"; 203 | } 204 | .fa-star-o:before { 205 | content: "\f006"; 206 | } 207 | .fa-user:before { 208 | content: "\f007"; 209 | } 210 | .fa-film:before { 211 | content: "\f008"; 212 | } 213 | .fa-th-large:before { 214 | content: "\f009"; 215 | } 216 | .fa-th:before { 217 | content: "\f00a"; 218 | } 219 | .fa-th-list:before { 220 | content: "\f00b"; 221 | } 222 | .fa-check:before { 223 | content: "\f00c"; 224 | } 225 | .fa-times:before { 226 | content: "\f00d"; 227 | } 228 | .fa-search-plus:before { 229 | content: "\f00e"; 230 | } 231 | .fa-search-minus:before { 232 | content: "\f010"; 233 | } 234 | .fa-power-off:before { 235 | content: "\f011"; 236 | } 237 | .fa-signal:before { 238 | content: "\f012"; 239 | } 240 | .fa-gear:before, 241 | .fa-cog:before { 242 | content: "\f013"; 243 | } 244 | .fa-trash-o:before { 245 | content: "\f014"; 246 | } 247 | .fa-home:before { 248 | content: "\f015"; 249 | } 250 | .fa-file-o:before { 251 | content: "\f016"; 252 | } 253 | .fa-clock-o:before { 254 | content: "\f017"; 255 | } 256 | .fa-road:before { 257 | content: "\f018"; 258 | } 259 | .fa-download:before { 260 | content: "\f019"; 261 | } 262 | .fa-arrow-circle-o-down:before { 263 | content: "\f01a"; 264 | } 265 | .fa-arrow-circle-o-up:before { 266 | content: "\f01b"; 267 | } 268 | .fa-inbox:before { 269 | content: "\f01c"; 270 | } 271 | .fa-play-circle-o:before { 272 | content: "\f01d"; 273 | } 274 | .fa-rotate-right:before, 275 | .fa-repeat:before { 276 | content: "\f01e"; 277 | } 278 | .fa-refresh:before { 279 | content: "\f021"; 280 | } 281 | .fa-list-alt:before { 282 | content: "\f022"; 283 | } 284 | .fa-lock:before { 285 | content: "\f023"; 286 | } 287 | .fa-flag:before { 288 | content: "\f024"; 289 | } 290 | .fa-headphones:before { 291 | content: "\f025"; 292 | } 293 | .fa-volume-off:before { 294 | content: "\f026"; 295 | } 296 | .fa-volume-down:before { 297 | content: "\f027"; 298 | } 299 | .fa-volume-up:before { 300 | content: "\f028"; 301 | } 302 | .fa-qrcode:before { 303 | content: "\f029"; 304 | } 305 | .fa-barcode:before { 306 | content: "\f02a"; 307 | } 308 | .fa-tag:before { 309 | content: "\f02b"; 310 | } 311 | .fa-tags:before { 312 | content: "\f02c"; 313 | } 314 | .fa-book:before { 315 | content: "\f02d"; 316 | } 317 | .fa-bookmark:before { 318 | content: "\f02e"; 319 | } 320 | .fa-print:before { 321 | content: "\f02f"; 322 | } 323 | .fa-camera:before { 324 | content: "\f030"; 325 | } 326 | .fa-font:before { 327 | content: "\f031"; 328 | } 329 | .fa-bold:before { 330 | content: "\f032"; 331 | } 332 | .fa-italic:before { 333 | content: "\f033"; 334 | } 335 | .fa-text-height:before { 336 | content: "\f034"; 337 | } 338 | .fa-text-width:before { 339 | content: "\f035"; 340 | } 341 | .fa-align-left:before { 342 | content: "\f036"; 343 | } 344 | .fa-align-center:before { 345 | content: "\f037"; 346 | } 347 | .fa-align-right:before { 348 | content: "\f038"; 349 | } 350 | .fa-align-justify:before { 351 | content: "\f039"; 352 | } 353 | .fa-list:before { 354 | content: "\f03a"; 355 | } 356 | .fa-dedent:before, 357 | .fa-outdent:before { 358 | content: "\f03b"; 359 | } 360 | .fa-indent:before { 361 | content: "\f03c"; 362 | } 363 | .fa-video-camera:before { 364 | content: "\f03d"; 365 | } 366 | .fa-photo:before, 367 | .fa-image:before, 368 | .fa-picture-o:before { 369 | content: "\f03e"; 370 | } 371 | .fa-pencil:before { 372 | content: "\f040"; 373 | } 374 | .fa-map-marker:before { 375 | content: "\f041"; 376 | } 377 | .fa-adjust:before { 378 | content: "\f042"; 379 | } 380 | .fa-tint:before { 381 | content: "\f043"; 382 | } 383 | .fa-edit:before, 384 | .fa-pencil-square-o:before { 385 | content: "\f044"; 386 | } 387 | .fa-share-square-o:before { 388 | content: "\f045"; 389 | } 390 | .fa-check-square-o:before { 391 | content: "\f046"; 392 | } 393 | .fa-arrows:before { 394 | content: "\f047"; 395 | } 396 | .fa-step-backward:before { 397 | content: "\f048"; 398 | } 399 | .fa-fast-backward:before { 400 | content: "\f049"; 401 | } 402 | .fa-backward:before { 403 | content: "\f04a"; 404 | } 405 | .fa-play:before { 406 | content: "\f04b"; 407 | } 408 | .fa-pause:before { 409 | content: "\f04c"; 410 | } 411 | .fa-stop:before { 412 | content: "\f04d"; 413 | } 414 | .fa-forward:before { 415 | content: "\f04e"; 416 | } 417 | .fa-fast-forward:before { 418 | content: "\f050"; 419 | } 420 | .fa-step-forward:before { 421 | content: "\f051"; 422 | } 423 | .fa-eject:before { 424 | content: "\f052"; 425 | } 426 | .fa-chevron-left:before { 427 | content: "\f053"; 428 | } 429 | .fa-chevron-right:before { 430 | content: "\f054"; 431 | } 432 | .fa-plus-circle:before { 433 | content: "\f055"; 434 | } 435 | .fa-minus-circle:before { 436 | content: "\f056"; 437 | } 438 | .fa-times-circle:before { 439 | content: "\f057"; 440 | } 441 | .fa-check-circle:before { 442 | content: "\f058"; 443 | } 444 | .fa-question-circle:before { 445 | content: "\f059"; 446 | } 447 | .fa-info-circle:before { 448 | content: "\f05a"; 449 | } 450 | .fa-crosshairs:before { 451 | content: "\f05b"; 452 | } 453 | .fa-times-circle-o:before { 454 | content: "\f05c"; 455 | } 456 | .fa-check-circle-o:before { 457 | content: "\f05d"; 458 | } 459 | .fa-ban:before { 460 | content: "\f05e"; 461 | } 462 | .fa-arrow-left:before { 463 | content: "\f060"; 464 | } 465 | .fa-arrow-right:before { 466 | content: "\f061"; 467 | } 468 | .fa-arrow-up:before { 469 | content: "\f062"; 470 | } 471 | .fa-arrow-down:before { 472 | content: "\f063"; 473 | } 474 | .fa-mail-forward:before, 475 | .fa-share:before { 476 | content: "\f064"; 477 | } 478 | .fa-expand:before { 479 | content: "\f065"; 480 | } 481 | .fa-compress:before { 482 | content: "\f066"; 483 | } 484 | .fa-plus:before { 485 | content: "\f067"; 486 | } 487 | .fa-minus:before { 488 | content: "\f068"; 489 | } 490 | .fa-asterisk:before { 491 | content: "\f069"; 492 | } 493 | .fa-exclamation-circle:before { 494 | content: "\f06a"; 495 | } 496 | .fa-gift:before { 497 | content: "\f06b"; 498 | } 499 | .fa-leaf:before { 500 | content: "\f06c"; 501 | } 502 | .fa-fire:before { 503 | content: "\f06d"; 504 | } 505 | .fa-eye:before { 506 | content: "\f06e"; 507 | } 508 | .fa-eye-slash:before { 509 | content: "\f070"; 510 | } 511 | .fa-warning:before, 512 | .fa-exclamation-triangle:before { 513 | content: "\f071"; 514 | } 515 | .fa-plane:before { 516 | content: "\f072"; 517 | } 518 | .fa-calendar:before { 519 | content: "\f073"; 520 | } 521 | .fa-random:before { 522 | content: "\f074"; 523 | } 524 | .fa-comment:before { 525 | content: "\f075"; 526 | } 527 | .fa-magnet:before { 528 | content: "\f076"; 529 | } 530 | .fa-chevron-up:before { 531 | content: "\f077"; 532 | } 533 | .fa-chevron-down:before { 534 | content: "\f078"; 535 | } 536 | .fa-retweet:before { 537 | content: "\f079"; 538 | } 539 | .fa-shopping-cart:before { 540 | content: "\f07a"; 541 | } 542 | .fa-folder:before { 543 | content: "\f07b"; 544 | } 545 | .fa-folder-open:before { 546 | content: "\f07c"; 547 | } 548 | .fa-arrows-v:before { 549 | content: "\f07d"; 550 | } 551 | .fa-arrows-h:before { 552 | content: "\f07e"; 553 | } 554 | .fa-bar-chart-o:before { 555 | content: "\f080"; 556 | } 557 | .fa-twitter-square:before { 558 | content: "\f081"; 559 | } 560 | .fa-facebook-square:before { 561 | content: "\f082"; 562 | } 563 | .fa-camera-retro:before { 564 | content: "\f083"; 565 | } 566 | .fa-key:before { 567 | content: "\f084"; 568 | } 569 | .fa-gears:before, 570 | .fa-cogs:before { 571 | content: "\f085"; 572 | } 573 | .fa-comments:before { 574 | content: "\f086"; 575 | } 576 | .fa-thumbs-o-up:before { 577 | content: "\f087"; 578 | } 579 | .fa-thumbs-o-down:before { 580 | content: "\f088"; 581 | } 582 | .fa-star-half:before { 583 | content: "\f089"; 584 | } 585 | .fa-heart-o:before { 586 | content: "\f08a"; 587 | } 588 | .fa-sign-out:before { 589 | content: "\f08b"; 590 | } 591 | .fa-linkedin-square:before { 592 | content: "\f08c"; 593 | } 594 | .fa-thumb-tack:before { 595 | content: "\f08d"; 596 | } 597 | .fa-external-link:before { 598 | content: "\f08e"; 599 | } 600 | .fa-sign-in:before { 601 | content: "\f090"; 602 | } 603 | .fa-trophy:before { 604 | content: "\f091"; 605 | } 606 | .fa-github-square:before { 607 | content: "\f092"; 608 | } 609 | .fa-upload:before { 610 | content: "\f093"; 611 | } 612 | .fa-lemon-o:before { 613 | content: "\f094"; 614 | } 615 | .fa-phone:before { 616 | content: "\f095"; 617 | } 618 | .fa-square-o:before { 619 | content: "\f096"; 620 | } 621 | .fa-bookmark-o:before { 622 | content: "\f097"; 623 | } 624 | .fa-phone-square:before { 625 | content: "\f098"; 626 | } 627 | .fa-twitter:before { 628 | content: "\f099"; 629 | } 630 | .fa-facebook:before { 631 | content: "\f09a"; 632 | } 633 | .fa-github:before { 634 | content: "\f09b"; 635 | } 636 | .fa-unlock:before { 637 | content: "\f09c"; 638 | } 639 | .fa-credit-card:before { 640 | content: "\f09d"; 641 | } 642 | .fa-rss:before { 643 | content: "\f09e"; 644 | } 645 | .fa-hdd-o:before { 646 | content: "\f0a0"; 647 | } 648 | .fa-bullhorn:before { 649 | content: "\f0a1"; 650 | } 651 | .fa-bell:before { 652 | content: "\f0f3"; 653 | } 654 | .fa-certificate:before { 655 | content: "\f0a3"; 656 | } 657 | .fa-hand-o-right:before { 658 | content: "\f0a4"; 659 | } 660 | .fa-hand-o-left:before { 661 | content: "\f0a5"; 662 | } 663 | .fa-hand-o-up:before { 664 | content: "\f0a6"; 665 | } 666 | .fa-hand-o-down:before { 667 | content: "\f0a7"; 668 | } 669 | .fa-arrow-circle-left:before { 670 | content: "\f0a8"; 671 | } 672 | .fa-arrow-circle-right:before { 673 | content: "\f0a9"; 674 | } 675 | .fa-arrow-circle-up:before { 676 | content: "\f0aa"; 677 | } 678 | .fa-arrow-circle-down:before { 679 | content: "\f0ab"; 680 | } 681 | .fa-globe:before { 682 | content: "\f0ac"; 683 | } 684 | .fa-wrench:before { 685 | content: "\f0ad"; 686 | } 687 | .fa-tasks:before { 688 | content: "\f0ae"; 689 | } 690 | .fa-filter:before { 691 | content: "\f0b0"; 692 | } 693 | .fa-briefcase:before { 694 | content: "\f0b1"; 695 | } 696 | .fa-arrows-alt:before { 697 | content: "\f0b2"; 698 | } 699 | .fa-group:before, 700 | .fa-users:before { 701 | content: "\f0c0"; 702 | } 703 | .fa-chain:before, 704 | .fa-link:before { 705 | content: "\f0c1"; 706 | } 707 | .fa-cloud:before { 708 | content: "\f0c2"; 709 | } 710 | .fa-flask:before { 711 | content: "\f0c3"; 712 | } 713 | .fa-cut:before, 714 | .fa-scissors:before { 715 | content: "\f0c4"; 716 | } 717 | .fa-copy:before, 718 | .fa-files-o:before { 719 | content: "\f0c5"; 720 | } 721 | .fa-paperclip:before { 722 | content: "\f0c6"; 723 | } 724 | .fa-save:before, 725 | .fa-floppy-o:before { 726 | content: "\f0c7"; 727 | } 728 | .fa-square:before { 729 | content: "\f0c8"; 730 | } 731 | .fa-navicon:before, 732 | .fa-reorder:before, 733 | .fa-bars:before { 734 | content: "\f0c9"; 735 | } 736 | .fa-list-ul:before { 737 | content: "\f0ca"; 738 | } 739 | .fa-list-ol:before { 740 | content: "\f0cb"; 741 | } 742 | .fa-strikethrough:before { 743 | content: "\f0cc"; 744 | } 745 | .fa-underline:before { 746 | content: "\f0cd"; 747 | } 748 | .fa-table:before { 749 | content: "\f0ce"; 750 | } 751 | .fa-magic:before { 752 | content: "\f0d0"; 753 | } 754 | .fa-truck:before { 755 | content: "\f0d1"; 756 | } 757 | .fa-pinterest:before { 758 | content: "\f0d2"; 759 | } 760 | .fa-pinterest-square:before { 761 | content: "\f0d3"; 762 | } 763 | .fa-google-plus-square:before { 764 | content: "\f0d4"; 765 | } 766 | .fa-google-plus:before { 767 | content: "\f0d5"; 768 | } 769 | .fa-money:before { 770 | content: "\f0d6"; 771 | } 772 | .fa-caret-down:before { 773 | content: "\f0d7"; 774 | } 775 | .fa-caret-up:before { 776 | content: "\f0d8"; 777 | } 778 | .fa-caret-left:before { 779 | content: "\f0d9"; 780 | } 781 | .fa-caret-right:before { 782 | content: "\f0da"; 783 | } 784 | .fa-columns:before { 785 | content: "\f0db"; 786 | } 787 | .fa-unsorted:before, 788 | .fa-sort:before { 789 | content: "\f0dc"; 790 | } 791 | .fa-sort-down:before, 792 | .fa-sort-desc:before { 793 | content: "\f0dd"; 794 | } 795 | .fa-sort-up:before, 796 | .fa-sort-asc:before { 797 | content: "\f0de"; 798 | } 799 | .fa-envelope:before { 800 | content: "\f0e0"; 801 | } 802 | .fa-linkedin:before { 803 | content: "\f0e1"; 804 | } 805 | .fa-rotate-left:before, 806 | .fa-undo:before { 807 | content: "\f0e2"; 808 | } 809 | .fa-legal:before, 810 | .fa-gavel:before { 811 | content: "\f0e3"; 812 | } 813 | .fa-dashboard:before, 814 | .fa-tachometer:before { 815 | content: "\f0e4"; 816 | } 817 | .fa-comment-o:before { 818 | content: "\f0e5"; 819 | } 820 | .fa-comments-o:before { 821 | content: "\f0e6"; 822 | } 823 | .fa-flash:before, 824 | .fa-bolt:before { 825 | content: "\f0e7"; 826 | } 827 | .fa-sitemap:before { 828 | content: "\f0e8"; 829 | } 830 | .fa-umbrella:before { 831 | content: "\f0e9"; 832 | } 833 | .fa-paste:before, 834 | .fa-clipboard:before { 835 | content: "\f0ea"; 836 | } 837 | .fa-lightbulb-o:before { 838 | content: "\f0eb"; 839 | } 840 | .fa-exchange:before { 841 | content: "\f0ec"; 842 | } 843 | .fa-cloud-download:before { 844 | content: "\f0ed"; 845 | } 846 | .fa-cloud-upload:before { 847 | content: "\f0ee"; 848 | } 849 | .fa-user-md:before { 850 | content: "\f0f0"; 851 | } 852 | .fa-stethoscope:before { 853 | content: "\f0f1"; 854 | } 855 | .fa-suitcase:before { 856 | content: "\f0f2"; 857 | } 858 | .fa-bell-o:before { 859 | content: "\f0a2"; 860 | } 861 | .fa-coffee:before { 862 | content: "\f0f4"; 863 | } 864 | .fa-cutlery:before { 865 | content: "\f0f5"; 866 | } 867 | .fa-file-text-o:before { 868 | content: "\f0f6"; 869 | } 870 | .fa-building-o:before { 871 | content: "\f0f7"; 872 | } 873 | .fa-hospital-o:before { 874 | content: "\f0f8"; 875 | } 876 | .fa-ambulance:before { 877 | content: "\f0f9"; 878 | } 879 | .fa-medkit:before { 880 | content: "\f0fa"; 881 | } 882 | .fa-fighter-jet:before { 883 | content: "\f0fb"; 884 | } 885 | .fa-beer:before { 886 | content: "\f0fc"; 887 | } 888 | .fa-h-square:before { 889 | content: "\f0fd"; 890 | } 891 | .fa-plus-square:before { 892 | content: "\f0fe"; 893 | } 894 | .fa-angle-double-left:before { 895 | content: "\f100"; 896 | } 897 | .fa-angle-double-right:before { 898 | content: "\f101"; 899 | } 900 | .fa-angle-double-up:before { 901 | content: "\f102"; 902 | } 903 | .fa-angle-double-down:before { 904 | content: "\f103"; 905 | } 906 | .fa-angle-left:before { 907 | content: "\f104"; 908 | } 909 | .fa-angle-right:before { 910 | content: "\f105"; 911 | } 912 | .fa-angle-up:before { 913 | content: "\f106"; 914 | } 915 | .fa-angle-down:before { 916 | content: "\f107"; 917 | } 918 | .fa-desktop:before { 919 | content: "\f108"; 920 | } 921 | .fa-laptop:before { 922 | content: "\f109"; 923 | } 924 | .fa-tablet:before { 925 | content: "\f10a"; 926 | } 927 | .fa-mobile-phone:before, 928 | .fa-mobile:before { 929 | content: "\f10b"; 930 | } 931 | .fa-circle-o:before { 932 | content: "\f10c"; 933 | } 934 | .fa-quote-left:before { 935 | content: "\f10d"; 936 | } 937 | .fa-quote-right:before { 938 | content: "\f10e"; 939 | } 940 | .fa-spinner:before { 941 | content: "\f110"; 942 | } 943 | .fa-circle:before { 944 | content: "\f111"; 945 | } 946 | .fa-mail-reply:before, 947 | .fa-reply:before { 948 | content: "\f112"; 949 | } 950 | .fa-github-alt:before { 951 | content: "\f113"; 952 | } 953 | .fa-folder-o:before { 954 | content: "\f114"; 955 | } 956 | .fa-folder-open-o:before { 957 | content: "\f115"; 958 | } 959 | .fa-smile-o:before { 960 | content: "\f118"; 961 | } 962 | .fa-frown-o:before { 963 | content: "\f119"; 964 | } 965 | .fa-meh-o:before { 966 | content: "\f11a"; 967 | } 968 | .fa-gamepad:before { 969 | content: "\f11b"; 970 | } 971 | .fa-keyboard-o:before { 972 | content: "\f11c"; 973 | } 974 | .fa-flag-o:before { 975 | content: "\f11d"; 976 | } 977 | .fa-flag-checkered:before { 978 | content: "\f11e"; 979 | } 980 | .fa-terminal:before { 981 | content: "\f120"; 982 | } 983 | .fa-code:before { 984 | content: "\f121"; 985 | } 986 | .fa-mail-reply-all:before, 987 | .fa-reply-all:before { 988 | content: "\f122"; 989 | } 990 | .fa-star-half-empty:before, 991 | .fa-star-half-full:before, 992 | .fa-star-half-o:before { 993 | content: "\f123"; 994 | } 995 | .fa-location-arrow:before { 996 | content: "\f124"; 997 | } 998 | .fa-crop:before { 999 | content: "\f125"; 1000 | } 1001 | .fa-code-fork:before { 1002 | content: "\f126"; 1003 | } 1004 | .fa-unlink:before, 1005 | .fa-chain-broken:before { 1006 | content: "\f127"; 1007 | } 1008 | .fa-question:before { 1009 | content: "\f128"; 1010 | } 1011 | .fa-info:before { 1012 | content: "\f129"; 1013 | } 1014 | .fa-exclamation:before { 1015 | content: "\f12a"; 1016 | } 1017 | .fa-superscript:before { 1018 | content: "\f12b"; 1019 | } 1020 | .fa-subscript:before { 1021 | content: "\f12c"; 1022 | } 1023 | .fa-eraser:before { 1024 | content: "\f12d"; 1025 | } 1026 | .fa-puzzle-piece:before { 1027 | content: "\f12e"; 1028 | } 1029 | .fa-microphone:before { 1030 | content: "\f130"; 1031 | } 1032 | .fa-microphone-slash:before { 1033 | content: "\f131"; 1034 | } 1035 | .fa-shield:before { 1036 | content: "\f132"; 1037 | } 1038 | .fa-calendar-o:before { 1039 | content: "\f133"; 1040 | } 1041 | .fa-fire-extinguisher:before { 1042 | content: "\f134"; 1043 | } 1044 | .fa-rocket:before { 1045 | content: "\f135"; 1046 | } 1047 | .fa-maxcdn:before { 1048 | content: "\f136"; 1049 | } 1050 | .fa-chevron-circle-left:before { 1051 | content: "\f137"; 1052 | } 1053 | .fa-chevron-circle-right:before { 1054 | content: "\f138"; 1055 | } 1056 | .fa-chevron-circle-up:before { 1057 | content: "\f139"; 1058 | } 1059 | .fa-chevron-circle-down:before { 1060 | content: "\f13a"; 1061 | } 1062 | .fa-html5:before { 1063 | content: "\f13b"; 1064 | } 1065 | .fa-css3:before { 1066 | content: "\f13c"; 1067 | } 1068 | .fa-anchor:before { 1069 | content: "\f13d"; 1070 | } 1071 | .fa-unlock-alt:before { 1072 | content: "\f13e"; 1073 | } 1074 | .fa-bullseye:before { 1075 | content: "\f140"; 1076 | } 1077 | .fa-ellipsis-h:before { 1078 | content: "\f141"; 1079 | } 1080 | .fa-ellipsis-v:before { 1081 | content: "\f142"; 1082 | } 1083 | .fa-rss-square:before { 1084 | content: "\f143"; 1085 | } 1086 | .fa-play-circle:before { 1087 | content: "\f144"; 1088 | } 1089 | .fa-ticket:before { 1090 | content: "\f145"; 1091 | } 1092 | .fa-minus-square:before { 1093 | content: "\f146"; 1094 | } 1095 | .fa-minus-square-o:before { 1096 | content: "\f147"; 1097 | } 1098 | .fa-level-up:before { 1099 | content: "\f148"; 1100 | } 1101 | .fa-level-down:before { 1102 | content: "\f149"; 1103 | } 1104 | .fa-check-square:before { 1105 | content: "\f14a"; 1106 | } 1107 | .fa-pencil-square:before { 1108 | content: "\f14b"; 1109 | } 1110 | .fa-external-link-square:before { 1111 | content: "\f14c"; 1112 | } 1113 | .fa-share-square:before { 1114 | content: "\f14d"; 1115 | } 1116 | .fa-compass:before { 1117 | content: "\f14e"; 1118 | } 1119 | .fa-toggle-down:before, 1120 | .fa-caret-square-o-down:before { 1121 | content: "\f150"; 1122 | } 1123 | .fa-toggle-up:before, 1124 | .fa-caret-square-o-up:before { 1125 | content: "\f151"; 1126 | } 1127 | .fa-toggle-right:before, 1128 | .fa-caret-square-o-right:before { 1129 | content: "\f152"; 1130 | } 1131 | .fa-euro:before, 1132 | .fa-eur:before { 1133 | content: "\f153"; 1134 | } 1135 | .fa-gbp:before { 1136 | content: "\f154"; 1137 | } 1138 | .fa-dollar:before, 1139 | .fa-usd:before { 1140 | content: "\f155"; 1141 | } 1142 | .fa-rupee:before, 1143 | .fa-inr:before { 1144 | content: "\f156"; 1145 | } 1146 | .fa-cny:before, 1147 | .fa-rmb:before, 1148 | .fa-yen:before, 1149 | .fa-jpy:before { 1150 | content: "\f157"; 1151 | } 1152 | .fa-ruble:before, 1153 | .fa-rouble:before, 1154 | .fa-rub:before { 1155 | content: "\f158"; 1156 | } 1157 | .fa-won:before, 1158 | .fa-krw:before { 1159 | content: "\f159"; 1160 | } 1161 | .fa-bitcoin:before, 1162 | .fa-btc:before { 1163 | content: "\f15a"; 1164 | } 1165 | .fa-file:before { 1166 | content: "\f15b"; 1167 | } 1168 | .fa-file-text:before { 1169 | content: "\f15c"; 1170 | } 1171 | .fa-sort-alpha-asc:before { 1172 | content: "\f15d"; 1173 | } 1174 | .fa-sort-alpha-desc:before { 1175 | content: "\f15e"; 1176 | } 1177 | .fa-sort-amount-asc:before { 1178 | content: "\f160"; 1179 | } 1180 | .fa-sort-amount-desc:before { 1181 | content: "\f161"; 1182 | } 1183 | .fa-sort-numeric-asc:before { 1184 | content: "\f162"; 1185 | } 1186 | .fa-sort-numeric-desc:before { 1187 | content: "\f163"; 1188 | } 1189 | .fa-thumbs-up:before { 1190 | content: "\f164"; 1191 | } 1192 | .fa-thumbs-down:before { 1193 | content: "\f165"; 1194 | } 1195 | .fa-youtube-square:before { 1196 | content: "\f166"; 1197 | } 1198 | .fa-youtube:before { 1199 | content: "\f167"; 1200 | } 1201 | .fa-xing:before { 1202 | content: "\f168"; 1203 | } 1204 | .fa-xing-square:before { 1205 | content: "\f169"; 1206 | } 1207 | .fa-youtube-play:before { 1208 | content: "\f16a"; 1209 | } 1210 | .fa-dropbox:before { 1211 | content: "\f16b"; 1212 | } 1213 | .fa-stack-overflow:before { 1214 | content: "\f16c"; 1215 | } 1216 | .fa-instagram:before { 1217 | content: "\f16d"; 1218 | } 1219 | .fa-flickr:before { 1220 | content: "\f16e"; 1221 | } 1222 | .fa-adn:before { 1223 | content: "\f170"; 1224 | } 1225 | .fa-bitbucket:before { 1226 | content: "\f171"; 1227 | } 1228 | .fa-bitbucket-square:before { 1229 | content: "\f172"; 1230 | } 1231 | .fa-tumblr:before { 1232 | content: "\f173"; 1233 | } 1234 | .fa-tumblr-square:before { 1235 | content: "\f174"; 1236 | } 1237 | .fa-long-arrow-down:before { 1238 | content: "\f175"; 1239 | } 1240 | .fa-long-arrow-up:before { 1241 | content: "\f176"; 1242 | } 1243 | .fa-long-arrow-left:before { 1244 | content: "\f177"; 1245 | } 1246 | .fa-long-arrow-right:before { 1247 | content: "\f178"; 1248 | } 1249 | .fa-apple:before { 1250 | content: "\f179"; 1251 | } 1252 | .fa-windows:before { 1253 | content: "\f17a"; 1254 | } 1255 | .fa-android:before { 1256 | content: "\f17b"; 1257 | } 1258 | .fa-linux:before { 1259 | content: "\f17c"; 1260 | } 1261 | .fa-dribbble:before { 1262 | content: "\f17d"; 1263 | } 1264 | .fa-skype:before { 1265 | content: "\f17e"; 1266 | } 1267 | .fa-foursquare:before { 1268 | content: "\f180"; 1269 | } 1270 | .fa-trello:before { 1271 | content: "\f181"; 1272 | } 1273 | .fa-female:before { 1274 | content: "\f182"; 1275 | } 1276 | .fa-male:before { 1277 | content: "\f183"; 1278 | } 1279 | .fa-gittip:before { 1280 | content: "\f184"; 1281 | } 1282 | .fa-sun-o:before { 1283 | content: "\f185"; 1284 | } 1285 | .fa-moon-o:before { 1286 | content: "\f186"; 1287 | } 1288 | .fa-archive:before { 1289 | content: "\f187"; 1290 | } 1291 | .fa-bug:before { 1292 | content: "\f188"; 1293 | } 1294 | .fa-vk:before { 1295 | content: "\f189"; 1296 | } 1297 | .fa-weibo:before { 1298 | content: "\f18a"; 1299 | } 1300 | .fa-renren:before { 1301 | content: "\f18b"; 1302 | } 1303 | .fa-pagelines:before { 1304 | content: "\f18c"; 1305 | } 1306 | .fa-stack-exchange:before { 1307 | content: "\f18d"; 1308 | } 1309 | .fa-arrow-circle-o-right:before { 1310 | content: "\f18e"; 1311 | } 1312 | .fa-arrow-circle-o-left:before { 1313 | content: "\f190"; 1314 | } 1315 | .fa-toggle-left:before, 1316 | .fa-caret-square-o-left:before { 1317 | content: "\f191"; 1318 | } 1319 | .fa-dot-circle-o:before { 1320 | content: "\f192"; 1321 | } 1322 | .fa-wheelchair:before { 1323 | content: "\f193"; 1324 | } 1325 | .fa-vimeo-square:before { 1326 | content: "\f194"; 1327 | } 1328 | .fa-turkish-lira:before, 1329 | .fa-try:before { 1330 | content: "\f195"; 1331 | } 1332 | .fa-plus-square-o:before { 1333 | content: "\f196"; 1334 | } 1335 | .fa-space-shuttle:before { 1336 | content: "\f197"; 1337 | } 1338 | .fa-slack:before { 1339 | content: "\f198"; 1340 | } 1341 | .fa-envelope-square:before { 1342 | content: "\f199"; 1343 | } 1344 | .fa-wordpress:before { 1345 | content: "\f19a"; 1346 | } 1347 | .fa-openid:before { 1348 | content: "\f19b"; 1349 | } 1350 | .fa-institution:before, 1351 | .fa-bank:before, 1352 | .fa-university:before { 1353 | content: "\f19c"; 1354 | } 1355 | .fa-mortar-board:before, 1356 | .fa-graduation-cap:before { 1357 | content: "\f19d"; 1358 | } 1359 | .fa-yahoo:before { 1360 | content: "\f19e"; 1361 | } 1362 | .fa-google:before { 1363 | content: "\f1a0"; 1364 | } 1365 | .fa-reddit:before { 1366 | content: "\f1a1"; 1367 | } 1368 | .fa-reddit-square:before { 1369 | content: "\f1a2"; 1370 | } 1371 | .fa-stumbleupon-circle:before { 1372 | content: "\f1a3"; 1373 | } 1374 | .fa-stumbleupon:before { 1375 | content: "\f1a4"; 1376 | } 1377 | .fa-delicious:before { 1378 | content: "\f1a5"; 1379 | } 1380 | .fa-digg:before { 1381 | content: "\f1a6"; 1382 | } 1383 | .fa-pied-piper-square:before, 1384 | .fa-pied-piper:before { 1385 | content: "\f1a7"; 1386 | } 1387 | .fa-pied-piper-alt:before { 1388 | content: "\f1a8"; 1389 | } 1390 | .fa-drupal:before { 1391 | content: "\f1a9"; 1392 | } 1393 | .fa-joomla:before { 1394 | content: "\f1aa"; 1395 | } 1396 | .fa-language:before { 1397 | content: "\f1ab"; 1398 | } 1399 | .fa-fax:before { 1400 | content: "\f1ac"; 1401 | } 1402 | .fa-building:before { 1403 | content: "\f1ad"; 1404 | } 1405 | .fa-child:before { 1406 | content: "\f1ae"; 1407 | } 1408 | .fa-paw:before { 1409 | content: "\f1b0"; 1410 | } 1411 | .fa-spoon:before { 1412 | content: "\f1b1"; 1413 | } 1414 | .fa-cube:before { 1415 | content: "\f1b2"; 1416 | } 1417 | .fa-cubes:before { 1418 | content: "\f1b3"; 1419 | } 1420 | .fa-behance:before { 1421 | content: "\f1b4"; 1422 | } 1423 | .fa-behance-square:before { 1424 | content: "\f1b5"; 1425 | } 1426 | .fa-steam:before { 1427 | content: "\f1b6"; 1428 | } 1429 | .fa-steam-square:before { 1430 | content: "\f1b7"; 1431 | } 1432 | .fa-recycle:before { 1433 | content: "\f1b8"; 1434 | } 1435 | .fa-automobile:before, 1436 | .fa-car:before { 1437 | content: "\f1b9"; 1438 | } 1439 | .fa-cab:before, 1440 | .fa-taxi:before { 1441 | content: "\f1ba"; 1442 | } 1443 | .fa-tree:before { 1444 | content: "\f1bb"; 1445 | } 1446 | .fa-spotify:before { 1447 | content: "\f1bc"; 1448 | } 1449 | .fa-deviantart:before { 1450 | content: "\f1bd"; 1451 | } 1452 | .fa-soundcloud:before { 1453 | content: "\f1be"; 1454 | } 1455 | .fa-database:before { 1456 | content: "\f1c0"; 1457 | } 1458 | .fa-file-pdf-o:before { 1459 | content: "\f1c1"; 1460 | } 1461 | .fa-file-word-o:before { 1462 | content: "\f1c2"; 1463 | } 1464 | .fa-file-excel-o:before { 1465 | content: "\f1c3"; 1466 | } 1467 | .fa-file-powerpoint-o:before { 1468 | content: "\f1c4"; 1469 | } 1470 | .fa-file-photo-o:before, 1471 | .fa-file-picture-o:before, 1472 | .fa-file-image-o:before { 1473 | content: "\f1c5"; 1474 | } 1475 | .fa-file-zip-o:before, 1476 | .fa-file-archive-o:before { 1477 | content: "\f1c6"; 1478 | } 1479 | .fa-file-sound-o:before, 1480 | .fa-file-audio-o:before { 1481 | content: "\f1c7"; 1482 | } 1483 | .fa-file-movie-o:before, 1484 | .fa-file-video-o:before { 1485 | content: "\f1c8"; 1486 | } 1487 | .fa-file-code-o:before { 1488 | content: "\f1c9"; 1489 | } 1490 | .fa-vine:before { 1491 | content: "\f1ca"; 1492 | } 1493 | .fa-codepen:before { 1494 | content: "\f1cb"; 1495 | } 1496 | .fa-jsfiddle:before { 1497 | content: "\f1cc"; 1498 | } 1499 | .fa-life-bouy:before, 1500 | .fa-life-saver:before, 1501 | .fa-support:before, 1502 | .fa-life-ring:before { 1503 | content: "\f1cd"; 1504 | } 1505 | .fa-circle-o-notch:before { 1506 | content: "\f1ce"; 1507 | } 1508 | .fa-ra:before, 1509 | .fa-rebel:before { 1510 | content: "\f1d0"; 1511 | } 1512 | .fa-ge:before, 1513 | .fa-empire:before { 1514 | content: "\f1d1"; 1515 | } 1516 | .fa-git-square:before { 1517 | content: "\f1d2"; 1518 | } 1519 | .fa-git:before { 1520 | content: "\f1d3"; 1521 | } 1522 | .fa-hacker-news:before { 1523 | content: "\f1d4"; 1524 | } 1525 | .fa-tencent-weibo:before { 1526 | content: "\f1d5"; 1527 | } 1528 | .fa-qq:before { 1529 | content: "\f1d6"; 1530 | } 1531 | .fa-wechat:before, 1532 | .fa-weixin:before { 1533 | content: "\f1d7"; 1534 | } 1535 | .fa-send:before, 1536 | .fa-paper-plane:before { 1537 | content: "\f1d8"; 1538 | } 1539 | .fa-send-o:before, 1540 | .fa-paper-plane-o:before { 1541 | content: "\f1d9"; 1542 | } 1543 | .fa-history:before { 1544 | content: "\f1da"; 1545 | } 1546 | .fa-circle-thin:before { 1547 | content: "\f1db"; 1548 | } 1549 | .fa-header:before { 1550 | content: "\f1dc"; 1551 | } 1552 | .fa-paragraph:before { 1553 | content: "\f1dd"; 1554 | } 1555 | .fa-sliders:before { 1556 | content: "\f1de"; 1557 | } 1558 | .fa-share-alt:before { 1559 | content: "\f1e0"; 1560 | } 1561 | .fa-share-alt-square:before { 1562 | content: "\f1e1"; 1563 | } 1564 | .fa-bomb:before { 1565 | content: "\f1e2"; 1566 | } 1567 | --------------------------------------------------------------------------------