diff --git a/.codeclimate.yml b/.codeclimate.yml new file mode 100644 index 0000000..0a9d1e8 --- /dev/null +++ b/.codeclimate.yml @@ -0,0 +1,4 @@ +languages: + JavaScript: true +exclude_paths: +- "tests/*" diff --git a/.jshintrc b/.jshintrc index 08096ef..e75f719 100644 --- a/.jshintrc +++ b/.jshintrc @@ -2,7 +2,8 @@ "predef": [ "document", "window", - "-Promise" + "-Promise", + "moment" ], "browser": true, "boss": true, diff --git a/.npmignore b/.npmignore deleted file mode 100644 index a28e4ab..0000000 --- a/.npmignore +++ /dev/null @@ -1,13 +0,0 @@ -bower_components/ -tests/ -tmp/ - -.bowerrc -.editorconfig -.ember-cli -.travis.yml -.npmignore -**/.gitkeep -bower.json -Brocfile.js -testem.json diff --git a/.travis.yml b/.travis.yml index cf23938..91ccc9f 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,5 +1,7 @@ --- language: node_js +node_js: + - "0.12" sudo: false @@ -7,7 +9,25 @@ cache: directories: - node_modules +env: + - EMBER_TRY_SCENARIO=ember-1.11 + - EMBER_TRY_SCENARIO=ember-1.12 + - EMBER_TRY_SCENARIO=ember-1.13 + - EMBER_TRY_SCENARIO=ember-release + - EMBER_TRY_SCENARIO=ember-beta + - EMBER_TRY_SCENARIO=ember-canary + +matrix: + fast_finish: true + allow_failures: + - env: EMBER_TRY_SCENARIO=ember-1.11 + - env: EMBER_TRY_SCENARIO=ember-canary + - env: EMBER_TRY_SCENARIO=ember-release + - env: EMBER_TRY_SCENARIO=ember-beta + + before_install: + - export PATH=/usr/local/phantomjs-2.0.0/bin:$PATH - "npm config set spin false" - "npm install -g npm@^2" @@ -17,4 +37,11 @@ install: - bower install script: - - npm test + - ember try $EMBER_TRY_SCENARIO test + +after_script: + - codeclimate-test-reporter < lcov.dat + +addons: + code_climate: + repo_token: 87c983d56c9a67abe7e1226adc38728edc7c2e07c8e6a6290fc9c49be8bc2b56 diff --git a/Brocfile.js b/Brocfile.js deleted file mode 100644 index 042a64d..0000000 --- a/Brocfile.js +++ /dev/null @@ -1,21 +0,0 @@ -/* jshint node: true */ -/* global require, module */ - -var EmberAddon = require('ember-cli/lib/broccoli/ember-addon'); - -var app = new EmberAddon(); - -// Use `app.import` to add additional libraries to the generated -// output files. -// -// If you need to use different assets in different -// environments, specify an object as the first parameter. That -// object's keys should be the environment name and the values -// should be the asset to use in that environment. -// -// If the library that you are including contains AMD or ES6 -// modules that you would like to import into your application -// please specify an object with the list of modules as keys -// along with the exports of each module as its value. - -module.exports = app.toTree(); diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..d00ba48 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,10 @@ +# Change Log + +## 0.4.0 +- `code modified to support latest version of bootstrap-daterangepicker` +- `latest ember version` + +## 0.3.0 +## 0.2.0 +## 0.1.0 +- Initial Release diff --git a/README.md b/README.md index f9c1572..484e1d4 100644 --- a/README.md +++ b/README.md @@ -1,19 +1,51 @@ -# Ember-bootstrap-daterange +# Ember-bootstrap-daterange # + +[](https://travis-ci.org/chauhansudhir/ember-bootstrap-daterange) +[](https://codeclimate.com/github/chauhansudhir/ember-bootstrap-daterange) +[](https://codeclimate.com/github/chauhansudhir/ember-bootstrap-daterange/coverage) + Ember add-on-ification of [bootstrap daterangepicker](https://github.com/dangrossman/bootstrap-daterangepicker). -## Requirements +## Features ## +__ This component using 3 observers, we will try to remove observers in future version.__ +* Render date picker textbox if singleDatePicker=true +* By Default it renders range date picker +* all possible daterangepicker options are available at http://www.daterangepicker.com/#config + +## Requirements ## Bootstrap 3.0+ ## Examples Simple date range picker with start and end dates bound. -```handlebars - {{bootstrap-daterange-picker startDate=start endDate=end}} ``` + {{ember-bootstrap-daterange startDate=start endDate=end}} +``` +## Documentation ## +Detailed documentation can be found [here](http://github.io/bootstrap-daterangepicker/docs) Single date picker with value bound. -```handlebars - {{bootstrap-daterange-picker singleDatePicker=true startDate=date}} ``` + {{ember-bootstrap-daterange singleDatePicker=true startDate=date}} +``` + +Range date picker with value bound. +``` +{{ember-bootstrap-daterange + startDate=start + endDate=end + timePicker=true + timePickerSeconds=false + timePicker24Hour=true + timePickerIncrement=60 + disabled=false + class="ember-view ember-text-field" + format="MM/DD/YYYY HH:00" +}} +``` + +## Configuration options ## +You can check [http://www.daterangepicker.com/#config](http://www.daterangepicker.com/#config) URL to configure date range picker + For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/). diff --git a/addon/components/daterange-picker.js b/addon/components/daterange-picker.js deleted file mode 100644 index 45fe4e8..0000000 --- a/addon/components/daterange-picker.js +++ /dev/null @@ -1,106 +0,0 @@ -import Ember from 'ember'; - -var jqueryAttrs = [ - 'startDate', - 'endDate', - 'minDate', - 'maxDate', - 'dateLimit', - 'timeZone', - 'showDropdowns', - 'showWeekNumbers', - 'timePicker', - 'timePickerIncrement', - 'timePicker12Hour', - 'timePickerSeconds', - 'ranges', - 'opens', - 'buttonClasses', - 'applyClass', - 'cancelClass', - 'format', - 'separator', - 'locale', - 'singleDatePicker', - 'parentEl' -]; - -export default Ember.Component.extend({ - tagName: 'input', - - jQueryOptions: Ember.computed(jqueryAttrs.join(','), function() { - var options = {}; - var self = this; - - jqueryAttrs.forEach(function(attr) { - options[attr] = self.get(attr); - }); - return options; - }), - - didInsertElement: function() { - this._super.apply(this, arguments); - Ember.run.schedule('afterRender', this, this._renderDatePicker); - }, - - _renderDatePicker: function() { - this.$().daterangepicker(); - this._setOptions(); - this._setStart(); - this._setEnd(); - }, - - _setStart: function() { - if (this.state === 'inDOM') { - var dateRangePickerObject = this.$().data('daterangepicker'); - if (dateRangePickerObject) { - dateRangePickerObject.setStartDate(this.get('startDate')); - } - } - }, - - _setEnd: function() { - if (this.state === 'inDOM') { - var dateRangePickerObject = this.$().data('daterangepicker'); - if (dateRangePickerObject) { - dateRangePickerObject.setEndDate(this.get('endDate')); - } - } - }, - - _setOptions: function() { - var currentComponent = this; - var changeCallback = function(start, end, label) { - - currentComponent.set('startDate', start); - currentComponent.set('endDate', end); - }; - if (this.state === 'inDOM') { - var dateRangePickerObject = this.$().data('daterangepicker'); - if (dateRangePickerObject) { - dateRangePickerObject.setOptions(this.get('jQueryOptions'), - changeCallback); - } - } - }, - - startDateDidChange: Ember.observer('startDate',function() { - Ember.run.once(this, this._setStart); - }), - - endDateDidChange: Ember.observer('endDate',function() { - Ember.run.once(this, this._setEnd); - - }), - - dateOptionsChanged: Ember.observer('jQueryOptions',function() { - Ember.run.once(this, this._setOptions); - }), - - willDestroyElement: function() { - this._super.apply(this, arguments); - if (this.state === 'inDOM' && this.$().data('daterangepicker')) { - this.$().daterangepicker('remove'); - } - } -}); diff --git a/addon/components/ember-bootstrap-daterange.js b/addon/components/ember-bootstrap-daterange.js new file mode 100644 index 0000000..7f8008f --- /dev/null +++ b/addon/components/ember-bootstrap-daterange.js @@ -0,0 +1,132 @@ +import Ember from 'ember'; + +const runOnce = Ember.run.once; +const jqueryAttrs = [ + 'startDate', + 'endDate', + 'minDate', + 'maxDate', + 'dateLimit', + 'timeZone', + 'showDropdowns', + 'showWeekNumbers', + 'timePicker', + 'timePickerIncrement', + 'timePicker24Hour', + 'timePickerSeconds', + 'ranges', + 'opens', + 'buttonClasses', + 'applyClass', + 'cancelClass', + 'format', + 'separator', + 'locale', + 'singleDatePicker', + 'parentEl' +]; + +const {computed, observer} = Ember; + +export default Ember.Component.extend({ + tagName: 'input', + /* + * dtPicket is an object of daterangecalendar useful for setting startDate and endDate + */ + dtPicker: null, + + /* + * dtPicket is an object of daterangecalendar useful for setting events + * dtPicket.on("cancel.daterangepicker", function(e){}); + */ + dateRangePicker: null, + + /** + * this method computed on daterangepicker properties e.g startDate + * and other observer which keeps an eye on jQueryOptions properties + * change to update calendar options + */ + jQueryOptions: computed(jqueryAttrs.join(","), function() { + var options = {}; + jqueryAttrs.forEach((attr) => { + options[attr] = this.get(attr); + }); + return options; + }), + + /** + * this method schedule a calender creation task after insertion on calender into the dom + */ + didInsertElement() { + this._super(...arguments); + Ember.run.schedule('afterRender', this, this._renderDatePicker); + }, + + /** + * render date range picker control and setup dtPicker and dateRangePicker properties + */ + _renderDatePicker() { + if(this.isDestroyed || this.isDestroying) { + return; + } + + let dateRangePicker = this.$().daterangepicker(this.get('jQueryOptions')); + let dt = this.$().data('daterangepicker'); + this.set('dtPicker', dt); + this.set('dateRangePicker', dateRangePicker); + }, + + /* + * setStart date of a calender + */ + _setStart() { + let dt = this.get('dtPicker'); + if (dt) { + dt.setStartDate(this.get('startDate')); + } + }, + + /* + * setEnd date of a calender + */ + _setEnd() { + let dt = this.get('dtPicker'); + if (dt) { + dt.setEndDate(this.get('endDate')); + } + }, + + /* + * observe on start Date change + */ + startDateDidChange: observer('startDate',function() { + runOnce(this, this._setStart); + }), + + /* + * observe on end Date change + */ + endDateDidChange: observer('endDate',function() { + runOnce(this, this._setEnd); + }), + + /* + * observe on any other option change and re-render daterangepicker + */ + dateOptionsChanged: observer('jQueryOptions',function() { + runOnce(this, this._renderDatePicker); + }), + + /** + * destory all objects + */ + willDestroyElement() { + this._super(...arguments); + let dt = this.get('dtPicker'); + if (dt) { + dt.remove(); + this.set('dtPicker', null); + this.set('dateRangePicker', null); + } + } +}); diff --git a/app/components/bootstrap-daterange-picker.js b/app/components/ember-bootstrap-daterange.js similarity index 73% rename from app/components/bootstrap-daterange-picker.js rename to app/components/ember-bootstrap-daterange.js index f67a82d..122224c 100644 --- a/app/components/bootstrap-daterange-picker.js +++ b/app/components/ember-bootstrap-daterange.js @@ -1,3 +1,3 @@ -import BootstrapDaterangePicker from 'ember-bootstrap-daterange/components/daterange-picker'; +import BootstrapDaterangePicker from 'ember-bootstrap-daterange/components/ember-bootstrap-daterange'; export default BootstrapDaterangePicker; diff --git a/blueprints/ember-bootstrap-daterange/index.js b/blueprints/ember-bootstrap-daterange/index.js index 9c6ad07..ae49885 100644 --- a/blueprints/ember-bootstrap-daterange/index.js +++ b/blueprints/ember-bootstrap-daterange/index.js @@ -6,9 +6,8 @@ module.exports = { afterInstall: function(options) { var that = this; - return this.addBowerPackageToProject('moment').then(function() { - return that.addBowerPackageToProject('bootstrap-daterangepicker'); + return that.addBowerPackageToProject('ember-bootstrap-daterange'); }); } diff --git a/bower.json b/bower.json index 213ab7c..beb2db1 100644 --- a/bower.json +++ b/bower.json @@ -1,19 +1,18 @@ { "name": "ember-bootstrap-daterange", "dependencies": { - "handlebars": "~1.3.0", + "ember": "1.13.10", + "ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3", + "ember-cli-test-loader": "ember-cli-test-loader#0.1.3", + "ember-load-initializers": "ember-cli/ember-load-initializers#0.1.7", + "ember-resolver": "~0.1.18", "jquery": "^1.11.1", - "ember": "1.8.1", - "ember-data": "1.0.0-beta.12", - "ember-resolver": "~0.1.10", - "loader.js": "stefanpenner/loader.js#1.0.1", - "ember-cli-shims": "stefanpenner/ember-cli-shims#0.0.3", - "ember-cli-test-loader": "rwjblue/ember-cli-test-loader#0.0.4", - "ember-load-initializers": "stefanpenner/ember-load-initializers#0.0.2", - "ember-qunit": "0.1.8", - "ember-qunit-notifications": "0.0.4", - "qunit": "~1.15.0", - "moment": "^2.9.0", - "bootstrap-daterangepicker": "~1.3.21" + "loader.js": "ember-cli/loader.js#3.2.0", + "moment": "^2.10.6", + "bootstrap-daterangepicker": "~2.0.11", + "qunit": "~1.17.1", + "blanket": "~1.1.5", + "ember-qunit": "0.4.10", + "ember-qunit-notifications": "0.0.7" } } diff --git a/bower.json.ember-try b/bower.json.ember-try new file mode 100644 index 0000000..90bcda2 --- /dev/null +++ b/bower.json.ember-try @@ -0,0 +1,18 @@ +{ + "name": "ember-bootstrap-daterange", + "dependencies": { + "ember": "1.13.10", + "ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3", + "ember-cli-test-loader": "ember-cli-test-loader#0.1.3", + "ember-load-initializers": "ember-cli/ember-load-initializers#0.1.7", + "ember-resolver": "~0.1.18", + "jquery": "^1.11.1", + "loader.js": "ember-cli/loader.js#3.2.0", + "moment": "^2.10.6", + "bootstrap-daterangepicker": "2.0.11", + "qunit": "~1.17.1", + "blanket": "~1.1.5", + "ember-qunit": "0.4.10", + "ember-qunit-notifications": "0.0.7" + } +} diff --git a/config/ember-try.js b/config/ember-try.js new file mode 100644 index 0000000..3148503 --- /dev/null +++ b/config/ember-try.js @@ -0,0 +1,55 @@ + +module.exports = { + scenarios: [{ + name: 'default', + dependencies: {} + }, { + name: 'ember-1.10', + dependencies: { + ember: '~1.10.0', + 'ember-data': '~1.13.0' + } + }, { + name: 'ember-1.11', + dependencies: { + ember: '~1.11.0', + 'ember-data': '~1.13.0' + } + }, { + name: 'ember-1.12', + dependencies: { + ember: '~1.12.0', + 'ember-data': '~1.13.0' + } + }, { + name: 'ember-1.13', + dependencies: { + ember: '~1.13.0', + 'ember-data': '~1.13.0' + } + }, { + name: 'ember-release', + dependencies: { + 'ember': 'components/ember#release' + }, + resolutions: { + 'ember': 'release' + } + }, { + name: 'ember-beta', + dependencies: { + 'ember': 'components/ember#beta' + }, + resolutions: { + 'ember': 'beta' + } + }, { + name: 'ember-canary', + dependencies: { + 'ember': 'components/ember#canary' + }, + resolutions: { + 'ember': 'canary' + } + }] +}; diff --git a/docs/docs/index.md b/docs/docs/index.md new file mode 100644 index 0000000..221123f --- /dev/null +++ b/docs/docs/index.md @@ -0,0 +1,46 @@ +# Ember-bootstrap-daterange # + +Ember add-on-ification of [bootstrap daterangepicker](https://github.com/dangrossman/bootstrap-daterangepicker). + +## Features ## +__ This component using 3 observers, we will try to remove observers in future version.__ +* Render date picker textbox if singleDatePicker=true +* By Default it renders range date picker +* all possible daterangepicker options are available at http://www.daterangepicker.com/#config + +## Requirements ## +Bootstrap 3.0+ + +## Examples +Simple date range picker with start and end dates bound. +``` + {{ember-bootstrap-daterange startDate=start endDate=end}} +``` +## Documentation ## +Detailed documentation can be found [here](http://github.io/bootstrap-daterangepicker/docs) + +Single date picker with value bound. +``` + {{ember-bootstrap-daterange singleDatePicker=true startDate=date}} +``` + +Range date picker with value bound. +``` +{{ember-bootstrap-daterange + startDate=start + endDate=end + timePicker=true + timePickerSeconds=false + timePicker12Hour=false + timePickerIncrement=60 + disabled=false + class="ember-view ember-text-field" + format="MM/DD/YYYY HH:00" +}} +``` + +## Configuration options ## +You can check [http://www.daterangepicker.com/#config](http://www.daterangepicker.com/#config) URL to configure date range picker + + +For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/). diff --git a/docs/mkdocs.yml b/docs/mkdocs.yml new file mode 100644 index 0000000..e9fc1a2 --- /dev/null +++ b/docs/mkdocs.yml @@ -0,0 +1,10 @@ +site_name: Ember Bootstrap Daterange +repo_url: 'https://github.com/wedgex/ember-bootstrap-daterange' +repo_name: 'GitHub' +site_dir: '../tests/dummy/public/docs' +theme: readthedocs +use_directory_urls: false +strict: true +extra_css: ['style.css'] +pages: +- Home: 'index.md' diff --git a/ember-cli-build.js b/ember-cli-build.js new file mode 100644 index 0000000..ea3f351 --- /dev/null +++ b/ember-cli-build.js @@ -0,0 +1,9 @@ +var EmberApp = require('ember-cli/lib/broccoli/ember-addon'); + +module.exports = function(defaults) { + var app = new EmberApp(defaults, { + // Any other options + }); + + return app.toTree(); +}; diff --git a/index.js b/index.js index 0c5c6b1..33645f2 100644 --- a/index.js +++ b/index.js @@ -6,9 +6,8 @@ module.exports = { included: function(app) { this._super.included(app); - this.app.import(app.bowerDirectory + '/moment/moment.js'); + this.app.import(app.bowerDirectory + '/bootstrap-daterangepicker/daterangepicker.css'); this.app.import(app.bowerDirectory + '/bootstrap-daterangepicker/daterangepicker.js'); - this.app.import(app.bowerDirectory + '/bootstrap-daterangepicker/daterangepicker-bs3.css'); } }; diff --git a/package.json b/package.json index 01df5c0..cff823e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-bootstrap-daterange", - "version": "0.3.0", + "version": "0.4.0", "directories": { "doc": "doc", "test": "tests" @@ -8,7 +8,7 @@ "scripts": { "start": "ember server", "build": "ember build", - "test": "ember test" + "test": "ember try:testall" }, "repository": "https://github.com/wedgex/ember-bootstrap-daterange", "engines": { @@ -16,19 +16,36 @@ }, "author": "Hunter Haydel", "license": "MIT", + "dependencies": { + "ember-cli-babel": "^5.1.3", + "ember-cli-htmlbars": "0.7.9", + "ember-cli-version-checker": "^1.1.4" + }, "devDependencies": { - "broccoli-asset-rev": "^1.0.0", - "broccoli-ember-hbs-template-compiler": "^1.6.1", - "ember-cli": "0.2.6", - "ember-cli-content-security-policy": "0.3.0", - "ember-cli-dependency-checker": "0.0.6", - "ember-cli-esnext": "0.1.1", - "ember-cli-ic-ajax": "0.1.1", - "ember-cli-inject-live-reload": "^1.3.0", - "ember-cli-qunit": "0.1.2", - "ember-export-application-global": "^1.0.0", + "codeclimate-test-reporter": "^0.1.1", + "broccoli-asset-rev": "^2.1.2", + "ember-cli-blanket": "0.5.3", + "ember-cli": "1.13.8", + "ember-cli-app-version": "0.5.0", + "ember-cli-content-security-policy": "0.4.0", + "ember-cli-dependency-checker": "^1.0.1", + "ember-cli-htmlbars-inline-precompile": "^0.2.0", + "ember-cli-ic-ajax": "0.2.1", + "ember-cli-inject-live-reload": "^1.3.1", + "ember-cli-release": "0.2.3", + "ember-cli-sri": "^1.0.3", + "ember-cli-uglify": "^1.2.0", + "ember-cli-moment-shim": "0.6.2", + "ember-disable-proxy-controllers": "^1.0.0", + "ember-export-application-global": "^1.0.3", + "ember-disable-prototype-extensions": "^1.0.0", + "ember-try": "0.0.6", + "broccoli-babel-transpiler": "5.4.5", + "ember-cli-qunit": "1.0.3", "express": "^4.8.5", - "glob": "^4.0.5" + "glob": "^4.0.5", + "debug": "~2.2.0", + "ember-moment": "3.6.2" }, "description": "Ember component for using https://github.com/dangrossman/bootstrap-daterangepicker", "keywords": [ @@ -42,4 +59,4 @@ "configPath": "tests/dummy/config", "defaultBlueprint": "ember-bootstrap-daterange" } -} \ No newline at end of file +} diff --git a/testem.json b/testem.json index eff93f9..59edb10 100644 --- a/testem.json +++ b/testem.json @@ -1,6 +1,6 @@ { "framework": "qunit", - "test_page": "tests/index.html", + "test_page": "tests/index.html?nojshint&coverage", "launch_in_ci": [ "PhantomJS" ], diff --git a/tests/.jshintrc b/tests/.jshintrc index 6ebf71a..1cd7d22 100644 --- a/tests/.jshintrc +++ b/tests/.jshintrc @@ -44,7 +44,9 @@ "andThen", "currentURL", "currentPath", - "currentRouteName" + "currentRouteName", + "moment", + "blanket" ], "node": false, "browser": false, diff --git a/tests/blanket-options.js b/tests/blanket-options.js new file mode 100644 index 0000000..0ba537d --- /dev/null +++ b/tests/blanket-options.js @@ -0,0 +1,17 @@ +var options = { + modulePrefix: '', + filter: '//.*ember-bootstrap-daterange/.*/', + antifilter: '//.*(tests|template).*/', + loaderExclusions: [], + enableCoverage: true, + cliOptions: { + reporters: ['lcov'], + autostart: true + } +}; + +if (typeof exports === 'undefined') { + blanket.options(options); +} else { + module.exports = options; +} diff --git a/tests/dummy/app/controllers/application.js b/tests/dummy/app/controllers/application.js index 349134e..0b4dc0e 100644 --- a/tests/dummy/app/controllers/application.js +++ b/tests/dummy/app/controllers/application.js @@ -3,8 +3,15 @@ import Ember from 'ember'; export default Ember.Controller.extend({ start: '11/5/1955', end: '8/26/1985', + ranges: undefined, actions: { + showDaterangepicker: function() { + console.log("showDaterangepicker"); + }, + hideDaterangepicker: function() { + console.log("showDaterangepicker"); + }, go: function() { this.set('start', '8/26/1985'); this.set('end', '10/21/2015'); diff --git a/tests/dummy/app/templates/application.hbs b/tests/dummy/app/templates/application.hbs index 51b30ee..c0f90f4 100644 --- a/tests/dummy/app/templates/application.hbs +++ b/tests/dummy/app/templates/application.hbs @@ -1,12 +1,28 @@