Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

Radeditor fullscreen bug when placed in raddock

7 Answers 160 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Amir
Top achievements
Rank 2
Amir asked on 21 Aug 2011, 10:59 AM
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)

7 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 24 Aug 2011, 04:13 PM
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 >>

0
Amir
Top achievements
Rank 2
answered on 25 Aug 2011, 09:01 AM
  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 ?
0
Rumen
Telerik team
answered on 25 Aug 2011, 09:13 AM
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 >>

0
Amir
Top achievements
Rank 2
answered on 29 Aug 2011, 04:39 AM
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>
0
Rumen
Telerik team
answered on 30 Aug 2011, 10:26 AM
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 >>

0
Amir
Top achievements
Rank 2
answered on 30 Aug 2011, 02:07 PM
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
0
Rumen
Telerik team
answered on 31 Aug 2011, 01:04 PM
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 >>

Tags
Editor
Asked by
Amir
Top achievements
Rank 2
Answers by
Rumen
Telerik team
Amir
Top achievements
Rank 2
Share this question
or