Download - Easy Edit Suite in Squiz Matrix - SIUC 2011

Transcript
Page 1: Easy Edit Suite in Squiz Matrix - SIUC 2011

Easy Edit Suite

Page 2: Easy Edit Suite in Squiz Matrix - SIUC 2011

The Easy Edit Suite – What is it?

>  An editing interface for Squiz Matrix >  Replaces the Matrix simple edit interface “_edit” >  Empowers users of all skill levels to easily create and

manage content >  Customisation possible to tailor the editing experience to

your authors >  3rd Major Release on Sept 5

Page 3: Easy Edit Suite in Squiz Matrix - SIUC 2011
Page 4: Easy Edit Suite in Squiz Matrix - SIUC 2011

What's changed?

>  Enhanced JS API •  Request batching, •  New JavaScript code base, •  additional functions

>  Re-vamped core code for performance >  Bug Fixes >  Improved error handling >  New features

•  Show differences for safe edit in preview mode •  Asset thumbnails •  Future status

Page 5: Easy Edit Suite in Squiz Matrix - SIUC 2011

Performance changes

>  Load straight into edit mode by default >  Asset Finder re-written >  Reduction in the amount of HTTP requests required to

load/save information (batched requests and optimised code)

>  More configuration options available to reduce features to improve page load times (linking screen child list, asset thumbnails)

Page 6: Easy Edit Suite in Squiz Matrix - SIUC 2011

New Features

>  Manage thumbnail images attached to assets from the details screen

>  Manage future status from the details screen >  Bookmark-able URLs and browser history for screen

navigation >  In safe edit a new option will appear in preview mode that

allows “Compare to live” version to be toggled >  Asset Finder pagination >  Small tweaks like a new refresh button on the Asset

Finder

Page 7: Easy Edit Suite in Squiz Matrix - SIUC 2011

New Feature: Thumbnails

>  You can now add, edit or remove a thumbnail from the details screen of any supported asset type

Page 8: Easy Edit Suite in Squiz Matrix - SIUC 2011

New Feature: Future Status

>  Future status can now be enabled on the details screen of supported asset types. Appears as a new button:

Page 9: Easy Edit Suite in Squiz Matrix - SIUC 2011

New Feature: URLs

>  URLs now change as you navigate screens and are now bookmark-able and available as browser history

Page 10: Easy Edit Suite in Squiz Matrix - SIUC 2011

New Feature: Compare to live

>  By popular demand a new button will now allow users to enable or disable the ‘show differences’ view in preview mode.

Page 11: Easy Edit Suite in Squiz Matrix - SIUC 2011

New Feature: Asset Finder Pagination >  In addition to a significant performance boost the Asset

Finder is now paginated

Page 12: Easy Edit Suite in Squiz Matrix - SIUC 2011

Geek speak ahead.

Page 13: Easy Edit Suite in Squiz Matrix - SIUC 2011

Enhanced JS API

>  “Enhanced JS API” is a new mode configurable on the JavaScript API asset

>  PHP code uses a more object oriented approach making it more flexible, maintainable, and adds performance improvements for existing core functions.

>  Enhanced mode uses completely new JavaScript •  More object oriented •  Function calls now extensible and “Future proofed” •  Only load the functions we need

Page 14: Easy Edit Suite in Squiz Matrix - SIUC 2011

Request Batching

>  Request batching takes several JS API functions that would have been run synchronously (or asynchronously) and combines them into a single HTTP request

Page 15: Easy Edit Suite in Squiz Matrix - SIUC 2011
Page 16: Easy Edit Suite in Squiz Matrix - SIUC 2011

Customisation. What’s possible?

>  Most aspects of the interface can be customised to deliver a tailored editing experience

>  Simple changes like logos or wording >  Advanced changes like:

•  Adding/removing editing screens; •  Using EES as a framework to deliver custom applications •  Connecting to external data repositories like a human

resources database, TRIM or SharePoint

Page 17: Easy Edit Suite in Squiz Matrix - SIUC 2011

The customisation toolset

>  EES has re-usable elements so you don’t have to re-invent the wheel; date picker, option slider, Asset Finder, asset picker, JS API wrapper and more…

>  Event system that can be used to trigger code at runtime >  Plugin system so external code can be easily integrated >  We use jQuery, a popular and well respected JavaScript

library. Existing JavaScript and jQuery knowledge can be easily transferred

>  It sits on top of Squiz Matrix, almost anything you can implement you can use in EES

Page 18: Easy Edit Suite in Squiz Matrix - SIUC 2011

Customisation: Plugins

>  Plugins offer a namespace for custom JavaScript >  Init() function that runs before EES is loaded

EasyEdit.plugins.myCustomPlugin = { init: function() { // Custom javascript } }

Page 19: Easy Edit Suite in Squiz Matrix - SIUC 2011

Customisation: Events

>  Events are points in the execution of the code >  Event manager can bind custom functions to events >  Examples: screen load, interface load, url change, save

complete, mode change, and more… >  Used in conjunction with plugins to customise EES

EasyEditEventManager.bind('EasyEditAfterLoad',function(){ // Javascript triggered after the interface has loaded });

Page 20: Easy Edit Suite in Squiz Matrix - SIUC 2011

Customisation: Existing code

>  Time saving code already exists for many common tasks >  3 quick examples:

•  EasyEditAPI •  EasyEditAssetManager •  jQuery and Matrix implementation

Page 21: Easy Edit Suite in Squiz Matrix - SIUC 2011

Summary

>  An extensible, easy to use editing interface with, or without customisation

>  Non-technical authors are not overwhelmed with concepts and require a relatively small amount of training to start publishing

>  Ideal for devolved authoring

Page 22: Easy Edit Suite in Squiz Matrix - SIUC 2011

Thanks

>  Scott Hall (Other half of the EES Team) >  Ashish Karelia (SquizLabs - JS API development) >  Josh Sherwood (SquizLabs - Documentation and testing) >  Chris Smith (SquizLabs - Packaging and VMs) >  Jerome Bonnet (Matrix/EES Testing)