Work Package #45003

Media Browser

Added by Sebastian Kurfuerst over 8 years ago. Updated about 8 years ago.

Status:
Accepted
Priority:
Should have
Category:
Content Editing
Target version:
Start date:
Due date:
% Done:

90%

Estimated time:
Spent time:

Description

Media Browser for Images and Files

  • Target Audience: users who deal with files and images
  • Responsible: Christian Müller <christian (dot) mueller (at) typo3 (dot) org>
  • Implemented by: Christian Müller, Karsten Dambekalns, Markus Goldbeck
  • Amount: 25 work days
  • Version: must have for 1.0
  • Planned Implementation Timeframe: March - April 2013

Motivation

Neos users need a way to organize images and files to have them reusable in content as content images or downloads. They want to preview the images they need and probably want to search in their available files.

Goal

Create a basic solution for organizing files in Neos which has a simple way to upload new files and browse already uploaded files.
The solution should be usable in Neos content view as well as in Neos Backend modules and other places of the system. That means we need to extend the TYPO3.Media package and do not create dependencies on Neos in order to have this media browser usable in Flow applications as well. Images should be visible as a thumbnail gallery. Users should be able to categorize files (tagging) and search by those categories.

Deliverables

  • MUST: AbstractMediaFile Model -> Image and (to be created) Document model extend that
  • MUST: MediaFile Repository to find existing files and images
  • MUST: Media browser (UI) to see existing files and images in the system as independent Flow application
  • MUST: Uploads in media browser
  • MUST: Image preview in media browser
  • MUST: Tag Modelling and relations to files
  • MUST: documentation for users of the media browser and developers that want to use the media browser in Neos modules or Flow applications.
  • MUST: Integration to Neos content view
  • COULD: hierarchical tags
  • COULD: search
  • COULD: endless scrolling
  • MAYBE: Metadata Model and relations

Files

typo3neos-distribution-base-45003.pdf (4.67 KB) typo3neos-distribution-base-45003.pdf Sebastian Kurfuerst, 2013-02-16 15:12
Mediabrowser.pdf (136 KB) Mediabrowser.pdf Christian Müller, 2013-03-25 11:02

Related issues

Related to TYPO3.Flow - Task #36800: Streamline Resource object APIAcceptedRobert Lemke2012-01-26

Actions
Related to Base Distribution - Task #48072: Remove image from image propertyClosedDominique Feyer2013-05-08

Actions
#1

Updated by Sebastian Kurfuerst over 8 years ago

  • Subject changed from Media Browser to [WIP] Media Browser
#2

Updated by Sebastian Kurfuerst over 8 years ago

  • Target version changed from 1.1 to 1.0 beta 1
#3

Updated by Christian Müller over 8 years ago

  • Subject changed from [WIP] Media Browser to Media Browser
#4

Updated by Christopher Hlubek over 8 years ago

Do we want hierarchical tags or a folder structure for assets? IMHO a folder structure should be the base organization since it is a very well known principle for most users. Tags or categories could then add another dimension.

We certainly need some kind of mockup sketching (e.g. Balsamiq) before implementing the UI or model to get a feeling how users should interact with assets.

#5

Updated by Christian Müller over 8 years ago

@Christopher we discussed that during the codesprint and came to the conclusion that tags (with hierarchy) can fill the role of folders (besides the possibility to have a file in multiple tags). As I suggested folders too I am not against it, but we would have to convince Robert and Sebastian that they are needed. I see the same point of "well known principle" but I think these days people are used to seeing web apps that work with assets in a different way (like Flickr).

#6

Updated by Sebastian Kurfuerst over 8 years ago

for me, nested tags are simply some kind of "folder", so I think that'd be more general than folders. But we can of course have an option to prevent adding more than one (folder-)-Tag to a node, effectively creating a folder structure :)

#7

Updated by Sebastian Kurfuerst over 8 years ago

  • Status changed from New to Accepted
#8

Updated by Sebastian Kurfuerst over 8 years ago

Has been discussed with Jan-Hendrik from the EAB on 12.02.2013; and has been accepted on 15.02.2013 by the EAB.
(The attached PDF is a snapshot of this work package at the time of acceptance.)

