ImageManager in Editor

10 posts, 0 answers
  1. DW Web Team Member
    DW Web Team Member avatar
    43 posts
    Member since:
    Jun 2012

    Posted 15 Sep 2010 Link to this post

    Hello,

     

    I just started working with the ImageManager in the Editor and have a few questions regarding the provided examples.

    1. Can the ImageManager window be resize?

    2. I believe FileExplorer is used inside ImageManager. When I try to resize the left side of the FileExplorer to make it bigger, the slider  on the right side goes over the right side of Image Manager. Can anything be done to fix this behavior?

    3. Can the slider’s visibility be changed dynamically? If yes, then how?

    4. In my application I would like to use a physical path in the ImageManager and not virtual. And partially I was able to do so. The problem I have with that is that when I select the file in the FileExplorer, I do not see the image on the Preview panel and there is no info on the Properties panel either. Am I missing something?

     

    Thank you

  2. Fiko
    Admin
    Fiko avatar
    1406 posts

    Posted 20 Sep 2010 Link to this post

    Hello,

    In reference to your questions:
    • Can the ImageManager window be resize?
      You need to modify the FileBrowser.ascx file and get reference to the currently opened window and then change its properties.
    • 2) and 3) I am not quite sure that I understood your requirements. Could you please provide more information (and/or some visuals) about the expected behavior.
    • If you use this content provider, then you need to modify the constructor of the FileItem to looks like this (the change is highlighted):
      FileItem fileItem = new FileItem(fileInfo.Name,
                        fileInfo.Extension,
                        fileInfo.Length,
                        virtualPath + fileInfo.Name,
                        url,
                        null,
                        GetPermissions(filePath)
                         );

    Greetings,
    Fiko
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. DW Web Team Member
    DW Web Team Member avatar
    43 posts
    Member since:
    Jun 2012

    Posted 20 Sep 2010 Link to this post

    Thank you for the response.

    I will try to make myself more clear.

    1. Can the ImageManager window be resize?
        By that, I ment if the user can resize the window. Is there any property on the FileManagers that allows the window to be resizable?

    2. and 3. Problems with the slider inside the FileManagers.
        You can take a look at your example on the http://demos.telerik.com/aspnet-ajax/editor/examples/default/defaultcs.aspx . Please select ImageManager or DocumentManager, for example. A windows that pops up has 2 sides - the left with FileExplorer and the right with the Preview panel and 2 buttons (Insert and Delete). Inside the FileExplorer on the left side there is a TreeView and on the right side - a Grid with the list of the files. They are separated by a splitter. So when I drag the splitter to the right to make the TreeView wider, the slider that is located inside the footer of the grid moves to the right side if the FileExplorer and goes over the Preview panel. 
         With all of that said, I am wondering if this behavior of the slider can be changed so it will stay inside the FileExplorer and will not go over the Preview panel. Another question is if it's possible to hide the slider (make it invisible) when all the files are only on 1 page.

    4. Physical path in the FileManagers.
        I already figured this out. However, thank you for the info.

    I hope my explanations makes sense.

    Thank you again
  5. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 23 Sep 2010 Link to this post

    Hello,

    In reference to your questions:
    1. "Can the ImageManager window be resize?"
      I have attached a demo which shows how to achieve the desired result
    2. and 3. "Problems with the slider inside the FileManagers."
      Could you please, set the RadEditor's DialogsCssFile property to point to a file with the following content?
      #RAD_SPLITTER_PANE_CONTENT_RadFileExplorer1_paneGrid
      {
          position: relative;
      }



    Kind regards,
    Dobromir
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  6. DW Web Team Member
    DW Web Team Member avatar
    43 posts
    Member since:
    Jun 2012

    Posted 23 Sep 2010 Link to this post

    Hi Dobromir,

    Thank you for your response...

    1. The demo works and I am able to set up the window's behaviour and properties. However, I have another question to ask. The FileManager window is splited to 2 panels: FileManager and Preview/Properties. In your demo if I make the window wider, the size of the panels is not changed. And I am wondering if it's possible to make the panels' width to be adjustable as well.

    2. It works for me. Great!

    Looking forward to your response,

    Tatiana
  7. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 24 Sep 2010 Link to this post

    Hi,

    By design, RadEditor's dialogs have fixed size. It is possible to modify the size to be flexible. To do this you need to modify the built-in dialogs and to assign a CSS file to be loaded inside the window using the RadEditor's DialogsCssFile property with the following content:
    html, body, form
    {
        height:100%;   
    }
    #initializer
    {
        height: 100%;   
    }
    #dialogControl
    {
        height: 100%;
    }
    .reDialog.ManagerDialog.NoMarginDialog
    {
        height: 100%;   
    }
    #listRow
    {
        height: 100%;   
    }
    .imagePreviewer, .imagePreviewer table
    {
        height: 100%;   
        width: 100%;
        vertical-align: top;
    }
    .FileExplorerPlaceholder
    {
        height: 100%;   
    }

    Please let us know if this helps.

    Regards,
    Dobromir
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  8. Cameron
    Cameron avatar
    28 posts
    Member since:
    Oct 2011

    Posted 19 Oct 2011 Link to this post

    I am having a problem trying to resize the ImageManager, and DocumentManager of the RadEditor.
    Unlike Tatiana, my radeditor is generated as a user control so I am unable to add an eventhandler for the Page_PreRenderComplete event.

    Any suggestions?

    Thanks,
    Cameron
  9. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 21 Oct 2011 Link to this post

    Hi Cameron,

    You can try the following code:

    protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            this.Page.PreRenderComplete += new EventHandler(Page_PreRenderComplete);
        }
        void Page_PreRenderComplete(object sender, EventArgs e)
        {
            DialogDefinition imagePropertiesDialog = RadEditor1.GetDialogDefinition("ImageManager");
            imagePropertiesDialog.Height = Unit.Pixel(900);
            imagePropertiesDialog.Width = Unit.Pixel(900);
        }

    All the best,
    Rumen
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  10. Cameron
    Cameron avatar
    28 posts
    Member since:
    Oct 2011

    Posted 21 Oct 2011 Link to this post

    Hi Rumen,

    Thanks for your help.

    I have one more question.

    Although setting the size of the dialog is now a relatively easy thing, it doesn't always work as expected.
    And here's why:

    Here I set the height of the TableWizard dialog:
    In the Page_PreRenderComplete event:
    propertiesDialog = radeditor.GetDialogDefinition("TableWizard"); 
    propertiesDialog.Height = System.Web.UI.WebControls.Unit.Pixel(600);


    And here's the HTML of what is actually rendered:
    <div id="RadWindowWrapper_ctl00_ContentPlaceHolder1_ucMulti_reTest2_dialogOpenerTableWizard" class="RadWindow RadWindow_Office2007 rwNormalWindow rwTransparentWindow" style="width: 740px; height: 539px; visibility: visible; position: absolute; left: 400px; top: 300px; z-index: 3009; " unselectable="on">
    <table cellspacing="0" cellpadding="0" class="rwTable" style="height: 539px; "

    If I set the Height to be 650px, then it DOES actually render with the height being 650px. And then it's too big. 539px is too small, cutting off the Cancel and OK buttons.

    Suggestions?

    Thanks again,
    Cameron
  11. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 25 Oct 2011 Link to this post

    Hi Cameron,

    The provided code resizes just the RadWindow dialog but not the contents inside it which have fixed size. If you want to customize the appearance of the built-in dialog then you can see how to load the external dialog files in this live demo: Customize Built-in Dialogs.

    All the best,
    Rumen
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017