diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 4955fcbdb..e51d544d5 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -272,6 +272,7 @@ All definitions files include a header with the author and editors, so at some p * [Platform](https://github.com/bestiejs/platform.js) (by [Jake Hickman](https://github.com/JakeH)) * [PouchDB](http://pouchdb.com) (by [Bill Sears](https://github.com/MrBigDog2U/)) * [PreloadJS](http://www.createjs.com/#!/PreloadJS) (by [Pedro Ferreira](https://bitbucket.org/drk4)) +* [ProgressJs](http://usablica.github.io/progress.js/) (by [Shunsuke Ohtani](https://github.com/zaneli)) * [Q](https://github.com/kriskowal/q) (by Barrie Nemetchek, Andrew Gaspar) * [Q-io](https://github.com/kriskowal/q-io) (by [Bart van der Schoor](https://github.com/Bartvds)) * [QUnit](http://qunitjs.com/) (by [Diullei Gomes](https://github.com/Diullei)) diff --git a/progressjs/progress-tests.ts b/progressjs/progress-tests.ts new file mode 100644 index 000000000..e2ab62f9a --- /dev/null +++ b/progressjs/progress-tests.ts @@ -0,0 +1,36 @@ +/// + +progressJs(); //without selector, set progress-bar for whole page +progressJs("#targetElement"); //start progress-bar for element id='targetElement' + +progressJs().start(); + +progressJs().set(20); //set progress to 20% + +progressJs().start().autoIncrease(4, 500); //every 500 milliseconds, percentage + 4 + +progressJs().increase(); //increase one percent +progressJs().increase(2); //increase two percent + +progressJs().start().set(20).end(); + +progressJs().setOption("theme", "black"); +progressJs().setOption("overlayMode", true); +progressJs().setOption("considerTransition", false); + +progressJs().setOptions({ 'theme': 'black', 'overlayMode': true }); +progressJs().setOptions({ 'theme': 'black', 'overlayMode': true }); +progressJs().setOptions({ 'theme': 'black', 'overlayMode': true, 'considerTransition': false }); +progressJs().setOptions({ 'overlayMode': true }); + +progressJs().onbeforeend(function() { + alert("before end"); +}); + +progressJs().onbeforestart(function() { + alert("before start"); +}); + +progressJs().onprogress(function(targetElm, percent) { + alert("progress changed to:" + percent); +}); diff --git a/progressjs/progress.d.ts b/progressjs/progress.d.ts new file mode 100644 index 000000000..a7f9923c3 --- /dev/null +++ b/progressjs/progress.d.ts @@ -0,0 +1,103 @@ +// Type definitions for ProgressJs v0.1.0 +// Project: http://usablica.github.io/progress.js/ +// Definitions by: Shunsuke Ohtani +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +interface ProgressJsStatic { + + /** + * Creating an ProgressJS object. + * + * @param targetElm String (optional) Should be defined to start progress-bar for specific element. + */ + (targetElm?: string): ProgressJs; +} + +interface ProgressJs { + + /** + * Start the progress-bar for defined element(s). + */ + start(): ProgressJs; + + /** + * Set specific percentage to progress-bar. + * + * @param percent Set to specific percentage. + */ + set(percent: number): ProgressJs; + + /** + * Set an auto-increase timer for the progress-bar. + * + * @param size The size of increment when timer elapsed. + * @param millisecond Timer in milliseconds. + */ + autoIncrease(size: number, millisecond: number): ProgressJs; + + /** + * Increase the progress-bar bar specified size. Default size is 1. + * + * @param size The size of increment. + */ + increase(size?: number): ProgressJs; + + /** + * End the progress-bar and remove the elements from page. + */ + end(): ProgressJs; + + /** + * Set a single option to progressJs object. + * + * @param option Option key name. + * @param value Value of the option. + */ + setOption(option: string, value: string): ProgressJs; + setOption(option: string, value: boolean): ProgressJs; + + /** + * Set a group of options to the progressJs object. + * + * @param options Object that contains option keys with values. + */ + setOptions(options: ProgressJsOptions): ProgressJs; + + /** + * Set a callback function for before end of the progress-bar. + * + * @param providedCallback Callback function. + */ + onbeforeend(providedCallback: () => any): ProgressJs; + + /** + * Set a callback function to call before start the progress-bar. + * + * @param providedCallback Callback function. + */ + onbeforestart(providedCallback: () => any): ProgressJs; + + /** + * Set callback function to call for each change of progress-bar. + * + * @param providedCallback Callback function. + */ + onprogress(providedCallback: (targetElement: string, percent: number) => any): ProgressJs; +} + +interface ProgressJsOptions { + /** + * progress bar theme + */ + theme?: string; + /** + * overlay mode makes an overlay layer in the target element + */ + overlayMode?: boolean; + /** + * to consider CSS3 transitions in events + */ + considerTransition?: boolean; +} + +declare var progressJs: ProgressJsStatic