osseed / com.osseed.eventcalendar

CiviCRM Event Calendar
GNU General Public License v3.0
11 stars 37 forks source link

move moment and full calendar above inline scripts on calendar page #62

Closed davidjosephhayes closed 2 years ago

davidjosephhayes commented 5 years ago

moment.js and fullcalendar.js were loading below the inline javascrpt in tempalte/CRM/Eventcalendar/Page/ShowEvents.tpl causing a a cj.fullcalendar is not defined error in Wordpress

elisseck commented 5 years ago

I reviewed this because I was having the same issue (Project currently running CiviCRM 5.13.4 and Wordpress 5.2.4).

Previous behavior: Calendar would not load up at all so we get a blank screen, console error 'cj.fullcalendar is not defined'.

New behavior (git fetch origin +refs/pull/62/merge, git checkout FETCH_HEAD): Calendar loads up as expected. No console errors.

Have not reviewed this change on another CMS installation for consistency but it works for WP.

alexymik commented 5 years ago

I had to change 'page-header' to 'html-header' to get it to work for me. Thanks for pointing in the right direction.

Running Drupal 7 and CiviCRM 5.18

davidjosephhayes commented 5 years ago

Switched to html-header because that is where the rest of the CiviCRM scripts (specifically jQuery) are rendering. I also moved the events to a data parameter and moved the render script to an external file. Turns out this fix is somewhat dependent on what other plugins/extensions are loading for jQuery.

Commits for Drupal 8 compatibility are accidentally included in the PR. I had merged back in the most recent changes.

mlutfy commented 4 years ago

html-header also worked for me on a Drupal7 site and had to change cj().fullCalendar to CRM.$(..).fullCalendar().

The JS scoping could be cleaned up a bit using the examples in here: https://docs.civicrm.org/dev/en/latest/standards/javascript/

Ex:

(function($, _, ts) {
  // your code here
})(CRM.$, CRM._, CRM.ts('com.osseed.eventcalendar'));

(I can try to submit a followup PR, if I forget, feel free to ping me)