vincentjames501 / angular-cron-gen Goto Github PK
View Code? Open in Web Editor NEWA basic way to for users to graphically build a cron expression using Angular.
License: MIT License
A basic way to for users to graphically build a cron expression using Angular.
License: MIT License
Sorry for asking here.
Which node js library fits best with this cron generator?
I need it to accept the generated cron and execute the task on the backend.
Thanks in advance
One of the older versions of your library allowed for the specification of a user-defined template via an options.templateUrl
property. The switch to a templateUrl
function now no longer allows the user to use a scoped variable as, per the angular documentation, scoped values are not accessible because the template function is executed before the scope is even initialized.
This means that one cannot do template-url="{{ vm.template }}"
. I don't have a great solution here and it's clear that angular is not going to fix this issue.
You can see the issue here along with an attempted fix using injected $element
, $attrs
service values. You can ignore the parsing error and just look at the template value.
Is there a way to specify a default hour+minute+second for the time pickers?
Would be nice to have a separate Weekday checkbox to wizard like produce the following:
0 0 0 1W 1/1 ? *: on the first weekday of the month
0 0 0 14W 1/1 ? *: on the weekday nearest day 14 of the month (missing)
0 0 0 LW 1/1 ? *: on the last weekday of the month
Proposal:
In Montly having "On the":
First (without "Weekday")
1
..
31
Last (without "Weekday")
Additional checkbox for Weekday modifier ("W")
Hey, i have an issue on a select in the monthly tab, the list is filled with undefined values.
this is the control :
<select class="month-days"
name="monthlySpecificDayDay"
ng-disabled="$ctrl.ngDisabled || $ctrl.activeTab !== 'monthly' || $ctrl.state.monthly.subTab !== 'specificDay'"
ng-change="$ctrl.regenerateCron()"
ng-model="$ctrl.state.monthly.specificDay.day"
ng-required="$ctrl.activeTab === 'monthly' && $ctrl.state.monthly.subTab === 'specificDay'"
ng-options="monthDaysWithLast as $ctrl.monthDayDisplay(monthDaysWithLast) for monthDaysWithLast in $ctrl.selectOptions.monthDaysWithLasts"
ng-class="$ctrl.parsedOptions.formSelectClass"></select>
code of the list generation :
monthDaysWithLasts: ["1W"].concat(s([].concat(s(new Array(31).keys())).map(function (e) {
return "" + (e + 1)
})), ["LW", "L"])
Values generated : undefined, undefined,undefined,undefined,undefined,...
In cron-gen.module.js IE 11 throws an error "Object doesn't support property or method 'keys'" when setting up the SELECT_OPTIONS object. Is a shim needed to support the keys property? Seems the demo doesn't work under IE either but could be a bad setting on my part.
Users of angular-cron-gen
library would most probably benefit a lot from a "human readable" explanation option of a cron result. Example: 0 0 11 1/1 * ? *
could be easily displayed as At 01:00 AM, only on Monday and Wednesday
.
Would an integration with libraries like cronstrue be a good idea? I could gladly submit a PR for this.
Is it possible to use the same cron-gen for a cron display only?
on the daily tab the radio button is not marked with the item selected. functionally it is working finr but user cant see the option he selected. @vincentjames501 @AntonisFK
Noticed a small flaw when using angular-cron-gen in a modal. The weekdays in the week tab are not grid-like positioned.
Tried also with container and container-fluid in modal.
I think of the inproper use of http://getbootstrap.com/css/#forms-controls-static
<script type="text/ng-template" id="wfEditCronExpressionHelper.html">
<div class="modal-header">
<h3 class="modal-title custom-font">Cron Expression Helper</h3>
</div>
<div class="modal-body">
<div class="row">
<div>
<cron-gen ng-model="vm.editCronExpressionHelperCronExpression" options="vm.editCronExpressionHelperCronOptions"></cron-gen>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-success btn-ef btn-ef-3 btn-ef-3c" ng-click="ok()"><i class="fa fa-arrow-right"></i>OK (use expression)</button>
<button class="btn btn-lightred btn-ef btn-ef-4 btn-ef-4c" ng-click="cancel()"><i class="fa fa-arrow-left"></i>Cancel</button>
</div>
</script>
vm.editCronExpressionHelper = function () {
var modalInstance = $uibModal.open({
templateUrl: 'wfEditCronExpressionHelper.html',
controller: 'SimpleItemModalInstanceCtrl',
scope: $scope,
size: "lg",
});
modalInstance.result.then(function () {
// something
}, function () {
});
};
Hello
If we set the use24HourTime
option to true
, the model is not correctly refreshed.
For example, if you set every day at 22
, you will reload with every day at 10
.
You could see the bug here :
http://jsfiddle.net/ascott42/w5dzge1f/6/
The ngModel
watcher is triggered before the option watcher that's why the model is not computed with the 24 hour time format.
I fix it by recomputing the model every time options change, but this is not a very optimized solution (the cron is now analyzed two times).
// Watch for option changes
$scope.$watch('$ctrl.options', function (options) {
_this.parsedOptions = _this.mergeDefaultOptions(options);
return _this.handleModelChange(_this.ngModel);
}, true);
I'm interested in your opinion on this
Thanks
Hi,
Is there a way to keep the same cron expression generated in any tab, once I move to the Advanced tab?
I've followed the instructions on the README.md:
- Include the dependency in your app
angular.module('myApp', ['angular-cron-gen'])
- Include the supplied JS and CSS file (or create your own CSS to override defaults).
<link rel='stylesheet' href='build/cron-gen.min.css' type='text/css' media='all' />
<script type='text/javascript' src='build/cron-gen.min.js'></script>
Nevertheless, although the Widget appear, the layout is totally incorrect, indicating some problem with the CSS. Only when including the Bootstrap CSS the widget appears as in the Demo page.
Unfortunately, we cannot use the Bootstrap CSS, so i would like to know if the Widget only works correctly when including the Bootstrap CSS, or if there is a way to use it without it.
Regards, and thank you for your excellent widget.
How can we convert the same functionality to angular-2.
I installed this via bower specifically for the supported quartz cron format. But the "seconds" field is missing from the bower install.
bower i --save angular-cron-gen
I'm using all the default settings plus the advanced tab.
$scope.cronExpression = '0 0 0/3 1/1 * ? *'; $scope.isCronDisabled = false; $scope.cronOptions = { formInputClass: 'form-control cron-gen-input', formSelectClass: 'form-control cron-gen-select', formRadioClass: 'form-control-static cron-gen-radio', formCheckboxClass: 'form-control-static cron-gen-checkbox', hideMinutesTab: false, hideHourlyTab: false, hideDailyTab: false, hideWeeklyTab: false, hideMonthlyTab: false, hideYearlyTab: false, hideAdvancedTab: false, use24HourTime: false, hideSeconds: false }
Based on the repo is should exist, but I cannot find it in the installed package. Is there something I'm doing incorrectly?
I think the dependency to Symbol is unneeded.
It took too long for me to figure out what I exactly need to incorporate it in my application. At the end I adapted the source:
var States = {
INIT: 1, // Symbol('INIT'),
DIRTY: 2, // Symbol('DIRTY'),
CLEAN: 3 // Symbol('CLEAN')
};
I don't think you win something to be cutting-edge using Symbol.
Having a library with as few dependencies as possible is always the best.
Hello,
I'm switching between tabs Hourly/Monthly/Daily/Weekly, can someone help me
Is there any method to know that which tab i was in?
Help more appreciated,
Thanks,
We are using ng 1.4.8 in our company and as far as our product consist of several big modules it is not possible for us to migrate ng to higher version right now. So I was thinking to change source code of angular-cron-gen to adopt it to ng 1.4.
I checked source code of angular-cron-gen and find out the most used feature of ng 1.5 is components instead of directives. Is there any other feature of ng 1.5 used that I should change? any other suggestion appreciated.
how to hide minutes and seconds fields from all tabs?
how can i change the selected tab on init?
Once the ng-Model is empty, the cron gen behaves like it is scheduled by minute !!
How to initialise it as empty ? to get it as not scheduled ?
see:
https://www.npmjs.com/package/angular-cron-gen
include this lib use bower install, and then:
execute gulp build
command . error .
gulp-notify: Error: unable to minify JavaScript
You code seems ES6 syntax...
what happened ? thank you.
Hi. Great plugin. I use it inside <form>
with Angular Validation.
With use24HourTime option the AM/PM selector is hidden. And that's what I see in HTML:
It is hidden but it is also required and it has no default value, because of that my form is invalid.
{
"$error": {
"required": [
{
"$viewValue": null,
"$validators": {},
"$asyncValidators": {},
"$parsers": [],
"$formatters": [],
"$viewChangeListeners": [
null
],
"$untouched": true,
"$touched": false,
"$pristine": true,
"$dirty": false,
"$valid": false,
"$invalid": true,
"$error": {
"required": true
},
"$name": "HourType",
"$options": null
}
]
},
"$name": "$ctrl.form",
"$dirty": true,
"$pristine": false,
"$valid": false,
"$invalid": true,
"$submitted": false,
....
Any way to fix this? Thanks.
Hello,
I'm not sure it's an issue but I couldn't found localization/i18n support.
It would be great if it have support for it or if we could at least set the day names and some constants in the cronOptions parameter.
Hello, great work on this! I was wondering if it would be possible to create a ES 5 version?
In more recent versions of bootstrap they added a min-height: 34px property to form-control-static.
This makes the name of the days in the weekly tab unaligned. Since all the other properties of this class are being overwritten in other css, I propose that this class should be removed from the radio and checkbox class definition.
Current default values:
Proposed fix:
It would be nice if we could use the library with Angular 2+. Any plans of upgrading? Would you accept a PR for this?
This link is wrong and should be updated
angular-cron-gen/src/templates/cron-gen.html
Line 479 in f3a2885
IE doesn't support the use of the Symbol function used in cron-gen.js. :(
Can someone please let me know how to hide minutes selection dropdown in all the tabs ??
Thanks,
Anil
Hello Vincent,
Thanks for this great library.
We use the library in our project, and we discover that the nb of days in the selected month is not correct for example February is always 31 days.
would you accept a fix for this, I have two solutions for this
1- To change the value of monthDaysWithLasts :
monthDaysWithLasts: {
'1': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'2': ["1W"].concat(r(r(new Array(new Date(new Date().getFullYear(), 2, 0).getDate())).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'3': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'4': ["1W"].concat(r(r(new Array(30)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'5': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'6': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'7': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'8': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'9': ["1W"].concat(r(r(new Array(3)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'10': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'11': ["1W"].concat(r(r(new Array(30)).map(function(e,t){return"".concat(t+1)})),["LW","L"]),
'12': ["1W"].concat(r(r(new Array(31)).map(function(e,t){return"".concat(t+1)})),["LW","L"])
}
2- to calculate monthDaysWithLasts in a separate function
what do you think?
Hi,
How can i change the content of the advanced tab ?
I want to remove some text (without touching node modules)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.