Gathering detailed insights and metrics for ember-fullcalendar
Gathering detailed insights and metrics for ember-fullcalendar
Gathering detailed insights and metrics for ember-fullcalendar
Gathering detailed insights and metrics for ember-fullcalendar
An Ember Component for FullCalendar and FullCalendar Scheduler
npm install ember-fullcalendar
Typescript
Module System
Node Version
NPM Version
JavaScript (91.03%)
HTML (5.92%)
Handlebars (3.06%)
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
MIT License
39 Stars
142 Commits
45 Forks
3 Watchers
26 Branches
13 Contributors
Updated on May 30, 2024
Latest Version
2.0.0
Package Id
ember-fullcalendar@2.0.0
Unpacked Size
20.11 kB
Size
7.12 kB
File Count
9
NPM Version
6.13.4
Node Version
10.19.0
Cumulative downloads
Total Downloads
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
9
27
ember-fullcalendar brings the power of FullCalendar and FullCalendar Scheduler to Ember.
This addon works in Ember 2.12+ with no deprecations.
To install it run:
ember install ember-fullcalendar
This addon currently supports every option and callback currently available for FullCalendar and FullCalendar Scheduler 4.4. Please see the FullCalendar documentation for more information.
If you upgrade from a previous version of ember-fullcalendar
using FullCalendar 3.x, note the FullCalendar v4 release notes and upgrade guide.
To use plugins, you need to pass a plugins
array to the full-calendar
component and add any plugins you need to the dependencies of your app. The plugin css must be included by adding the plugin to your environment.js.
You no longer need to define includeLocales
in your environment.js, but instead import and pass them in the locales
option.
Instead of setting includeScheduler
use the appropriate Scheduler plugins.
A simple example:
1import dayGridPlugin from '@fullcalendar/daygrid'; 2 3let events = Ember.A([{ 4 title: 'Event 1', 5 start: '2016-05-05T07:08:08', 6 end: '2016-05-05T09:08:08' 7}, { 8 title: 'Event 2', 9 start: '2016-05-06T07:08:08', 10 end: '2016-05-07T09:08:08' 11}, { 12 title: 'Event 3', 13 start: '2016-05-10T07:08:08', 14 end: '2016-05-10T09:48:08' 15}, { 16 title: 'Event 4', 17 start: '2016-05-11T07:15:08', 18 end: '2016-05-11T09:08:08' 19}]); 20 21let plugins = [dayGridPlugin]; 22 23{{full-calendar events=events plugins=plugins}}
The CSS of the plugins you are using must be included by defining them in your config/environment.js
file:
1 emberFullCalendar: { 2 plugins: ['core', 'daygrid', 'list'], 3 }
To call FullCalendar methods, you need a reference to the calendar object.
A reference gets passed with every FullCalendar callback as last parameter, so you can use e.g. viewSkeletonRender
to get the object:
1// app/controllers/application.js 2import Ember from 'ember'; 3 4export default Ember.Controller.extend({ 5 actions: { 6 viewSkeletonRender(info, calendar) { 7 this.set('calendar', calendar); 8 }, 9 10 nextMonth() { 11 this.calendar.next(); 12 }, 13 } 14});
1// app/controllers/application.hbs 2 3{{full-calendar viewSkeletonRender=(action "viewSkeletonRender")}}
Where possible, this addon takes advantage of DDAU (Data Down, Actions Up) to allow your Ember app to interact with FullCalendar from outside of the component. Below are a list of properties that override default FullCalendar properties:
viewName
(replaces defaultView
) - allows you to change the view mode from outside of the component. For example, when using header=false
, you can use your own buttons to modify the viewName
property to change the view of the calendar.
viewRange
- can be used in conjunction with viewName
to simultaneously navigate to a new date when switching to a new view. See the docs.
onViewChange
- pass an action to be notified when the view changes. This is different than the viewRender
callback provided by FullCalendar as it is only triggered when the view changes and is not when any of the date navigation methods are called.
date
(replaces defaultDate
) - allows you to change the date from outside of the component.
All FullCalendar and FullCalendar Scheduler callbacks are supported and can be handled using Ember Actions. Here's a simple example:
Add the component to your template:
1// app/templates/application.hbs 2{{full-calendar events=events eventClick=(action 'clicked')}}
Add some events:
1// app/routes/application.js 2import Ember from 'ember'; 3 4export default Ember.Route.extend({ 5 model: function() { 6 return { 7 events: Ember.A([{ 8 title: 'Partayyyy', start: new Date() 9 }]) 10 }; 11 } 12});
Register the action in your controller or component:
1// app/controllers/application.js 2import Ember from 'ember'; 3 4export default Ember.Controller.extend({ 5 actions: { 6 clicked({event, jsEvent, view}){ 7 this.showModal(event); 8 } 9 } 10});
By default, the addon uses the Free Trial License Key provided by FullCalendar. If you have a paid license key, you may set it by explicitly passing it into the component as schedulerLicenseKey
or, the better option, is to set it in your config/environment.js
file like so:
1var ENV = { 2 emberFullCalendar: { 3 schedulerLicenseKey: '<your license key>', 4 } 5 // Other options here, as needed. 6};
To use locales, import and pass them in the locales
option. See the docs for more info
This addon now has minimal Fastboot support via #46.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
Found 3/12 approved changesets -- score normalized to 2
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
122 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-06-30
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More