Note:

If you want to create a new page for developers, you should create it on the Moodle Developer Resource site.

Editor file management: Difference between revisions

From MoodleDocs
No edit summary
Line 1: Line 1:
This document is a specification that describes how how the handling of embedded media and attachments will work with and around the editor in Moodle 2.0.  
This document is a specification that describes how how the handling of embedded media and attachments will work with and around the editor in Moodle 2.0.  
==Embedding media in a text===


Embedded media includes images, videos and sounds that are embedded within a single given HTML text.  These are added using the HTML editor (which in Moodle 2.0 is a modified version of TinyMCE) and stored in the "file area" associated with the text.  This applies to all HTML texts in Moodle 2.0, ranging from simple forum posts to full pages in the Resource module.  These files can be stored in one flat virtual folder, they do not need to be in sub-directories.
Embedded media includes images, videos and sounds that are embedded within a single given HTML text.  These are added using the HTML editor (which in Moodle 2.0 is a modified version of TinyMCE) and stored in the "file area" associated with the text.  This applies to all HTML texts in Moodle 2.0, ranging from simple forum posts to full pages in the Resource module.  These files can be stored in one flat virtual folder, they do not need to be in sub-directories.


Attached files are for whenever you have a set of files that you want to store and display.  These include forum attachments, assignment submissions, and resource files (including whole mini web-sites).  Attachments need to support subdirectories and require more file management.
The basic procedure for embedding an image is:


* Click on the image button in the editor
* Click on the Browse button in the editor dialog
* Use Filepicker to select the file from a repository (or recent files, or upload) with a name
* IF A FILE WITH THAT NAME ALREADY EXISTS THEN ALTER THE NAME IN MOODLE (eg file.jpg --> file2.jpg)
* Add metadata and preferences in the editor dialog
* Insert the image into the text


== Some conventions in other software ==
The procedure is very similar for video and audio files as well.


[[Image:wordpress2.8-upload-a.png|thumb|Wordpress 2.8]][[Image:wordpress2.8-upload-b.png|thumb|Wordpress 2.8]]
Note: Like most operating system "Open file" dialogs, the filepicker only shows those media types that you are searching for at that time.  For example, if you are looking for video files then repositories which don't support video files are not shown, and only video files are shown in the remanining repositories (even if other files may be there).
Example 1: Office document (Word, OpenOffice, Google Docs).  Once the "Open" dialog is used to bring the media into the page, the only way it can be removed from the document is by deleting it from the document directly.  Office applications do not have a way of managing media separately from the document view.


Example 2: Dreamweaver.  
[[Image:Adding_an_image.png]]


Example 3: Box net.  Documents can be made and images added, but there is no interface in the document to manage media.  However, when looking at the filesystem view one can see the media in a folder and can edit it.  Obviously changing names and deleting things will break the links in the HTML.
(click on this diagram to see the full-sized version of this example)


Example 4: Wordpress: Separate tabs for Uploading from PC, uploading from URL, and selecting an image from Media Library (files already on server). When image is uploaded in first two, there is a list of the files already uploaded. In any of the three tabs, when an image is selected, options for its display are shown, along with an option to delete. See: http://demo.opensourcecms.com/wordpress/wp-admin/page-new.php (user:admin, password:demo123 or see http://php.opensourcecms.com/scripts/details.php?scriptid=88&name=WordPress)


(TODO: more examples)
===Adding attachments===


== Related Moodle 2 features ==
Attached files are for whenever you have a set of files that you want to store and display.  These include forum attachments, assignment submissions, and resource files (including whole mini web-sites).  Attachments need to support subdirectories and require more file management.
 
===File picker ===
 
The file picker is designed to mimic the file open dialog. 
 
As usual, the button/link/menu that initiates the file picker can specify what mime types are being looked for, and the resulting display is limited to those repositories that support those mime types, and only files matching the mime types are shown.  This can already be seen in Moodle 2.
 
===File manager form element ===
 
The file manager form element allows any form to have a managed set of files, such as a set of attachments to a forum post.  Files can be added (by calling the file picker) or deleted (by pressing a little X next to any file).
 
  [[Image:Filemanagerform.png]]
 
This image shows the current state in Moodle 2.0 dev.  See below for mockups of the full extended version.
 
==Illustrated Examples==
 
===Add a new image to a text===
 
* Click on the image button in the editor
* Click on the Browse button
* Select a file from a repository (or recent files, or upload)
* Add metadata and preferences.
* Insert the image
 
(click on this diagram to see the full-sized version)
 
[[Image:Adding_an_image.png]]
 
===Adding attachments===


When you have one or more atatchments to manage, then we use the file manager form element.  This will work equally well for forum attachments as for an uploaded resource consisting of many files.  
The file manager form element is designed for this.


* Click on "Add" in the file manager form element
* Click on "Add" in the file manager form element
Line 57: Line 33:
* File is added  
* File is added  


This is what the new "file manager" form element looks like (screenshots from MDL-16597):
This is what the new "file manager" form element will look like (screenshots from MDL-16597):


http://tracker.moodle.org/secure/attachment/18132/File+manager+interface+%28on+root%29.png
http://tracker.moodle.org/secure/attachment/18132/File+manager+interface+%28on+root%29.png

Revision as of 07:43, 7 August 2009

This document is a specification that describes how how the handling of embedded media and attachments will work with and around the editor in Moodle 2.0.

Embedding media in a text=

Embedded media includes images, videos and sounds that are embedded within a single given HTML text. These are added using the HTML editor (which in Moodle 2.0 is a modified version of TinyMCE) and stored in the "file area" associated with the text. This applies to all HTML texts in Moodle 2.0, ranging from simple forum posts to full pages in the Resource module. These files can be stored in one flat virtual folder, they do not need to be in sub-directories.

The basic procedure for embedding an image is:

  • Click on the image button in the editor
  • Click on the Browse button in the editor dialog
  • Use Filepicker to select the file from a repository (or recent files, or upload) with a name
  • IF A FILE WITH THAT NAME ALREADY EXISTS THEN ALTER THE NAME IN MOODLE (eg file.jpg --> file2.jpg)
  • Add metadata and preferences in the editor dialog
  • Insert the image into the text

The procedure is very similar for video and audio files as well.

Note: Like most operating system "Open file" dialogs, the filepicker only shows those media types that you are searching for at that time. For example, if you are looking for video files then repositories which don't support video files are not shown, and only video files are shown in the remanining repositories (even if other files may be there).

Adding an image.png

(click on this diagram to see the full-sized version of this example)


Adding attachments

Attached files are for whenever you have a set of files that you want to store and display. These include forum attachments, assignment submissions, and resource files (including whole mini web-sites). Attachments need to support subdirectories and require more file management.

The file manager form element is designed for this.

  • Click on "Add" in the file manager form element
  • Select a file from a repository (or upload)
  • File is added

This is what the new "file manager" form element will look like (screenshots from MDL-16597):

http://tracker.moodle.org/secure/attachment/18132/File+manager+interface+%28on+root%29.png

And once you click on any folder you can go down in the tree:

http://tracker.moodle.org/secure/attachment/18130/File+manaager+interface+%28on+subdir%29.png

When moving a file or folder, you get a little popup browser to choose the destination.

http://tracker.moodle.org/secure/attachment/18128/moving+file+interface.png

Discussion

Discussion: RFC: Editor file management in Moodle 2.0 Discussion document: August 3 version of this page

Retrieved from "https://docs.moodle.org/dev/index.php?title=Editor_file_management&oldid=15156"
Powered by MediaWiki