Duration Picker

[WorldImpex]

As an editor, I want to create an item that allows the user to enter a time (hours, minutes, seconds), days, weeks and years so that I can ask relevant questions about time.

Requirements:

• Implement a duration picker widget so the editor can create an item with a user response of either time (hours, minutes, seconds), days, weeks and years
• Require the editor to make a selection between Time and Days ** Require the editor to select one checkbox following the radio button (Hours, Minutes, Seconds, etc)
• It should be required to define a large text field
• It should have a skippable option
• It should have an Input text field option
• Ability to set a header image
• When added to an applet the user should input a time in order to progress forward in the app
• This should work for webapp and mobile

Example: https://www.npmjs.com/package/react-duration-picker?activeTab=readme

• Add an item called Duration to the drop-down ** Use this icon

[WorldImpex]

@binaryExDev Yes

[WorldImpex]

I think this was resolved in a slack conversation. Each duration of time (days, minutes, etc) functions independently and they do not work together

[natalia-muzyka]

@binaryExDev Mobile app crashes after an attempt to open the activity with duration time picker Video: https://www.screencast.com/t/WMebiwfT0RE

Blank page on website after an attempt to open the activity with duration time picker Video: https://www.screencast.com/t/qTRvKnDlpyd3

Environment: ML v0.19.6 staging Samsung Galaxy S7 // Android 8 iPhone Xs Max// iOS 15.3 https://web-staging.mindlogger.org/ jeraka1732@wodeda.com 1234567890 mix applet (jeraka) activity: duration picker Applet password Qwe123!!!

[natalia-muzyka]

Issues: Fixed - Blank page on website after an attempt to open the activity with duration time picker#444 Fixed - The mobile app crashes after completing the activity#2081 Only the option text field is displayed on the screen if duration picker has enabled "text input option"#2515 with the allowed "hide" checkbox#2519 [mobile app][web] Duration picker item responses aren't shown on the Data tab, DataViz(Responses, Review)#2520 Duration picker item response is incorrectly stored and reflected in CSV report#1525 [web] Header image and text creator(prompt) aren't displayed for duration item #455 [web] The "Next" button instead of "Skip" is displayed on the skippable duration item #456 [web] [UI] Make the duration picker dropdown smaller and scrollable #2536 [web] [UI] Indent and padding issues on the duration picker item #457

[natalia-muzyka]

@Matchdev120 @binaryExDev
is it possible to make such a time picker as in the example in the ticket (with fixed labels for "hours", "years", etc) or at least similar to the Android system picker (with labels above the picker, to prevent UI issues on small screens if there are 3-4 options)?

• with the current implementation when user selects a few options it is not comfortable and clear which response was already selected
• there are no 0 values for hours, min, sec, etc, user should have the ability to select 0 years and 3 months for example (but shouldn't be able to select 0 years and 0 months)

Example of system timer on Android and iOS:

Current implementation on Android and iOS:

cc: @WorldImpex

[natalia-muzyka]

cc: @WorldImpex @Matchdev120 @binaryExDev

[natalia-muzyka]

@Matchdev120 @WorldImpex it was decided to make duration picker just as an input field? Current implementation: https://www.screencast.com/t/4Zr3Jsq8pQw