Skip to content

Commit

Permalink
improvements
Browse files Browse the repository at this point in the history 
- strings to Date object
- parameters to JoomlaCalendar.params (tide up)
- remove option for highlighted today, now always on (no reason for this to be disabled)
- better naming of some variables
- local calendars require to override only the calendar-setup-vanilla.js e.g.: media/fa-IR/js/calendar-setup-vanilla.js
- Persian calendar override setup script : https://gist.github.com/dgt41/73269432efec4365c57df8491ae0012f (still buggy)
  • Loading branch information
@dgrammatiko
dgrammatiko committed Jul 18, 2016
1 parent 207fd6b commit 44589ad
Show file tree
Hide file tree
Showing 6 changed files with 200 additions and 197 deletions.
2 changes: 1 addition & 1 deletion administrator/templates/isis/html/layouts/joomla/form/field/calendar.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,7 +175,7 @@
<button type="button" class="btn btn-secondary"
id="<?php echo $id; ?>_btn"
data-inputfield="<?php echo $id; ?>"
data-ifformat="<?php echo $format; ?>"
data-dayformat="<?php echo $format; ?>"
data-button="<?php echo $id; ?>_btn"
data-firstday="<?php echo JFactory::getLanguage()->getFirstDay(); ?>"
data-weekend="<?php echo JFactory::getLanguage()->getWeekEnd(); ?>"
Expand Down
2 changes: 1 addition & 1 deletion layouts/joomla/form/field/calendar.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,7 @@
<button type="button" class="btn btn-secondary"
id="<?php echo $id; ?>_btn"
data-inputfield="<?php echo $id; ?>"
data-ifformat="<?php echo $format; ?>"
data-dayformat="<?php echo $format; ?>"
data-button="<?php echo $id; ?>_btn"
data-firstday="<?php echo JFactory::getLanguage()->getFirstDay(); ?>"
data-weekend="<?php echo JFactory::getLanguage()->getWeekEnd(); ?>"
Expand Down
1 change: 0 additions & 1 deletion libraries/joomla/form/fields/calendar.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,6 @@ protected function getLayoutData()
'weeknumbers' => $this->weeknumbers,
'showtime' => $this->showtime,
'filltable' => $this->filltable,
// 'multiple' => $this->multiple,
'timeformat' => $this->timeformat,
'minyear' => $this->minyear,
'maxyear' => $this->maxyear,
Expand Down
83 changes: 50 additions & 33 deletions media/system/js/calendar-setup-vanilla.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@
*
* dateType: 'jalali' The name of the local calendar
* localLangNumbers: [0-9] The array with the translated numbers 0 to 9
* stringLocalWEEKEND The array with the day numbers signify weekend eg: [0,6] refers to (Sun,Sat)
* stringLocalSDN The array with the short day names eg: ["Sun", "Mon" ... ]
*
* Also needed a function that will bind on form submit and will convert local to gregorian.
**/
Expand All @@ -33,43 +35,59 @@ document.onreadystatechange = function () {
JoomlaCalendar.setup = function (elem) {

var element = elem.getElementsByTagName("button")[0];

Date.stringDN =element.getAttribute("data-weekdays_full") ? element.getAttribute("data-weekdays_full").split('_') :
["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"]; // Translated full day names
Date.stringSDN = element.getAttribute("data-weekdays_short") ? element.getAttribute("data-weekdays_short").split('_') :
["Sun","Mon","Tue","Wed","Thu","Fri","Sat","Sun"]; // Translated short day names
Date.stringMN = element.getAttribute("data-months_long") ? element.getAttribute("data-months_long").split('_') :
["January","February","March","April","May","June","July","August","September","October","November","December"]; // Translated full month names
Date.stringSMN = element.getAttribute("data-months_short") ? element.getAttribute("data-months_short").split('_') :
["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; // Translated short month names
Date.stringTODAY = element.getAttribute("data-today_trans") ? element.getAttribute("data-today_trans") : "Today"; // Translated string for Today
Date.stringWEEKEND = element.getAttribute("data-weekend") ? element.getAttribute("data-weekend").split(',').map(Number) :
[0,6]; // integers comma separated 0,6
Date.stringWK = element.getAttribute("data-wk") ? element.getAttribute("data-wk") : "wk"; // Translated string for wk
Date.stringTIME = element.getAttribute("data-time") ? element.getAttribute("data-time") : "Time:"; // Translated string for Time:
Date.stringTIMEAM = element.getAttribute("data-time_am") ? element.getAttribute("data-time_am") : "AM"; // Translated string for AM
Date.stringTIMEPM = element.getAttribute("data-time_pm") ? element.getAttribute("data-time_pm") : "PM"; // Translated string for PM

Date.localStringDN = element.getAttribute("data-weekdays_full") ? element.getAttribute("data-weekdays_full").split('_') :
["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"]; // Translated full day names
Date.localStringSDN = element.getAttribute("data-weekdays_short") ? element.getAttribute("data-weekdays_short").split('_') :
["Sun","Mon","Tue","Wed","Thu","Fri","Sat","Sun"]; // Translated short day names
Date.localStringMN = element.getAttribute("data-months_long") ? element.getAttribute("data-months_long").split('_') :
["January","February","March","April","May","June","July","August","September","October","November","December"]; // Translated full month names
Date.localStringSMN = element.getAttribute("data-months_short") ? element.getAttribute("data-months_short").split('_') :
["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; // Translated short month names
Date.localStringTODAY = element.getAttribute("data-today_trans") ? element.getAttribute("data-today_trans") : "Today"; // Translated string for Today
Date.localStringWEEKEND= element.getAttribute("data-weekend") ? element.getAttribute("data-weekend").split(',').map(Number) :
[0,6]; // integers comma separated 0,6
Date.localStringWK = element.getAttribute("data-wk") ? element.getAttribute("data-wk") : "wk"; // Translated string for wk
Date.localStringTIME = element.getAttribute("data-time") ? element.getAttribute("data-time") : "Time:"; // Translated string for Time:
Date.localStringTIMEAM = element.getAttribute("data-time_am") ? element.getAttribute("data-time_am") : "AM"; // Translated string for AM
Date.localStringTIMEPM = element.getAttribute("data-time_pm") ? element.getAttribute("data-time_pm") : "PM"; // Translated string for PM
Date.localLangNumbers = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];

JoomlaCalendar.addEvent(element, "click", function () {

var params = {
inputField : element.parentNode.getElementsByTagName('INPUT')[0], // The related input
ifFormat : element.getAttribute("data-ifformat") ? element.getAttribute("data-ifformat") : "%Y-%m-%d %H:%M:%S", // The date format
dateFormat : element.getAttribute("data-dayformat") ? element.getAttribute("data-dayformat") : "%Y-%m-%d %H:%M:%S", // The date format
button : element, // The button associated
firstDay : element.getAttribute("data-firstday") ? parseInt(element.getAttribute("data-firstday")) : 0, // First day (from translated strings) integer 0 = Sun
todayBtn : (parseInt(element.getAttribute("data-today_btn")) == 0) ? false : true, // Enable today button?
onlyMonths : (parseInt(element.getAttribute("data-only_months_nav")) == 1) ? true : false, // Month and year in one line?
hiliteToday : (parseInt(element.getAttribute("data-hilite_today")) != 1) ? false : true, // Highlight today?
firstDayOfWeek : element.getAttribute("data-firstday") ? parseInt(element.getAttribute("data-firstday")) : 0, // First day (from translated strings) integer 0 = Sun
showsTodayBtn : false, //(parseInt(element.getAttribute("data-today_btn")) == 0) ? false : true, // Enable today button?
compressedHeader : true, //(parseInt(element.getAttribute("data-only_months_nav")) == 1) ? true : false, // Month and year in one line?
minYear : element.getAttribute("data-min_year") ? parseInt(element.getAttribute("data-min_year")) : 1970, // Minimum year
maxYear : element.getAttribute("data-max_year") ? parseInt(element.getAttribute("data-max_year")) : 2050, // Maximum year
weekNumbers : (parseInt(element.getAttribute("data-week_numbers")) == 1) ? true : false, // Display week numbers column?
showsTime : (parseInt(element.getAttribute("data-shows_time")) == 1) ? true : false, // Enable time picker? Make sure that the date format also INCLUDES time
showsTime : true, //(parseInt(element.getAttribute("data-shows_time")) == 1) ? true : false, // Enable time picker? Make sure that the date format also INCLUDES time
time24 : (parseInt(element.getAttribute("data-time_24")) == 24) ? true : false, // Use 24 hour format?
showOthers : (parseInt(element.getAttribute("data-show_others")) == 0) ? false : true, // Show days form the month before and after?

stringDN : element.getAttribute("data-weekdays_full") ? element.getAttribute("data-weekdays_full").split('_') :
["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"], // Translated full day names
stringSDN : element.getAttribute("data-weekdays_short") ? element.getAttribute("data-weekdays_short").split('_') :
["Sun","Mon","Tue","Wed","Thu","Fri","Sat","Sun"], // Translated short day names
stringMN : element.getAttribute("data-months_long") ? element.getAttribute("data-months_long").split('_') :
["January","February","March","April","May","June","July","August","September","October","November","December"], // Translated full month names
stringSMN : element.getAttribute("data-months_short") ? element.getAttribute("data-months_short").split('_') :
["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"], // Translated short month names
stringTODAY : element.getAttribute("data-today_trans") ? element.getAttribute("data-today_trans") : "Today", // Translated string for Today
stringWEEKEND: element.getAttribute("data-weekend") ? element.getAttribute("data-weekend").split(',').map(Number) :
[0,6], // integers comma separated 0,6
stringWK : element.getAttribute("data-wk") ? element.getAttribute("data-wk") : "wk", // Translated string for wk
stringTIME : element.getAttribute("data-time") ? element.getAttribute("data-time") : "Time:", // Translated string for Time:
stringTIMEAM : element.getAttribute("data-time_am") ? element.getAttribute("data-time_am") : "AM", // Translated string for AM
stringTIMEPM : element.getAttribute("data-time_pm") ? element.getAttribute("data-time_pm") : "PM", // Translated string for PM
showsOthers : (parseInt(element.getAttribute("data-show_others")) == 0) ? false : true, // Show days form the month before and after?
/**
* Support for different calendars, e.g.: jalali
*/
dateType: 'gregorian'
//localLangNumbers : ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"]
};

// Initialize only if the button and input field are set
Expand All @@ -78,12 +96,16 @@ document.onreadystatechange = function () {
return false;
}

// Initialize the calendar
var dateEl = params.inputField;
var cal = window.jCalendar;

// Method to set the value for the input field
function onSelect(cal) {
var p = cal.params;
var update = cal.dateClicked;
if (p.inputField) {
p.inputField.value = cal.date.print(p.ifFormat);
p.inputField.value = cal.date.print(p.dateFormat, params.dateType);
if (typeof p.inputField.onchange == "function")
p.inputField.onchange();
}
Expand All @@ -93,20 +115,15 @@ document.onreadystatechange = function () {
cal.callCloseHandler();
}

// Initialize the calendar
var dateEl = params.inputField;
var dateFmt = params.ifFormat;
var cal = window.jCalendar;

// Get the date from the input
if (dateEl) {
params.dateStr = Date.parseDate(params.inputField.value, params.ifFormat);
params.dateStr = Date.parseDate(params.inputField.value, params.dateFormat, params.dateType);
}

// Create the calendar
window.jCalendar = cal = new JoomlaCalendar(onSelect, null, params);
cal.params = params;
cal.setDateFormat(dateFmt);
cal.setDateFormat(params.dateFormat);
cal.create(params.inputField);
cal.refresh();
cal.show();
Expand All @@ -118,7 +135,7 @@ document.onreadystatechange = function () {
var calendars = document.getElementsByClassName("field-calendar");

// Loop to initialize them all
for (index = 0, len = calendars.length; index < len; ++index) {
for (var index = 0, len = calendars.length; index < len; ++index) {
JoomlaCalendar.setup(calendars[index]);
}
}
Expand Down
Loading

0 comments on commit 44589ad

Please sign in to comment.