angular-cron-jobs

WebJar for angular-cron-jobs

License

License

MIT
Categories

Categories

Github Development Tools Version Controls Angular User Interface Web Frameworks
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

github-com-angular-cron-jobs-angular-cron-jobs
Last Version

Last Version

3.2.0
Release Date

Release Date

Type

Type

jar
Description

Description

angular-cron-jobs
WebJar for angular-cron-jobs
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/angular-cron-jobs/angular-cron-jobs

Download github-com-angular-cron-jobs-angular-cron-jobs

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/github-com-angular-cron-jobs-angular-cron-jobs/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>github-com-angular-cron-jobs-angular-cron-jobs</artifactId>
    <version>3.2.0</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/github-com-angular-cron-jobs-angular-cron-jobs/
implementation 'org.webjars.bower:github-com-angular-cron-jobs-angular-cron-jobs:3.2.0'
// https://jarcasting.com/artifacts/org.webjars.bower/github-com-angular-cron-jobs-angular-cron-jobs/
implementation ("org.webjars.bower:github-com-angular-cron-jobs-angular-cron-jobs:3.2.0")
'org.webjars.bower:github-com-angular-cron-jobs-angular-cron-jobs:jar:3.2.0'
<dependency org="org.webjars.bower" name="github-com-angular-cron-jobs-angular-cron-jobs" rev="3.2.0">
  <artifact name="github-com-angular-cron-jobs-angular-cron-jobs" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='github-com-angular-cron-jobs-angular-cron-jobs', version='3.2.0')
)
libraryDependencies += "org.webjars.bower" % "github-com-angular-cron-jobs-angular-cron-jobs" % "3.2.0"
[org.webjars.bower/github-com-angular-cron-jobs-angular-cron-jobs "3.2.0"]

Dependencies

compile (2)

Group / Artifact Type Version
org.webjars.bower : angular jar [0,)
org.webjars.bower : angular-mocks jar [0,)

Project Modules

There are no modules declared in this project.

NO LONGER MAINTAINED

This project is no longer maintained! If some wants to take over the project and begin merging in PRs, addressing Issues, and updating functionality please reach out!

Last known compatibility is with Angular 1.5.8

Thanks you everyone who used and helped create Angular Cron Jobs!

Build Status Coverage Status Codacy Badge npm version

angular-cron-jobs

UI Component For Creating Cron Job Syntax To Send To Server

Demo

Installation

Install using bower:

bower install angular-cron-jobs

Use:

Include the component in your application:

angular.module('myApp', ['angular-cron-jobs']);

Insert the directive where you would like it to appear in your application:

<cron-selection ng-model="myOutput"></cron-selection>

By setting the ng-model attribute equal to a value in your controller (i.e. $scope.myOutput in the example above) you have access to the cron syntax output.

For example, a job selected to run every month on the 11th at 4:10 AM would output the follow:

'10 4 11 * *'

as a string.

Configuration:

The directive takes an optional attribute of config

<cron-selection ng-model="myOutput" config="myConfig"></cron-selection>

Options

This is an object in your controller you can use to remove options from the user. For example if you would like the user to be able to set Minute, Hour, and Day but not Week, Month, and Year you would create the following object in your controller:

$scope.myConfig = {
    options: {
        allowWeek : false,
        allowMonth : false,
        allowYear : false
    }
}

Currently the config object accepts an options property with an object of allowed selections. These include:

  • allowMinute
  • allowHour
  • allowDay
  • allowWeek
  • allowMonth
  • allowYear

Setting the keys as booleans will turn the selection on and off.

allowMultiple

You can also set whether or not you want to allow a user to select multiple calues for a cron:

$scope.myConfig = {
    allowMultiple: true
}

Setting allowMultiple to either true or false will toggle the ability.

Quartz by RajanRastogi

By default, the cron expression generated is Unix Cron compatible. Incase you use the Quartz Scheduler, you would want to enable the quartz mode in the options. You can do so by passing that flag as true in the config object.

$scope.myConfig = {
    quartz: true
}

In case you are using a custom template, please be sure to pass an extra argument cronStyle to the cronDayName filter. So your code should look something like this:

value as (value | cronDayName: cronStyle) for value in dayValues

A complete config object may look like the following:

$scope.myConfig = {
    allowMultiple: true,
    options: {
        allowWeek : false,
        allowMonth : false,
        allowYear : false
    },
    quartz: true
}

Custom Templates:

As noted by TimotheeJeannin you can use custom template by setting the template attribute on your cron DOM element:

<cron-selection template="path/to/my/template.html"></cron-selection>

Initializing UI with data from server

The directive takes an attribute of ng-model used for init and output data.

<cron-selection ng-model="myOutput" config="myConfig"></cron-selection>

This is a string in your controller of cron syntax that was recieved from your server or any other source:

$scope.myOutput = "30 2 4 * *"

Thew directive will properly build out the UI to reflect this data.

Setting Cron after directive load

The ng-model attribute also works as a reset attribute

<cron-selection ng-model="myOutput" config="myConfig"></cron-selection>

This is an expression paired with a value in your controller. Whenever the value changes (or is set for the first time) and passed the angular.isDefined() method the cron will reset itself to match that value

$timeout(function(){
   $scope.myOutput = "0 0 * * *"
}, 3000);

The directive will properly build out the UI to reflect this data.

Utilize Exposed $scope.myFrequency:

the frequency attribute grants you exposure to the $scope.myFrequency object inside the directive. It is two way bound so you can manipulate it from outside the directive as well.

The type of {number|Array.<number>} depends on the following: number if allowMultiple is false and Array if allowMultiple is true

Properties you now have access to via frequency attribute include:

  • base {number} 1-6 (minute thru year)
  • minuteValue {number|Array.<number>} 0-55 (increments of 5)
  • hourValue {number|Array.<number>} 1-23
  • dayOfMonthValue {number|Array.<number>} 0-6 (Sunday thru Saturday)
  • monthValue {number|Array.<number>} 1-12

You can get away from using select inputs in your custom temple using the frequency attribute.

Demo Without Using Selects

Contributors

@jacobscarter - Author

@wowo

@immertreu

@TSteele27

@DmitryEfimenki

Coming Soon:

The next big to-do's on my list include:

* Support generlized selections such as a one button click for "Every Five Minutes" or "Last Thursday of Every Month"

Versions

Version
3.2.0