Support/Comments for TinymceWrapper

5,888 Posts

Bruno17 Reply #51, 8 years, 8 months ago

Are you talking about a normal richtext-TV or about a richtext-field within MIGX?

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

1,145 Posts

donshakespeare Reply #52, 8 years, 8 months ago

I think

elements: "tv[[+tv_id]]",

is left alone, but you will have to wait for Bruno on that one.

Has the official MIGX been updated to include that code that is referenced on Github?

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

☆ A M B ☆
721 Posts

rx2 Reply #53, 8 years, 8 months ago

Quote from: Bruno17 at Sep 16, 2015, 06:43 PM

Are you talking about a normal richtext-TV or about a richtext-field within MIGX?

A normal richtext-tv that is rendered in a MIGX template.

MODX Version: 2.4.0-pl
MIGX Version: 2.9.4
TinymceWrapper Version: 2.1.1.beta1

Template variable is called services.

TV: services
Input Type: migx
Form Tabs:

[
{"caption":"CTAs", "fields": [
{"field":"faicon","caption":"Icon","inputTV":"faicon"}, 
{"field":"heading","caption":"Heading","inputTV":"heading"},
{"field":"richcopy","caption":"Copy","inputTV":"richcopy"},
{"field":"link","caption":"Link","inputTV":"link"},
{"field":"urltarget","caption":"Link Target","inputTV":"urltarget"}
]}
]

Grid Columns:

[
{"header": "Icon", "width": "500", "sortable": "false", "dataIndex": "faicon"},
{"header": "Heading", "width": "500", "sortable": "false", "dataIndex": "heading"},
{"header": "Copy", "width": "500", "sortable": "false", "dataIndex": "richcopy"},
{"header": "Link", "width": "500", "sortable": "false", "dataIndex": "link"},
{"header": "Target", "width": "500", "sortable": "false", "dataIndex": "urltarget"}
]

TV: richcopy
Input Type: richtext

MIGX Code:

    [[!getImageList? 
        &tvname=`services`
        &tpl=`servicesTPL`
        &docid=`[[++services_id]]`
        &limit=`[[#[[++global_page_id]].tv.ctacolumns:is=`3`:then=`4`:else=`3`]]`
        &placeholdersKeyField=`idx`
    ]]

MIGX Template Code for: servicesTPL

<div class="col-md-[[#[[++global_page_id]].tv.ctacolumns]]">
    <span class="fa-stack fa-4x">
        [[+link:notempty=`<a href="[[~[[+link]]]]" target="[[+urltarget]]">`]]<i class="fa fa-circle fa-stack-2x text-primary"></i>
        <i class="fa fa-[[+faicon]] fa-stack-1x fa-inverse"></i>[[+link:notempty=`</a>`]]
    </span>
    <h4 class="service-heading">[[+link:notempty=`<a href="[[~[[+link]]]]" target="[[+urltarget]]">`]][[+heading]][[+link:notempty=`</a>`]]</h4>
    <p class="text-muted">
        [[+richcopy]]    
    </p>
</div>

The richcopy field in the MIGX dialog box when you click Add Item or edit an existing one does not give you TinyMCE.

1,145 Posts

donshakespeare Reply #54, 8 years, 7 months ago

I am not much familiar with MIGX, but it should be dead easy to load TinyMCE in any instance of MIGX' richtextTV

@Bruno
Questions...
1. Is there a specific html markup id/class or pattern that differentiates richtext from other input fields?
2. Do MIGX richtext have unique parents?

3. Apart from when this rich textarea is created on the fly, is there another use-case scenario where richtextTVs are used? ( I am thinking kinds of CMP)

Once I am clear on these questions, I can add a jQuery-based solution for MIGX richtext

@rx2
For now test this: open your resource in, say, Chrome.
In JS console paste this and hit return key

$(document).on("mouseenter", "div[id^=modx-window-mi-grid]", function() {
  tinymce.init({
    selector: "textarea[id^=tvinp_]",
    setup: function(editor) {
      editor.on('mouseleave', function(evt) { //sync MIGX textarea with TinyMCE 
        tinyMCE.activeEditor.save();
      });
    }
  })
})

If the above works for you, it is a temporary fix you can add to the TinymceWrapper plugin until further notice... of course you will need some more TinyMCE customization.

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

5,888 Posts

Bruno17 Reply #55, 8 years, 7 months ago

the changes/additions to get tinymceWrapper work withing MIGX are not in the official 2.9.4 - version of the Repo

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

5,888 Posts

Bruno17 Reply #56, 8 years, 7 months ago

you will need this
https://github.com/Bruno17/MIGX/commit/a8785612d687ec74d893c493090fb8a5a417c069
and this:
https://github.com/Bruno17/MIGX/commit/19d4063e1aded630f610b17a0be1b816a2b54281

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

1,145 Posts

donshakespeare Reply #57, 8 years, 7 months ago

Does this affect all textareas, rich and non rich?

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

5,888 Posts

Bruno17 Reply #58, 8 years, 7 months ago

only fields, which are defined as richtext

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

1,145 Posts

donshakespeare Reply #59, 8 years, 7 months ago

I have been testing MIGX, is there a way to tell which is richtext by looking at the HTML source code?
Something like a class="migx-richtetxt", then I could use TinymceWrapper to play some wonders with MIGX

<textarea id="tvinp_245_1_2"
name="tvinp_245_1_2"
rows="15"
class="x-form-textarea x-form-field migx-richtetxt" ...//this would be awesome
...

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

5,888 Posts

Bruno17 Reply #60, 8 years, 7 months ago

https://github.com/Bruno17/MIGX/commit/29bb3905f4858af144857c6019dea0e4957ffed4#diff-524ae1706d30e649f20ecbf9f1c34f01R2

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!