Develop Reference

Adding description in Fancybox

I have this fancybox code -->
jsfiddle: http://jsfiddle.net/uZCC6/5192/
CSS:
.hidden {
display: none;
}
JQUERY:
$('.fancybox').fancybox({
prevEffect : 'fade',
nextEffect : 'fade',
closeBtn : true,
arrows : true,
nextClick : true,
helpers : {
thumbs : {
width : 50,
height : 50
}
}
});
I'm trying to add a description to the image popping out using this method provided by JFK Adding a title to fancy box.
<img width="304" height="350" alt="Winged back chair and ottoman" src="images/Gallery/tn/wing-back-chair.jpg">
$(document).ready(function() {
$(".fancybox").fancybox({
helpers : {
title : { type : 'inside' }
}, // helpers
beforeLoad: function() {
this.title = $(this.element).attr('caption');
}
}); // fancybox
}); // ready
However when i try to implement his code, the thumbnails are disappearing, any help on the correct method of applying his answer?

Magnific-popup with Google InfoBox and titleSrc

With this code below I can not get, below the image popup, the title !
I do not know what i'm doing wrong !!!
If I remove 'titleSrc : 'data-title'' everything works fine ;))
window.google.maps.event.addListener(infobox, "domready", function () {
$('.pop').on('click', function () {
$.magnificPopup.open({
items : {
src : $(this).data('lg'),
},
type : 'image',
image : {
titleSrc : 'data-title' // My data-title in the A HREF
}
});
});
});
Thanks for your help
UPDATED
window.google.maps.event.addListener(infobox, "domready", function () {
$('.pop').on('click', function () {
$.magnificPopup.open({
items : {
src : $(this).data('lg')
},
type : 'image',
image : {
titleSrc : $(this).data('title')
}
});
});
});
Even if I put titleSrc : 'TEST'

how to access function in Json

I am able to access the onclick properties function for the printButton property at the end of the block. Although I am unable to initiate the onclick functions under the exportButton property.I have the following code.
B.exporting = {
type : "image/png",
url : "http://export.highcharts.com/",
width : 800,
enableImages : false,
buttons : {
exportButton : {
symbol : "exportIcon",
x : -10,
symbolFill : "#A8BF77",
hoverSymbolFill : "#768F3E",
_titleKey : "exportButtonTitle",
menuItems : [{
textKey : "downloadPNG",
onclick : function() {
this.exportChart()
}
}, {
textKey : "downloadJPEG",
**onclick : function() {
this.exportChart({
type : "image/jpeg"
})**
}
}, {
textKey : "downloadPDF",
onclick : function() {
this.exportChart({
type : "application/pdf"
})
}
}, {
textKey : "downloadSVG",
onclick : function() {
this.exportChart({
type : "image/svg+xml"
})
}
}
}]
},
printButton : {
symbol : "printIcon",
x : -36,
symbolFill : "#B5C9DF",
hoverSymbolFill : "#779ABF",
_titleKey : "printButtonTitle",
onclick : function() {
this.print()
}
}
}
};
I am binding keyboard controls to the click events using the jquery plugin this is what I used to print. This Works!:
Mousetrap.bind('ctrl+s', function(e) { B.exporting.buttons.printButton.onclick(this.print());
});
This code is what I tried to access an individual onclick function under the exportButton property in the json above
Mousetrap.bind('*', function(e) {B.exporting.buttons.exportButton.menuItems[0].onclick;});
The result i get is the value but i want to run the function as the onclick property does.Does anyone know how to run a function under a json property?I Appreciate any help here thanks folks.

Mousetrap.bind('click', B.exporting.buttons.exportButton.menuItems[0].onclick);
Your ctrl-s binding also looks wrong, it should be:
Mousetrap.bind('ctrl+s', B.exporting.buttons.printButton.onclick);
The printButton.onclick function doesn't take an argument. Your binding calls this.print before calling the printButton.onclick function, and then the printButton.onclick function
does it again.

TinyMCE: Text Counter not working on readonly toggle

