QuickManager+ plugin for MODX Evolution - Docs

QuickManager+

@author Mikko Lammi, www.maagit.fi/quickmanager-plus
@license GNU General Public License (GPL v3), www.gnu.org/copyleft/gpl.html
@version 1.5.5 updated 12/01/2011
@requirements MODx 1.0.0+                

Description

QuickManager+ enables front-end content editing.

Installation

If this is an update from earlier version delete first your old QuickManager+ plugin and all files at "assets/plugins/qm/".

1. Extract all files from package to site root.

NOTICE: If you are using Mac OS X don't extract files to the site root or you will overwrite your whole assets folder.

2. Create plugin with

  • Name: QuickManager+
  • Description: <strong>1.5.5</strong> Enables front-end content editing

3. Copy paste plugin code:

/**
 * QuickManager+
 *
 * @author Mikko Lammi, www.maagit.fi/quickmanager-plus
 * @license GNU General Public License (GPL), http://www.gnu.org/copyleft/gpl.html
 * @version 1.5.5 updated 12/01/2011   
 */

// In manager
if (isset($_SESSION['mgrValidated'])) {

    $show = TRUE;
   
    if ($disabled  != '') {
        $arr = explode(",", $disabled );
        if (in_array($modx->documentIdentifier, $arr)) {
            $show = FALSE;
        }
    }
   
    if ($show) {
        // Replace [*#tv*] with QM+ edit TV button placeholders
        if ($tvbuttons == 'true') {
            $e = $modx->Event;
            if ($e->name == 'OnParseDocument') {
                 $output = &$modx->documentOutput;             
                 $output = preg_replace('~\[\*#(.*?)\*\]~', '<!-- '.$tvbclass.' $1 -->[*$1*]', $output);  
                 $modx->documentOutput = $output;
             }   
         }
        // In manager
        if (isset($_SESSION['mgrValidated'])) {
            include_once($modx->config['base_path'].'assets/plugins/qm/qm.inc.php');
            $qm = new Qm($modx, $jqpath, $loadmanagerjq, $loadfrontendjq, $noconflictjq, $loadtb, $tbwidth, $tbheight, $hidefields, $hidetabs, $hidesections, $addbutton, $tpltype, $tplid, $custombutton, $managerbutton, $logout, $autohide, $editbuttons, $editbclass, $newbuttons, $newbclass, $tvbuttons, $tvbclass);
        }
    }
}

4. Check events:

  • OnParseDocument
  • OnWebPagePrerender
  • OnDocFormPrerender
  • OnDocFormSave
  • OnManagerLogout 
NOTICE: Make sure QuickManager+ is the first plugin on OnParseDocument event: Elements > Manage Elements > Plugins > Edit Plugin Execution Order by Event > OnParseDocument

5. Copy paste plugin default configuration:

&jqpath=Path to jQuery;text;assets/js/jquery-1.3.2.min.js &loadmanagerjq=Load jQuery in manager;list;true,false;false &loadfrontendjq=Load jQuery in front-end;list;true,false;true &noconflictjq=jQuery noConflict mode in front-end;list;true,false;true &loadtb=Load modal box in front-end;list;true,false;true &tbwidth=Modal box window width;text;80% &tbheight=Modal box window height;text;90% &hidefields=Hide document fields from front-end editors;text;parent &hidetabs=Hide document tabs from front-end editors;text; &hidesections=Hide document sections from front-end editors;text; &addbutton=Show add document here button;list;true,false;true &tpltype=New document template type;list;parent,id,selected;parent &tplid=New document template id;int;3  &custombutton=Custom buttons;textarea; &1=undefined;; &managerbutton=Show go to manager button;list;true,false;true &logout=Logout to;list;manager,front-end;manager &disabled=Plugin disabled on documents;text; &autohide=Autohide toolbar;list;true,false;true &editbuttons=Inline edit buttons;list;true,false;false &editbclass=Edit button CSS class;text;qm-edit &newbuttons=Inline new resource buttons;list;true,false;false &newbclass=New resource button CSS class;text;qm-new &tvbuttons=Inline template variable buttons;list;true,false;false &tvbclass=Template variable button CSS class;text;qm-tv

