Make Datepicker translatable

Summary: This adds the Ablillity to translate the Content of the Date Picker. It is possible to display more than one Letter for the Day Captions.

Test Plan:
- Change the Language in the User Preferences, make sure it translates 'S|M|T|W|T|F|S' and Months or add the following to the translation.override config to get German Translation:

```
{
'S|M|T|W|T|F|S': 'So|Mo|Di|Mi|Do|Fr|Sa',
'January': 'Januar',
'February': 'Februar',
'March': 'März',
'May': 'Mai',
'June': 'Juni',
'July': 'Juli',
'October': 'Oktober',
'December': 'Dezember'
}
```
- Open Datepicker on a Datefield (Edit Event or Edit for Custom Field of Type date)
- The Day Headers and the Months should now be translated

Reviewers: O1 Blessed Committers, speck

Reviewed By: O1 Blessed Committers, speck

Subscribers: CSharp, 0, speck, tobiaswiese

Tags: #calendar

Differential Revision: https://we.phorge.it/D25016

authored by

Leon Eckardt and committed by

Christopher Speck 4 years ago b293e6ff fd1922c7

+40 -23

3 changed files

expand all

resources

celerity

map.php

src

view

form

control

AphrontFormDateControl.php

webroot

rsrc

core

behavior-fancy-datepicker.js

+9 -9

resources/celerity/map.php

··· 481 481 'rsrc/js/core/behavior-detect-timezone.js' => '78bc5d94', 482 482 'rsrc/js/core/behavior-device.js' => 'ac2b1e01', 483 483 'rsrc/js/core/behavior-drag-and-drop-textarea.js' => '7ad020a5', 484 - 'rsrc/js/core/behavior-fancy-datepicker.js' => '956f3eeb', 484 + 'rsrc/js/core/behavior-fancy-datepicker.js' => 'e77fcc9d', 485 485 'rsrc/js/core/behavior-form.js' => '55d7b788', 486 486 'rsrc/js/core/behavior-gesture.js' => 'b58d1a2a', 487 487 'rsrc/js/core/behavior-global-drag-and-drop.js' => '1cab0e9a', ··· 635 635 'javelin-behavior-editengine-reorder-configs' => '4842f137', 636 636 'javelin-behavior-editengine-reorder-fields' => '0ad8d31f', 637 637 'javelin-behavior-event-all-day' => '0b1bc990', 638 - 'javelin-behavior-fancy-datepicker' => '956f3eeb', 638 + 'javelin-behavior-fancy-datepicker' => 'e77fcc9d', 639 639 'javelin-behavior-global-drag-and-drop' => '1cab0e9a', 640 640 'javelin-behavior-harbormaster-log' => 'b347a301', 641 641 'javelin-behavior-herald-rule-editor' => '0922e81d', ··· 1781 1781 'javelin-vector', 1782 1782 'javelin-stratcom', 1783 1783 ), 1784 - '956f3eeb' => array( 1785 - 'javelin-behavior', 1786 - 'javelin-util', 1787 - 'javelin-dom', 1788 - 'javelin-stratcom', 1789 - 'javelin-vector', 1790 - ), 1791 1784 '9623adc1' => array( 1792 1785 'javelin-behavior', 1793 1786 'javelin-stratcom', ··· 2173 2166 'javelin-workflow', 2174 2167 'javelin-dom', 2175 2168 'phabricator-draggable-list', 2169 + ), 2170 + 'e77fcc9d' => array( 2171 + 'javelin-behavior', 2172 + 'javelin-util', 2173 + 'javelin-dom', 2174 + 'javelin-stratcom', 2175 + 'javelin-vector', 2176 2176 ), 2177 2177 'e8240b50' => array( 2178 2178 'javelin-behavior',

+16

src/view/form/control/AphrontFormDateControl.php

··· 267 267 $week_key = PhabricatorWeekStartDaySetting::SETTINGKEY; 268 268 $week_start = $viewer->getUserSetting($week_key); 269 269 270 + $date_pht = array( 271 + 'S|M|T|W|T|F|S' => pht('S|M|T|W|T|F|S'), 272 + 'January' => pht('January'), 273 + 'February' => pht('February'), 274 + 'March' => pht('March'), 275 + 'April' => pht('April'), 276 + 'May' => pht('May'), 277 + 'June' => pht('June'), 278 + 'July' => pht('July'), 279 + 'August' => pht('August'), 280 + 'September' => pht('September'), 281 + 'October' => pht('October'), 282 + 'November' => pht('November'), 283 + 'December' => pht('December'), 284 + ); 270 285 Javelin::initBehavior('fancy-datepicker', array( 271 286 'format' => $this->getDateFormat(), 272 287 'weekStart' => $week_start, 288 + 'pht' => $date_pht, 273 289 )); 274 290 275 291 $classes = array();

+15 -14

webroot/rsrc/js/core/behavior-fancy-datepicker.js

··· 13 13 } 14 14 statics.initialized = true; 15 15 16 + var pht = JX.phtize(config.pht); 16 17 var picker; 17 18 var anchor_node; 18 19 var root; ··· 262 263 var year = valid_date.getYear() + 1900; 263 264 264 265 var months = [ 265 - 'January', 266 - 'February', 267 - 'March', 268 - 'April', 269 - 'May', 270 - 'June', 271 - 'July', 272 - 'August', 273 - 'September', 274 - 'October', 275 - 'November', 276 - 'December']; 266 + pht('January'), 267 + pht('February'), 268 + pht('March'), 269 + pht('April'), 270 + pht('May'), 271 + pht('June'), 272 + pht('July'), 273 + pht('August'), 274 + pht('September'), 275 + pht('October'), 276 + pht('November'), 277 + pht('December')]; 277 278 278 279 var buttons = [ 279 280 cell('\u25C0', 'm:-1', false, 'lrbutton'), ··· 330 331 var weeks = []; 331 332 332 333 // First, render the weekday names. 333 - var weekdays = 'SMTWTFS'; 334 + var weekdays = pht('S|M|T|W|T|F|S').split('|'); 334 335 var weekday_names = []; 335 336 var week_start = parseInt(get_week_start(), 10); 336 337 var week_end = weekdays.length + week_start; 337 338 338 339 for (var ii = week_start; ii < week_end; ii++) { 339 340 var index = ii%7; 340 - weekday_names.push(cell(weekdays.charAt(index), null, false, 'day-name')); 341 + weekday_names.push(cell(weekdays[index], null, false, 'day-name')); 341 342 } 342 343 weeks.push(JX.$N('tr', {}, weekday_names)); 343 344

Configure Feed

Configure Feed