(core) In Welcome questionnaire, add 'School' option, ask to enter company or school

Test Plan: Added some checks that company and use_school get recorded. (Live doc will need to be updated before release.)

Reviewers: paulfitz

Reviewed By: paulfitz

Differential Revision: https://phab.getgrist.com/D2650
This commit is contained in:
Dmitry S 2020-10-31 03:09:39 -04:00
parent 71519d9e5c
commit 275a35d03a
2 changed files with 12 additions and 2 deletions

View File

@ -101,6 +101,8 @@ export class WelcomePage extends Disposable {
*/
private _buildInfoForm(owner: MultiHolder) {
const allFilled = Observable.create(owner, false);
const whereObs = Observable.create(owner, '');
return forms.form({method: "post", action: location.href },
handleSubmit(),
(elem) => { setTimeout(() => elem.focus(), 0); },
@ -108,7 +110,12 @@ export class WelcomePage extends Disposable {
forms.question(
forms.text('Where do you plan to use Grist?'),
forms.checkboxItem([{name: 'use_work'}], 'Work'),
forms.checkboxItem([{name: 'use_school'}], 'School'),
forms.checkboxItem([{name: 'use_personal'}], 'Personal'),
forms.textBox({name: 'company'},
dom.hide(use => !use(whereObs)),
dom.attr('placeholder', (use) => use(whereObs) === 'school' ? 'Your School' : 'Your Company')
),
),
forms.question(
forms.text('What brings you to Grist?'),
@ -127,6 +134,7 @@ export class WelcomePage extends Disposable {
),
dom.on('change', (e, form) => {
allFilled.set(forms.isFormFilled(form, ['use_*', 'reason_*', 'industry', 'role']));
whereObs.set(form.use_work.checked ? 'work' : form.use_school.checked ? 'school' : '');
}),
cssButtonGroup(
cssButtonGroup.cls('-right'),

View File

@ -15,7 +15,7 @@
* );
*/
import {cssCheckboxSquare, cssLabel} from 'app/client/ui2018/checkbox';
import {dom, DomElementArg, styled} from 'grainjs';
import {dom, DomArg, DomElementArg, styled} from 'grainjs';
export {
form,
@ -30,7 +30,9 @@ export {
* array of arguments to the checkbox; the rest goes into the label. E.g.
* checkboxItem([{name: 'ok'}], 'Check to approve');
*/
export function checkboxItem(checkboxArgs: DomElementArg[], ...labelArgs: DomElementArg[]): HTMLElement {
export function checkboxItem(
checkboxArgs: Array<DomArg<HTMLInputElement>>, ...labelArgs: DomElementArg[]
): HTMLElement {
return cssCheckboxLabel(
cssCheckbox({type: 'checkbox'}, ...checkboxArgs),
...labelArgs);