JFU 2.15 is released
JFU does now include TFU 2.15 with all the new features that comes with it. The master mode can now create directories with the user group as well. Works fine with Joomla 1.7.x
JFUploader NewsJFUploader OverviewThe JFUploader is the Joomla component of the TWG Flash Uploader. The Joomla Flash Uploader is now JFUploader. The new name was needed because an extension is not allowed to start with Joomla anymore. It also shows that this is not the internal uploader of Joomla but a real component with many new features. You now have the possibility to upload files to your web server the easiest way possible. You simply select the files you want to upload and thats it. No upload HTML form anymore where you have to upload each file individually. You only need Flash 8 or higher installed to use this component. You can upload files in the backend of Joomla AND you can offer this in the front-end for your users as well. You can create upload profiles and assign them to your joomla users. This gives you the possibility to give e.g. every of your users a different upload directory and/or different rights/functions. Uploading was never easier!
|
Features
Additional features of the registered version
RequirementsJoomla 1.6.x/1.7.x |
Joomla 1.5.x |
Joomla 1.0.x |
|
| JFUploader Component | |||
| JFUploader Mambot/plugin Since 2.11 you have to include the plugin with "jfuploader" and not with "joomla_flash_uploader" + you need a security token you can generate in the JFU administration. |
|||
JFUploader Editor extension button  The editor button of JFU replaces the "image" button of the Joomla editor. See here for details. ALWAYS update the component if you update the editor button! Most of the code is in the compoment! |
not available |
||
Component + Mambot/Plugin + Editor extension |
If the download is corrupt you can download the component + mambot/plugin here: JFU 2.15.x - Joomla 1.6.x | JFU 2.15.x - Joomla 1.5.x | JFU 2.15.x - Joomla 1.0.x
Please unzip this file once because it contains the comonent and the mambot/plugin.
See history.txt in the downloads for changes of minor versions.
JFU for Joomla 1.0.x does always contain the same version of the flash but the backend user interface is not extended anymore from version 2.10 on. You have to set the new settings in the tfu_config.php file.
SECURITY UPDATE: Please update to JFU 2.12 because some server do handle multiple extensions not properly and I added a detection for this. I have enhanced the security of JFU and especially for the plugin. I have added a new security token for the plugin which prevents that e.g. a publisher can edit a page and use a different profile where he might get more rights then he should! Additionally the server details (upload limit, timeouts) can not be seen when calling tfu_config.php anymore. JFU displays this information on the limits tab.
JFU Editor extension button
Since JFU 2.13 there is also an editor extension of JFU available. It does fully replace the existing "Image" button below the artice editor and gives you the full power of JFU:
- Full integration of JFU in the editor. You can upload multiple files instead of only one file like in the Joomla implementation
- You can use groups and profiles - this makes it possible to define exactly where each user can upload files.
- Use the server side to select images you want to insert.
- Add a link target by simply selecting it in the server side view.
- Create thumbnails of existing images and include them.
- Define the size of the image you want to include
- Support for Lightbox, Lytebox and Highslide
- A nice ruler - because I don't know how much 300px are :).
- Caption support! You can create automatically a div or span that in includes your image + your text. Please see the description below!
- JFUploader Editor extension can be configured.
- Links can be inserted
- Thumbnails of pdf's can be created.
- Google doc viewer can be used directly.
- Html and css was optimized to work with different templates (some templates destroyed the divs)
Screenshots:
Additional screenshots please look below.
Installation: Install the package and activate the 'Button - JFUploader Editor Plugin' plugin in the plugins manager. Disable the 'Button - Image' plugin because it is now not needed anymore.
Configuration: Please go to Extensions -> Plugin manager. Search for 'Button - JFUploader Editor Plugin' and set the parameters on the right side. You have to use the same parameters as for the component or the plugin. For the editor extension you can only specify one group or profile! You can enable/disable most of the available options. So feel free only to use the one you like.
Usage: Select the image you want to add. If it is too big enter a smaller size and click on 'Create thumbnail'. Then a thumbnail is created. Please select the thumbnail and enter an alternative text if you like. If you like to add a link go to the 'link properties'. There you can add a link directly or select one above. The interesting part is the addtional link attributes where you can easy add lightbox or lytebox support. Currently the code you have to add for lightbox, lytebox and highslide can be selected. Please read the documentation of this lightboxes to e.g. make a slide show. Many templates already have a support of a lightbox. So you can use it without installing anything. If you don't have lightbox support you only have to include the required libraries to your template.
Editor buttons are not desinged to edit elements you have already inserted. So please delete the image if you want to midify an existing one with the JFUploader editor button or check ifyou can do the modifications with the image editor of your editor.
Caption: Next to the alt text/ titel you have the option to use this text as caption. This will render a div or span (depending how the plugin is configured) where the image is included and below it the text you have inserted. You have also the option to style this div/span. The following two styles are available you can to add to your Joomla template:
- jfu_caption_div - this is the container around the image and your text. Here you can add e.g. a nice border, padding or a margin. I normally add a default margin in the style sheet of the templete. I also recommend to define the text color, text size and text font here. Because you never know where the caption div/span is added!
- jfu_caption - Here you can style the caption text. You can define the size or the distance to the image.
Most Joomla editors do not handle spans/divs really nice. So if you use this, the image/text will not be shown properly in the editor but will look o.k. in the final page.
Alignment: Here I have added something that looks strange: It's the "+ clear". If you use this the included element will have a "clear" defined. If you don't define this all images will be shown in e.g. the right next to each other. If you choose the "+ clear" the images will be displayed on the right but one below the other!
Horizonal space/Vertical space: By default "Template default" is shown. This means that for images the default margin for images is used (which is normally 0) and for the caption the margin defined in jfu_caption_div. If you have a jfu_caption_div like in the example below you shold define a default margin because this simply looks better. If you define your own marigin the one from the template is overwritten.
div/span: In the configuration of the editor plugin you have the option to include the caption by div or by span. You have tho check at you editor you use, which ist the better supported one. If you choose div you have to check if e.g. <p> tags are added automatically and if you like this. This often thid leads to an new line you might don't like. But in the editor itself divs often can be display while spans can't. So please check what is the better way for you.
Insert links: Since 2.14 you can also insert links. If anything except an image is selected the view is automatically switched to the link tab and "Insert Link" is enabled. For images you can also insert a link only.
Thumbnail creation of pdfs: If you want to enable the creation of thumbnails when selecting a pdf (or enable the preview of pdfs in the flash) you need the following:
- Check if image magick is available
- Enable image magick
- Create a folder called thumbs in the tfu folder. (administrator/components/com_jfuploader/tfu/thumbs). If you select a pdf and a preview is shown in the flash everything is configured right!
Google doc viewer: If you select a supported file extension (see http://docs.google.com/support/bin/answer.py?hl=en&answer=1189935) the file of the link is shown in the google doc viewer.
Example: Below you see a image with the following style set in the template.css (jfu_caption is not used - I use the default padding for the text). I also recommend to define the text color, text size and text font here. Because you never know where the caption div/span is added!
.jfu_caption_div {
text-align:center;
border: 1px solid #aaaaaa;
padding:3px;
color: #333333;
font-size:11px;
}
Tested with: IE, Firefox, Chrome, Opera and Safari
Have fun using this extension.
Demos
Please go to the TFU Demos to see the the flash working in the freeware and the registered version.
Installation
Simply install the zip file as a component in the Joomla backend.
There could be problem with the installation when your server does have safe mode active. To install JFU with safe mode properly please:
- Use the safe mode patch - This is actually useful for all your other installtions too (if you have safe mode active on your server) ;).
AND - Go to 'Site -> Configuration -> Server' and change the settings for 'CHMOD new files' and 'CHMOD new directories' to 777 (or 775).
This should be done if you get one of the following error messages:
- Failed to move uploaded file to /media directory.
- Unrecoverable error "PCLZIP_ERR_READ_OPEN_FAIL (-2)" - Joomla 1.5: In Joomla 1.5 the session can be stored in the database. JFU has some restrictions (See JFU config page) if you have this setting.
You have to select "none" at Site -> Configuration -> System -> Session-Handler.
If you change the permissions please do this BEFORE installing JFU. Please note that there are many server configurations do exist and every setting is a little bit different. Therefore you should first try to install JFU without any modifications and then try to make the settings described above.
On my server it is enough to do step 2 only. But this depends on your server safe mode confguration. Therefore you maybe have to try different settings for your server until you get JFU working. If you had to make something else to get JFU to work please let me know to improve this text.
Update
Joomla 1.6.x
Simply use the new update server functionality in Joomla 1.6. The component and all plugins can be updated this way.
You can also simply update JFU by installing JFU with the Joomla installer. Finally you still have the option to uninstall the component and install it again. Please check the restrictions of the uninstall/install in the Joomla 1.0.x section.
Joomla 1.5.x
Since JFU 2.13 you can simply update JFU by installing JFU again trough the Joomla installer. You don't have to uninstall the component anymore. Please make sure to update plugins as well. If you uninstall the component please read the Joomla 1.0.x part below.
You can update this version also by simply overwriting all files of the current installation. But you have to copy the install-, xml-, admin-, site- and all the language files to the right place! Only recommended for users that have to update many installations automatically and know what they do. The database is updated the first time you access the administration of JFU. This feature is not available for Joomla 1.6 anymore because it has the internal updater where you can update all your components directly in the administration and for most components you have to choose this way anyway...
Joomla 1.0.x
To update to the latest version of JFU simply uninstall the old component and install the new version. In the config you can select if you want to keep your settings (= keeping the database tables) or if you want to remove them too. If you keep the settings the installer does automatically updates your database to the lastest version. It adds the new settings to the existing configurations. No profile is removed or changed. The default is that the tables are not removed!
Check if the menu entries do still work. Most of the time they don't because a new internal id is most likely used for the component! If not - simply open the menu entry and reselect JFU again. If you use the plugin you have to enable the plugin again and if you where upgrading from a version before 2.11 you have to change joomla_flash_uploader to jfuploader at the places where you have included the plugin.
Video tutorials
You not sure how to use JFU? Profiles? Groups? ...
The video tutorials cover common scenarios which are explained also below in the FAQ.
The following tutorials are available:
 Installation |
