I am currently writing a replacement for the plone dialog infrastructure. Mostly for personal use and fun, but available on github as collective.js.jqueryuidialog.
Currently I'm struggling to manage the initialization for the tinyMCE editor in the dialogs.
I tried to get the missing scripts with getScript, but then I get stuck. I googled and found some init hooks, like this one
$(document).bind('loadInsideOverlay', function() {
$('textarea.mce_editable').each(function() {
var config = new TinyMCEConfig($(this).attr('id'));
config.init();
});
});
but none worked.
Any ideas or recommendations to read further?
Update
I updated Products.TinyMCE to version 1.3.3 and proceeded through the upgrade steps in the ZMI. All other functionality is still working (Yeehaa).
I realized, that the call seems to have changed, since all pages with a tinyMCE on it, now issue a get command to a view named tiny_mce_gzp.js that seems to deliver the actual configured editor from the portal.
Actually I am digging the source to find that call and copy it's behavior.
Related
I am having a problem using the "Tabs" component: https://material-ui.com/components/tabs/ In fact, when developing locally, the rendering of the component is fine. But pushing to the server, it looks weird (with differences in the borders on each side of the bar).
Moreover: when refreshing the page in which it has been embedded or browsing manually to this page, the whole template is broken all of a sudden!
I tried generating a build folder locally and launching the page from that build, and fell back on the same problem.
Thank you in advance for your help
From your description, I saw that your "build" is not work even in local development. That's mean it should not work on the production, of course.
The thing is, what is your actual "build" action? Depends on what library/framework you use, but basically with Material-UI, most popular problem comes from not load some CSS before using it's components.
Please read here first: https://material-ui.com/guides/server-rendering/#server-rendering
Just in case you use Gatsby, read here: https://www.gatsbyjs.org/packages/gatsby-plugin-material-ui/.
I'm using Gatsby and use this following config to fix some CSS issues.
stylesProvider: {
injectFirst: true,
}
Hope this help.
I am just beginning to look into Ember.js engines. One thing that stands out is that for every change I make in the engine code I need to re-install it into the host application. There is no live reload, rebuild or any of this.
Is there a way to smooth out this flow as it would slow down development considerably.
The trick is to set isDevelopingAddon like so in the index.js file for the addon and use NPM link to get it into the main application node_packages folder - you will then get live reload, etc-:
// Addon index.js
isDevelopingAddon: function() {
return true;
}
To add to this I found an interesting article here: Ember and Yarn Workspaces
I've created a fresh install of Moodle 2.5. I installed successfully, I thought. I have not customized the theme, so it can NOT be theme-based.
TinyMCE's file picker is not loading...whether trying to upload a file or creating/editing a course under the Course summary files section...all I get is the "Loader" star. I did some research and found no solutions that worked. Quite a few said "custom themes," but I have no custom themes yet. Now, in checking the console, I got this:
- Uncaught SyntaxError: Unexpected Identifier /lib/editor/tinymce/tinymce/3.5.8/tiny_mce.js:2
- Uncaught ReferenceError: tinymce is not defined module.js:1
- Uncaught ReferenceError: tinyMCE is not defined yui_combo.php?moodle/1374671241/editor_tinymce/collapse/collapse-min.js:1
Digging further, I found the error on tiny_mce.js with the "uncaught syntax error" is around this area (I beautified the JavaScript for better readability and it ended up on line 3344):
pi: function(h, i) {
if (i) {
c.push("")
} else {
c.push("")
}
if (a) {
c.push("\n")
}
}
I also have no clue why the page is not seeing TinyMCE as defined.
In my browsing of multiple sites, one person mentioned being able to open the file picker in Moodle 2.5 when logged in as a regular non-Moodle user. They, too, have no answer to the problem, but I tried that and the file picker did, indeed, open.
Update
I've found it's not quite just the file picker. This whole thing is tying in to TinyMCE not loading properly...with the editing toolbar capability (whether collapsed or not.) It acts as if it's a simple text editor.
I fought with it and ended up causing more problems than solutions, so I uninstalled everything, and started from scratch. I have no plugin add-ons, no fancy themes (it's the basic one it installs with), and no customization, and it's still buggy.
The console continues to say:
- Uncaught SyntaxError: Unexpected Identifier /lib/editor/tinymce/tinymce/3.5.8/tiny_mce.js:2
- Uncaught ReferenceError: tinymce is not defined module.js:1
- Uncaught ReferenceError: tinyMCE is not defined yui_combo.php?
And it pauses the debugger on practically every page with this. It's telling me that there's a problem with how TinyMCE is called in.
I've submitted a bug report, but haven't gotten the answer yet. What I'm hoping for is someone else to have had the same problem and come up with the solution, remembering there is no theme customization, no add-ons...so they can't be at fault.
As a matter of fact I also banged to this issue after upgrading to Moodle 2.5.1+, and after digging it for hours came up with a solution that made things work smooth again, I have disabled Cache JavaScript from:
Home / ► Site administration / ► Appearance / ► AJAX and Javascript
After saving the settings the file picker started working as normal. I am not sure how bad this will affect overall moodle performance and how bad it will increase the load on server and website loading overhead, but at the moment that was the only solution that I came up with.
Hope this will help...
version 2.5.1+
The FilePicker doesn't load when editing is turned on.
If you have this issue where the FilePicker hangs while loading, click on the following:
Administration | Course Administration | Turn editing off
Then refresh the page with the FilePicker that you need to use.
I'm putting this as an answer, because I received one, and I want everyone who ends up with a similar problem to know the way to solve it.
The problem was with the admin user profile settings. The Moodle team responded, and told me what to do.
It's as simple as:
Change the admin's user profile and set not to use html editor by default.
Purge all caches both in moodle and in your browser.
Make sure that in "Site administration ► Development ► Debugging" you have "debug messages = developers" and "display debug = yes"
Thanks!
Folks,
My company needs to support the following workflow:
- There's rich content getting created in Google Docs (with simple formatting - bold/italic, as well as hyperlinks)
- That content is then pasted into an internal CMS that uses TinyMCE.
Problem: all formatting gets lost when pasting stuff in.
Already tried the "paste from Word" plugin - it doesn't work.
Please advise. Thank you!
UPDATE:
I narrowed the problem down to Google Chrome. Firefox works just fine. I also used the paste_pre_processing() callbacks - the data gets corrupted before getting in there.
I ended up giving up on the Paste plugin into TinyMCE. Instead, I used the undocumented valid_styles property of TinyMCE. This solved the problem fine for my scenario. Here's the config snippet we ended up using:
valid_elements: "a[href|title|target],del,b,strong,del,i,blockquote,p,br,em,ul,li,ol,span[style]",
valid_styles : { '*' : 'font-weight,font-style,text-decoration' },
I know this question was asked a long time ago however I am making an application that requires a copy and paste from google drive into tiny mce. This is actually fairly simple with the free paste plugin. Simply remove the filters so that it can copy in all of the data.
tinymce.init({
selector: 'textarea',
plugins: "paste",
paste_data_images: true,
paste_enable_default_filters: false,
paste_remove_styles_if_webkit: false
});
Your problem is a somewhat complex issue.
First you need to make sure that tinymce does not remove tags and tag-attributes that it recognises as invalid (have a closer look at the tinymce configuration options valid_elements and valid_children).
Second you will have to implement an own handling of the paste process.
There are three way to do this. The most time consuming option is to write an own custom paste plugin and replace the given one. The other options are ways to configure the paste plugins and define own functions to interact with and change the pasted content.
The seetings paste_pre_processing and paste_post_processing are the way to go here.
I am currently debugging my apps so they can run with the KBX extension. KBX extension runs the last deployed version so everytime I change some code in the appbuilder I need to redeploy to see the changes. Could the Kynetx team give us a modified KBX extension that uses the last saved version instead?
We do have plans to make the KBX more developer friendly, but in the meantime, there are a few tricks.
We recommend spending most of your development time testing with bookmarklets, as these give you greater control over when your actions fire, allowing easier inspection between the state of the page before and after your rules fire. Applications can be tested with bookmarklets with no change to the code, and are easy to use.
This does not help debugging in the rare case that your application behaves differently while running in the KBX, but it should get you past most troubles you are currently experiencing.
Here is a solution for Chrome and Firefox: a modified KBX extension that targets the latest version of apps: http://blog.lolo.asia/technology/kynetx/2011/04/16/debugging-with-kbx-extension-how-to-avoid-having-to-deploy-at-every-code-modification/
In short, I replaced :
KOBJ.add_config_and_run({‘rids’:response.apps});
with :
//patch run_latest_app_version_in_kbx
var run_latest_app_version_in_kbx= true;
var run_msg_json={‘rids’:response.apps};
if (run_latest_app_version_in_kbx===true){
for (var i=0;i<response.apps.length;i++){
run_msg_json[response.apps[i]+’:kynetx_app_version’]=’dev’;
}
}
KOBJ.add_config_and_run(run_msg_json);
//
in page_interaction/pages.js inside the Chrome extension and
in resources/jid0-njkmo4quo4rc8p9kcuemahnyiku-kynetxforfirefox-data/page_interaction.js inside the Firefox extension