I am using spellchecker from Google in my web application. It was working great but for some reason Google has stopped or removed their service and now it's not working.
Here is the link for the SOAP API - https://developers.google.com/soap-search/?csw=1#1_3.
I tried with some other components like
http://www.jspell.com/tinymcespellchecker.html (it's require some intallation on the server and have some issues related to typing + some PHP code to execute)
http://jquery-spellchecker.badsyntax.co/tinymce.html (it's require some PHP code to execute and giving error "the method is not allowed with "POST")
Both aren't working well as expected.
I had also posted an question previously but don't get any reply there Tinymce: Spellchecker is not working.
Why don't you use the browser spellchecking?
There is not much you will need to do to make it work.
The browser needs to have a dictionary of your language installed (AddOn) and additionally you will need to set the attribute spellcheck of the editor body to true.
tinyMCE.init({
...
setup : function(ed) {
ed.onInit.add(function(ed, evt) { //since tinymce4 use ed.on('init', function(evt){...
ed.getBody().setAttribute('spellcheck', true);
});
}
});
This is far faster than a remote spellchecker approach (using something like Google spellchecker or an other aspell server).
The spellchecker plugin included in the 4.XX download WILL NOT WORK. That plugin relied on Google's spell checking API which has been permanently discontinued, disabled, removed. I too recommend using the browser-based spellchecker. After that you can remove all code for spellchecker.
tinymce.init({
selector: '.mceEditor',
browser_spellcheck: true,
contextmenu: false,
});
Following up on mcain66's post, I was able to rewrite the .Net handler to use Google's new API.
New dll and source code are here.
Note that I updated the target framework to 3.5 in order to use the JavaScriptSerializer. I can't imagine many people are using older versions of .Net at this point anyway.
The new API requires an API key, but the one in mcain66's post is the same one used by my version of Google toolbar, so it appears that every install of the toolbar uses the same key.
Anyway, I don't know if this is a great long-term solution since it's still an undocumented and unsupported API, but I'm hoping it gets us by until everyone is using IE10+ and can rely on native browser spell checking.
Ref: Post by dhammond member at TinyMCE
For anyone still struggling with the latest version (4). All I had to do was add the following to my init statement. Note the plugin method. I have it on the toolbar as well as it doesnt appear if its not working - good check!
tinymce.init({
selector: "textarea",
menubar: false,
plugins: "spellchecker",
toolbar: "cut copy paste pastetext undo redo spellchecker | link unlink hr | bold italic underline | bullist numlist outdent indent blockquote | alignleft aligncenter alignright alignjustify",
statusbar: false
});
Related
In Alfresco Share the Search page is implemented with Aikau.
I'm interested in the more general question, is it possible to Debug Aikau widgets?
I have founds some links on this matter, but they talk more about logging and not actual javascript debugging:
http://docs.alfresco.com/5.1/tasks/dev-extensions-share-tutorials-debugging.html
https://github.com/Alfresco/Aikau/blob/master/tutorial/chapters/Tutorial4.md
Suppose I have the following Aikau widget alfresco/search/AlfSearchResult and the following method inside it:
/**
* This function is called to create a
* [SearchResultPropertyLink]{#link module:alfresco/renderers/SearchResultPropertyLink} widget
* to render the displayName of the result. It can be overridden to replace the default widget
* with a reconfigured version.
*
* #instance
*/
createDisplayNameRenderer: function alfresco_search_AlfSearchResult__createDisplayNameRenderer() {
// jshint nonew:false
var config = {
id: this.id + "_DISPLAY_NAME",
currentItem: this.currentItem,
pubSubScope: this.pubSubScope,
propertyToRender: "displayName",
renderSize: "large",
newTabOnMiddleOrCtrlClick: this.newTabOnMiddleOrCtrlClick,
defaultNavigationTarget: this.navigationTarget
};
if (this.navigationTarget)
{
config.navigationTarget = this.navigationTarget;
}
new SearchResultPropertyLink(config, this.nameNode);
}
Is there any way I could insert a breakpoint and stop execution at the line where this.currentItem is used in order for me to evaluate it's properties?
Yes, there are several ways in which you can debug Aikau... the first thing to do is to make sure that you're running with "client-debug" mode enabled (either in Share or in your custom Aikau client).
For example, in Share you'd want to update the /WEB-INF/classes/alfresco/share-config.xml file to change:
<config>
<flags>
<client-debug>false</client-debug>
...to be...
<config>
<flags>
<client-debug>true</client-debug>
You'll need to restart Share for the changes to take effect. You'll see then that you have a "Debug Menu" item in the main header menu bar. If you open this you can enable logging by toggling "Debug Logging" and "Show All Logs" to be true.
This will result in logging output appearing in your browser developer tools console. You can also fine tune the logging output to only show errors or warning and to provide a RegEx expression to match certain logging output.
With client debug enabled the JavaScript source being loaded by the browser will be uncompressed. This will make it easier for you to add break points.
Because Surf aggregates all of the required module source code into a single resource (for performance and caching reasons) you will want to find the Aikau source file - the easiest way to do this is to use "CTRL-P" (in Chrome) to open a resource and type "surf" into the box that appears - this will always find the Aikau source code first.
Firebug for Firefox handles finding across resources better, so you can just used "CTRL-F" and then paste in the line you want to break on.
You can add breakpoints in this resource as you normally would and the browser will break on them.
As well as setting break points you can also use the DebugLog widget. This can be toggled from the "Debug Menu" and shows all the publications and subscriptions that are being made.
It is also possible to directly include and configure the alfresco/services/LoggingService and the alfresco/logging/DebugLog widgets in your page as you are developing. We take this approach for all our unit test pages. This can be a handy approach during development and they can be removed when you're finished developing.
This presentation although quite old, also contains some useful debugging tips (see slide 56 onwards).
Before 3.2, I can set the menu item type to "external link" and then set the link as
"javascript:myFunction()"
When clicked, the menu item will call the JavaScript function. But after I upgraded to 3.2, when I did the same thing and tried to save the menu item, it said "Save not permitted".
Did 3.2 block this usage? If yes, how do I get my JS function executed by a menu item?
I've came up this problem a while ago, in Joomla version 3.2.1 concerning a 'Skype' link, e.g.
skype:myloginname
This has to do with the protocol types that are allowed and are defined in this file:
/administrator/components/com_menus/controllers/item.php, line ~180.
There is an array that defines the acceptable schemes:
$scheme = array('http', 'https', 'ftp', 'ftps', 'gopher', 'mailto', 'news', 'prospero', 'telnet', 'rlogin', 'tn3270', 'wais', 'url', 'mid', 'cid', 'nntp', 'tel', 'urn', 'ldap', 'file', 'fax', 'modem', 'git');
When adding skype at the end of the list Joomla! allowed saving the external link. The same applies for javascript. In any case you should consider any security risk that comeswith this solution.
In addition, you should take into mind that this override may be discarded in any future update of joomla.
Technically speaking Joomla thinks that javascript is a protocol, like HTTP & Co., it looks it up inside a list of known protocols, it does not find it and it throws an error.
Start reading at around line inside [MenusControllerItem::save()][1]. So basically it has nothing to do with the fact you are trying to use some JavaScript, this is just a side-effect.
While using JavaScript in the External Link is not really an advertised feature but rather said a loophole, it does break b/c if you have used before.
You can:
Open an issue in the Joomla Issue Tracker and report this issue, get some community feedback. The fix is really easy, it just needs to get accepted.
Use the suggestion below:
Instead of link put #
Set the field "Link CSS Style" to something that does not colide with other classes, eg. my-function
Save
You can use jQuery to intercept the click event on the link and to make it run your function. See code below:
jQuery(document).ready(function($){
// Select element based on the class set in Joomla backend
$( ".my-function" ).on( "click", function(e) {
// Do not follow the link
e.preventDefault();
// Call function
myFunction(1);
});
});
function myFunction(x)
{
alert("I was called" + x);
}
Update: after a short discussion with the commiter of the change, I understood that it may be related to a security issue. So it may be on purpose after all not to allow js.
I'd like to change a link's href based on that: if Skype isn't installed, show a popup explaining what Skype is and how to install it, if it is installed, change the link to skype:my.contact.name?call so the click will start a call. Real estate issues means that I'd prefer to only have one link shown.
Unfortunately, browsers do not support such API and this cannot be done cross-browser compatible way. There is some kind of support, but it is buggy.
Javascript to detect Skype?
All browser plugins registering their mime-types in global array named mimeTypes, that can be accessed via navigator object navigator.mimeTypes.
So you can use this for check plugin active or not. If plugin installed and disabled — no any mime-type will be registred for that disabled plugin. If plugin installed and active — he has a mime-type record in navigator.mimeTypes
Some code implementation using jQuery:
jQuery.extend({checkPlugin: function(mimetype_substr) {
for (var i = 0; i < navigator.mimeTypes.length; i++) {
if (navigator.mimeTypes[i]['type'].toLowerCase().indexOf(mimetype_substr) >= 0) {
console.log("Gotcha! Here it is: "+navigator.mimeTypes[i]['type']);
return true;
}
}
return false;
}});
So this: $.checkPlugin("skype"); returns true if skype click2call plugin is installed and active. And false if there is no active plugin or plugin are not installed.
Actually need to search within another global array — navigator.plugins, but all active plugins have their records in navigator.mimeTypes, and this is a bit easier.
I am writing a Firefox extension and I am using their Add-on SDK; but I can't figure out how to inject a local CSS file from the data folder into the webpage. It would be great if there were a way to do it via page_mod package.
As of Add-on SDK 1.14 there's experimental (API may change) support for this in the page-mod module:
var pageMod = require("sdk/page-mod").PageMod({
include: "*",
contentStyleFile: require("sdk/self").data.url("my-style.css")
});
See Modifying Web Pages Based on URL for an elaborate guide to using page-mod.
There's a page on the Addon SDK's wiki discussing issues with the current implementation, although it seems a bit outdated.
Under the hood it uses nsIDOMWindowUtils.loadSheet() to add the stylesheet without touching the page's DOM. (This API was added in Firefox 18, see bug 737003. Before that you had to use nsIStyleSheetService which was similar, but not tab-specific.)
Before that you could use the page-mod's content script to insert the link or style element (example). [edit] thanks to lwburk's comment, here's a more elaborate elaborate description in Greasemonkey Hacks: Tips & Tools for Remixing the Web with Firefox By Mark Pilgrim: "Alter a Page's Style" section.
To insert CSS from main.js one can now use "page-mod":
var data = require("sdk/self").data;
var pageMod = require("sdk/page-mod");
pageMod.PageMod({
include: "*.org",
contentStyleFile: data.url("my-page-mod.css")
});
I was using CKEditor with no problems on my site then moved the site from one directory to another -- /vmgdev to /vmg. Everything is working OK except ckeditor, which doesn't appear. It seems that ckeditor is failing to load the autogrow plugin scripts, as it's still looking at the old path. Disabling autogrow fixes the problem and ckeditor appears again. In the head of a page that uses the editor I still have the following:
<script type="text/javascript">
<!--//--><![CDATA[//><!--
jQuery.extend(Drupal.settings, {
...
"loadPlugins": { "autogrow": { "name": "autogrow", "desc": "Autogrow plugin", "path": "/vmgdev/sites/all/modules/ckeditor/ckeditor/plugins/autogrow/", "default": "f" },
...;
//--><!]]>
</script>
How I can I fix the autogrow plugin path? In the form that allows me to change the ckeditor global profile the plugins path is set to %m/plugins and beneath this field it claims that %m is equal to %m - /vmg/sites/all/modules/ckeditor, but that's obviously not the path that's being used.
Thanks.
Remember to clear the cache on your Drupal server as well as the cache on your browser.
Since ckeditor relies on a lot of javascript, I've found that often the browser caches the javascript and doesn't show the changes you've made even if you've refreshed the Drupal cache.