gristlabs_grist-core/app/client/widgets/UserTypeImpl.js
Dmitry S 2e22966289 (core) Revamp attachment editor + preview UI, and support more types, including PDFs.
Summary:
- New UI for the modal look mostly following the design prepared previously.
- Use <object> for rendering PDFs (on a Mac works on Firefox, Chrome, Safari; needs checking on Windows)
- While we are at it, use <video> and <audio> for relevant files (object would
  render them too, but without the option to disable autoplay).
- Use <object> for unknown types, except for text/html (unsafe) and other text
  types (need more work to render well).
- Fix skipping save on Escape or when attachments are unsaved (previously a
  noop action was emitted, creating surprises with undo).
- Display extension for files without preview, both in-cell and in the modal.
- Replace tiny "eye" icon to preview particular attachment with double-clicking.
- As an accidental feature, a particular attachment can be previewed by typing 1, 2, 3, etc into cell.
- Renamed PreviewsWidget/PreviewModel to AttachmentsWidget/AttachmentsEditor.

Test Plan: Unified old and new tests for attachments, added new test cases.

Reviewers: paulfitz

Reviewed By: paulfitz

Differential Revision: https://phab.getgrist.com/D2667
2020-11-19 21:30:09 -05:00

51 lines
1.9 KiB
JavaScript

const {NTextBox} = require('./NTextBox');
const {NumericTextBox} = require('./NumericTextBox');
const {Spinner} = require('./Spinner');
const {AttachmentsWidget} = require('./AttachmentsWidget');
const {AttachmentsEditor} = require('./AttachmentsEditor');
const UserType = require('./UserType');
const {HyperLinkEditor} = require('./HyperLinkEditor');
const {NTextEditor} = require('./NTextEditor');
const {ReferenceEditor} = require('./ReferenceEditor');
/**
* Convert the name of a widget to its implementation.
*/
const nameToWidget = {
'TextBox': NTextBox,
'TextEditor': NTextEditor,
'NumericTextBox': NumericTextBox,
'HyperLinkTextBox': require('./HyperLinkTextBox'),
'HyperLinkEditor': HyperLinkEditor,
'Spinner': Spinner,
'CheckBox': require('./CheckBox'),
'CheckBoxEditor': require('./CheckBoxEditor'),
'Reference': require('./Reference'),
'Switch': require('./Switch'),
'ReferenceEditor': ReferenceEditor,
'ChoiceTextBox': require('./ChoiceTextBox'),
'ChoiceEditor': require('./ChoiceEditor'),
'DateTimeTextBox': require('./DateTimeTextBox'),
'DateTextBox': require('./DateTextBox'),
'DateEditor': require('./DateEditor'),
'AttachmentsWidget': AttachmentsWidget,
'AttachmentsEditor': AttachmentsEditor,
'DateTimeEditor': require('./DateTimeEditor'),
};
exports.nameToWidget = nameToWidget;
/** return a good class to instantiate for viewing a widget/type combination */
function getWidgetConstructor(widget, type) {
const {config} = UserType.getWidgetConfiguration(widget, type);
return nameToWidget[config.cons];
}
exports.getWidgetConstructor = getWidgetConstructor;
/** return a good class to instantiate for editing a widget/type combination */
function getEditorConstructor(widget, type) {
const {config} = UserType.getWidgetConfiguration(widget, type);
return nameToWidget[config.editCons];
}
exports.getEditorConstructor = getEditorConstructor;