by Ange Tuteur May 9th 2014, 1:06 am
Hi BlackScorpion,
I have written up a quick draft, you can find it below.
Modules > Javascript codes management > create a new script
Title : Your choice
Placement : In the topics, or in all pages
Paste the code below and save :
- Code:
$(window).load(function() {
var settings = {
image : 'http://i56.servimg.com/u/f56/18/21/60/73/icon10.png', // button image
upload : 'http://photobucket.com/upload', // iframe upload url
height : '250px', // iframe height
width : '500px' // iframe width
};
$('.sceditor-button-servimg').after('<a class="sceditor-button sceditor-button-pb"><div style="background-image:url(' + settings.image + ')"></div></a>');
$('body').append('<div id="pb_container" class="sceditor-dropdown" style="display:none;"></div>');
$('.sceditor-button-pb').click(function() {
var X = $('.sceditor-button-pb').offset().left;
var Y = $('.sceditor-button-pb').offset().top + 25;
if (!document.getElementById('pb_frame') && $('#pb_container').css('display') == 'none') $('#pb_container').show().css('left',X + 'px').css('top',Y + 'px').append('<iframe id="pb_frame" style="border:none;height:' + settings.height + ';width:' + settings.width + ';" src="' + settings.upload + '"></iframe>');
else if ($('#pb_container').css('display') == 'none') $('#pb_container').show().css('left',X + 'px').css('top',Y + 'px');
else $('#pb_container').hide();
});
$('.sceditor-button:not(.sceditor-button-pb), .sceditor-container textarea, .sceditor-container iframe').click(function() { $('#pb_container').hide() });
$('.sceditor-container iframe').contents().mousedown(function() { $('#pb_container').hide() });
$('.sceditor-button-source').click(function() { $('.sceditor-button-pb').removeClass('disabled') });
});
There are some settings at the top which let you customize it :
- Code:
var settings = {
image : 'http://i56.servimg.com/u/f56/18/21/60/73/icon10.png', // button image
upload : 'http://photobucket.com/upload', // iframe upload url
height : '250px', // iframe height
width : '500px' // iframe width
};
They're marked with comments so they should be self explanatory, just make sure that your content is always between the single quotes to prevent bugs.
Ooh if you want to hide the old upload button, just add this to your Stylesheet :
- Code:
.sceditor-button-servimg { display:none !important; }