Profiles |
Groups |
Plugin and Javascript callbacks. |
Please note that you have to use the security token since 2.11.1 for the plugin!
Thanks to Zsolt
Screenshoots
JFU integrated in the Joomla backend (click on the thumbs for a big image):
JFU integrated in the front-end (click on the thumbs for a big image):
JFU Editor extension
License
Please note that 2 licenses affect this software bundle. The JFUploader is bridge between Joomla and the TWG Flash Uploader. Therefore all parts that belong to the Joomla integration are distributed under the GNU GENERAL PUBLIC LICENSE. The TWG Flash Uploader Flash itself is distributed under the TWG Flash Upload Freeware License Agreement. Please see license.txt in the download for details.
From the Joomla Webpage
A bridge links Joomla! to an external application (the TWG Flash Uploader) so that they can exchange data and cooperate. On the Joomla! side of the bridge, the bridge is treated just like a component, module, or plugin; it must comply with the GPL unless it is a separate work (and some bridges might indeed be separate works). If the external application is separate enough from Joomla! that it is a separate work under copyright law, it may be licensed under whatever license the holder of its copyright sees fit.
Help / Howto / FAQ / Forum
Forum
The forum of the TinyWebGallery has a special section for the JFUploader. Please post there if your problem is not covered in the help.
Video tutorials.
The video tutorials cover common scenarios which are explained also below in the FAQ.
The tutorials can be found on the JFU website -> watch them.
How to check if the Flash does work.
To verify that the uploader works correctly please perform the following steps:
- Go to 'Components -> JFUploader -> Upload'
- Check if the main directory of Joomla is listed on the left side. If not please log off Joomla and close your browsers and login again to get a new session.
- If you get the message 'The folder has no write permissions. All actions are disabled.' you have to change the permissions of the folder you want to upload that php can write to this folder. Most of the time you need 777 (sometimes 775 is enough).
- Upload an image. If this does not work and the flash say you have to copy a .htaccess file please go to 'Components -> JFUploader -> Upload'. At the bottom of the page you can create this file, then retry.
- If you have a .htaccess to protect your Joomla administration you have to move the tfu folder to the site components directory. On the JFU config page you can do this (since 2.10.3) and find all info you need to know!
If the flash does not work: Please go to the website by using this link (-> TFU FAQ 1) or go to www.tinywebgallery.com -> TWG Flash Uploader -> Installation & FAQ -> FAQ 1. There the most server problems/restrictions are explainded.
How to use the JFUploader in the backend
Simply upload files by using the Upload menu item! By default the main directory of Joomla is selected. The 1st profile (1) is the profile used for the uploader of the backend. This profile should only be used for the administrator.
How to use the JFUploader in the front end
The most interesting feature is to offer the upload flash to your front end users. This can be done in two ways: Using the component and using the mambot.
- Component - You can include the flash to your front-end by selecting Menu -> <your menu> -> New -> Component. Select JFUploader and press apply. Then you have to enter the mandatory parameters (Profile Id/Group Id and ID) for the component. Please read below what you have to enter ;). In the profile you can specify a title and the text before and after the flash. If you want to include the flash in one of your existing pages please use the mambot/plugin
- Mambot/Plugin - Use the mambot/plugin if you want to integrate the flash into one of your pages. Please read "How to use the mambot" about usage and below about the parameters you have to use.
Now you know how you can include it - but the interesting part is how you can configure it ;). There are two ways:
- Profile - You can create a profile by selecting Components -> JFUploader -> Config. Here you find the different profiles. By default two profiles do exist. Profile 1 is the administrator profile and used in the back end - and should only be used for this purpose! Profile 2 is an example profile you can use for your users in the front-end. Using a profile means that all users that have access to the page where the flash is visible get the settings of this one profile. The users you assign to a profile only used if you use groups!
If you want to use a profile this you have to select Profile ID in the component in the menu or 0 as type for the mambot/plugin and use the id of the profile you want to use.
Please read 'How to use a master profile' if you like one folder created automatically for each user! - Group - The more advanced way is to use a group id. A group is a set of profiles where the profile is selected depending on the user that is logged in. This makes it possible to use different profiles on the same page.
- Set up at least 2 profiles (the admin profile should not be used!).
- Edit this profiles and assign the same group id to all of them!
- You always need a default profile. This is the profile where no users are assigned to. This is used for not assigned users and if the flash can be accessed without login. You can disable the default profile if you like. Then the text of the "Text before the flash" is shown.
- Assign user to the other profiles. This can be done by draging at the profile on the User tab or at Components -> JFUploader -> Users. Simply select the user and the profile and click add. At the bottom you see your current mappings where you can delete them too.
If a user is logged in and a profile is mapped to this user this profile of this group is used. - Select Group ID in the component in the menu or 1 as type for the mambot/plugin and enter the group id you want to use.
- Look for a user and if a mapping is found this profile is used.
- Look for a Joomla group and if one of the users groups matches this profile is used. If a user has serveral groups and several matches the one with the lowest group id is used.
- Look for the default profile and if you have defined a default profile this is used.
- If no profile is found an error message is displayed.
How to use a master profile
Before JFU 2.8 you needed to create a folder for every user you want to allow to upload files. If a lot of users should use the same folder this was fine. But if you like that every user has his own upload folder you had to create a profile for every user, assign this user to the profile and put all profiles to one group.
Since 2.8 you can set in the config of a profile that it is a master profile! Then for every registered user a sub directory of the profile directory is created and the user can only access this folder. The foldername is either the login or the user id.
New 2.8.3.2: You can copy a default folder structure with files and folders to a new created user directory. You have to create a folder called 'default' in the directory components/com_jfuploader. Everything inside the default folder is copied to a user directory when it is created. This can be a simple index.htm but also a full folder structure.
How to make the flash fit into your site
You can define the size of the flash in the profile. Simply enter the width you need and the flash is resized to this size. You have to check if the flash is still displayed nicely in your size. Optimal width is 650 pixel.
How to use the mambot/plugin
If you want to integrate the flash into one of your existing pages you can use the mambot/plugin of JFUploader. Make sure to install this mambot/plugin AND publish it. Use the following format:
{joomla_flash_uploader type=<0 or 1> id=<profile or group id>}
Since JFU 2.11.1
{jfuploader type=<0 or 1> id=<profile or group id> securitytoken=<security token>}
- type is the selector if a profile is selected directly or a group is used. 0 = profile, 1 = group.
- id is the number of the profile or the group.
- securitytoken is a unique key which prevents that type or id can be changed by e.g. a publisher or editor. This token is different for every Joomla installation!
Since JFU 2.11.1 you find a generator for the plugin code on the config page of JFU. This will generate the plugin code with the security token for all possible profiles and groups you have configured. This new feature makes it impossible that frontend editors of your site to get more access than you have configured! Therefore please update to this version if you use the plugin in the frontend!
For example: {joomla_flash_uploader type=0 id=2 } Since JFU 2.11: {jfuploader type=0 id=2 securitytoken=19a6bd2ad78eee19675905306a73aebc}
New 2.8.1:
For Joomla 1.5.x the plugin code is still visible if you disable the plugin or set the access level to e.g. registered. In 1.5.x there are only some workarounds to solve this. For JFU I have implemented the following solution. Include the plugin with
<!-- {joomla_flash_uploader type=<0 or 1> id=<profile or group id>} -->
Since JFU 2.11
<!-- {jfuploader type=<0 or 1> id=<profile or group id> securitytoken=<security token>} -->
If the plugin is enabled I do automatically remove the html comment <!-- --> and the plugin is shown properly. If the plugin is disabled the code is still there but not shown because of the html comment.
How to make the text before and after the flash language dependant
In the configuration you have to option to use the textboxes below or to use the language file. If you use the language file you can display the text depending on the language your user is using. Please select 'Use language file' and enter the text in the language files.
For Joomla 1.0.x the language file is located at administrator\components\com_jfuploader\language and the following entries can be made:
- $GLOBALS["JFU_TEXT_TITLE_<profile id>"] = "Title";
- $GLOBALS["JFU_TEXT_TOP_<profile id>"] = "Text before ";
- $GLOBALS["JFU_TEXT_BOTTOM_<profile id>"] = "Text after";
For Joomla 1.5.x the English language file is located at language\en-GB\en-GB.com_jfuploader.ini and the following entries can be made:
- JFU_TEXT_TITLE_<profile id>=Title
- JFU_TEXT_TOP_<profile id>=Text before
- JFU_TEXT_BOTTOM_<profile id>=Text after
The language files for the other language do NOT exist yet. You have to create them and place them where language files below in the Joomla version you use. For Joomla 1.0.x it's the same location as the English file. For Joomla 1.5.x there you first have to go to the language folder of you language and then create the file in the same format as the other language files. e.g. for German: language\de-DE\de-DE.com_jfuploader.ini
How to use the Javascript callbacks - registered version only
If you are registered you can use the Javascript callbacks of the flash. You have to add the Javascript to the site and activate the Javascript call.
Right now 8 Javascript calls are available:
- uploadFinished
- previewSelect
- deleteFile
- changeFolder
- createFolder
- renameFolder
- deleteFolder
- copymove
The Javascript below is an example for a call after the upload:
<script type="text/javascript">
function uploadFinished(loc) {
// you can do something after the upload - loc is the parameter you provide in the config!
// you can call e.g. a php page where you have stored infos during upload!
// e.g. if you want to jump to another page after upload the code could be:
// window.location.href=loc;
alert(loc);
}
</script>
You can use 2 ways to include the Javascript:
- You have to use the mambot/plugin (see 'How to use the mambot/plugin') and include the Javascript directly to your site. Make sure your editor allows to enter Javascript!
- You can use the component.
Go to the configuration to the profile, enter the Javascript in the 'Text after the flash' box and make sure 'Use textbox below' is selected. You can use the example above as a first start. Make sure to include the <script> .. </script> tags as well.
Now you have to enable the Javascript call. For our upload example this would be the setting 'Enable Javascript upload call'. Enter something in the textfield. The value you enter here is the parameter you get as loc in the uploadFinished(loc) function. In your example avove this parameter is only shown in an alert box. On the website you find a working example at the registered demo of TFU where Javascript calls trigger the display of data. The Javascript reads the data from a status.php which is displayed below the flash then. You can download the example at the page to see how this is is done.
Done.
Example:
Enter
<script type="text/javascript">
function uploadFinished(loc) {
window.location.href=loc;
}
</script>
In the 'Text after the flash' box and make sure 'Use textbox below' is selected.
Then go to the "Registered settings tab -> Enable Javascript upload call" and enter e.g.
http://www.tinywebgallery.com
to get redirected to tinywebgallery after the upload. You should of course use your url ;).
How to add your own language
There are 2 parts to translate: The Joomla integration part and the Flash itself.
The flash is available in 24 languages right now. For the full list please go to the website
and check the languages of the TWG Flash Uploader.
If you want to translate the backend you simply have to tranlate the language/english.php language file.
But this not the important part because this only used in the administration.
If your language of the flash is not included you can translate the flash by translating the en.xml in the tfu/lang folder.
To enable the automatic mapping of the language open the joomla_flash_uploader.class.php and search for the section where the language
mappings are and add your language there. Please send the translated xml back to me that I can include it to the next release.
How to change the colors of the flash - professional licence or above
If you have a personal license or above you can change the colors of the flash. It's not possible to change everything (e.g. the colors of the buttons are defined in a theme and there you can only set 3 different ones. If you like to modify these to you need to modify the source code by yourself) but most colors can be changed. If you have a source code license you can either change the colors by yourself but of course use this settings too. You only have to remove the body of the method MLayout.as -> resetColors. If your license does already contain TWG_SOURCE in the domain this is not needed.
Colors does always have to be in the hexadecimal format. e.g. AA00FF unless something else is described. This are the possible colors you can change:
- c_theme - The basic theme of the flash - possible settings are "haloOrange", "haloGreen", "haloBlue"
- c_text - The basic color of all texts
- c_text_header - The color of the header text (for popups too!)
- c_header_bg - The background of the header
- c_header_bg_2 - The 2.nd background of the header - makes a gradient fill from c_header_bg to c_header_bg_2.
- c_bg - The main background
- c_border - The color of the border
- c_list_bg - The background of the list and the grid
- c_list_header - The background color of the header of the grid
- c_list_header_solid - set this to "true" if you like to have a solid list header. All gradients are fading to white because this is hardcoded in the core (new 2.8.3).
- c_progress_text - The color of the text on the progress bar
- c_progress_label - The color of the label left to the progress bar
- c_progress_bar - The color of the moving part of the progress bar
- c_progress_bar_bg - The color of the background of the progress bar
- c_progress_bar_seperator - The color of the small seperators in the progress bar
- c_popup_bg - The background color of popups like the login
- c_popup_header_bg - The background of the headers of the popups
- c_popup_header_bg_2 - The 2.nd background of the headers of the popups - makes a gradient fill from c_popup_header_bg to c_popup_header_bg_2
- c_popup_border - The color of the border of the popups
- c_bg_numbers - The background of the line numbers - This color is related to the backgound color but with an alpha channel - you have to find the right color e.g. with a tool that shows you the color of the background when faded.
- c_numbers - The color of the numbers
- c_status - The color of the status line. If not set c_text is used
To set a color you simly add them in JFU in the free text field of the profile like url parameters. e.g. &c_text=FF00FF&c_border=00FF00.
If you don't have a professional license or above and set colors this way then all colors are set to white.
Follow TWG at
Bookmark at
...