So, Christian, you can schedule this work package in your day-to-day calendar and implement it then -- can't wait to see it in Neos 1.0 :-)

Another side-note: Please do not forget to add comments to this work package and update "% done" while you are working on this package.

Greets, Sebastian

#9

Updated by Sebastian Kurfuerst over 8 years ago

  • Estimated time set to 150.00 h
#10

Updated by Christian Müller over 8 years ago

What we show in the mockup and want to do:

- Media files model (need a common base model, images are one example for more specialized models), base behavior include tagging, name, date?
- Tags are hierarchical categories to sort media files into, basically they have just a name. For easier recognition color and icon could be added. Files can be added to multiple tags. Later "smart tags" like smart folder could be implemented that offer files based on preselected criteria. Tags can also be favorited by users for faster access.

There will be two views in the mediabrowser, both share the sidebar and topbar.
Sidebar includes tag hierarchy, favorite tags and common/global actions and links, additionally we need a untagged/unsorted meta-"tag"
Topbar includes actions directly related to files, so a search/filter, operations for selections (like delete selected) and upload
Main view is a more image centric view with thumbnails and alternatively a plain file list (both offer infinite scrolling)

Media files can be added to multiple tags, the "delete" action will remove the file from the currently selected tag! Implement soft delete and implement real deletion later (Only if a file is removed from all tags it can be deleted from the untagged list of files (later on this removal from tags and unconnecting from content could be offered)). To add a file to a tag you drag the file from the list to the tag.
Multiselection of files should be possible together with batch actions on the files.

The scetched application should work standalone and in other application context. To improve interoperability I suggest working only with (RESTful) services so another UI could access functionality as well (think mobile app)

Search for now will be a simple string based filter on the file list, later some more sophisticated filtering can be added.

Files can have actions attached which should be extensible if someone later wants to add more actions.

Questions / Implementation details not yet discussed

Tag sorting/order
Can the application be used in the same way for selecting files and giving selection back to parent application (Neos image content eg.) or do we need a subset as file selector for that?
Sorting in "image view"?

#11

Updated by Christian Müller over 8 years ago

  • % Done changed from 0 to 10
#12

Updated by Christian Müller over 8 years ago

  • Due date changed from 2013-04-30 to 2013-05-20
  • % Done changed from 10 to 20

Setting the Due date a bit later as we are behind schedule currently and want to use the Neos sprint for integrating the solution together.

#13

Updated by Sebastian Kurfuerst over 8 years ago

At the beginning, there were some coordination issues (people waiting for each other, deadlock), but that is solved now.

Current state as discussed with the team:

  • Concept is done (see attached wireframes)
  • TODO: discuss the concept wireframes with Rasmus
  • Domain Model is developed inside a fork at https://github.com/mgoldbeck/TYPO3.Media
  • DONE: standalone Upload, List View, Tagging
  • TODO: standalone image preview
  • TODO: integrate this module into backend (based on Views.yaml change)
  • TODO: write Content Module inspector editor (biggest chunk)
  • TODO: the changes from the fork will be pushed to review until 24th of May
  • next update-meeting will happen on 07. June 2013 08:30 until 09:00. Goal is to have the Content Module Inspector in the review by then, effectively having the whole thing in the review.
#14

Updated by Sebastian Kurfuerst over 8 years ago

  • Due date changed from 2013-05-20 to 2013-06-07
#15

Updated by Christian Müller over 8 years ago

  • % Done changed from 20 to 30
#16

Updated by Sebastian Kurfuerst over 8 years ago

Meeting with Christian, Sebastian on 10. June 2013, 12:30

Current state as discussed with the team:

  • TODO: standalone image preview (Karsten)
  • TODO: integrate this module into backend (based on Views.yaml change) (Karsten)
  • TODO: write Content Module inspector editor (biggest chunk) (Karsten + Christian; in the week until 14. June)

Summary: we are a little later than expected, but still make progress here.

next update-meeting will happen in a week on 17. June 2013 12:30 until 13:00. Goal is to have the Content Module Inspector in the review by then, effectively having the whole thing in the review.

#17

Updated by Robert Lemke about 8 years ago

  • % Done changed from 50 to 70
#18

Updated by Christian Müller about 8 years ago

  • % Done changed from 70 to 90

Also available in: Atom PDF