I'm trying to add a custom button for umbraco richtext datatype, so i made a simple plugin for TinyMCE... But i cant seem to get it working, it shows up in the datatype, but not when i open the editor for some page...
//File: umbraco_client/tinymce3/plugins/addarrowheader/editor_plugin_src.js
//Same content in editor_plugin.js (just minified)
(function () {
tinymce.create('tinymce.plugins.mceAddArrowHeader', {
init: function (ed, url) {
ed.addCommand('addHeader', function () {
alert('hello!');
});
ed.addButton('addArrow', { title: 'DoAdd', image: '/images/editor/umbracoTextGen.gif', cmd: 'addHeader' });
},
getInfo: function () {
return {
longname: 'mceAddArrowHeader',
author: 'Bekker',
authorurl: 'Eksponent.com',
infourl: 'none',
version: tinymce.majorVersion + "." + tinymce.minorVersion
};
}
});
// Register plugin
tinymce.PluginManager.add('mceAddArrowHeader', tinymce.plugins.mceAddArrowHeader);
})();
Added following to tinyMceConfig.config (/config/ folder)
//in <commands>
<command>
<umbracoAlias>mceAddArrowHeader</umbracoAlias>
<icon>images/editor/spellchecker.gif</icon>
<tinyMceCommand value="" userInterface="true" frontendCommand="mceAddArrowHeader">addarrowheader</tinyMceCommand>
<priority>76</priority>
</command>
//In <plugins>
//just using spellchecker.gif for test purpose, no custom icon yet...
<plugin loadOnFrontend="false">addarrowheader</plugin>
It seemed to be a matter of wrong plugin folder naming...
Didnt know that it had an impact, but renaming the folder to same name as the plugin (mceAddArrowHeader) solved the problem.
Related
I just started modifying the electron-react-boilerplate project and tried doing the following:
In the App.tsx file I added a button:
const ping = () => {
electron.ipcRenderer.myAwesomePing('Hello world!');
};
const Hello = () => {
return (
<div>
...
<button type="button" onClick={() => ping()}>
Ping!
</button>
...
</div>
);
};
And in the preload.js file, I added the corresponding call for myAwesomePing:
contextBridge.exposeInMainWorld('electron', {
ipcRenderer: {
myAwesomePing(text) {
ipcRenderer.send('ipc-example', text);
},
When I run the code, everything seems to work fine and I receive the ping through the context-bridge on the main process.
But, visual studio code keeps complaining, that it
Cannot find name 'electron'. Did you mean 'Electron'?
inside App.tsx.
Is this because I am missing something or just a bug in vscode? Is there maybe a build step necessary to create the connection?
ERB recently added support for globally exposed variables via preload:
https://github.com/electron-react-boilerplate/electron-react-boilerplate/blob/main/src/renderer/preload.d.ts
Copy and paste the file into your project and it should just work.
I'm trying to render a component using react-testing-library in an Ionic React based project. There appears to be an issue with StatusBar. The error says StatusBar does not have web implementation.
My code looks something like this:
let component
beforeEach(() => {
component = render(
<ThemeProvider>
<IonReactRouter>
<IonRouterOutlet>
<Login />
</IonRouterOutlet>
</IonReactRouter>
</ThemeProvider>
)
})
describe('snapshot', () => {
it('should match snapshot', () => {
const { asFragment } = component
expect(asFragment()).toMatchSnapshot()
})
})
That's no error, that's the Capacitor Plugin not having the Web Implementation, you could just ignore that or catch it everywhere with .catch(()=>{});
Have you installed #capacitor/status-bar in /src-capacitor? (yarn add #capacitor/status-bar or npm install ....)
I have a javascript variable (var testButton) in my Nuxt plugins folder. I then added the file to my nuxt.config.js plugins. In my component, I have a Buefy button, and I'm trying to call the script:
<b-button #click="testButton">Click Me</b-button>
...
<script>
export default {
mounted () {
this.$testButton()
}
}
</script>
I import the script in my script section and have tried computed and mounted lifecycles. Not sure what I'm doing wrong. Thank you
Check the following things, you must be missing one or more:
1. Your plugin should export a method. That method should receive an 'inject' function and use it to register your 'testButton' function.
So, in your ~/plugins/testButton.js
export default (context, inject) => {
inject('testButton', () => {
console.log('testButton works!')
})
}
2. You shuold register your plugin correctly in the nuxt.conf.js file
Do it like so:
plugins: [
{ src: '~/plugins/testButton.js' },
],
3. Call it as '$testButton()' (note that Nuxt will have added a dollar sign to your method's name).
Your '$testButton' method will now be available from anywhere in your nuxt app. You don't have to import it o create any computed property.
<b-button #click="$testButton">Click Me</b-button>
<script>
export default {
}
</script>
i have created an aurelia plugin using the skelton-plugin https://github.com/aurelia/skeleton-plugin i am now looking at writing unit tests for it.
i am stuggling to get a unit test running for a custom element ive added to the project. i started with the 'testing a custom element' example from http://aurelia.io/hub.html#/doc/article/aurelia/testing/latest/testing-components/3
template:
<template>
<div class="firstName">${firstName}</div>
</template>
vm
import {bindable} from 'aurelia-framework';
export class MyComponent {
#bindable firstName;
}
i added this to the src folder.
my test code is
import {StageComponent} from 'aurelia-testing';
import {bootstrap} from 'aurelia-bootstrapper';
describe('MyComponent', () => {
let component;
beforeEach(() => {
component = StageComponent
.withResources('my-component')
.inView('<my-component first-name.bind="firstName"></my-component>')
.boundTo({ firstName: 'Bob' });
});
it('should render first name', done => {
component.create(bootstrap).then(() => {
const nameElement = document.querySelector('.firstName');
expect(nameElement.innerHTML).toBe('Bob');
done();
}).catch(e => { console.log(e.toString()) });
});
afterEach(() => {
component.dispose();
});
});
i jspm installed aurelia-bootstrapper and aurelia-testing to get it running.
im now getting the error
Error{stack: '(SystemJS) XHR error (404 Not Found) loading http://localhost:9876/base/my-component.js
so it looks like karma cant find my component. i checked the karma.config file and the jspm loadFiles: ['test/setup.js', 'test/unit/**/*.js'], looks correct.
has any one run into a similar issue?
solved the issue.
in karma.config.js file needed to change
serveFiles: ['src//.']
to
serveFiles: ['src//*.js', 'src/**/*.html']
I am using Liferay UI for popup window in Liferay 6.2. I am getting the pop up but i can not close it.Why it is not working Liferay 6.2.
Below is my code which is written on parent page:
AUI().ready(function(A) {
AUI().use('aui-dialog', 'aui-io', function(A) {
var url = '<%=testPopupURL.toString()%>';
Liferay.Util.openWindow(
{
dialog: {
cache: false,
width:800,
modal: true
},
id:'<portlet:namespace/>shahbaj',
uri: url
}
);
Liferay.provide(
window,
'<portlet:namespace />closePopup',
function(popupIdToClose) {
var A = AUI();
alert(popupIdToClose);
A.DialogManager.closeByChild('#' + popupIdToClose);
},
['aui-base','aui-dialog','aui-dialog-iframe']
);
});
});
Below code is pop-up page content:
<aui:button name="YES" value="YES" onClick="javascript:yes();"/>
<aui:script>
function yes(){
alert('pop');
Liferay.Util.getOpener().<portlet:namespace />closePopup('<portlet:namespace />shahbaj');
}
</aui:script>
Please help me out!!
Add a Cancel / Close button with following script in your jsp.
<input type="button" onclick="hidePopup();" value="Cancel" />
function hidePopup(){
AUI().ready('aui-dialog', function(A){
A.DialogManager.hideAll();
});
}
This worked!!
AUI().ready(function(A) {
AUI().use('aui-dialog', 'aui-io', function(A) {
var url = 'http://localhost/url';
Liferay.Util.openWindow(
{
dialog: {
cache: false,
width:800,
modal: true
},
id:'shahbaj',
uri: url
}
);
Liferay.provide(
window,
'closePopup',
function(popupIdToClose) {
var dialog = Liferay.Util.getWindow(popupIdToClose);
dialog.destroy(); // You can try toggle/hide whatever You want
},
['aui-base','aui-dialog','aui-dialog-iframe']
);
});
});
Simpler Solution
A much simpler solution is to use the close-panel class name.
<aui:button cssClass="close-panel" type="cancel" value="close" />
No additional JavaScript required.
I am working with Liferay 7.2 and I have used the next code in JavaScript:
Liferay.fire('closeWindow',{id:'idPopup'});
in your case idPopup = 'portlet:namespace/shahbaj'
Sorry I dont speak english very good