claudiuconstantin/cron-editor

Graphically build a CRON expression in Angular applications

cron-editor's Issues

Generated wrong expression for seconds.

When I try to use the Minutes tab in the editor and choose "every 0 minutes and 40 seconds", it generates the expression as " 40 0/0 * 1/1 * ? * ". This means that the job will be triggered every 40th second every hour. Whereas I wanted it to be triggered every 40 seconds. This, as you can see is misleading and should be fixed.

Where is the CSS?

I've fired this up and it's functional but I can't seem to find the CSS files to make it display properly. I've been digging and the only thing I can find is a reference to bootstrap in the angular.json file, and I've replicated that and it still doesn't display. I fired up a brand new Angular app and tried to display it fresh and no luck... looks like this.

I'm going to continue to look for it but if you could point me in the right direction, that'd be great.

Thanks,
Andrew

How to set minutes tab as default initially ?

`hideMinutes` of Undefined

Errors

ERROR TypeError: Cannot read property 'hideMinutesTab' of undefined
    at Object.eval [as updateDirectives] (ng:///CronEditorModule/CronEditorComponent.ngfactory.js:2687)
    at Object.debugUpdateDirectives [as updateDirectives] (vendor.js:73542)
    at checkAndUpdateView (vendor.js:72938)
    at callViewAction (vendor.js:73179)
    at execComponentViewsAction (vendor.js:73121)
    at checkAndUpdateView (vendor.js:72944)
    at callViewAction (vendor.js:73179)
    at execComponentViewsAction (vendor.js:73121)
    at checkAndUpdateView (vendor.js:72944)
    at callViewAction (vendor.js:73179)

ng:///SharedModule/CronEditorComponent.ngfactory.js:7 ERROR TypeError: Cannot read property 'removeSeconds' of undefined
    at CronEditorComponent.push../node_modules/cron-editor/fesm5/cron-editor.js.CronEditorComponent.ngOnInit (vendor.js:308903)
    at checkAndUpdateDirectiveInline (vendor.js:71730)
    at checkAndUpdateNodeInline (vendor.js:72994)
    at checkAndUpdateNode (vendor.js:72956)
    at debugCheckAndUpdateNode (vendor.js:73590)
    at debugCheckDirectivesFn (vendor.js:73550)
    at Object.eval [as updateDirectives] (ng:///SharedModule/CronEditorComponent.ngfactory.js:21)
    at Object.debugUpdateDirectives [as updateDirectives] (vendor.js:73542)
    at checkAndUpdateView (vendor.js:72938)
    at callViewAction (vendor.js:73179)

This is how i implemented
1- npm i cron-editor -S
2- Import in my Module
3- Used in Html <cron-editor [(cron)]="cronExpression"></cron-editor>

Wrong expression generated

Whenever I start the app, there is an already-generated cron expression in this form:

0/1 * 1/1 * ?

So if I try to set "every 1 minute" and just it, it doesn't work. 1/1 remains and there is no way to change it.

ERROR in CronEditorModule is not an NgModule

First of all, Thank You for making it available for angular2.

I have below issue after installing the package and start the application.

"ERROR in CronEditorModule is not an NgModule"

Could you please help me.

Translations

How about adding options for translations?

Instantiate with default values while reopening cron editor

Using cron options to initialize, once reopened for second time cron editor is retaining the old selections.

How to reinitialize the default values available in cronOptions.

public cronOptions: CronOptions = {
    formInputClass: 'form-control cron-editor-input',
    formSelectClass: 'form-control cron-editor-select',
    formRadioClass: 'cron-editor-radio',
    formCheckboxClass: 'cron-editor-checkbox',

    defaultTime: '10:00:00',
    use24HourTime: true,

    hideMinutesTab: false,
    hideHourlyTab: false,
    hideDailyTab: false,
    hideWeeklyTab: false,
    hideMonthlyTab: false,
    hideYearlyTab: false,
    hideAdvancedTab: true,

    hideSeconds: false,
    removeSeconds: false,
    removeYears: false
  };

<cron-editor [(cron)]="cronExpression" [disabled]="isCronDisabled" [(options)]="cronOptions"></cron-editor>

Upgrade Bootstrap lib to v4+

Upgrade bootstrap npm package to latest version

autofill cron expression comes from the backend

If user wants to edit any cron expression then I have to first show the user, previous cron expression.
how can I do this in angular reactive form??

Update documentation

Keep different versions of documentation for library (npm package) and the development app

How to get the separate values for all fields.

I want separate all field entered value other than cron expression.

Type '{}' is not assignable to type 'string'

I read the example code and everywhere else the cronExpresion is string. But getting compile error when cronExpression is passed as string.

cronExpression = "0 0 4 1/1 * ? *";

I also tried with public
Same error for

public cronExpression : string = "0 0 4 1/1 * ? *";

Angular 2 cron editor

After integrating the changes i'm getting the below error:
] ERROR in c:/NEERCompliance/complianceapp/ComplianceApp.Web/client
-app/app/control-administration/schedule/cron-editor/cron-editor.comp
onent.ts (8,15): Ca

Doesn't support NCrons

I am using this component together with Hangfire background processing server. However the generated Crontab expression from your tool doesn't accept by the server. When I read some documentation it is noticed that Hangfire uses NCrons rather than Crons.

For example, a task that need to happens in every 5 minutes your tool generates the following expression.
0 0/5 * 1/1 * ? *

However, this expression doesn't accept by the Hangfire server.
The relevant NCron expression is */5 * * * *

Is it possible to support for NCron in future?

Regards

drop-down arrow is not visible

using below html code
<cron-editor class="cron" [(cron)]="cronExpression" [disabled]="isCronDisabled" [(options)]="cronOptions">

Component value is not nullable

Hello,

Thanks for the great component.
I use it to edit schedules and create new ones. There's no problem on editing, as an expression already exists; but when I create a new schedule, I get an error 'ERROR Error: Error: Expression is empty', because there is no initial expression in this case (and I don't want to add one to avoid the chance of user error). Although everything works, but there's still a red spot in the console :(

