Skip to content

Commit

Permalink
Adapt installer to mui3
Browse files Browse the repository at this point in the history
  • Loading branch information
@cdujeu
cdujeu committed Jul 4, 2023
1 parent b58b622 commit 6ee24ec
Show file tree
Hide file tree
Showing 6 changed files with 439 additions and 117 deletions.
187 changes: 145 additions & 42 deletions discovery/install/assets/src/res/build/PydioInstall.js
View file

Large diffs are not rendered by default.

10 changes: 5 additions & 5 deletions discovery/install/assets/src/res/build/PydioInstall/gen/languages.js
View file

Large diffs are not rendered by default.

175 changes: 139 additions & 36 deletions discovery/install/assets/src/res/build/PydioInstall/install.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,75 @@ var api = new _InstallServiceApi2.default(client);

var supportedLanguages = [_react2.default.createElement(_materialUi.MenuItem, { key: "en-us", value: "en-us", primaryText: "English" }), _react2.default.createElement(_materialUi.MenuItem, { key: "fr", value: "fr", primaryText: "Français" }), _react2.default.createElement(_materialUi.MenuItem, { key: "de", value: "de", primaryText: "Deutsch" }), _react2.default.createElement(_materialUi.MenuItem, { key: "es-es", value: "es-es", primaryText: "Español" }), _react2.default.createElement(_materialUi.MenuItem, { key: "it", value: "it", primaryText: "Italiano" }), _react2.default.createElement(_materialUi.MenuItem, { key: "pt-br", value: "pt-br", primaryText: "Português do Brasil" })];

var noWrap = {
whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis'
};
var hintColor = 'var(--md-sys-color-outline)';
var panelBG = 'rgba(225, 234, 242, 0.98)';
var v2Block = {
backgroundColor: '#dde3ea',
borderRadius: '3px 3px 0 0',
height: 52,
marginTop: 8,
boxSizing: 'border-box'
};
var underline = {
idle: { borderBottom: '1px solid rgb(193 199 206)' },
focus: { borderBottom: '2px solid var(--md-sys-color-primary)' }
};

var fieldStyles = {
textFieldV2: {
style: _extends({}, v2Block),
inputStyle: { position: 'absolute', height: 30, marginTop: 0, bottom: 2, paddingLeft: 8, paddingRight: 8 },
hintStyle: _extends({ bottom: 4, paddingLeft: 7, color: hintColor }, noWrap, { width: '100%' }),
underlineStyle: _extends({ opacity: 1, bottom: 0 }, underline.idle),
underlineFocusStyle: _extends({ opacity: 1, borderRadius: 0, bottom: 0 }, underline.focus),
floatingLabelFixed: true,
floatingLabelStyle: _extends({ top: 26, left: 8, width: '127%' }, noWrap),
floatingLabelShrinkStyle: { top: 26, left: 8 },
errorStyle: {
position: 'absolute', bottom: 8, right: 8,
maxWidth: '60%', textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden'
}
},
selectFieldV2: {
style: _extends({}, v2Block, { padding: 8, paddingRight: 0, overflow: 'hidden' }),
menuStyle: { marginTop: -6 },
hintStyle: _extends({ paddingLeft: 0, marginBottom: -7, paddingRight: 56, color: hintColor }, noWrap, { width: '100%' }),
underlineStyle: _extends({ opacity: 1, bottom: 0, left: 0, right: 0 }, underline.idle),
underlineFocusStyle: _extends({ opacity: 1, borderRadius: 0, bottom: 0 }, underline.focus),
floatingLabelFixed: true,
floatingLabelStyle: _extends({ top: 26, left: 8, width: '127%' }, noWrap),
floatingLabelShrinkStyle: { top: 26, left: 8 },
dropDownMenuProps: {
iconStyle: { right: 0, fill: '#9e9e9e' },
menuStyle: { background: 'white' }
}
},
textareaFieldV2: {
rows: 15,
rowsMax: 15,
style: { height: 388 },
inputStyle: {
backgroundColor: v2Block.backgroundColor,
height: 380,
borderRadius: v2Block.borderRadius,
marginTop: 8,
paddingLeft: 8
},
textareaStyle: { marginTop: 24, marginBottom: 0 },
floatingLabelFixed: true,
floatingLabelStyle: _extends({ top: 35, left: 6, width: '127%' }, noWrap),
floatingLabelShrinkStyle: { top: 35, left: 6 },
hintStyle: _extends({ paddingLeft: 7, color: hintColor }, noWrap, { width: '100%', top: 12, bottom: 'inherit' }),
underlineStyle: _extends({ opacity: 1, bottom: 0 }, underline.idle),
underlineFocusStyle: _extends({ opacity: 1, bottom: 0, borderRadius: '0px 0px 3px 3px' }, underline.focus),
errorStyle: { position: 'absolute', bottom: 8, right: 8 }
}

};

