私はしばらくこれで遊んでいます。
私はあなたが言うようにJavaScriptのウィザードではありません笑...
とにかく、正しく動作しながらコードを準拠させようとしています。
私はそれを準拠させることができますが、スクリプトは機能しなくなります。
とにかく、ここにコードスニペットがあります:
(function() {
'use strict';
tinymce.create('tinymce.plugins.Shortcodes', {
init : function(ed, url) {
},
createControl : function(n, cm) {
if(n=='Shortcodes'){
var msb = cm.createListBox('Shortcodes', {
title : 'Shortcodes',
onselect : function(p) {
if(p == 'Accordions'){
content = "[accordion_wrap]<br>[accordions title=\"Title Goes Here\"]This is where some content goes...[/accordions]<br>[accordions title=\"Title Goes Here\"]This is where some content goes...[/accordions]<br>[accordions title=\"Title Goes Here\"]This is where some content goes...[/accordions]<br>[/accordion_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Accordions With Icons'){
content = "[accordion_wrap]<br>[accordions accordionicon=\"icon-globe\" title=\"Title Goes Here\"]This is where some content goes...[/accordions]<br>[accordions accordionicon=\"icon-globe\" title=\"Title Goes Here\"]This is where some content goes...[/accordions]<br>[accordions accordionicon=\"icon-globe\" title=\"Title Goes Here\"]This is where some content goes...[/accordions]<br>[/accordion_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Toggles'){
content = "[toggle_wrap]<br>[toggles title=\"Title Goes Here\"]This is where some content goes...[/toggles]<br>[toggles title=\"Title Goes Here\"]This is where some content goes...[/toggles]<br>[toggles title=\"Title Goes Here\"]This is where some content goes...[/toggles]<br>[/toggle_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Tabs'){
content = "[tab_wrap]<br>[tab title=\"Title Goes Here\"]This is where some content goes...[/tab]<br>[tab title=\"Title Goes Here\"]This is where some content goes...[/tab]<br>[tab title=\"Title Goes Here\"]This is where some content goes...[/tab]<br>[/tab_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Tabs With Icons'){
content = "[tab_wrap]<br>[tab icon=\"icon-globe\" title=\"Title Goes Here\"]This is where some content goes...[/tab]<br>[tab icon=\"icon-globe\" title=\"Title Goes Here\"]This is where some content goes...[/tab]<br>[tab icon=\"icon-globe\" title=\"Title Goes Here\"]This is where some content goes...[/tab]<br>[/tab_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Latest Portfolio Items'){
var portfoliohowmany = prompt("How many?", 4);
content = '[latest_portfolio howmany="'+portfoliohowmany+'"]';
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Testimonial Slider'){
content = "[testimonial_wrap]<br>[testimonial name=\"Testimonial Name Here\" company=\"Testimonial Company Name\" testimonial=\"Testimonial goes here\"]Image Goes Here...[/testimonial]<br>[testimonial name=\"Testimonial Name Here\" company=\"Testimonial Company Name\" testimonial=\"Testimonial goes here\"]Image Goes Here...[/testimonial]<br>[testimonial name=\"Testimonial Name Here\" company=\"Testimonial Company Name\" testimonial=\"Testimonial goes here\"]Image Goes Here...[/testimonial]<br>[/testimonial_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Pricing Tables Wrapper'){
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
content = '[pricingtable_wrap]'+selected+'[/pricingtable_wrap]';
}else{
content = '[pricingtable_wrap][/pricingtable_wrap]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Pricing Tables'){
var sellingcolumns = prompt("How Many Columns (Choices are: 3 or 4)", 3);
var sellingtitle = prompt("Package", "");
var sellingprice = prompt("Price", "$29");
var sellingunderprice = prompt("Pre Month/Per Year", "Per Month");
var sellingbuttonname = prompt("Buttons Name", "More Info");
var sellingbuttonurl = prompt("Buttons Url", "#");
var sellingbuttoncolor = prompt("Button Colour... (Your Choices are: green, blue, lightblue, orange, red, black)", "green");
var sellingfeatured = prompt("Make This Featured (Type yes to make it featured)", "no");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[pricing_table columns="'+sellingcolumns+'" title="'+sellingtitle+'" price="'+sellingprice+'" underprice="'+sellingunderprice+'" buttonname="'+sellingbuttonname+'" buttonurl="'+sellingbuttonurl+'" buttoncolor="'+sellingbuttoncolor+'" featured="'+sellingfeatured+'"]'+selected+'[/pricing_table]';
}else{
content = '[pricing_table columns="'+sellingcolumns+'" title="'+sellingtitle+'" price="'+sellingprice+'" underprice="'+sellingunderprice+'" buttonname="'+sellingbuttonname+'" buttonurl="'+sellingbuttonurl+'" buttoncolor="'+sellingbuttoncolor+'" featured="'+sellingfeatured+'"][/pricing_table]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Team Member'){
var teamhowmany = prompt("How Many In A Row: (Choices: 3,4)", 3);
var teamname = prompt("Team Members Name", "");
var teamposition = prompt("Team Members Company Position (Example: Web Developer)", "");
var teamcontent = prompt("Very Small Paragraph About Team Member", "");
var teamtwitter = prompt("Twitter Url (Including http://) ... Leave blank to not show", "");
var teamdribbble = prompt("Dribbble Url (Including http://) ... Leave blank to not show", "");
var teamfacebook = prompt("Facebook Url (Including http://) ... Leave blank to not show", "");
var teamlinkedin = prompt("Linked In Url (Including http://) ... Leave blank to not show", "");
var teamgoogle = prompt("Google Plus Url (Including http://) ... Leave blank to not show", "");
var teaminstagram = prompt("Instagram Url (Including http://) ... Leave blank to not show", "");
var teamwindows = prompt("Windows Url (Including http://) ... Leave blank to not show", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
content = '[teammember howmany="'+teamhowmany+'" name="'+teamname+'" position="'+teamposition+'" smallcontent="'+teamcontent+'" twitter="'+teamtwitter+'" dribbble="'+teamdribbble+'" facebook="'+teamfacebook+'" linkedin="'+teamlinkedin+'" google="'+teamgoogle+'" instagram="'+teaminstagram+'" windows="'+teamwindows+'"]'+selected+'[/teammember]';
} else {
content = '[teammember howmany="'+teamhowmany+'" name="'+teamname+'" position="'+teamposition+'" smallcontent="'+teamcontent+'" twitter="'+teamtwitter+'" dribbble="'+teamdribbble+'" facebook="'+teamfacebook+'" linkedin="'+teamlinkedin+'" google="'+teamgoogle+'" instagram="'+teaminstagram+'" windows="'+teamwindows+'"][/teammember]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Clients Show'){
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[clients]'+selected+'[/clients]';
} else {
content = '[clients][/clients]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Intro Boxes'){
var introboxeshowmany = prompt("How Many In A Row (Choices are: 3 or 4)", 4);
var introboxescolor = prompt("Box Colour (Choices are: inverse, blue, red, orane, yellow)... Inverse means sites colours!", "");
var introboxesicon = prompt("Icon Code, Please see Font Awesome Website For Each And Every Code", "");
var introboxestitle = prompt("Title", "");
var introboxescontent = prompt("Small Content", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[intro_icons howmany="'+introboxeshowmany+'" color="'+introboxescolor+'" icon="'+introboxesicon+'" title="'+introboxestitle+'" content="'+introboxescontent+'"]';
}else{
content = '[intro_icons howmany="'+introboxeshowmany+'" color="'+introboxescolor+'" icon="'+introboxesicon+'" title="'+introboxestitle+'" content="'+introboxescontent+'"]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Progessive Bars'){
var progressivename = prompt("Name Of Bar", "");
var progressivepercentage = prompt("Percentage)", 100);
var progressivecolor = prompt("Bar Colour (Choices are: inverse, blue, green, orange, red)... Inverse is sites colours!", "green");
var progressivestriped = prompt("Stiped Effect (Choices: yes, no)", "no");
var progressiveactive = prompt("Moving Stripes (Choices: yes, no)... If you want moving stipes, the striped effect needs a yes!", "no");
content = '[progress_bar name="'+progressivename+'" percentage="'+progressivepercentage+'" color="'+progressivecolor+'" striped="'+progressivestriped+'" active="'+progressiveactive+'"]';
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Slider'){
content = "[slider_wrap]<br>[slide]Image Goes Here...[/slide]<br>[slide]Image Goes Here...[/slide]<br>[slide]Image Goes Here...[/slide]<br>[/slider_wrap]";
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Featured Link'){
var featuredclass = prompt("Do you want to add another css class?", "");
var featuredbuttonurl = prompt("Button Url", "#");
var featuredbuttonname = prompt("Button Name", "Buy Now");
var featuredbackgroundcolor = prompt("Background Colour (Choices are: white, grey, light grey, dark grey, very dark grey, blue, theme color)", "blue");
var featuredcontent = prompt("Content", "");
var featuredbuttoncolor = prompt("Button Colour (Choices are: grey, blue, lightblue, green, orange, red, black)", "");
content = '[featuredlink backgroundcolor='+featuredbackgroundcolor+' class="'+featuredclass+'" buttonurl="'+featuredbuttonurl+'" buttonname="'+featuredbuttonname+'" content="'+featuredcontent+'" buttoncolor="'+featuredbuttoncolor+'"]';
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Buttons'){
var buttonlinkurl = prompt("Button Url", "#");
var buttoncolor = prompt("Button Colour (Choices are: grey, blue, aqua, green, orange, red, black)... Inverse means sites colours!", "");
var buttonsize = prompt("Button Size (Choices are: mini, small, normal, large)", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[button linkurl="'+buttonlinkurl+'" color="'+buttoncolor+'" size="'+buttonsize+'"]'+selected+'[/button]';
}else{
content = '[button linkurl="'+buttonlinkurl+'" color="'+buttoncolor+'" size="'+buttonsize+'"][/button]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Icons'){
var iconicon = prompt("Icon Code, Please see Font Awesome Website For Each And Every Code", "");
var iconsize = prompt("Icon Size (Choices are: small, normal, large, supersize)", "normal");
var iconposition = prompt("Icon Position (Choices: left, right)", "left");
content = '[icon icon="'+iconicon+'" size="'+iconsize+'" position="'+iconposition+'"]';
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Tool Tips'){
var tooltipposition = prompt("Position (Choices are: top, bottom, left, right)", "right");
var tooltiplink = prompt("Tool tip link url", "#");
var tooltiptooltip = prompt("Tooltip Content", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[tooltip position="'+tooltipposition+'" link="'+tooltiplink+'" tooltip="'+tooltiptooltip+'"]'+selected+'[/tooltip]';
}else{
content = '[tooltip position="'+tooltipposition+'" link="'+tooltiplink+'" tooltip="'+tooltiptooltip+'"][/tooltip]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Alerts'){
var alerttype = prompt("Type (Choices are: alert-success, alert-yellow, alert-info, alert-danger, alert-warning)", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[alert type="'+alerttype+'"]'+selected+'[/alert]';
}else{
content = '[alert type="'+alerttype+'"][/alert]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Labels'){
var labeltype = prompt("Type (Choices are: grey, green, orange, red, blue, black)", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[label type="'+labeltype+'"]'+selected+'[/label]';
}else{
content = '[label type="'+labeltype+'"][/label]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Badges'){
var badgetype = prompt("Type (Choices are: grey, green, orange, red, blue, black)", "");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[badge type="'+badgetype+'"]'+selected+'[/badge]';
}else{
content = '[badge type="'+badgetype+'"][/badge]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Text Highlight'){
var heightlightcolor = prompt("Text Colour (Please use the hex colour charts!)", "#ffffff");
var heightlightbgcolor = prompt("Background Colour (Please use the hex colour charts!)", "#4aaaa5");
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[highlight color="'+heightlightcolor+'" bgcolor="'+heightlightbgcolor+'"]'+selected+'[/highlight]';
}else{
content = '[highlight color="'+heightlightcolor+'" bgcolor="'+heightlightbgcolor+'"][/highlight]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Small Text'){
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[small]'+selected+'[/small]';
}else{
content = '[small][/small]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Code Tags'){
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[code]'+selected+'[/code]';
}else{
content = '[code][/code]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Pre Tags'){
selected = tinyMCE.activeEditor.selection.getContent();
if( selected ){
//If text is selected when button is clicked
//Wrap shortcode around it.
content = '[pre]'+selected+'[/pre]';
}else{
content = '[pre][/pre]';
}
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'HR Tag'){
content = '[hr]';
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
if(p == 'Clear Fix'){
content = '[clear]';
tinymce.execCommand('mceInsertContent', false, content);
} // end of shortcode
}
});
// Add some menu items
var my_shortcodes = ['Accordions','Accordions With Icons','Toggles','Tabs','Tabs With Icons','Latest Portfolio Items','Testimonial Slider','Pricing Tables Wrapper','Pricing Tables','Team Member','Clients Show','Intro Boxes','Progessive Bars','Slider','Featured Link','Buttons','Icons','Tool Tips','Alerts','Labels','Badges','Text Highlight','Small Text','Code Tags','Pre Tags','HR Tag','Clear Fix'];
for(var i in my_shortcodes){
msb.add(my_shortcodes[i],my_shortcodes[i]);
}
return msb;
}
return null;
}
});
tinymce.PluginManager.add('Shortcodes', tinymce.plugins.Shortcodes);
})();
最大の問題は == が === であるように見えますが、これを行うと機能しなくなります。
もう1つの大きな問題は、コンテンツが定義されていないということですが、varをその前に置くと、コンテンツがすでに定義されていると表示されるため、勝てません笑。
ifステートメントを考慮しているとは思いません。
もう1つはスペーシングです。これはまったくばかげていると思います。読みやすいので、このようにコーディングします。スペーシングはコードに影響しないと常に言われていました。
とにかく、どんな助けも素晴らしいでしょう
ありがとう