Move statistics module next to the design mode buttons

11 posts, 0 answers
  1. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 22 Jul 2010 Link to this post

    Such as in the examples in your help files: http://www.telerik.com/help/aspnet-ajax/images/DesignMode.png
  2. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 27 Jul 2010 Link to this post

    Hi Matthew,

    By design, RadEditor for ASP.NET AJAX has a preset positions for its system modules and does not provide built-in functionality to change their positions. Nevertheless, you can achieve the required outcome using the following JavaScript code:
    <telerik:RadEditor ID="RadEditor1" runat="server" OnClientLoad="OnClientLoad">
    </telerik:RadEditor>
     
    <script type="text/javascript">
        function OnClientLoad(editor, args)
        {
            setTimeout(function ()
            {
                var moduleContainer = $telerik.$("#<%= RadEditor1.ClientID %>Bottom > .reModule")[0];//get reference to the Statistic Module container
                moduleContainer.parentNode.removeChild(moduleContainer);//remove the element from its current position
     
                var newContainer = $telerik.$(".reEditorModesCell")[0];//get reference to the Modes container
                newContainer.appendChild(moduleContainer);//place the Statistic Module container
            }, 0);
        }
    </script>

    Please note that this is considered as a hack and might not work with future versions of RadControls for ASP.NET AJAX. 

    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 09 Feb 2011 Link to this post

    This works pretty well except for one thing... when the editor is first loaded it still has the extra space at the bottom.  As soon as the user resizes, the extra disappears and it looks great.  How can I fix this?
  5. Rumen
    Admin
    Rumen avatar
    12848 posts

    Posted 14 Feb 2011 Link to this post

    Hi Mattew,

    I tried to reproduce the problem using the provided by Dobromir code, but without success. You can see my test at http://screencast.com/t/donZyNqRwKM. The bottom part of the editor placed under the content area are actually the DOM Inspector and Properties modules. Am I missing something? Can you please help us to reproduce the problem?

    Best regards,
    Rumen
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  6. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 14 Feb 2011 Link to this post

    Look at your video, the editor has 100px of extra grey space underneath it that isn't being used!  It does not look acceptable.

    I have DOM inspector and all other modules disabled.
  7. Rumen
    Admin
    Rumen avatar
    12848 posts

    Posted 14 Feb 2011 Link to this post

    Hi Matthew,

    As explained in my earlier post this space is reserved for the RadEditor's modules. You can see how to hide them in the following help article: Disable or Hide Modules.

    Best wishes,
    Rumen
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  8. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 14 Feb 2011 Link to this post

    As explained in my earlier post I've already done that.  Here is the XML file I'm using for it:

    <modules
        <module name="RadEditorStatistics" enabled="true" visible="true" /> 
        <module name="RadEditorDomInspector" dockingZone="Module" enabled="false" visible="false"  /> 
        <module name="RadEditorNodeInspector" dockingZone="Module" enabled="false" visible="false" /> 
        <module name="RadEditorDiagnostics" dockingZone="Module" enabled="false" visible="false" /> 
        <module name="RadEditorHtmlInspector" dockingZone="Module" enabled="false" visible="false"  /> 
    </modules>

    Here are some screenshots showing exactly what I am seeing on my end.  The "extra_space.jpg" shows what it looks like when the page is first rendered.

    The "fixed.jpg" shows what it looks after after I resize it or click on the highlighted corner.  This screenshot is what I'd like it to look like when it is first rendered.

    Thanks.
  9. Rumen
    Admin
    Rumen avatar
    12848 posts

    Posted 14 Feb 2011 Link to this post

    Hi,

    Thank you for the detail that you use a toolsfile.

    I was able to solve the problem by setting
    dockingzone="bottom"
    in the following tag

    <module name="RadEditorStatistics" dockingzone="bottom" enabled="true" visible="true" />

    You can see my test at: http://screencast.com/t/oEIFuJcVmD.

    Best regards,
    Rumen
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  10. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 14 Feb 2011 Link to this post

    Your video is exactly what I want to do - it looks great.  However, I made that change on my project and it did not resolve it.  I downloaded and ran your project but it gave a Javascript error: Microsoft JScript runtime error: 'parentNode' is null or not an object.

    Basically when I run your project, in the rendered page I don't have any element that matches #RadEditor1Bottom > .reResizeCell.  Any ideas?

    I'm running v 2010.3.1317.40
  11. Rumen
    Admin
    Rumen avatar
    12848 posts

    Posted 17 Feb 2011 Link to this post

    Hi,

    I deployed my project once again and I was able to run and test it without problem in VS2010. Can you please test the project on another machine?

    You can also try to get a reference to the module using:

    var moduleContainer = $telerik.$("#" + editor.get_id() + "Bottom > .reModule")[0];

    Please, also make sure that the EnableResize property is not set to false.

    If you unable to achieve your scenario, isolate the problem in a simple working project and send it for examination via a support ticket.

    Kind regards,
    Rumen
    the Telerik team
  12. msigman
    msigman avatar
    141 posts
    Member since:
    Apr 2008

    Posted 22 Feb 2011 Link to this post

    Just to follow up on this for anyone in a similar situation: The issue was that they were running their example in "IE 7.0 Standards mode," so the XML file parsing was not being enforced as case sensitive.  When switching to the default IE 8.0 Standards mode, they were able to reproduce the issue I described.

    The problem was actually just due to a small typo in the originally suggested fix, it should have been like this:

    <module name="RadEditorStatistics" dockingzone="Bottom" enabled="true" visible="true" />

    Note the capital "B" in "Bottom."  Thanks for your persistence with this issue, Rumen!
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017