I could not determine the cause at the first glance; may be you can guide me where to look for it, so I'll make a PR?

use24HourTime AM/PM binding incorrect.

cron-editor/projects/cron-editor/src/lib/time-picker/time-picker.component.html

the binding for the AM/PM select ngModel is currently bound to time.hourTypes and should be time.hourType

In Daily just show Every day or Every working day. How to implement this?

Instantiate with default values while reopening cron editor

Using cron options to initialize, once reopened for second time cron editor is retaining the old selections.

How to reinitialize the default values available in cronOptions.

<cron-editor [(cron)]="cronExpression" [disabled]="isCronDisabled" [(options)]="cronOptions">

Modify UI with help of angular/ionic library

I want to modify the UI of the cron editor according to the project theme
Is it possible to use angular or ionic CSS library instead of bootstrap??
if yes, then please tell me how can I do this?

How to show the value use formcontrol in cron editor

When Edit a form I want to show the value from the database. Is it possible??

unix format

Thanx for giving us such a good library for cron expression. i am very happy to use it. do you have any plans to create library for unix format??

The editor is not display when hideMonthlyTab is true as default

if I set hideMonthlyTab is true as default, then the editor is not displayed anymore.
is there any option for setting the default active tab?

Is it possible to use this with systemjs ?

I'm trying to use cron-editor using sytemjs

  System.config({
        defaultJSExtensions: false,
        paths: {
                    'npm:': 'node_modules/'
        },
   
        map: {
            // our app is within the app folder
            app: 'app',
            //.....
            "cron-editor": "npm:cron-editor"
        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: {
                main: './main.js',
                defaultExtension: 'js'
            },
            'cron-editor': {
                main: './cron-editor.js',
            }
        }
    });

in appModule.ts

