More in this section

Forums / Developing with Sitefinity / Need help with RadEditor

Need help with RadEditor

2 posts, 1 answered
  1. Jome Akpoduado
    Jome Akpoduado avatar
    16 posts
    Registered:
    07 Jan 2010
    10 Feb 2010
    Link to this post
    Hello,
    I am trying to create a web control that would require multiple editors on the page. (First off, let me say I am very green when it comes to javascript). I dropped several radeditor controls on the page and I wanted to make use of the tools as shown in other modules and some investigation showed that the xml file is located ~/Sitefinity/admin/controltemplates/editortoolsfile.xml.
    I pointed my editors to this xml file and in running the application, I get a LibraryImageManager not implemented error. After some searches I see that I have to create some javascript to make the buttons work. This is perfect for one editor control.

    Since I have multiple editor controls on the page, do I have to paste scripts for each of the controls, changing this line,
    function InsertTextArea() {
                                        var editor = $find('<%=TeaserEditor.ClientID%>');
                                        editor.set_html('<textarea id="myTableToFind" style="overflow:hidden; height: 300px; width: 500px;" border="none"></textarea>');
                                    }
     .

    Is there an efficient way to make Librarymanagers on all controls work staright out of the box for not so good programmers like us?
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    12 Sep 2017
    10 Feb 2010
    Link to this post
    Hi Jome Akpoduado,

    You should add the script block below to each instance of RadEditor control you want to use together with Sitefinity's custom managers.

    <script type="text/javascript">
     
                  Telerik.Web.UI.Editor.CommandList["LibraryImageManager"] = function(commandName, editor, args)
                  {
                     var editorArgs = editor.getSelectedElement();
                     if (!editorArgs.nodeName || typeof(editorArgs.nodeName) == "undefined" || editorArgs.nodeName != "A")
                          editorArgs = editor.getSelection();
                      
                     var myCallbackFunction = function(sender, args)
                     {
                          if (typeof(editorArgs.nodeName) != "undefined" && editorArgs.nodeName == "IMG")
                              args.parentNode.replaceChild(editorArgs, args);
                          else
                          {
                              var cloned = args.cloneNode(true);
                              var div = args.ownerDocument.createElement("DIV");
                              div.appendChild(cloned);
                              editorArgs.pasteHtml(div.innerHTML);
                          }
                     }
                     editor.showExternalDialog(
                     '<%= ((Telerik.Cms.Web.CmsPageBase)Page).ResolveCmsUrl("~/Sitefinity/UserControls/Dialogs/ImageEditorDialog.aspx") %>',
                     editorArgs,
                     750,
                     600,
                     myCallbackFunction,
                     null,
                     'ImageLibraryDialog',
                     true,
                     Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,
                     false,
                     true)
                  };
     
                  Telerik.Web.UI.Editor.CommandList["LibraryDocumentManager"] = function(commandName, editor, args)
                  {
                     var editorArgs = editor.getSelectedElement();
                     if (!editorArgs.nodeName || typeof(editorArgs.nodeName) == "undefined" || editorArgs.nodeName != "A")
                          editorArgs = editor.getSelection();
                      
                     var myCallbackFunction = function(sender, args)
                     {
                          if (typeof(editorArgs.nodeName) != "undefined" && editorArgs.nodeName == "A")
                              args.parentNode.replaceChild(editorArgs, args);
                          else
                          {
                              var cloned = args.cloneNode(true);
                              var div = args.ownerDocument.createElement("DIV");
                              div.appendChild(cloned);
                              editorArgs.pasteHtml(div.innerHTML);
                          }
                     }
                     editor.showExternalDialog(
                     '<%= ((Telerik.Cms.Web.CmsPageBase)Page).ResolveCmsUrl("~/Sitefinity/UserControls/Dialogs/DocumentEditorDialog.aspx") %>',
                     editorArgs,
                     750,
                     600,
                     myCallbackFunction,
                     null,
                     'ImageLibraryDialog',
                     false,
                     Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,
                     false,
                     true)
                  };
     
                  Telerik.Web.UI.Editor.CommandList["LinkManager"] = function(commandName, editor, args)
                  {
                     var editorArgs = editor.getSelectedElement();
                     if (!editorArgs.nodeName || typeof(editorArgs.nodeName) == "undefined" || editorArgs.nodeName != "A")
                     {                                                                  
                          var sel = editor.getSelection(); 
                          editorArgs = sel;
                          editorArgs.Html = sel.getHtml();
                          editorArgs.Text = sel.getText();                                   
                     }
                      
                     var myCallbackFunction = function(sender, args)
                     {
                          if (typeof(editorArgs.nodeName) != "undefined" && editorArgs.nodeName == "A")
                              args.parentNode.replaceChild(editorArgs, args);
                          else
                          {
                              var cloned = args.cloneNode(true);
                              var div = args.ownerDocument.createElement("DIV");
                              div.appendChild(cloned);
                              editorArgs.pasteHtml(div.innerHTML);
                          }
                     }
                     editor.showExternalDialog(
                     '<%= ((Telerik.Cms.Web.CmsPageBase)Page).ResolveCmsUrl("~/Sitefinity/UserControls/Dialogs/LinksDialog.aspx") %>',
                     editorArgs,
                     750,
                     600,
                     myCallbackFunction,
                     null,
                     'ImageLibraryDialog',
                     false,
                     Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,
                     false,
                     true)
                  };
     
                  Telerik.Web.UI.Editor.CommandList["SetLinkProperties"] = function(commandName, editor, args)
                  {
                     var editorArgs = editor.getSelectedElement();
                     if (!editorArgs.nodeName || typeof(editorArgs.nodeName) == "undefined" || editorArgs.nodeName != "A")
                          editorArgs = editor.getSelection();
                      
                     var myCallbackFunction = function(sender, args)
                     {
                          if (typeof(editorArgs.nodeName) != "undefined" && editorArgs.nodeName == "A")
                              args.parentNode.replaceChild(editorArgs, args);
                          else
                          {
                              var cloned = args.cloneNode(true);
                              var div = args.ownerDocument.createElement("DIV");
                              div.appendChild(cloned);
                              editorArgs.pasteHtml(div.innerHTML);
                          }
                     }
                     editor.showExternalDialog(
                     '<%= ((Telerik.Cms.Web.CmsPageBase)Page).ResolveCmsUrl("~/Sitefinity/UserControls/Dialogs/LinksDialog.aspx") %>',
                     editorArgs,
                     750,
                     600,
                     myCallbackFunction,
                     null,
                     'ImageLibraryDialog',
                     false,
                     Telerik.Web.UI.WindowBehaviors.Close + Telerik.Web.UI.WindowBehaviors.Move,
                     false,
                     true)
                  };
                  var oldFunction = Telerik.Web.UI.Editor.CommandList["ToggleScreenMode"]; //save the original Paste function
     
                  Telerik.Web.UI.Editor.CommandList["ToggleScreenMode"] = function(commandName, editor, args)
                  {
                      oldFunction(commandName, editor, args);
                      var bd = document.getElementsByTagName("body")[0];
                       
                      if(/fullScreenMode/.test(bd.className)) {
                          var rep = bd.className.match(' '+'fullScreenMode')?' '+'fullScreenMode':'fullScreenMode';
                          bd.className=bd.className.replace(rep,'');
     
                      } else {
                          bd.className += bd.className?' '+'fullScreenMode':'fullScreenMode';
                      }
                  };
                   
                  // automated tests helper function
                  function InsertTextArea()
                  {
                      var editor = $find('<%=Editor.ClientID%>');
                      editor.set_html('<textarea id="myTableToFind" style="overflow:hidden; height: 300px; width: 500px;" border="none"></textarea>');
                  }
                   
                  </script>


    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.
    Answered
2 posts, 1 answered