var renderTextField = function renderTextField(_ref) {
var input = _ref.input,
label = _ref.label,
Expand All @@ -81,15 +150,23 @@ var renderTextField = function renderTextField(_ref) {
error = _ref$meta.error,
custom = _objectWithoutProperties(_ref, ['input', 'label', 'floatingLabel', 'meta']);

return _react2.default.createElement(_materialUi.TextField, _extends({
hintText: label,
floatingLabelText: floatingLabel,
floatingLabelFixed: true,
errorText: touched && error,
fullWidth: true,
hintStyle: { whiteSpace: 'nowrap' },
floatingLabelStyle: { whiteSpace: 'nowrap' }
}, input, custom));
if (custom && custom.multiLine) {
return _react2.default.createElement(_materialUi.TextField, _extends({
hintText: label,
floatingLabelText: floatingLabel,
floatingLabelFixed: true,
errorText: touched && error,
fullWidth: true
}, fieldStyles.textareaFieldV2, input, custom));
} else {
return _react2.default.createElement(_materialUi.TextField, _extends({
hintText: label,
floatingLabelText: floatingLabel,
floatingLabelFixed: true,
errorText: touched && error,
fullWidth: true
}, fieldStyles.textFieldV2, input, custom));
}
};

var renderPassField = function renderPassField(_ref2) {
Expand All @@ -108,10 +185,8 @@ var renderPassField = function renderPassField(_ref2) {
errorText: error,
fullWidth: true,
type: "password",
autoComplete: "new-password",
hintStyle: { whiteSpace: 'nowrap' },
floatingLabelStyle: { whiteSpace: 'nowrap' }
}, input, custom));
autoComplete: "new-password"
}, fieldStyles.textFieldV2, input, custom));
};

var renderCheckbox = function renderCheckbox(_ref3) {
Expand Down Expand Up @@ -170,7 +245,7 @@ var renderSelectField = function renderSelectField(_ref6) {
return input.onChange(value);
},
children: children
}, custom));
}, fieldStyles.selectFieldV2, custom));
};

