Thursday, June 29, 2006

Adding the Save As button to Image Editor


You can customize Image Editor and add "Save As" button. Here are steps: 1) Copy Image Editor XAML application from "\sitecore\shell\Applications\Media\Imager\Imager.xml" to "\sitecore\shell\Override\" folder. 2) Change CodeBeside e.g.: <CodeBeside Type="CustomImagerForm.CustomImagerForm, CustomImagerForm"/> 3) Create a custom code beside class that inherits from Sitecore.Shell.Applications.Media.Imager.ImagerForm 4) Here is the example code: using System; using System.IO; using Sitecore; using Sitecore.Text; using Sitecore.Data; using Sitecore.Data.Items; using Sitecore.Shell; using Sitecore.Shell.Applications.Media.Imager; using Sitecore.Web.UI.Sheer; namespace CustomImagerForm { public class CustomImagerForm: ImagerForm { [HandleMessage("imager:saveas", true)] protected void SaveAs(ClientPipelineArgs args) { if (args.IsPostBack) { if (((args.Result == null) || (args.Result.Length <= 0)) || (args.Result == "undefined")) { return; } string lastFile = this.GetWorkFile(this.Work); SaveAsNewImage(lastFile, args.Result); } else { Context.ClientPage.ClientResponse.Input("Please input new name without extension? ", "NewName"); args.WaitForPostBack(); } } #region Private Method private void SaveAsNewImage(string oldName, string newImage) { oldName = MainUtil.MapPath(oldName); newImage = String.Concat(Path.GetDirectoryName(MainUtil.MapPath(this.File)), @"\" , newImage , Path.GetExtension(oldName)); System.IO.File.Copy(oldName, newImage, true); } private string GetWorkFile(int index) { ListString listFiles = new ListString(this.UndoList, '|'); string lastFile = listFiles[index]; return lastFile.Substring(0, lastFile.IndexOf("*")); } #endregion Private Method } } I’ve attached this class. 5) Go to Sitecore client and switch to Core database 6) Duplicate node /content/Applications/Media/Imager/Toolbar/Resize to /content/Applications/Media/Imager/Toolbar/SaveAs and place a message “imager:saveas” to the Click field. In the Icon filed you can place your the appropriate icon. So, when you click SaveAs, the new file name without extension will be requested and aftewards Image Editor saves edited image to new one.