I have TinyMCE on my website which works fine.
Recently I added the functionality of readonly toggle.
For the readonly toggle I added a field "mytext_readonly".
TinyMCE is initialized in readonly mode, and stays in readonly if the value in "mytext_readonly" is 'readonly', otherwise it becomes editable.
The functionality is working as I want it, except the textcounter isn't working.
The problem is onKeyUp event is not working.
Text counter works if I click on B I U etc on the toolbar(means onExecCommand is working)
I want to know why onKeyUp is not working? And what shall I do to make it work?
tinyMCE.init({
mode : "exact",
elements : "mytext",
debug : false,
nowrap : false,
cleanup_on_startup : true,
fix_nesting : true,
force_br_newlines : true,
force_p_newlines : false,
gecko_spellcheck : true,
forced_root_block : '' ,
readonly : true,
setupcontent_callback : "myCustomSetupContent",
plugins : "preview",
plugins : "AtD,preview",
atd_button_url : "/tinymce-new/jscripts/tiny_mce/plugins/atd-tinymce/atdbuttontr.gif",
atd_css_url : "/tinymce-new/jscripts/tiny_mce/plugins/atd-tinymce/css/content.css",
tab_focus : ':next',
theme : "advanced",
theme_advanced_buttons1_add : "AtD",
theme_advanced_buttons1 : "bold,italic,separator, justifyfull,bullist,numlist,|,charmap,|,undo,redo,|",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
/* the URL of proxy file */
atd_rpc_url : "/common-scripts/tinymce-new/jscripts/tiny_mce/plugins/atd-tinymce/server/proxy.php?url=",
/* set your API key */
atd_rpc_id : "flinstone",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
valid_elements : ""
+"p,"
+"br,"
+"i/em,"
+"ul,"
+"li,"
+"ol,"
+"b/strong,"
+"marquee,"
+"sub,"
+"sup,"
+"table[border|width|height|align],"
+"tr[rowspan|width|height|align|valign],"
+"th,"
+"td[colspan|rowspan|width|height|align|valign]",
setup : function(ed) {
ed.onKeyUp.add(function(ed) {
textCounter('mytext','Charcount',4000);
});
ed.onExecCommand.add(function(ed) {
textCounter('mytext','Charcount',4000);
});
}
});
function myCustomSetupContent(editor_id, body, doc) {
var desc = document.getElementById('item_description').value;
desc = unescape(desc);
if (desc)
{
desc = desc.replace(/''/ig,"'");
desc = desc.replace(/&/ig,'&');
tinyMCE.get('mytext').setContent(desc);
}
textCounter('mytext','Charcount',4000);
if (document.getElementById('mytext_readonly') && document.getElementById('mytext_readonly').value == 'readonly') {
//do nothing
}
else
tinyMCE.get('mytext').getBody().setAttribute('contenteditable', true);
}

CKEditor Plugin - OK Button Permission Error

Hi i have created the following ckeditor plugin to insert a youtube video:
(function() {
CKEDITOR.plugins.add('youtube', {
requires : ['iframedialog'],
init : function(editor) {
var iframeWindow = null;
CKEDITOR.dialog.add('youtube_dialog', function() {
return {
title : 'YouTube Movie Properties',
minWidth : 550,
minHeight : 200,
contents : [{
id : 'iframe',
label : 'Insert YouTube Movie',
expand : true,
elements : [{
type : 'iframe',
src : me.path + 'dialogs/youtube.html',
width : '100%',
height : '100%',
onContentLoad : function() {
iframeWindow = document.getElementById(this._.frameId).contentWindow;
}
}]
}],
onOk : function() {
this._.editor.insertHtml('<cke:youtube url="' + iframeWindow.document.getElementById('url').value + '">YouTube Video Place Marker</cke:youtube>');
}
};
});
editor.addCommand('youtube', new CKEDITOR.dialogCommand('youtube_dialog'));
editor.ui.addButton('YouTube', {
label : 'Insert YouTube Movie',
command : 'youtube',
icon : this.path + 'images/icon.gif'
});
}
});
})();
This was working fine but i recently moved my ckeditor files to a CDN. Now when i click the "OK" button i get a permission error. I was looking at the source of the existing plugins to get an idea of how they work but whatever i have tried doesn't seem to work. To get something basic working I tried changing my okOk event to:
onOk : function() {
var hr = new CKEDITOR.dom.element('hr', editor.document );
editor.insertElement(hr);
}
But this gave me a null reference exception.
I'd really appreciate it if someone could show me what i am doing wrong. Thanks

Problem fixed! The solution is to change:
CKEDITOR.dialog.add('youtube_dialog', function()
to:
CKEDITOR.dialog.add('youtube_dialog', function(editor)
and change:
this._.editor
to:
editor
Hope this helps.