chronoman
Version:
Utility class to simplify use of timers created by setTimeout
314 lines (226 loc) • 9.78 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>chronoman Index</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/sunlight.default.css">
<link type="text/css" rel="stylesheet" href="styles/site.spacelab.css">
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top ">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.html">chronoman</a>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#topNavigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="topNavigation">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="modules.list.html" class="dropdown-toggle" data-toggle="dropdown">Modules<b class="caret"></b></a>
<ul class="dropdown-menu ">
<li><a href="module-chronoman.html">chronoman</a></li>
</ul>
</li>
<li class="dropdown">
<a href="classes.list.html" class="dropdown-toggle" data-toggle="dropdown">Classes<b class="caret"></b></a>
<ul class="dropdown-menu ">
<li><a href="module-chronoman-Timer.html">chronoman~Timer</a></li>
</ul>
</li>
</ul>
<div class="col-sm-3 col-md-3">
<form class="navbar-form" role="search">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search" name="q" id="search-input">
<div class="input-group-btn">
<button class="btn btn-default" id="search-submit"><i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="container" id="toc-content">
<div class="row">
<div class="col-md-8">
<div id="main">
<section class="readme-section">
<article><h1>chronoman</h1><p>Utility class to simplify use of timers created by <code>setTimeout</code>.</p>
<h3>Features</h3><ul>
<li>Support for one-time (like <code>setTimeout</code>) or recurrent (like <code>setInterval</code>) timers.</li>
<li>It is possible to repeat action indefinitely (<code>recurrent</code> property),
specified number of times (<code>repeatQty</code> property) or depending on
result of control function (<code>repeatTest</code> property).</li>
<li>Time period (timeout) can be: a fixed value, a random value, an item selected from a list
depending on action's execution number, or a value returned from specified function.</li>
<li>Action that is called can be a function or an object specifying function and its call's context.</li>
<li>Action result is saved in timer's field for further access.</li>
<li>Timer's start time, stop time and action execution times are saved in
<code>startTime</code>, <code>stopTime</code> and <code>executeTime</code> properties correspondingly.</li>
</ul>
<pre class="prettyprint source lang-js"><code>var timer = new Timer({
period: [100, 200, 300, 400, 500, {start: 100, end: 500}],
repeatQty: 100,
passToAction: true,
action: function(tmr) {
console.log("#", tmr.getExecutionQty() + 1, ":", new Date());
},
active: true
});
...
timer.stop();</code></pre><p><a href="http://badge.fury.io/js/chronoman"><img src="https://badge.fury.io/js/chronoman.png" alt="NPM version"></a>
<a href="http://travis-ci.org/gamtiq/chronoman"><img src="https://secure.travis-ci.org/gamtiq/chronoman.png?branch=master" alt="Build Status"></a>
<a href="http://gruntjs.com/"><img src="https://gruntjs.com/cdn/builtwith.png" alt="Built with Grunt"></a></p>
<h2>Installation</h2><h3>Node</h3><pre class="prettyprint source"><code>npm install chronoman</code></pre><h3><a href="http://bower.io">Bower</a></h3><pre class="prettyprint source"><code>bower install chronoman</code></pre><h3>AMD, <script></h3><p>Use <code>dist/chronoman.js</code> or <code>dist/chronoman.min.js</code> (minified version).</p>
<h2>Usage</h2><h3>ECMAScript 6/2015</h3><pre class="prettyprint source lang-js"><code>import Timer from "chronoman";</code></pre><h3>Node</h3><pre class="prettyprint source lang-js"><code>var Timer = require("chronoman").Timer;</code></pre><h3>AMD</h3><pre class="prettyprint source lang-js"><code>define(["path/to/dist/chronoman.js"], function(chronoman) {
var Timer = chronoman.Timer;
...
});</code></pre><h3>Bower, <script></h3><pre class="prettyprint source lang-html"><code><!-- Use bower_components/chronoman/dist/chronoman.js if the library was installed by Bower -->
<script type="text/javascript" src="path/to/dist/chronoman.js"></script>
<script type="text/javascript">
// сhronoman is available via Chronoman field of window object
var Timer = Chronoman.Timer;
...
</script></code></pre><h3>Example</h3><pre class="prettyprint source lang-js"><code>var tmrOne = new Timer({
period: function(timer) {
return 1000 + (timer.getExecutionQty() * 100);
},
action: function(timer) {
console.log("---> Timer one. ", timer);
if (! tmrThree.isActive()) {
tmrThree.start();
}
}
});
var tmrTwo = new Timer();
tmrTwo.setPeriod([2000, , {start: 1000, end: 1500}])
.setRepeatQty(9)
.setPassToAction(true)
.setAction({
i: 0,
execute: function(timer) {
var nI = ++this.i;
console.log("Timer two. #", nI, timer);
tmrOne.setActive(nI % 2 === 1);
}
});
var tmrThree = new Timer()
.setPeriod(3000)
.setRepeatTest(function() {
return tmrTwo.isActive();
});
tmrThree.onExecute = function() {
console.log("* Timer three. #", this.getExecutionQty() + 1);
};
tmrTwo.start();</code></pre><p>See <code>test/chronoman.js</code> for additional examples.</p>
<h2>API</h2><p>See <code>doc</code> folder.</p>
<h2>Related projects</h2><ul>
<li><a href="https://github.com/gamtiq/numgen">NumGen</a></li>
<li><a href="https://github.com/gamtiq/povtor">povtor</a></li>
</ul>
<h2>Inspiration</h2><p>This module is inspired by <a href="http://qooxdoo.org">qooxdoo</a>'s <code>qx.event.Timer</code> class.</p>
<h2>Licence</h2><p>Copyright (c) 2013-2020 Denis Sikuler<br>Licensed under the MIT license.</p></article>
</section>
</div>
</div>
<div class="clearfix"></div>
<div class="col-md-3">
<div id="toc" class="col-md-3 hidden-xs hidden-sm hidden-md"></div>
</div>
</div>
</div>
<div class="modal fade" id="searchResults">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Search results</h4>
</div>
<div class="modal-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<footer>
<span class="copyright">
Copyright (c) 2013-2020 Denis Sikuler
</span>
<span class="jsdoc-message">
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.3</a>
on 2020-02-13T23:27:10+03:00
using the <a href="https://github.com/docstrap/docstrap">DocStrap template</a>.
</span>
</footer>
<script src="scripts/docstrap.lib.js"></script>
<script src="scripts/toc.js"></script>
<script type="text/javascript" src="scripts/fulltext-search-ui.js"></script>
<script>
$( function () {
$( "[id*='$']" ).each( function () {
var $this = $( this );
$this.attr( "id", $this.attr( "id" ).replace( "$", "__" ) );
} );
$( ".tutorial-section pre, .readme-section pre, pre.prettyprint.source" ).each( function () {
var $this = $( this );
var example = $this.find( "code" );
exampleText = example.html();
var lang = /{@lang (.*?)}/.exec( exampleText );
if ( lang && lang[1] ) {
exampleText = exampleText.replace( lang[0], "" );
example.html( exampleText );
lang = lang[1];
} else {
var langClassMatch = example.parent()[0].className.match(/lang\-(\S+)/);
lang = langClassMatch ? langClassMatch[1] : "javascript";
}
if ( lang ) {
$this
.addClass( "sunlight-highlight-" + lang )
.addClass( "linenums" )
.html( example.html() );
}
} );
Sunlight.highlightAll( {
lineNumbers : true,
showMenu : true,
enableDoclinks : true
} );
$.catchAnchorLinks( {
navbarOffset: 10
} );
$( "#toc" ).toc( {
anchorName : function ( i, heading, prefix ) {
return $( heading ).attr( "id" ) || ( prefix + i );
},
selectors : "#toc-content h1,#toc-content h2,#toc-content h3,#toc-content h4",
showAndHide : false,
smoothScrolling: true
} );
$( "#main span[id^='toc']" ).addClass( "toc-shim" );
$( '.dropdown-toggle' ).dropdown();
$( "table" ).each( function () {
var $this = $( this );
$this.addClass('table');
} );
} );
</script>
<!--Navigation and Symbol Display-->
<!--Google Analytics-->
<script type="text/javascript">
$(document).ready(function() {
SearcherDisplay.init();
});
</script>
</body>
</html>