import { CronEditorModule } from "cron-editor/cron-editor";
@NgModule({
    imports: [
        BrowserModule,
   \\....
             CronEditorModule,
    \\....

But it is trying to add .js extension for all the files , I'm getting following errors

zone.js:2933 GET http://localhost/Inconverter/node_modules/cron-editor/components/cron-editor/cron-editor.component.css.js 404 (Not Found)
scheduleTask @ zone.js:2933
ZoneDelegate.scheduleTask @ zone.js:411
Zone.scheduleTask @ zone.js:236
Zone.scheduleMacroTask @ zone.js:259
(anonymous) @ zone.js:2966
proto.(anonymous function) @ zone.js:1366
fetchTextFromURL @ system.src.js:1051
(anonymous) @ system.src.js:1778
ZoneAwarePromise @ zone.js:890
(anonymous) @ system.src.js:1777
(anonymous) @ system.src.js:2806
(anonymous) @ system.src.js:3384
(anonymous) @ system.src.js:3707
(anonymous) @ system.src.js:4099
(anonymous) @ system.src.js:4562
(anonymous) @ system.src.js:4831
(anonymous) @ system.src.js:407
ZoneDelegate.invoke @ zone.js:392
Zone.run @ zone.js:142
(anonymous) @ zone.js:873
ZoneDelegate.invokeTask @ zone.js:425
Zone.runTask @ zone.js:192
drainMicroTaskQueue @ zone.js:602
ZoneTask.invokeTask @ zone.js:503
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2933
ZoneDelegate.scheduleTask @ zone.js:411
Zone.scheduleTask @ zone.js:236
Zone.scheduleMacroTask @ zone.js:259
(anonymous) @ zone.js:2966
proto.(anonymous function) @ zone.js:1366
fetchTextFromURL @ system.src.js:1051
(anonymous) @ system.src.js:1778
ZoneAwarePromise @ zone.js:890
(anonymous) @ system.src.js:1777
(anonymous) @ system.src.js:2806
(anonymous) @ system.src.js:3384
(anonymous) @ system.src.js:3707
(anonymous) @ system.src.js:4099
(anonymous) @ system.src.js:4562
(anonymous) @ system.src.js:4831
(anonymous) @ system.src.js:407
ZoneDelegate.invoke @ zone.js:392
Zone.run @ zone.js:142
(anonymous) @ zone.js:873
ZoneDelegate.invokeTask @ zone.js:425
Zone.runTask @ zone.js:192
drainMicroTaskQueue @ zone.js:602
ZoneTask.invokeTask @ zone.js:503
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2933
ZoneDelegate.scheduleTask @ zone.js:411
Zone.scheduleTask @ zone.js:236
Zone.scheduleMacroTask @ zone.js:259
(anonymous) @ zone.js:2966
proto.(anonymous function) @ zone.js:1366
fetchTextFromURL @ system.src.js:1051
(anonymous) @ system.src.js:1778
ZoneAwarePromise @ zone.js:890
(anonymous) @ system.src.js:1777
(anonymous) @ system.src.js:2806
(anonymous) @ system.src.js:3384
(anonymous) @ system.src.js:3707
(anonymous) @ system.src.js:4099
(anonymous) @ system.src.js:4562
(anonymous) @ system.src.js:4831
(anonymous) @ system.src.js:407
ZoneDelegate.invoke @ zone.js:392
Zone.run @ zone.js:142
(anonymous) @ zone.js:873
ZoneDelegate.invokeTask @ zone.js:425
Zone.runTask @ zone.js:192
drainMicroTaskQueue @ zone.js:602
ZoneTask.invokeTask @ zone.js:503
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2933
ZoneDelegate.scheduleTask @ zone.js:411
Zone.scheduleTask @ zone.js:236
Zone.scheduleMacroTask @ zone.js:259
(anonymous) @ zone.js:2966
proto.(anonymous function) @ zone.js:1366
fetchTextFromURL @ system.src.js:1051
(anonymous) @ system.src.js:1778
ZoneAwarePromise @ zone.js:890
(anonymous) @ system.src.js:1777
(anonymous) @ system.src.js:2806
(anonymous) @ system.src.js:3384
(anonymous) @ system.src.js:3707
(anonymous) @ system.src.js:4099
(anonymous) @ system.src.js:4562
(anonymous) @ system.src.js:4831
(anonymous) @ system.src.js:407
ZoneDelegate.invoke @ zone.js:392
Zone.run @ zone.js:142
(anonymous) @ zone.js:873
ZoneDelegate.invokeTask @ zone.js:425
Zone.runTask @ zone.js:192
drainMicroTaskQueue @ zone.js:602
ZoneTask.invokeTask @ zone.js:503
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2933
ZoneDelegate.scheduleTask @ zone.js:411
Zone.scheduleTask @ zone.js:236
Zone.scheduleMacroTask @ zone.js:259
(anonymous) @ zone.js:2966
proto.(anonymous function) @ zone.js:1366
fetchTextFromURL @ system.src.js:1051
(anonymous) @ system.src.js:1778
ZoneAwarePromise @ zone.js:890
(anonymous) @ system.src.js:1777
(anonymous) @ system.src.js:2806
(anonymous) @ system.src.js:3384
(anonymous) @ system.src.js:3707
(anonymous) @ system.src.js:4099
(anonymous) @ system.src.js:4562
(anonymous) @ system.src.js:4831
(anonymous) @ system.src.js:407
ZoneDelegate.invoke @ zone.js:392
Zone.run @ zone.js:142
(anonymous) @ zone.js:873
ZoneDelegate.invokeTask @ zone.js:425
Zone.runTask @ zone.js:192
drainMicroTaskQueue @ zone.js:602
ZoneTask.invokeTask @ zone.js:503
invokeTask @ zone.js:1540
globalZoneAwareCallback @ zone.js:1566
XMLHttpRequest.send (async)
scheduleTask @ zone.js:2933
ZoneDelegate.scheduleTask @ zone.js:411
Zone.scheduleTask @ zone.js:236
Zone.scheduleMacroTask @ zone.js:259
(anonymous) @ zone.js:2966
proto.(anonymous function) @ zone.js:1366
fetchTextFromURL @ system.src.js:1051
(anonymous) @ system.src.js:1778
ZoneAwarePromise @ zone.js:890
(anonymous) @ system.src.js:1777
(anonymous) @ system.src.js:2806
(anonymous) @ system.src.js:3384
(anonymous) @ system.src.js:3707
(anonymous) @ system.src.js:4099
(anonymous) @ system.src.js:4562
(anonymous) @ system.src.js:4831
(anonymous) @ system.src.js:407
ZoneDelegate.invoke @ zone.js:392
Zone.run @ zone.js:142
(anonymous) @ zone.js:873
ZoneDelegate.invokeTask @ zone.js:425
Zone.runTask @ zone.js:192
drainMicroTaskQueue @ zone.js:602
Promise.then (async)
scheduleMicroTask @ zone.js:585
ZoneDelegate.scheduleTask @ zone.js:414
Zone.scheduleTask @ zone.js:236
Zone.scheduleMicroTask @ zone.js:256
scheduleResolveOrReject @ zone.js:871
ZoneAwarePromise.then @ zone.js:981
(anonymous) @ system.src.js:4789
import @ system.src.js:839
(anonymous) @ system.src.js:1801
(anonymous) @ (index):34
(index):34 Error: (SystemJS) XHR error (404 Not Found) loading http://localhost/Inconverter/node_modules/cron-editor/components/cron-editor/cron-editor.component.css.js
Error: XHR error (404 Not Found) loading http://localhost/Inconverter/node_modules/cron-editor/components/cron-editor/cron-editor.component.css.js

Render not working

Hello,

I'm looking for a cron (quartz) editor on angular 7, I tried your it looks like:

What's the problem ? (I have bootstrap)
Thank's.

How to generate CRON expression in angular 12

I know I am asking for reference and not actual code help here.

We have our own custom UI which has control onto it like- start time, end time, repeat on, each day etc. Now, by taking all those custom controls value we need to generate a CRON expression.

Can you please give any reference on how can we use this by passing our own UI elements values?