diff --git a/CHANGELOG.md b/CHANGELOG.md index bbb853c95..e0ee4edd1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -58,17 +58,17 @@ What we need to do to release Uppy 1.0 - [x] feature: restrictions: by size, number of files, file type - [x] feature: beta file recovering after closed tab / browser crash -- [ ] feature: improved UI for Provider, Google Drive and Instagram, grid/list views - [x] feature: finish the direct-to-s3 upload plugin and test it with the flow to then upload to :transloadit: afterwards. This is because this might influence the inner flow of the plugin architecture quite a bit - [x] feature: easy integration with React (UppyReact components) - [x] feature: Redux and ReduxDevTools support (currently mirrors Uppy state to Redux) +- [ ] feature: improved UI for Provider, Google Drive and Instagram, grid/list views - [ ] feature: React Native support - [ ] feature: preset for Transloadit that mimics jQuery SDK - [x] QA: tests for core and utils -- [ ] QA: tests for plugins +- [ ] QA: tests for some plugins - [ ] QA: test how everything works together: user experience from `npm install` to production build with Webpack, using in React/Redux environment (npm pack) - [ ] QA: test uppy server. benchmarks / stress test. multiple connections, different setups, large files. add metrics to Librato -- [ ] QA: test in multiple browsers and mobile devices, fix bugs +- [ ] QA: test in multiple browsers and mobile devices - [ ] QA: test with real screen reader to identify accessibility problems - [x] uppy-server: add uppy-server to main API service to scale it horizontally. for the standalone server, we could write the script to support multiple clusters. Not sure how required or neccessary this may be for Transloadit's API service. - [ ] ui: refine UI, neat things up (if that’s even a word) @@ -77,7 +77,6 @@ What we need to do to release Uppy 1.0 - [ ] refactoring: possibly switch from Yo-Yo to Preact, because it’s more stable, solves a few issues we are struggling with (onload being weird/hard/modern-browsers-only with bel; no way to pass refs to elements; extra network requests with base64 urls) and mature, “new standard”, larger community - [ ] refactoring: possibly differentiate UI plugins from logic plugins, so that, say uploading plugins don’t include rendering stuff - [x] refactoring: webcam plugin -- [ ] refactoring: clean up code everywhere - [ ] docs: on using plugins, all options, list of plugins, i18n - [ ] uppy-server: better error handling, general cleanup (remove unused code. etc) - [ ] uppy-server: security audit @@ -85,45 +84,55 @@ What we need to do to release Uppy 1.0 - [ ] consider iframe / more security for Transloadit/Uppy integration widget and Uppy itself. Page can’t get files from Google Drive if its an iframe; possibility for folder restriction for provider plugins - [ ] automatically host releases on edgly and use that as our main CDN +# next + ## 0.22.0 +To be released: 2017-12-20 +Theme: 🎄 Christmas edition +- [ ] add `Form`: a plugin that is used in conjunction with any other acquirer, responsible for 1\. acquiring the metadata from form; 2\. intercepting submit event on the form, opening Uppy dialog instead; 3\. injecting any result (like from Transloadit plugin) back into the form (jquery-sdk includes the whole Assembly Status JSON in a hidden field i think) (@arturi) - [ ] core: Redux PR (#216 / @arturi, @goto-bus-stop, @richardwillars) -- [ ] core: limit ammount of simultaneous uploads, queuing? #360 -- [ ] provider: improve UI, add icons for file types (@arturi) -- [ ] dashboard: place upload button into StatusBar, use Alex’s suggestions for retry +- [ ] core: css-in-js, while keeping non-random classnames (ideally prefixed) and useful preprocessor features. also see simple https://github.com/codemirror/CodeMirror/blob/master/lib/codemirror.css (@arturi, @goto-bus-stop) +- [ ] core: improve on Redux PR #216 to allow using Redux (or any other solution) for all Uppy state management, instead of proxy-only (@goto-bus-stop, @arturi) +- [ ] core: limit amount of simultaneous uploads, queuing? #360 +- [ ] core: research !important styles to be immune to any environment/page. Maybe use smth like `postcss-safe-important`. Or increase specificity (with .Uppy) (@arturi) - [ ] dashboard: allow minimizing the Dashboard during upload (Uppy then becomes just a tiny progress indicator) (@arturi) - [ ] dashboard: cancel button for any kind of uploads? currently resume/pause only for tus, and cancel for XHR (@arturi, @goto-bus-stop) +- [ ] dashboard: place upload button into StatusBar, use Alex’s suggestions for retry +- [ ] docs: quick start guide: https://community.transloadit.com/t/quick-start-guide-would-be-really-helpful/14605 (@arturi) - [ ] goldenretriever: add “ghost” files (@arturi) - -# next +- [ ] provider: improve UI, add icons for file types (@arturi) +- [ ] test: add https://github.com/pa11y/pa11y for automated accessibility testing? +- [ ] test: add tests for `npm pack` +- [ ] tus: Review “tus: Remove old upload and events when starting a new upload.” b3cc48130e292f08c2a09f2f0adf6b6332bf7692 (@arturi) ## 0.21.0 -To be released: 2017-11-10 +Released: 2017-11-14 -- [x] s3: Automatically wrap XHRUpload. **Users should remove `.use(XHRUpload)` when using S3.** (@goto-bus-stop) -- [x] webcam: look into simplifying / improving webcam plugin (probably good to do modern browsers only) (#382 / @goto-bus-stop) -- [ ] webcam: only show the webcam tab when browser support is available (media recorder API) (@arturi, @goto-bus-stop) -- [ ] core: improve on Redux PR #216 to allow using Redux (or any other solution) for all Uppy state management, instead of proxy-only (@goto-bus-stop, @arturi) -- [ ] core: css-in-js, while keeping non-random classnames (ideally prefixed) and useful preprocessor features. also see simple https://github.com/codemirror/CodeMirror/blob/master/lib/codemirror.css (@arturi, @goto-bus-stop) -- [ ] core: research !important styles to be immune to any environment/page. Maybe use smth like `postcss-safe-important`. Or increase specificity (with .Uppy) (@arturi) -- [ ] test: modify acceptance/integration tests to not use website (@arturi) -- [ ] test: add tests for `npm pack`, -- [ ] core: allow setting custom `id` for plugins: https://github.com/transloadit/uppy/pull/328#issuecomment-328242214 (@arturi) -- [ ] add `Form`: a plugin that is used in conjunction with any other acquirer, responsible for 1\. acquiring the metadata from form; 2\. intercepting submit event on the form, opening Uppy dialog instead; 3\. injecting any result (like from Transloadit plugin) back into the form (jquery-sdk includes the whole Assembly Status JSON in a hidden field i think) (@arturi) -- [ ] core: return `{ successful, failed }` from `uppy.upload()` (@goto-bus-stop) +- [x] accessibility: add tabindex="0" to buttons and tabs, aria-labels, focus (#414 / @arturi) +- [x] core: allow setting custom `id` for plugins to allow a plugin to be used multiple times (#418 / @arturi) +- [x] core: do not check isPreviewSupported for unknown filetypes (#417 / @sadovnychyi) - [x] core: refactor `uppy-base` (#382 / @goto-bus-stop) -- [x] uppy-server: look into storing tokens in user’s browser only (@ifedapoolarewaju) -- [ ] accessibility: add tabindex="0" to buttons and tabs, aria-, focus; add https://github.com/pa11y/pa11y for automated accessibility testing (@arturi) -- [x] xhrupload: set a timeout in the onprogress event handler to detect stale network (#378 / @goto-bus-stop) -- [ ] tus: Review b3cc48130e292f08c2a09f2f0adf6b6332bf7692 -- [x] tus: Rename Tus10 → Tus -- [ ] docs: quick start guide: https://community.transloadit.com/t/quick-start-guide-would-be-really-helpful/14605 (@arturi) +- [x] core: remove functions from state object (#408 / @goto-bus-stop) +- [x] core: return `{ successful, failed }` from `uppy.upload()` (#404 / @goto-bus-stop) +- [x] core: update state with error messages rather than error objects (#406 / @richardwillars) +- [x] core: use `tinyify` for the unpkg bundle. (#371 / @goto-bus-stop) +- [x] dashboard: Fix pasting files, default `image` file name, add type to meta, file type refactor (#395 / @arturi) +- [x] dragdrop: Fix of the .uppy-DragDrop-inner spacing on small screens (#405 / @nqst) +- [x] react: fix `uppy` PropType, closes (#416 / @goto-bus-stop) +- [x] s3: automatically wrap XHRUpload. **Users should remove `.use(XHRUpload)` when using S3.** (#408 / @goto-bus-stop) +- [x] test: refactored end-to-end tests to not use website, switched to Webdriver.io, added tests for Edge, Safari, Android and iOS (#410 / @arturi) +- [x] tus: Rename Tus10 → Tus (#285 / @goto-bus-stop) - [x] uppy-serer: mask sensitive data from request logs (@ifedapoolarewaju) - [x] uppy-server: add request body validators (@ifedapoolarewaju) -- [x] uppy-server: migrate dropbox to use v2 API (@ifedapoolarewaju) -- [x] Use `tinyify` for the unpkg bundle. (#371 / @goto-bus-stop) +- [x] uppy-server: migrate dropbox to use v2 API (#386 / @ifedapoolarewaju) +- [x] uppy-server: store tokens in user’s browser only (@ifedapoolarewaju) +- [x] webcam: only show the webcam tab when browser support is available (media recorder API) (#421 / @arturi, @goto-bus-stop) +- [x] webcam: simplify and refactor webcam plugin (modern browser APIs only) (#382 / @goto-bus-stop) +- [x] xhrupload: set a timeout in the onprogress event handler to detect stale network (#378 / @goto-bus-stop) +- [x] uppy-server: allow flexible whitelist endpoint protocols (@ifedapoolarewaju) ## 0.20.3 diff --git a/examples/bundled-example/main.js b/examples/bundled-example/main.js index 4c4b2bba7..b095ff669 100644 --- a/examples/bundled-example/main.js +++ b/examples/bundled-example/main.js @@ -46,11 +46,11 @@ const uppy = Uppy({ // maxWidth: 350, // maxHeight: 400, inline: false, - disableStatusBar: false, - disableInformer: false, + // disableStatusBar: true, + // disableInformer: true, getMetaFromForm: true, - replaceTargetContent: true, - target: '.MyForm', + // replaceTargetContent: true, + // target: '.MyForm', hideUploadButton: false, closeModalOnClickOutside: false, locale: { diff --git a/package-lock.json b/package-lock.json index ca12554f7..7ca5ccf5f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "uppy", - "version": "0.20.3", + "version": "0.21.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 1a39ee629..dca12cca5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "uppy", - "version": "0.20.3", + "version": "0.21.0", "description": "Extensible file upload widget with support for drag&drop, resumable uploads, previews, restrictions, file processing/encoding, remote providers like Dropbox and Google Drive, S3 and more :dog:", "main": "lib/index.js", "jsnext:main": "src/index.js", @@ -40,7 +40,9 @@ }, "homepage": "https://github.com/transloadit/uppy#readme", "jest": { - "testPathIgnorePatterns": ["lib"] + "testPathIgnorePatterns": [ + "lib" + ] }, "devDependencies": { "autoprefixer": "6.3.7", diff --git a/src/generic-provider-views/Browser.js b/src/generic-provider-views/Browser.js index 72a4a4d87..37e60734f 100644 --- a/src/generic-provider-views/Browser.js +++ b/src/generic-provider-views/Browser.js @@ -56,7 +56,8 @@ module.exports = (props) => { toggleCheckbox: props.toggleCheckbox, getItemName: props.getItemName, getItemIcon: props.getItemIcon, - handleScroll: props.handleScroll + handleScroll: props.handleScroll, + title: props.title })} diff --git a/src/generic-provider-views/Table.js b/src/generic-provider-views/Table.js index 3e008c957..7d89353ea 100644 --- a/src/generic-provider-views/Table.js +++ b/src/generic-provider-views/Table.js @@ -16,7 +16,7 @@ module.exports = (props) => { return html` - + ${props.folders.map((folder) => { return Row({ title: props.getItemName(folder), diff --git a/src/generic-provider-views/TableRow.js b/src/generic-provider-views/TableRow.js index 6630e95aa..a7ff22a69 100644 --- a/src/generic-provider-views/TableRow.js +++ b/src/generic-provider-views/TableRow.js @@ -3,8 +3,12 @@ const Column = require('./TableColumn') module.exports = (props) => { const classes = props.active ? 'BrowserTable-row is-active' : 'BrowserTable-row' + const handleKeyDown = (event) => { + if (event.keyCode === 13) props.handleClick() + } + return html` - + diff --git a/src/index.js b/src/index.js index 74802b771..73d4a51d7 100644 --- a/src/index.js +++ b/src/index.js @@ -29,7 +29,7 @@ const XHRUpload = require('./plugins/XHRUpload') const Transloadit = require('./plugins/Transloadit') const AwsS3 = require('./plugins/AwsS3') -// Other? +// Helpers and utilities const GoldenRetriever = require('./plugins/GoldenRetriever') const ReduxDevTools = require('./plugins/ReduxDevTools') const ReduxStore = require('./plugins/Redux') diff --git a/src/plugins/AwsS3/index.js b/src/plugins/AwsS3/index.js index 5bc35e6db..0dba300b1 100644 --- a/src/plugins/AwsS3/index.js +++ b/src/plugins/AwsS3/index.js @@ -1,4 +1,5 @@ const Plugin = require('../Plugin') +const Translator = require('../../core/Translator') const XHRUpload = require('../XHRUpload') module.exports = class AwsS3 extends Plugin { @@ -23,6 +24,9 @@ module.exports = class AwsS3 extends Plugin { this.locale = Object.assign({}, defaultLocale, this.opts.locale) this.locale.strings = Object.assign({}, defaultLocale.strings, this.opts.locale.strings) + this.translator = new Translator({ locale: this.locale }) + this.i18n = this.translator.translate.bind(this.translator) + this.prepareUpload = this.prepareUpload.bind(this) } @@ -43,7 +47,7 @@ module.exports = class AwsS3 extends Plugin { fileIDs.forEach((id) => { this.core.emit('core:preprocess-progress', id, { mode: 'determinate', - message: this.locale.strings.preparingUpload, + message: this.i18n('preparingUpload'), value: 0 }) }) @@ -56,7 +60,7 @@ module.exports = class AwsS3 extends Plugin { return paramsPromise.then((params) => { this.core.emit('core:preprocess-progress', file.id, { mode: 'determinate', - message: this.locale.strings.preparingUpload, + message: this.i18n('preparingUpload'), value: 1 }) return params diff --git a/src/plugins/Dashboard/ActionBrowseTagline.js b/src/plugins/Dashboard/ActionBrowseTagline.js index c96234b94..d3a0188ac 100644 --- a/src/plugins/Dashboard/ActionBrowseTagline.js +++ b/src/plugins/Dashboard/ActionBrowseTagline.js @@ -2,9 +2,14 @@ const html = require('yo-yo') module.exports = (props) => { const input = html` - - ` + ` return html` diff --git a/src/plugins/Dashboard/Dashboard.js b/src/plugins/Dashboard/Dashboard.js index 2d1c26d64..76137c2da 100644 --- a/src/plugins/Dashboard/Dashboard.js +++ b/src/plugins/Dashboard/Dashboard.js @@ -7,6 +7,7 @@ const { isTouchDevice, toArray } = require('../../core/Utils') const { closeIcon } = require('./icons') // http://dev.edenspiekermann.com/2016/02/11/introducing-accessible-modal-dialog +// https://github.com/ghosh/micromodal module.exports = function Dashboard (props) { function handleInputChange (ev) { @@ -48,6 +49,20 @@ module.exports = function Dashboard (props) { }) } + const renderInnerPanel = (props) => { + return html`
+
+