6. Save plugin.   

+ 7. Rich text editors (optional)

If you don't need inline template variable buttons you can skip this.

You don't need to change anything if your rich text editor version is at least:
- TinyMCE 3.3.6r2 for MODx
- CKEditor 3.3 for modx alpha 3

Now the hardest part. To get rich text editors to work properly with QuickManager+ inline template variable buttons you will need to edit the rich text editor plugin code. If you won't do this change the rich text editors will use web theme buttons when editing richtext template variables.

TinyMCE 3.2.4.1 (MODx 1.0.2 and below):

In MODx manager go to: Elements > Manage Elements > Plugins > TinyMCE

Replace line:
if(isset($forfrontend)||$modx->isFrontend()){

With:
if(isset($forfrontend)||($modx->isFrontend() && (intval($_GET['quickmanagertv'] != 1) && !(isset($_SESSION['mgrValidated']))))){

TinyMCE 3.3.2 (MODx 1.0.3) and 3.3.5.1 (MODX 1.0.4):

In MODx manager go to: Elements > Manage Elements > Plugins > TinyMCE

Replace line:
if($modx->isBackend())

With:
if($modx->isBackend() || (intval($_GET['quickmanagertv']) == 1 && isset($_SESSION['mgrValidated'])))

Configuration

Go to plugin configuration tab.

Configuration option Default value Possible values Instructions
Path to jQuery   assets/js/jquery-1.3.2.min.js   text Path to your jQuery script. 
Load jQuery in manager  true true || false Prevent loading jQuery twice if you are already using some other plugin which loads jQuery such as ManagerManager.
Load jQuery in front-end  true true || false   Prevent loading jQuery twice if you are already using it in your site template.
jQuery noConflict mode in front-end true true || false Define if jQuery should use noConflict mode. NoConflict mode is useful if you use other JavaScript libraries in front-end such as Mootools.
Load modal box in front-end  true true || false   Prevent loading the modal box JavaScript (ColorBox) twice if you are already using it in your site template.
Modal box window width 80% number || percent Define modal box (ColorBox) window width, for example: 800 or 75%.
Modal box window height 90% number || percent Define modal box (ColorBox) window height, for example: 500 or 75%.
Hide document fields from front-end editors  parent text Separate fields with commas, for example: parent,template,menuindex

Parent selection doesn't work at all with QuickManager+ due missing menu tree frame, so it should be hidden from front-end editors.

Possible fields to hide: content, pagetitle, longtitle, menuindex, parent, description, alias, link_attributes, introtext, template, menutitle

NOTICE! Hiding document fields may not work if fields are moved to other tabs with ManagerManager plugin.
Hide document tabs from front-end editors
text Separate tabs with commas, for example: settings,access

Possible tabs to hide: general, settings, access

NOTICE! Hiding tabs may not work properly if tab order is changed with ManagerManager plugin.
Hide document sections from front-end editors
text Separate sections with commas, for example: content,tvs

Possible sections to hide: docsettings, content, tvs

NOTICE! Hiding sections may not work properly if you are hiding sections with ManagerManager plugin.
Show add document here button  true true || false   Define if it's possible to add documents with QuickManager+.
New document template type  parent parent || id || selected  How to determine a new document template:

- parent: Use parent document template
- id: Use template based on id number
- selected: Define template based on parent document "inheritTpl" template variable used by "Inherit Selected Template" plugin http://modxcms.com/extras.html?view=package/view&package=214. You don't have to install the plugin, but you still have to have "inheritTpl" template variable on parent document with correct template id number.
New document template id 3 number Define which template id to use with new documents. Used only if new document template type is id.
Custom buttons
text Define custom buttons, for example add document to site root or add news document

- New document button: 'button title','new','parent id','template id','visible for user role ids'

- Link button: 'button title','link','http://www.example.com','','visible for user role ids'

- Modal button: 'button title','modal','http://www.example.com','','visible for user role ids'

MODx link tag, e.g. [~23~], works for link and modal button links.
MODx id tag [*id*] works, e.g. http://www.example.com?refererMODxPageId=[*id*]
Every custom button has individual CSS class, e.g. qm-custom-"index"

Visible for user role ids: leave empty to accept all roles, role 1 = Administrator

Separate different buttons with ||

Basic example:
'Site statistics','link','http://www.google.com/analytics/','',''

Advanced example:
'New root document','new','0','3',''||'Add news','new','10','4','4,5,6'||'For admins only','link','[~45~]','','1,4'||'Site statistics','modal','http://www.google.com/analytics/','','1,4'
Show go to manager button true true || false Define is go to manager button visible.
Logout to manager manager || front-end Define where to logout: to manager login screen or to active document on front-end.
Plugin disabled on documents

text Document id numbers where the plugin is disabled.
Separate fields with commas, for example: 34,22,7,19
Autohide toolbar
true
true || false Define if toolbar hides automatically or is always visible (manually close the toolbar by clicking MODx logo or X button)
Inline edit buttons
false
true || false Define if special edit buttons are searched inside content.

Purpose:
Edit any page from other page, e.g. for editing ditto listings.

How it works:
- Add anywhere in to your page: <!-- "Edit button CSS class" "document id to be edited" '"Button title"' -->
- This will create an edit button inside your page when logged in manager
- For regular visitors it will be shown as a regular HTML comment visible only in the HTML source code

Basic example:
- Add in to your template <!-- qm-edit 1 'Edit this' -->
- Creates button to edit page id 1

Advanced example:
- Add in to your Ditto template chunk: <!-- qm-edit [+id+] 'Edit news item' -->
- Creates edit buttons for news listings etc. inside the container page

NOTICE! Button title will fail if you use accented characters. Use HTML entities instead, for example &auml;
Edit button CSS class qm-edit
text
Default qm-edit class can be found at: assets/plugins/qm/css/style.css

You can use your own class if you want to make your own edit button or for added security measure.
Inline new resource buttons false
true || false Define if special new resource buttons are searched inside content.

Purpose:
Create any page from other page, e.g. create new news items.

How it works:
- Add anywhere in to your page: <!-- "New resource button CSS class" "parent id" "template id" '"Button title"' -->
- This will create an new resource button inside your page when logged in manager
- For regular visitors it will be shown as a regular HTML comment visible only in the HTML source code

Basic example:
- Add in to your template <!-- qm-new 1 3 'New news item' -->
- Creates new resource button
- Parent id: 1 (new resource will be created under document id 1)
- Template id: 3 (uses template id 3)
- Button title: New news item

NOTICE! Button title will fail if you use accented characters. Use HTML entities instead, for example &auml;
New resource button CSS class qm-new
text
Default qm-new class can be found at: assets/plugins/qm/css/style.css

You can use your own class if you want to make your own new resource button or for added security measure.
Inline template variable buttons false
true || false Define if special template variable buttons are searched inside content.

Purpose:
Edit any template variable.

Editable default MODx fields:
pagetitle, longtitle, description, content, menutitle, introtext

How it works:
- Add anywhere in to your page: [*#tvName*], notice the "#"
  OR
- Add anywhere in to your page: <!-- "Template variable button CSS class" "tvName" -->
- This will create a template variable button inside your page when logged in manager
- For regular visitors it will be shown as a regular HTML comment visible only in the HTML source code

Basic example:
- Add in to your template [*#tvName*]
- Creates button to edit tvName template variable (and outputs the template variable)

Advanced example:
- Add in to your template: <!-- qm-tv tvName -->
- Creates button to edit tvName template variable
Template variable button CSS class qm-tv text
Default qm-tv class can be found at: assets/plugins/qm/css/style.css

You can use your own class if you want to make your own template variable button or for added security measure.

How to use

Just login, open frontend and enjoy!

Known issues

  • Parent selection is hidden and doesn't work at all with QuickManager+ due missing menu tree frame.

Special thanks

  • QuickManager+ is orginally based on QuickManager by Urique Dertlian
  • Template variable editing ideas from QuickEdit by Adam Crownoble

Changelog

1.5.5 - 12/01/2011
  • Changer: QM+ toolbar close button changed to li element for better cross-browser compatibility
  • Fixed: Multiple little CSS fixes for better protection against global CSS definitions
1.5.4 - 03/01/2011
  • Changed: Updated ColorBox to 1.3.15: http://colorpowered.com/colorbox/
  • Fixed: Support for jQuery 1.4.4
  • Fixed: Inline template variable edit/save was still causing error if "'" mark was used (was affecting pagetitle etc default fields)
1.5.3 - 12/10/2010
  • Changed: Plugin code checks immeditally at start if user is in manager to save processing time
  • Fixed: Inline template variable edit/save was causing error if "'" mark was used
1.5.2 - 14/09/2010
  • Added: CSS classes to toolbar buttons, also li elements: qmCustom, qmManager, qmLogout
  • Changed: Inline buttons div => span, validates correctly
  • Fixed: Inline template variable editing when TV type is checkbox
1.5.1 - 02/08/2010
  • Added: CSS classes to toolbar buttons: qmCustom, qmManager, qmLogout
  • Fixed: Updated ColorBox to 1.3.9 that solves TinyMCE image align problems with IE6 and IE7
1.5
  • Added: Inline template variable buttons!!! Edit template variables with QuickEdit style. Off by default though.
  • Added: OnParseDocument plugin event
  • Added: Image TV preview
  • Added: Preserve alias on save
  • Added: "documentDirty=false;" to cancel button to prevent unnecessary MODx manager alert message
  • Added: Custom buttons now support standard MODx [*id*] tag, e.g. http://www.example.com?refererMODxPageId=[*id*]
  • Added: Individual CSS class for every custom button, e.g. qm-custom-"index"
  • Changed: Plugin content
  • Changed: TV access routine
  • Fixed: TV edit form button labels
  • Removed: close.php => now implemented with OnWebPagePrerender event to preserve alias
1.4.1
  • Added: Individual user language check, previously QM+ used global language setting for all users
  • Changed: Edit buttons in content => Inline edit buttons, New resource buttons in content => Inline new resource buttons
  • Changed: Inline edit buttons "placeholder markup" changed to: <!-- "Edit button CSS class" "document id to be edited" '"Button title"' -->
  • Fixed: Inline edit/new buttons access control
1.4
  • Added: Edit buttons inside content. Edit any page from other page, e.g. for editing ditto listings.
  • Added: New resource buttons inside content. Create any page from other page, e.g. create new news item.
  • Added: Custom buttons works now with default MODx links, e.g. [~23~]
  • Added: Show friendly alias after saving the document. Notice: This is still an experimental feature in is off by default.
  • Changed: Multiple CSS tweaks mainly for IE
  • Changed: close.php uses now sessions instead of JavaScript cookies
  • Fixed: PHP4 support fixed (Thanks yama!)
  • Fixed: Hiding tabs and sections fixed (access -tab and docsettings -section)
  • Removed: .htaccess file under qm -folder that was accidentally left there is not needed at all.
1.3.4.1
  • Changed: CSS tweaks for IE, opacity now works fine with IE8 but unfortunately with IE7 ugly fonts remain (Thanks again uxello!)
1.3.4
  • Added: Autohide toolbar configuration option
  • Changed: Updated ColorBox to 1.3.6: http://colorpowered.com/colorbox/
  • Changed: CSS tweaks, mainly for IE (opacity removed for IE, it breaks cleartype fonts resulting very ugly looking fonts)
  • Changed: Plugin code moved from text file to this file (Installation / 3. Copy paste plugin code)
  • Fixed: Document lock problem solved, now document lock is released when cancel button is pressed (Thanks uxello for the solution!)
  • Fixed: Toolbar is now valid XHTML 1.0 Transitional code
  • Removed: Unnecessary $disabled variable from edit code
  • Removed: Images folder, all images are now under css > images
1.3.3
  • Added: A fallback to English if the languages are missing in the Manager/user settings
  • Added: Little tweaks with QuickManager action buttons: small hide/show animations and possibilty to close the menu by clicking the MODx logo
  • Added: New option for custom buttons: modal = any link opened in a modal box (ColorBox)
  • Changed:  Custom buttons separator is now || instead of # (reserved for URL anchors)
  • Changed: Rounded modal box is back, finally resolved bugs with ColorBox CSS in IE and friendly urls
  • Changed: qm-colorbox.css renamed back to colorbox.css
  • Fixed: Satinitized possible XSS vulnerabilities
  • Removed: OnManagerPageInit plugin event removed
  • Removed: IE6 support dropped, QuickManager+ is not tested with IE6 as MODx manager doesn't offially support IE6
1.3.2.1
  • Fixed: Language file loading
1.3.2
  • Added: New configuration option - jQuery noConflict mode in front-end
  • Added: Check user manager access permissions to current document and show action buttons according to permissions
  • Added: It's now possible to hide QM+ action buttons
  • Added: Hide parent frame scrollbars and QM+ buttons when modal box is visible (ColorBox bindings)
  • Added: Modal box can't be accidentally closed by clicking the overlay
  • Changed: Stylish ColorBox CSS style didn't work properly with IE and crashed too often with Safari, had to replace it with minimalistic style for better cross-browser compatibility
  • Changed: Updated ColorBox to version 1.3.1, includes for example IE ClearType fix (no more ugly fonts)
  • Changed: colorbox.css renamed to qm-colorbox.css and moved to QM+ css folder
  • Fixed: All normal MODx manager actions including template and RTE selection works now just fine (thank you very much Susan O. for your ideas!)
  • Fixed: Multiple small CSS fixes for IE
  • Fixed: Alias friendly logout code (thanks Mar!)
  • Fixed: Language selection a bit more robust and offer a level of fallback
  • Removed: Use with ManagerManager plugin  -option deprecated
1.3.1
  • Added: It's now possible to change template once. After that you can't change the template again but of course you can press cancel button and try again.
    Note: ToDo: Investigate if there is a way to detect parent frame in PHP to solve this problem
1.3
  • Added: Support for MODx Evolution 1.0.0 version, better combatibility with MODx Carbon manager theme
  • Added: Support for jQuery in noConflict mode by default
  • Added: ColorBox modal box support
  • Added: Modal box (ColorBox) window width
  • Added: Modal box (ColorBox) window height
  • Added: Possibility to add custom link buttons
  • Removed: Thickbox window max width
  • Removed: MODx versions below 1.0.0 are not supported due manager interface changes
  • Removed: ThickBox modal box support
1.2
  • Added: Plugin disabled option
  • Added: Show go to manager button option
  • Added: Custom add buttons option
  • Added: Hide document sections from front-end editors option
  • Added: Hide document tabs from front-end editors option
  • Added: Dynamic ThickBox windows size adjustement, window size is calculated without refreshing the window
  • Added: ThickBox window max width option 
  • Added: Logout to configuration option added, needs event OnManagerLogout 
  • Fixed: Documentation changed to html file
  • Fixed: Clearer plugin folder structure
  • Fixed: Hiding templates if only one template
  • Fixed: Load jQuery in front-end was not working properly
  • Fixed: mcc.class.php => hideTab & hideSection
  • Removed: ThickBox windows width and height options removed.
1.1.1
  • Fixed: Logout function changed. Previous version had a problem with multiple users resulting document locked issues. Now plugin logs user nicely out to the manager login page.