In Editor - Image manager : How to hide preview and properties window ?

7 posts, 0 answers
  1. systems
    systems avatar
    70 posts
    Member since:
    Dec 2013

    Posted 08 Oct 2015 Link to this post

    Hello,

    In our web application, we have RadEditor with Image manager and in our case we do not want to show the preview and properties in the image manager window. 

    We tried with the CSS but it does not work.  So, can you please suggest the proper way  to hide only the preview and properties in the image manager window of RadEditor.

    PFA. 

    Thanks,
    Vivek.​

  2. systems
    systems avatar
    70 posts
    Member since:
    Dec 2013

    Posted 12 Oct 2015 Link to this post

    Any workaround pls? your thoughts are appreciable on this topic.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Vessy
    Admin
    Vessy avatar
    1384 posts

    Posted 12 Oct 2015 Link to this post

    Hello,

    You can control the visibility of the different parts of RadEditor Dialogs by enabling the external dialogs of the control and applying the desired modifications in them. For example, you can make the following modification in the ImageManager dialog:
    <tr>
        <td>
            <telerik:RadMultiPage ID="imageMultiPage" runat="server">
                <telerik:RadPageView ID="previewPage" runat="server" >
                    <table cellpadding="0" cellspacing="0" width="100%">
                        <tr>
                            <td>
                                <div id="selectedFileName" class="selectedFileName">
                                     </div>
                            </td>
                        </tr>
                        <tr>
                            <td valign="middle">
                                <div id="CleanImageContainer" style="position: absolute; width: 0; height: 0px;
                                    overflow: hidden;">
                                </div>
                                <div id="ImagePreviewer" class="imagePreview noImage">
                                     </div>
                            </td>
                        </tr>
                    </table>
                </telerik:RadPageView>
                <telerik:RadPageView ID="propertiesPage" runat="server" Selected="true">
                    <dc:SetImagePropertiesDialog id="ImageProperties" runat="server" StandAlone="false">
                    </dc:SetImagePropertiesDialog>
                </telerik:RadPageView>
            </telerik:RadMultiPage>
        </td>
    </tr>
    <tr>
        <td>
            <telerik:RadTabStrip ID="imageTabStrip" Width="100%" runat="server" Orientation="HorizontalBottom" ShowBaseLine="true"
                MultiPageID="imageMultiPage">
                <Tabs>
                    <telerik:RadTab Text="Preview" Value="Preview" Visible="false" />
                    <telerik:RadTab Text="Properties" Value="Properties" Selected="true" />
                </Tabs>
            </telerik:RadTabStrip>
        </td>
    </tr>


    Regards,
    Vessy
    Telerik
    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 Feedback Portal and vote to affect the priority of the items
  5. systems
    systems avatar
    70 posts
    Member since:
    Dec 2013

    Posted 12 Oct 2015 in reply to Vessy Link to this post

    Thank you Vessy for your reply,

    Is there any hack/workaround to disable the properties window without enabling the external dialog? i.e. We wish to refer the embebed dialog only. 

    Thanks,

    Chetan

  6. Vessy
    Admin
    Vessy avatar
    1384 posts

    Posted 13 Oct 2015 Link to this post

    Hi Chetan,

    In order to get reference to the ImageManager dialog content window you have to attach handler to the dialog's pageLoad event and execute the target logic in it. For example you can have similar implementation:
    <telerik:RadEditor ID="RadEditor1" runat="server" OnClientCommandExecuted="onClientCommandExecuted">
        <ImageManager ViewPaths="~/Images" DeletePaths="~/Images" UploadPaths="~/Images" />
    </telerik:RadEditor>
    <script>
        function onClientCommandExecuted(sender, args) {
            if (args.get_commandName() == "ImageManager") {
                var dialog = sender.get_dialogOpener()._dialogContainers["ImageManager"]
                dialog.add_pageLoad(hidePreviewWindow);
            }
        }
        function hidePreviewWindow(dialog) {
            var oDoc = dialog.get_contentFrame().contentDocument;
            var window = dialog.get_contentFrame().contentWindow;
            var tab = window.$find("imageTabStrip").get_tabs().toArray()[0];
            var pageView = window.$find("imageMultiPage");
            pageView.set_selectedIndex(1)
     
            if (tab.get_text() == "Preview") {
                tab.hide();
            }
        }
    </script>

    Please note that this is only a sample prepared for demonstration purposes but not a fully tested solution, so you can feel free to change it in order to fit your scenario the best.

    Regards,
    Vessy
    Telerik
    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 Feedback Portal and vote to affect the priority of the items
  7. systems
    systems avatar
    70 posts
    Member since:
    Dec 2013

    Posted 15 Oct 2015 in reply to Vessy Link to this post

    Thank you so much Vessy.

    It works in our case.

  8. Vessy
    Admin
    Vessy avatar
    1384 posts

    Posted 19 Oct 2015 Link to this post

    Hi,

    You are welcome, Chetan -  I am glad the suggested solution served its purposes.

    Regards,
    Vessy
    Telerik
    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 Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017