+ ${props.i18n('importFrom')} ${props.activePanel ? props.activePanel.name : null} +

+ +
+ ${props.getPlugin(props.activePanel.id).render(props.state)} +
` + } + return html`
diff --git a/src/plugins/Dashboard/FileCard.js b/src/plugins/Dashboard/FileCard.js index 932032a49..bc0f20683 100644 --- a/src/plugins/Dashboard/FileCard.js +++ b/src/plugins/Dashboard/FileCard.js @@ -31,38 +31,41 @@ module.exports = function fileCard (props) { } return html`
-
-

Editing ${file.meta ? file.meta.name : file.name}

- -
${props.fileCardFor - ? html`
-
- ${file.preview - ? html`${file.name}` - : html`
- ${getFileTypeIcon(file.type).icon} - -
` - } + ? html` +
+
+

Editing ${file.meta ? file.meta.name : file.name}

+
-
-
- - -
- ${renderMetaFields(file)} +
+
+ ${file.preview + ? html`${file.name}` + : html`
+ ${getFileTypeIcon(file.type).icon} + +
` + } +
+
+
+ + +
+ ${renderMetaFields(file)} +
+
+
+
` : null } -
- -
` } diff --git a/src/plugins/Dashboard/FileList.js b/src/plugins/Dashboard/FileList.js index 9a257115c..6cc1cf27d 100644 --- a/src/plugins/Dashboard/FileList.js +++ b/src/plugins/Dashboard/FileList.js @@ -20,8 +20,6 @@ module.exports = (props) => { ? html`

${props.note}

` : '' } -
` : null } diff --git a/src/plugins/Dashboard/Tabs.js b/src/plugins/Dashboard/Tabs.js index b096d49de..5008dfc3f 100644 --- a/src/plugins/Dashboard/Tabs.js +++ b/src/plugins/Dashboard/Tabs.js @@ -20,15 +20,20 @@ module.exports = (props) => { } const input = html` - - ` + ` return html`