/**
Expand Down Expand Up @@ -536,13 +611,19 @@ var InstallForm = function (_React$Component) {
label: this.t('stepper.button.back'),
disabled: stepIndex === 0,
onClick: this.handlePrev,
style: { marginRight: 5 }
style: { borderRadius: 20, marginRight: 5 },
buttonStyle: { borderRadius: 20 },
labelStyle: { textTransform: 'none', fontWeight: 400 }
}),
_react2.default.createElement(_materialUi.RaisedButton, {
label: stepIndex === 3 + stepOffset ? this.t('stepper.button.last') : this.t('stepper.button.next'),
primary: true,
onClick: nextAction,
disabled: nextDisabled || invalid || nextInvalid
disabled: nextDisabled || invalid || nextInvalid,
style: { borderRadius: 20 },
buttonStyle: { borderRadius: 20 },
overlayStyle: { borderRadius: 20 },
labelStyle: { textTransform: 'none', fontWeight: 400 }
})
)
);
Expand Down Expand Up @@ -616,7 +697,8 @@ var InstallForm = function (_React$Component) {
},
contentScroller: {
height: panelHeight - 88,
overflowY: 'auto'
overflowY: 'auto',
overflowX: 'hidden'
}
};
var leftAction = void 0,
Expand Down Expand Up @@ -707,8 +789,21 @@ var InstallForm = function (_React$Component) {
_react2.default.createElement(
'div',
null,
_react2.default.createElement(_materialUi.FlatButton, { label: 'Back', onClick: this.handlePrev.bind(this), style: { marginRight: 5 } }),
_react2.default.createElement(_materialUi.RaisedButton, { label: 'Next', primary: true, onClick: nextAction, disabled: !licCheckPassed && !licenseString })
_react2.default.createElement(_materialUi.FlatButton, {
label: 'Back',
onClick: this.handlePrev.bind(this),
style: { borderRadius: 20, marginRight: 5 },
buttonStyle: { borderRadius: 20 },
overlayStyle: { borderRadius: 20 },
labelStyle: { textTransform: 'none', fontWeight: 400 }
}),
_react2.default.createElement(_materialUi.RaisedButton, {
label: 'Next', primary: true, onClick: nextAction, disabled: !licCheckPassed && !licenseString,
style: { borderRadius: 20 },
buttonStyle: { borderRadius: 20 },
overlayStyle: { borderRadius: 20 },
labelStyle: { textTransform: 'none', fontWeight: 400 }
})
)
)
)
Expand Down Expand Up @@ -820,7 +915,7 @@ var InstallForm = function (_React$Component) {
{ style: flexContainer },
_react2.default.createElement(
_reduxForm.Field,
{ name: 'dbConnectionType', component: renderSelectField },
{ name: 'dbConnectionType', component: renderSelectField, label: this.t('database.stepLabel') },
_react2.default.createElement(_materialUi.MenuItem, { value: 'tcp', primaryText: this.t('form.dbConnectionType.tcp') }),
_react2.default.createElement(_materialUi.MenuItem, { value: 'socket', primaryText: this.t('form.dbConnectionType.socket') }),
_react2.default.createElement(_materialUi.MenuItem, { value: 'manual', primaryText: this.t('form.dbConnectionType.manual') })
Expand Down Expand Up @@ -1047,15 +1142,17 @@ var InstallForm = function (_React$Component) {
_react2.default.createElement(
'div',
{ style: { display: 'flex', alignItems: 'flex-end' } },
_react2.default.createElement(_materialUi.TextField, { value: DSNURL.hostname, onChange: function onChange(e, v) {
_react2.default.createElement(_materialUi.TextField, _extends({ value: DSNURL.hostname, onChange: function onChange(e, v) {
return changeDSN(DSNURL, 'hostname', v);
}, floatingLabelText: this.t('advanced.mongo.host'), fullWidth: true, style: { marginRight: 10 }, floatingLabelFixed: true }),
_react2.default.createElement(_materialUi.TextField, { value: DSNURL.port, onChange: function onChange(e, v) {
}, floatingLabelText: this.t('advanced.mongo.host'), fullWidth: true, floatingLabelFixed: true }, fieldStyles.textFieldV2)),
_react2.default.createElement('div', { style: { marginRight: 10 } }),
_react2.default.createElement(_materialUi.TextField, _extends({ value: DSNURL.port, onChange: function onChange(e, v) {
return changeDSN(DSNURL, 'port', v);
}, floatingLabelText: this.t('advanced.mongo.port'), fullWidth: true, style: { marginRight: 10 }, floatingLabelFixed: true }),
_react2.default.createElement(_materialUi.TextField, { value: DSNURL.pathname.replace('/', ''), onChange: function onChange(e, v) {
}, floatingLabelText: this.t('advanced.mongo.port'), fullWidth: true, floatingLabelFixed: true }, fieldStyles.textFieldV2)),
_react2.default.createElement('div', { style: { marginRight: 10 } }),
_react2.default.createElement(_materialUi.TextField, _extends({ value: DSNURL.pathname.replace('/', ''), onChange: function onChange(e, v) {
return changeDSN(DSNURL, 'pathname', '/' + v);
}, floatingLabelText: this.t('advanced.mongo.db'), fullWidth: true, floatingLabelFixed: true }),
}, floatingLabelText: this.t('advanced.mongo.db'), fullWidth: true, floatingLabelFixed: true }, fieldStyles.textFieldV2)),
performingCheck === 'MONGO' && _react2.default.createElement(
'div',
{ style: { minWidth: 48, height: 48, padding: 12, boxSizing: 'border-box' } },
Expand Down Expand Up @@ -1087,17 +1184,19 @@ var InstallForm = function (_React$Component) {
_react2.default.createElement(
'div',
{ style: { display: 'flex', alignItems: 'flex-end' } },
_react2.default.createElement(_materialUi.TextField, { value: DSNURL.username, onChange: function onChange(e, v) {
_react2.default.createElement(_materialUi.TextField, _extends({ value: DSNURL.username, onChange: function onChange(e, v) {
return changeDSN(DSNURL, 'username', v);
}, floatingLabelText: this.t('advanced.mongo.username'), fullWidth: true, style: { marginRight: 10 }, floatingLabelFixed: true }),
_react2.default.createElement(_materialUi.TextField, { value: DSNURL.password, onChange: function onChange(e, v) {
}, floatingLabelText: this.t('advanced.mongo.username'), fullWidth: true, floatingLabelFixed: true }, fieldStyles.textFieldV2)),
_react2.default.createElement('div', { style: { marginRight: 10 } }),
_react2.default.createElement(_materialUi.TextField, _extends({ value: DSNURL.password, onChange: function onChange(e, v) {
return changeDSN(DSNURL, 'password', v);
}, floatingLabelText: "Password", fullWidth: true, type: this.t('advanced.mongo.password'), style: { marginRight: 10 }, floatingLabelFixed: true }),
_react2.default.createElement(_materialUi.TextField, { value: DSNSearchParams.get('authSource') || "",
}, floatingLabelText: "Password", fullWidth: true, type: this.t('advanced.mongo.password'), floatingLabelFixed: true }, fieldStyles.textFieldV2)),
_react2.default.createElement('div', { style: { marginRight: 10 } }),
_react2.default.createElement(_materialUi.TextField, _extends({ value: DSNSearchParams.get('authSource') || "",
onChange: function onChange(e, v) {
return changeDSN(DSNURL, 'authSource', v);
},
floatingLabelText: this.t('advanced.mongo.authSource'), fullWidth: true, floatingLabelFixed: true }),
floatingLabelText: this.t('advanced.mongo.authSource'), fullWidth: true, floatingLabelFixed: true }, fieldStyles.textFieldV2)),
_react2.default.createElement('div', { style: { minWidth: 48 } })
)
),
Expand Down Expand Up @@ -1126,7 +1225,7 @@ var InstallForm = function (_React$Component) {
null,
_react2.default.createElement(
_reduxForm.Field,
{ name: 'dsType', component: renderSelectField },
{ name: 'dsType', component: renderSelectField, label: this.t('form.dsType.Label') },
_react2.default.createElement(_materialUi.MenuItem, { value: '', primaryText: this.t('form.dsType.FS') }),
_react2.default.createElement(_materialUi.MenuItem, { value: 'S3', primaryText: this.t('form.dsType.S3') })
)
Expand Down Expand Up @@ -1314,7 +1413,11 @@ var InstallForm = function (_React$Component) {
secondary: true,
onClick: function onClick() {
window.location.reload();
}
},
style: { borderRadius: 20 },
buttonStyle: { borderRadius: 20 },
overlayStyle: { borderRadius: 20 },
labelStyle: { textTransform: 'none', fontWeight: 400 }
})
)
)
Expand All @@ -1323,10 +1426,10 @@ var InstallForm = function (_React$Component) {

return _react2.default.createElement(
_materialUi.Paper,
{ zDepth: 2, style: { width: 800, minHeight: panelHeight, margin: 'auto', position: 'relative', backgroundColor: 'rgba(255,255,255,0.96)' } },
{ zDepth: 2, style: { width: 800, minHeight: panelHeight, margin: 'auto', position: 'relative', backgroundColor: panelBG, borderRadius: 20 } },
_react2.default.createElement(
'div',
{ style: { width: 256, height: panelHeight, backgroundColor: 'rgb(94, 142, 174)', fontSize: 13, display: 'flex', flexDirection: 'column' } },
{ style: { width: 256, height: panelHeight, backgroundColor: 'rgb(94, 142, 174)', fontSize: 13, display: 'flex', flexDirection: 'column', borderRadius: '20px 0 0 20px' } },
_react2.default.createElement('div', { style: { backgroundImage: 'url(res/css/PydioLogo250.png)', backgroundSize: '90%',
backgroundRepeat: 'no-repeat', backgroundPosition: 'center center', width: 256, height: 100 } }),
_react2.default.createElement(
Expand Down
3 changes: 3 additions & 0 deletions discovery/install/assets/src/res/i18n/en-us.all.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -224,6 +224,9 @@
"form.dsFolder.legend":{
"other":"Use an absolute path on the server"
},
"form.dsType.Label":{
"other": "Storage Type"
},
"form.dsType.FS":{
"other": "Local FS (store all data on this server)"
},
Expand Down
Loading

0 comments on commit 6ee24ec

Please sign in to comment.