For the most part, I use the default TinyMCE plugins.
Every now and then, I make my own for my own specific needs.
To do so, I go to the tinymce directory, then the plugin directory, and then one of the individual plugin directories, and modify the script as necessary.
All is good except my memory (not my computer's but my head's). 4 months goes by, and I decide to upgrade to a newer version or something. Which ones did I change? I have no idea!
I would like to create my own directory called myTinyMCE_Plugins, and not even include it in the tinymce directory. That way I just need to remember to move my specific plugins over.
But when configuring TinyMCE, I can add the plugin name, but don't seem to be able to specify the plugin's path. Yes, I can use symbolic links, but this too is not ideal.
How can I locate TinyMCE plugins in a separate directory?
tinymce.init({
plugins: ["someDefaultPlugin someCustomPlugin"],
toolbar: "someDefaultPlugin | someCustomPlugin"
});
After asking the question, I found http://www.tinymce.com/wiki.php/Tutorials:Creating_a_plugin.
You can also have the plugin in any location you want by loading the plugin.js/plugin.min.js files directrly after the tinymce.js/tinymce.min.js.
Example of loading the plugin from another url
<script src="/tinymce/js/tinymce.min.js"></script>
<script src="/scripts/my.tinymce.plugin.js"></script>
<script>
tinymce.init({..});
</script>
Related
I am new to Magento but work in webdev for several years now.
My goal is to optimise an existing Magento installation in terms of speed.
Looking at all the JS and CSS files used within this installation the first thing I aim for is to combine those file or better reduce the number of modules used. I am aware of the "combine files" function within the config menu, but that does lead to conflicts between jQuery and prototype which is why I am trying to first get an understanding of what types of frameworks/modules etc are used.
This is a list of all JS-files required by the homepage of this installation:
jquery-1.12.3.min.js
prototype.js
ccard.js
validation.js
builder.js
effects.js
dragdrop.js
controls.js
slider.js
js.js
form.js
script.js
menu.js
translate.js
cookies.js
func.js
jquery.easing.1.3.min.js
efects.js
jquery-1.11.0.min.js
jquery-migrate-1.2.1.min.js
jquery.noconflict.js
swiper.min.js
jquery.easing.js
jquery.scrollTo.min.js
jquery.global.js
remodal.min.js
jquery.themepunch.tools.min.js
jquery.themepunch.revolution.min.js
easyzoom.js
ios-orientationchange-fix.js
jquery.swipebox.min.js
jquery.themepunch.plugins.min.js
jquery.themepunch.revolution.js
jquery.slider.js
jquery.selectbox.js
jquery.bxslider.min.js
jquery.tweet.js
cookieconsent.min.js
gtm.js?id=GTM-5W7V6F
analytics.js
ec.js
What would be the best approach to clean up this list in order to keep functionality while reducing request and load?
For starters i see that you load 2 versions of jQuery
jquery-1.12.3.min.js and jquery.easing.1.3.min.js
What i did was combine the javascript files with the config settings like you said and use the jQuery.noConflict() https://api.jquery.com/jquery.noconflict/. Don't use the $ (dollar) sign to use jQuery but write it fully because prototype also uses it and it creates problems sometimes. There will be some problems which you should try to fix. Sometimes it's just adding a ; to the end of the file or function.
I then tried to figure out what code was needed and what wasn't so i could remove some of it.
Magento Inbuilt provide this things
Login admin panel
goto System->configuration->Advanced->Developer->JavaScript Settings and set Merge JavaScript Files to yes
You can do same for css and you will see very few request in your web page
I want to add a additional parent level folder to CKFinder object.
Current setup:
On Create: /resource/events/0/
On Edit: /resource/events/{id}/
Wish On Edit:
{'/resource/events/{id}/', '/resource/events/0/', '/resource/shared/'}
The multiple folders solution will help in reducing the need to upload the same file on many events.
An ASP solution talks about adding the "ResourceTypes(3)" definition to add more sub-folders, but I am unable to find documentation on JavaScript API solution.
Unresolved Q&A:
http://ckeditor.com/forums/Support/Multiple-Images-folders
In an existing ExtJS 5.0 project, cannot change the original code. We are allowed to add code to an existing overrides/ directory.
I have an existing function generateTree in class Products.view.ProductsTreeViewController that I want to override.
The current function is in file PTVC.js under Useless/app/view/.
This is the code I'm using to override:
Ext.define('overrides.Products.view.ProductsTreeViewController', {
override :'Products.view.ProductsTreeViewController',
generateTree: function (data) {
if (this.isValid(data))
this.callOverridden(data);
else
this.callOverridden(this.getDefaultData());
}
};
First question, where should the code reside under overrides/? I've seen many different configurations suggested, e.g.
Everything in one file:
Useless/
overrides/
app.js
Same path as original file:
Useless/
overrides/
app/
view/
PTVC.js
Overridden class name:
Useless/
overrides/
Products/
view/
ProductsTreeViewController/
class.js
I've tried all of the above and many more approaches and confirmed through various means that the code does not get included!
So second question, how to make sure it is included?
The documentation makes it seem like it's so easy, which makes it all the more frustrating.
In the version I'm using there is no classpath variable in sencha.cfg, in any case I'd be changing an existing file, so likely can't do that, or add requires in Ext.application for the same reason.
So third question, in lieu of modifying existing files, is there a build command line switch I can use to specify an additional build directory?
I'm pulling my hair out trying to figure this out. Any advice, short of quitting my job, would be appreciated.
It's best to duplicate the directory structure, then you don't have to worry about file name collisions, but you can put the files anywhere under overrides/.
Are you running ExtJS 5.0.0? It has a regression bug whereby they forgot to include "overrides": "${app.dir}/overrides" in app.json. You can also modify a config file under .sencha but it's better to have it in app.json. You won't need requires. This is fixed in version 5.0.1.
Probably not, but it's a really small change to add that line in app.json and the only way to make overrides work in 5.0.0 (which I suspect you're using).
I have downloaded jquery and jquery ui files and i want to import them in my server as a "global library".
I want to add my files on the server so as to be globally visible and import them in any XPage.
( I dont want to reference them from the cdn with http, or add the files from my computer as a resource each time or add them only in a specific theme. )
For example: i could place the files in \domino\js\jQuery and \domino\js\jQueryUI or any other folder in the file system and then add them from any XPage from resources tab.
Can i do it somehow?
Can it be even better, for example:
not even add them as a resource and directly use the jquery code
add them as an osgi plugin
If OSGI plugin is an option then try to use the Bootstrap4XPages plugin. It contains jquery libs as well. Is that a Domino 9 server?
Copy the files to WebContent in package explorer.
Reference them in the headTag of the page... something like:
<xp:headTag tagName="script">
<xp:this.attributes>
<xp:parameter name="type" value="text/javascript" />
<xp:parameter name="src" value="jquery-1.11.1.min.js" />
</xp:this.attributes>
</xp:headTag>
Make sure resource aggregation is turned ON.
I am using the jQuery UI framework, but I'd like to modify the slider control to suit my needs. I only want to make changes in that one file. What is the best way to include those changes in my project? Currently I have it all wrapped up in jquery-ui-1.8.8.custom.min.js.
Options include:
Edit the minified source directly. Seems like a huge pain.
Download all the source files, put them in my /js directory, and add <script> tags for each one. Ugh.
Try to make the changes from outside the framework, using my own script. I'm not sure this would work.
Somehow use the one file I modify + the rest of the framework in the single minified file?
Download the entire framework, modify the file I want, then compress it into a single file. (But is then debugging/testing will require <script> tags for all the source files, right?) (How do I minify the code?)
If I were to be including <script> tags for every source file, could I only use the ones I'm interested in, and their explicitly stated dependencies? Or is this asking for trouble? (Update: Looks like this works.)
Other ideas? Is (4) possible? What is the best approach here?
Update: I see that the minified file is of the form:
/***
* UI Slider
*/
minifiedCode();
/***
* UI Autocomplete
*/
minifiedCode();
/***
* UI Spinner
*/
minifiedCode();
What if I comment out the Slider code, then include my own non-minified, altered Slider file? Can minified and non-minified code work together?
Depending on the changes - if you are overriding a method, you can put it in a separate js file and load that file after you load jQuery - it will override the method functionality.