Radeditor fullscreen bug when placed in raddock

8 posts, 0 answers
  1. Amir
    Amir avatar
    12 posts
    Member since:
    Nov 2007

    Posted 21 Aug 2011 Link to this post

    Problem:
    I have right to left page and an editor in a dock. when i toggle fullscreen mode it dont work corrent.
    i take a screencast from the problem
    http://www.screencast.com/users/AmirMirkamali/folders/Jing/media/965bd81f-a4d1-45c1-a4b5-3c398539d95c

    also some part of toolbars hide behind the page. such as toggle full screen and i cant return to normal screen (I know the shortcut is F11 but many users does not)

  2. Rumen
    Admin
    Rumen avatar
    12846 posts

    Posted 24 Aug 2011 Link to this post

    Hello Amir,

    You can remove some of the unimportant toolbar buttons so that the Toggle FullScreen Mode buttons appears in full screen mode. You can see how to do that in the following article: Removing Toolbar Buttons.

    Another approach is to choose another ToolbarMode such as Floating, PageTop or ShowOnFocus and see whether the issue will persist.

    Best regards,
    Rumen
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Amir
    Amir avatar
    12 posts
    Member since:
    Nov 2007

    Posted 25 Aug 2011 Link to this post

    1. I think you didnt understand the problem, the problem is the editor is not full screen when you click the full screen button!!! you can see in the movie then it strech only from right side! this is the main problem (the gray area is my internet explorer screen)
    2. If somebody need all tools what he/she can do ?
  5. Rumen
    Admin
    Rumen avatar
    12846 posts

    Posted 25 Aug 2011 Link to this post

    Hello Amir,

    I was unable to reproduce the reported problem using the following configuration:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
     
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="Sc1" runat="server">
        </asp:ScriptManager>
        <telerik:RadDock ID="RadDock" runat="server" Width="700">
            <ContentTemplate>
                <telerik:RadEditor ID="RadEditor1" runat="server">
                </telerik:RadEditor>
            </ContentTemplate>
        </telerik:RadDock>
        </form>
    </body>
    </html>

    For your scenario my suggestion is to open a second hidden editor when the first editor goes to full screen mode. The second hidden editor should be placed outside of the Dock element and will become visible and in full screen mode when the Toggle Full Screen mode button of the editor in the dock is clicked. You can use the code of this KB article as a base to proceed:  Different Set Of Tools When Switching To Full Screen Mode.

    Regards,
    Rumen
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  6. Amir
    Amir avatar
    12 posts
    Member since:
    Nov 2007

    Posted 28 Aug 2011 Link to this post

    Here is sample of problem



    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head runat="server">
    <title></title>
    </head>
    <body style="direction: rtl;">
    <form id="form1" runat="server">
    <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">
    </telerik:RadStyleSheetManager>
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
    <div style="width: 700px; margin-left: auto; margin-right:auto;">
    <telerik:RadDockZone ID="rdzContent" runat="server" Width="100%">
    <telerik:RadDock ID="rdContent" runat="server" Width="100%" EnableDrag="false" Collapsed="False"
    DefaultCommands="ExpandCollapse" EnableAnimation="True">
    <ContentTemplate>
    <telerik:RadEditor ID="reRichTextBox" runat="server" NewLineMode="P" NewLineBr="False"
    Width="100%">
    </telerik:RadEditor>
    </ContentTemplate>
    </telerik:RadDock>
    </telerik:RadDockZone>
    </div>
    </form>
    </body>
    </html>
  7. Rumen
    Admin
    Rumen avatar
    12846 posts

    Posted 30 Aug 2011 Link to this post

    Hi Amir,

    Please, try the following solution for your RTL scenario:
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head id="Head1" runat="server">
        <title></title>
    </head>
    <body style="direction: rtl;">
        <form id="form1" runat="server">
        <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">
        </telerik:RadStyleSheetManager>
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <div style="width: 700px; margin-left: auto; margin-right: auto;">
            <telerik:RadDockZone dir="rtl" ID="rdzContent" runat="server" Width="100%">
                <telerik:RadDock ID="rdContent" runat="server" Width="100%" EnableDrag="false" Collapsed="False"
                    DefaultCommands="ExpandCollapse" EnableAnimation="True">
                    <ContentTemplate>
                        <div id="editorContainer1">
                            <telerik:RadEditor runat="server" ID="RadEditor1" NewLineMode="P" NewLineBr="False"
                                OnClientCommandExecuting="OnClientCommandExecuting1" Width="100%">
                            </telerik:RadEditor>
                        </div>
                    </ContentTemplate>
                </telerik:RadDock>
            </telerik:RadDockZone>
        </div>
        <div id="editorContainer2" style="display: none;">
            <telerik:RadEditor runat="server" ID="RadEditor2" OnClientCommandExecuting="OnClientCommandExecuting2">
            </telerik:RadEditor>
        </div>
        <script type="text/javascript">
            var div1 = document.getElementById("editorContainer1");
            var div2 = document.getElementById("editorContainer2");
            var editor1 = null;
            var editor2 = null;
            var toHide = false;
            var content;
     
            function pageLoad() {
                editor1 = $find("<%=RadEditor1.ClientID%>"); //get a reference to RadEditor client object 
                editor2 = $find("<%=RadEditor2.ClientID%>");
            }
     
     
            function OnClientCommandExecuting1(editor, args) {
                var commandName = args.get_commandName();
                if (commandName == "ToggleScreenMode" && toHide == false) {
     
                    div1.style.display = "none";
                    div2.style.display = "";
     
                    editor2.fire("ToggleScreenMode");
                    toHide = true;
                    content = editor1.get_html(true);
                    editor2.set_html(content);
                    args.set_cancel(true);
     
                }
            }
            function OnClientCommandExecuting2(editor, args) {
                var commandName = args.get_commandName();
                if (commandName == "ToggleScreenMode") {
                    if (toHide == true) {
                        div2.style.display = "none";
                        div1.style.display = "";
                        content = editor2.get_html(true);
                        editor1.set_html(content);
                        toHide = false;
                    }
     
     
     
                }
            
        </script>
        </form>
    </body>
    </html>


    Regards,
    Rumen
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  8. Amir
    Amir avatar
    12 posts
    Member since:
    Nov 2007

    Posted 30 Aug 2011 Link to this post

    Hi, thanks for reply.

    I saw this solution before, but do you think this is a wise solution?
    sorry but this is only a temporary solution and not an expert solution.
    This is a bug! and the editor must feet all screen even when i put it in a rtl page and raddock. This is a bug in calculating top and left of screen in rtl page or something like that. Didnt it? 

    My editor placed in user control because i want to add changes to editor from one place in all project and use this user control when i want edtior. My masterpages can uploaded by user thus I cant put another editor outside of raddock. Another problem is all my cms component placed in raddock and user controls that have editor always placed in raddock.

    Thank you for reply but I understood that there is no way to solve this problem in normal way and i decided to focus on writing this function (fullscreen mode) by myself and bypass built in function.
    I will put the solution here when i wrote it.

    Sincerely Yours
    Amir Mirkamali
  9. Rumen
    Admin
    Rumen avatar
    12846 posts

    Posted 31 Aug 2011 Link to this post

    Hello Amir,

    This is not a bug. The fullscreen mode is calculating the position of the page from the top left corner and this works correctly in LTR mode. That is why I provided a solution with two editors in your other forum post.

    We will gladly award your work if you implement a better solution and share it with the community.

    Kind regards,
    Rumen
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017