Change Details

====Problem When blocking a user via Special:Block it would be helpful to have a calendar as datetime selector to select a specific day and hour in the future as expiry time. This avoids typing a (english) timestamp in the correct format inside the duration field, when not using the default block duration from the drop down list. ------ ====Acceptance criteria [x] On Special:Block, add a buttonSelectWidget in front of the expiration dropdown. [x] This element should be skipped in the tab ordering of the block page. [x] The ~~first~~ second button option should be a pencil icon, which should be selected by default. [x] When it is selected the expiration dropdown and text field should behave as they do today. [] The ~~second~~ first button option should be a calendar icon. [x] On click it should replace the dropdown and text field with a DateTimeInputWidget widget allowing the user to provide a calendar date and time. (YYYY-MM-DD HH:MM:SS) [x] The timezone should match the logged-in users' time zone preference. {T190603} [x] On submit of the block, the system should calculate when block length between the current datetime and the selected datetime. [] Error messages [x] The widget should not allow the user to select a date in the past (use an error message if needed) [x] The widget should display a red border if the contents are invalid (if possible) [x] If the system cannot compute a block length, on submit of the block the 'Expiry time invalid.' error message can display [] Temporary Config flag [] No change for no-JS users [x] Toggling between the two options (pencil + calendar) should not result in any data loss. Whatever is selected when the user submits the block should be submitted. [] Should work on RTL and LTR wikis ------ ====Mockups | **Note that in these mockups the order of the pencil and calendar icons are incorrect, and the calendar input is just a dateinput, when it will be a datetimeinput.** | We'll want to add the DateTimeInputWidget which will be hidden behind a buttonSelectWidget, as seen on UploadWizard. The default state would be the pencil, which would provide the same functionality as Special:Block has today: {F13957098} On click of the calendar icon, it would change the list dropdown to the DateTimeInputWidget, like such: {F13957102} The block would still be saved the same way, the calculation would happen before 'Block this user' is clicked.

====Problem When blocking a user via Special:Block it would be helpful to have a calendar as datetime selector to select a specific day and hour in the future as expiry time. This avoids typing a (english) timestamp in the correct format inside the duration field, when not using the default block duration from the drop down list. ------ ====Acceptance criteria * On Special:Block, add a buttonSelectWidget in front of the expiration dropdown. ** This element should be skipped in the tab ordering of the block page. * The ~~first~~ second button option should be a pencil icon, which should be selected by default. ** When it is selected the expiration dropdown and text field should behave as they do today. * The ~~second~~ first button option should be a calendar icon. ** On click it should replace the dropdown and text field with a DateTimeInputWidget widget allowing the user to provide a calendar date and time. (YYYY-MM-DD HH:MM:SS) ** The timezone should match the logged-in users' time zone preference. {T190603} ** On submit of the block, the system should calculate when block length between the current datetime and the selected datetime. * Error messages ** The widget should not allow the user to select a date in the past (use an error message if needed) ** The widget should display a red border if the contents are invalid (if possible) ** If the system cannot compute a block length, on submit of the block the 'Expiry time invalid.' error message can display * Temporary Config flag * No change for no-JS users * Toggling between the two options (pencil + calendar) should not result in any data loss. Whatever is selected when the user submits the block should be submitted. * Should work on RTL and LTR wikis ------ ====Mockups | **Note that in these mockups the order of the pencil and calendar icons are incorrect, and the calendar input is just a dateinput, when it will be a datetimeinput.** | We'll want to add the DateTimeInputWidget which will be hidden behind a buttonSelectWidget, as seen on UploadWizard. The default state would be the pencil, which would provide the same functionality as Special:Block has today: {F13957098} On click of the calendar icon, it would change the list dropdown to the DateTimeInputWidget, like such: {F13957102} The block would still be saved the same way, the calculation would happen before 'Block this user' is clicked.

====Problem When blocking a user via Special:Block it would be helpful to have a calendar as datetime selector to select a specific day and hour in the future as expiry time. This avoids typing a (english) timestamp in the correct format inside the duration field, when not using the default block duration from the drop down list. ------ ====Acceptance criteria [x]* On Special:Block, add a buttonSelectWidget in front of the expiration dropdown. [x]** This element should be skipped in the tab ordering of the block page. [x]* The ~~first~~ second button option should be a pencil icon, which should be selected by default. [x]** When it is selected the expiration dropdown and text field should behave as they do today. []* The ~~second~~ first button option should be a calendar icon. [x]** On click it should replace the dropdown and text field with a DateTimeInputWidget widget allowing the user to provide a calendar date and time. (YYYY-MM-DD HH:MM:SS) [x]** The timezone should match the logged-in users' time zone preference. {T190603} [x]** On submit of the block, the system should calculate when block length between the current datetime and the selected datetime. []* Error messages [x]** The widget should not allow the user to select a date in the past (use an error message if needed) [x]** The widget should display a red border if the contents are invalid (if possible) [x]** If the system cannot compute a block length, on submit of the block the 'Expiry time invalid.' error message can display []* Temporary Config flag []* No change for no-JS users [x]* Toggling between the two options (pencil + calendar) should not result in any data loss. Whatever is selected when the user submits the block should be submitted. []* Should work on RTL and LTR wikis ------ ====Mockups | **Note that in these mockups the order of the pencil and calendar icons are incorrect, and the calendar input is just a dateinput, when it will be a datetimeinput.** | We'll want to add the DateTimeInputWidget which will be hidden behind a buttonSelectWidget, as seen on UploadWizard. The default state would be the pencil, which would provide the same functionality as Special:Block has today: {F13957098} On click of the calendar icon, it would change the list dropdown to the DateTimeInputWidget, like such: {F13957102} The block would still be saved the same way, the calculation would happen before 'Block this user' is clicked.