Hybrid View

  1. #1
    Sencha User
    Join Date
    Jun 2008
    Posts
    288
    Vote Rating
    16
    Qtx will become famous soon enough

      2  

    Default Ext.ux.form.TinyMCETextArea - a text area with integrated TinyMCE WYSIWYG Editor.

    Ext.ux.form.TinyMCETextArea - a text area with integrated TinyMCE WYSIWYG Editor.


    Ext.ux.form.TinyMCETextArea

    ExtJS form field - a text area with integrated TinyMCE WYSIWYG Editor.

    Version: 2.7
    Release date: 13.12.2013
    ExtJS Version: 4.2.1
    TinyMCE Version: 3.5.10
    License: Sencha, LGPL v2.1 or later

    Subscribe to this topic to get informed about updates!

    The integration is done by deriving from the Ext.form.field.TextArea.

    Following issues are covered:
    • Initialization in an initially visible and in an initially invisible tab.
    • Correct place occupation by the initialization in any ExtJS layout.
    • Correct resizing by the resizing of the underlying text area.
    • Activation and deactivation of the WYSIWYG editor. Keeping of the cursor position by switching to the HTML text modus.
    • Enabling and disabling of the WYSIWYG editor control.
    • ReadOnly state support.
    • Changing of WYSIWYG settings and CSS file for the editable contents on the fly.
    • Pre-formatting of the HTML text in visible and invisible modus.
    • Focusing of the WYSIWYG editor control.
    • Marking invalid.
    • Tracking dirty state.
    • Skin "extjs" and the native ExtJS windows for the editor inline popups.
    • Storing and restoring cursor position by inserting of a place holder over a popup window.
    View Example

    Download Sources and Demo

    Implementation Details and Reference

    GitHub Project

    Have a lot of fun!

    Attention!


    The beta version of the TinyMCETextArea for the TimyMCE 4th generation is released. If you want to try out your application with the new TinyMCE editor, you can download the new version from

    http://www.point-constructor.com/en/tinyta4/

    and test directly under the following link:

    http://www.point-constructor.com/tinyta_demo4/

    GitHub Project
    Last edited by Qtx; 16 Dec 2013 at 12:54 PM. Reason: Latest versions of the Editor and ExtJS are used

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,651
    Vote Rating
    402
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Thank you for the contribution. You may also wish to add it to the Market Place:
    http://market.sencha.com/

    Regards,
    Scott.

  3. #3
    Sencha User
    Join Date
    Aug 2008
    Posts
    49
    Vote Rating
    7
    TonySteele is on a distinguished road

      0  

    Default


    With 4.1 there is a bug and Text and TextArea do not resize. For the editor to work you need to do an override for TextArea as described :

    http://www.sencha.com/forum/showthre...tom-form-field

    This is a major bug, god knows why they are taking so long to fix it. Its wasted 3 hours of my time before I found this ticket, I wonder how many hours in total have been spent on this problem.

    Nice component, by the way.

    Tony

  4. #4
    Sencha User
    Join Date
    Jun 2008
    Posts
    288
    Vote Rating
    16
    Qtx will become famous soon enough

      0  

    Default


    Hi Tony,

    thank you for the feedback. I faced this problem while creation of the component with the release candidates of the 4.1. But, when the final release came out, I noticed that the resize event is fired and I was very glad.

    At least, my example should work in all browsers. Maybe, the resize event in 4.1 is fired not in all cases or not in all layouts, or in other words, the bug is not fixed completely.

    Due to the link you have give this bug is fixed, however if someone finds the case where the resize event not working, please let me to know, I will try to find the workaround for this case.

  5. #5
    Sencha User
    Join Date
    Aug 2008
    Posts
    49
    Vote Rating
    7
    TonySteele is on a distinguished road

      0  

    Default


    Puzzled why I need to call tinymce.triggerSave() before getting the value,is there some reason you did not call this in your getValue method.

    Also is it possible to have multiple editors on a page?

  6. #6
    Sencha User
    Join Date
    Jun 2008
    Posts
    288
    Vote Rating
    16
    Qtx will become famous soon enough

      0  

    Default


    1) triggerSave

    The reason is the support of the HTML text modus, that is, the WYSIWYG is not visible, the text is entered directly into the text area. For some reason, when you typing into the text area, the method getValue is called every time you type a character. If I would call ed.save() , it overwrites the newly typed texts with that from the WYSIWYG.

    If you do not need the HTML text modus, you can override the method getValue() like this

    TinyMCETextArea.js
    Code:
      getValue: function() {
        var me = this;
        
        if(me.wysiwygIntialized)
        {
          var ed = tinymce.get(me.getInputId());
          if(ed) ed.save();
        }
        
        return me.callParent(arguments);
      },
    Interesting, that this component for ExtJS 3 also requires the call of the triggerSave().

    http://www.sencha.com/forum/showthread.php?24787-Updated-Ext.ux.TinyMCE-TinyMCE-form-field-(v0.7b1)

    Actually, I waited long time for the update to the version 4, but then decided to create my own.

    2) Also is it possible to have multiple editors on a page?

    Yes, there are no restrictions, and each editor may have own specific configuration. The demo example has two editors.

  7. #7
    Sencha Premium Member
    Join Date
    May 2010
    Location
    Guatemala, Central America
    Posts
    1,190
    Vote Rating
    76
    ssamayoa is a jewel in the rough ssamayoa is a jewel in the rough ssamayoa is a jewel in the rough ssamayoa is a jewel in the rough

      0  

    Default


    Quote Originally Posted by TonySteele View Post
    With 4.1 there is a bug and Text and TextArea do not resize. For the editor to work you need to do an override for TextArea as described
    This bug still in 4.1.1?

    I have the TinyMCETextArea inside a form in center region of ViewPort but sometimes when I shrink west or east area the TinyMCETextArea's editor just disappears. Note that TinyMCETextArea's tool bar stills in place.

    I'm using TinyMCETextArea's 1.9

    Regards.
    UI: Sencha Architect 3.x / ExtJS 4 MVC
    Server side: EJB 3.1 / CDI / JPA 2 / JAX-RS / JasperReports
    Application Server: Glassfish 3.1.x
    Databases: Oracle 10g & 11g / DB2 9 & 10 / Firebird 2.5

    If you like my answer please vote!

  8. #8
    Sencha User
    Join Date
    Jun 2008
    Posts
    288
    Vote Rating
    16
    Qtx will become famous soon enough

      0  

    Default


    ssamayoa,

    could you provide a test.html - simple example which demonstrates the problem? I can then debug the issue and try to fix.

  9. #9
    Sencha User
    Join Date
    Jun 2008
    Posts
    288
    Vote Rating
    16
    Qtx will become famous soon enough

      0  

    Default


    New version 2.0

    Fixed bug with the full screen mode.

    Note:

    The full screen mode works as follows. A clone of the active editor is created and placed over all other elements with a very high z-index.

    In order to enable the correct z-order of the popup windows in the full screen mode, the z-index of editor clone is decreased due to the current value of the ZIndexManger, so that subsequent popup windows are shown over the full screen editor clone.

    Another important action is to assign the TinyMCETextAreaWindowManager to the editor clone instead of the standard one.

    All these actions are done on the event “onExecCommand” if the command “mceFullScreen” has been fired.

  10. #10
    Sencha Premium Member
    Join Date
    May 2010
    Location
    Guatemala, Central America
    Posts
    1,190
    Vote Rating
    76
    ssamayoa is a jewel in the rough ssamayoa is a jewel in the rough ssamayoa is a jewel in the rough ssamayoa is a jewel in the rough

      0  

    Default


    Quote Originally Posted by Qtx View Post
    ssamayoa,

    could you provide a test.html - simple example which demonstrates the problem? I can then debug the issue and try to fix.
    Sorry for not answering before.

    I will upgrade to 2.0 then if I get the same problem I will prepare a test case.

    Regards.
    UI: Sencha Architect 3.x / ExtJS 4 MVC
    Server side: EJB 3.1 / CDI / JPA 2 / JAX-RS / JasperReports
    Application Server: Glassfish 3.1.x
    Databases: Oracle 10g & 11g / DB2 9 & 10 / Firebird 2.5

    If you like my answer please vote!

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar