| 1 |
<?php |
| 2 |
wp_enqueue_script('jquery-ui-core'); |
| 3 |
wp_enqueue_script('jquery-ui-widget'); |
| 4 |
wp_enqueue_script('jquery-ui-position'); |
| 5 |
wp_enqueue_script('jquery'); |
| 6 |
global $wp_scripts; |
| 7 |
?> |
| 8 |
<!DOCTYPE html> |
| 9 |
<head> |
| 10 |
<title><?php _e("Insert Columns", "virtue"); ?></title> |
| 11 |
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php echo get_option('blog_charset'); ?>" /> |
| 12 |
<script language="javascript" type="text/javascript" src="<?php echo get_option('siteurl') ?>/wp-includes/js/tinymce/tiny_mce_popup.js"></script> |
| 13 |
<script language="javascript" type="text/javascript" src="<?php echo site_url(); ?>/wp-includes/js/tinymce/utils/form_utils.js"></script> |
| 14 |
<base target="_self" /> |
| 15 |
<?php wp_print_scripts(); ?> |
| 16 |
<script type="text/javascript"> |
| 17 |
|
| 18 |
var ButtonDialog = { |
| 19 |
local_ed : 'ed', |
| 20 |
init : function(ed) { |
| 21 |
ButtonDialog.local_ed = ed; |
| 22 |
tinyMCEPopup.resizeToInnerSize(); |
| 23 |
}, |
| 24 |
insert : function insertButton(ed) { |
| 25 |
|
| 26 |
// Try and remove existing style / blockquote |
| 27 |
tinyMCEPopup.execCommand('mceRemoveNode', false, null); |
| 28 |
|
| 29 |
// set up variables to contain our input values |
| 30 |
var coutput = jQuery('#icon-dialog select#columnoutput').val(); |
| 31 |
|
| 32 |
var output = ''; |
| 33 |
|
| 34 |
// setup the output of our shortcode |
| 35 |
switch (coutput) |
| 36 |
{ |
| 37 |
case '1': |
| 38 |
output = '<img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnstart mceItem" title="hcolumns" />'; |
| 39 |
if(document.getElementById('2column').checked) { |
| 40 |
output += '<div class="col-md-6"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-6 mceItem" title="columnhelper col-md-6" />'; |
| 41 |
output += '<p>add content here</p>'; |
| 42 |
output += '</div> '; |
| 43 |
output += '<div class="col-md-6"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-6 mceItem" title="columnhelper col-md-6" />'; |
| 44 |
output += '<p>add content here</p>'; |
| 45 |
output += '</div> '; |
| 46 |
}else if(document.getElementById('2columnright').checked) { |
| 47 |
output += '<div class="col-md-4"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-4 mceItem" title="columnhelper col-md-4" />'; |
| 48 |
output += '<p>add content here</p>'; |
| 49 |
output += '</div> '; |
| 50 |
output += '<div class="col-md-8"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-8 mceItem" title="columnhelper col-md-8" />'; |
| 51 |
output += '<p>add content here</p>'; |
| 52 |
output += '</div> '; |
| 53 |
}else if(document.getElementById('2columnleft').checked) { |
| 54 |
output += '<div class="col-md-8"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-8 mceItem" title="columnhelper col-md-8" />'; |
| 55 |
output += '<p>add content here</p>'; |
| 56 |
output += '</div> '; |
| 57 |
output += '<div class="col-md-4"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-4 mceItem" title="columnhelper col-md-4" />'; |
| 58 |
output += '<p>add content here</p>'; |
| 59 |
output += '</div> '; |
| 60 |
}else if(document.getElementById('3column').checked) { |
| 61 |
output += '<div class="col-md-4"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-4 mceItem" title="columnhelper col-md-4" />'; |
| 62 |
output += '<p>add content here</p>'; |
| 63 |
output += '</div> '; |
| 64 |
output += '<div class="col-md-4"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-4 mceItem" title="columnhelper col-md-4" />'; |
| 65 |
output += '<p>add content here</p>'; |
| 66 |
output += '</div> '; |
| 67 |
output += '<div class="col-md-4"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-4 mceItem" title="columnhelper col-md-4" />'; |
| 68 |
output += '<p>add content here</p>'; |
| 69 |
output += '</div> '; |
| 70 |
}else if(document.getElementById('4column').checked) { |
| 71 |
output += '<div class="col-md-3"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-3 mceItem" title="columnhelper col-md-3" />'; |
| 72 |
output += '<p>add content here</p>'; |
| 73 |
output += '</div> '; |
| 74 |
output += '<div class="col-md-3"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-3 mceItem" title="columnhelper col-md-3" />'; |
| 75 |
output += '<p>add content here</p>'; |
| 76 |
output += '</div> '; |
| 77 |
output += '<div class="col-md-3"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-3 mceItem" title="columnhelper col-md-3" />'; |
| 78 |
output += '<p>add content here</p>'; |
| 79 |
output += '</div> '; |
| 80 |
output += '<div class="col-md-3"><img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnhelper col-md-3 mceItem" title="columnhelper col-md-3" />'; |
| 81 |
output += '<p>add content here</p>'; |
| 82 |
output += '</div> '; |
| 83 |
} |
| 84 |
output += '<img src="'+tinymce.baseURL+'/plugins/wpgallery/img/t.gif" class="columnend mceItem" title="/hcolumns" />'; |
| 85 |
|
| 86 |
break; |
| 87 |
default: |
| 88 |
output = '[columns] '; |
| 89 |
if(document.getElementById('2column').checked) { |
| 90 |
output += '[span6] '; |
| 91 |
output += '<p>add content here</p>'; |
| 92 |
output += '[/span6]'; |
| 93 |
output += '[span6] '; |
| 94 |
output += '<p>add content here</p>'; |
| 95 |
output += '[/span6]'; |
| 96 |
}else if(document.getElementById('2columnright').checked) { |
| 97 |
output += '[span4] '; |
| 98 |
output += '<p>add content here</p>'; |
| 99 |
output += '[/span4]'; |
| 100 |
output += '[span8] '; |
| 101 |
output += '<p>add content here</p>'; |
| 102 |
output += '[/span8]'; |
| 103 |
}else if(document.getElementById('2columnleft').checked) { |
| 104 |
output += '[span8] '; |
| 105 |
output += '<p>add content here</p>'; |
| 106 |
output += '[/span8]'; |
| 107 |
output += '[span4] '; |
| 108 |
output += '<p>add content here</p>'; |
| 109 |
output += '[/span4]'; |
| 110 |
}else if(document.getElementById('3column').checked) { |
| 111 |
output += '[span4] '; |
| 112 |
output += '<p>add content here</p>'; |
| 113 |
output += '[/span4]'; |
| 114 |
output += '[span4] '; |
| 115 |
output += '<p>add content here</p>'; |
| 116 |
output += '[/span4]'; |
| 117 |
output += '[span4] '; |
| 118 |
output += '<p>add content here</p>'; |
| 119 |
output += '[/span4]'; |
| 120 |
}else if(document.getElementById('4column').checked) { |
| 121 |
output += '[span3] '; |
| 122 |
output += '<p>add content here</p>'; |
| 123 |
output += '[/span3]'; |
| 124 |
output += '[span3] '; |
| 125 |
output += '<p>add content here</p>'; |
| 126 |
output += '[/span3]'; |
| 127 |
output += '[span3] '; |
| 128 |
output += '<p>add content here</p>'; |
| 129 |
output += '[/span3]'; |
| 130 |
output += '[span3] '; |
| 131 |
output += '<p>add content here</p>'; |
| 132 |
output += '[/span3]'; |
| 133 |
} |
| 134 |
|
| 135 |
output += '[/columns]'; |
| 136 |
} |
| 137 |
|
| 138 |
tinyMCEPopup.execCommand('mceReplaceContent', false, output); |
| 139 |
|
| 140 |
// Return |
| 141 |
tinyMCEPopup.close(); |
| 142 |
} |
| 143 |
}; |
| 144 |
tinyMCEPopup.onInit.add(ButtonDialog.init, ButtonDialog); |
| 145 |
|
| 146 |
</script> |
| 147 |
<style type="text/css" media="screen"> #icon-dialog label {font-size:12px; line-height:24px; width:150px; display:inline-block; text-align:right;} #icon-dialog label.imglabel {width: auto; text-align: left; padding-left: 10px;} #icon-dialog a#insert {margin-top:2px;} #icon-dialog p {font-size:12px;} #icon-dialog .option-row {padding-bottom:6px; border-bottom: solid 1px #d7d7d7; margin-bottom:8px;} #icon-dialog select {width:159px; height:24px;} </style> |
| 148 |
|
| 149 |
</head> |
| 150 |
<body> |
| 151 |
<div id="icon-dialog"> |
| 152 |
<form action="/" method="get" id="columnform" accept-charset="utf-8"> |
| 153 |
<div> |
| 154 |
<p>Choose a Column Layout:</p> |
| 155 |
</div> |
| 156 |
<div class="option-row"> |
| 157 |
<label for="column-option">Choose Column Output:</label> |
| 158 |
<select name="column-one" id="columnoutput"> |
| 159 |
<option value="2">Shortcodes</option> |
| 160 |
<option value="1">Visual Aid</option> |
| 161 |
</select> |
| 162 |
</div> |
| 163 |
<div class="option-row"> |
| 164 |
<label for="2column">Two Column</label> |
| 165 |
<input type="radio" name="column" value="2column" id="2column"> |
| 166 |
<label class="imglabel" for="2column"><img src="<?php echo get_template_directory_uri()?>/assets/img/twocolumn.jpg" /></label> |
| 167 |
</div> |
| 168 |
<div class="option-row"> |
| 169 |
<label for="2columnright">Two Column Offset Right</label> |
| 170 |
<input type="radio" name="column" value="2columnright"id="2columnright"> |
| 171 |
<label class="imglabel" for="2columnright"><img src="<?php echo get_template_directory_uri()?>/assets/img/twocolumnright.jpg" /></label> |
| 172 |
</div> |
| 173 |
<div class="option-row"> |
| 174 |
<label for="2columnleft">Two Column Offset Left</label> |
| 175 |
<input type="radio" name="column" value="2columnleft"id="2columnleft"> |
| 176 |
<label class="imglabel" for="2columnleft"><img src="<?php echo get_template_directory_uri()?>/assets/img/twocolumnleft.jpg" /></label> |
| 177 |
</div> |
| 178 |
<div class="option-row"> |
| 179 |
<label for="3column">Three Column</label> |
| 180 |
<input type="radio" name="column" value="3column"id="3column"> |
| 181 |
<label class="imglabel" for="3column"><img src="<?php echo get_template_directory_uri()?>/assets/img/threecolumn.jpg" /></label> |
| 182 |
</div> |
| 183 |
<div class="option-row"> |
| 184 |
<label for="4column">Four Column</label> |
| 185 |
<input type="radio" name="column" value="4column"id="4column"> |
| 186 |
<label class="imglabel" for="4column"><img src="<?php echo get_template_directory_uri()?>/assets/img/fourcolumn.jpg" /></label> |
| 187 |
</div> |
| 188 |
<div> |
| 189 |
<a href="javascript:ButtonDialog.insert(ButtonDialog.local_ed)" id="insert" style="display: block; line-height: 24px; text-align:center">Insert</a> |
| 190 |
</div> |
| 191 |
</form> |
| 192 |
</div> |
| 193 |
</body> |
| 194 |
</html> |
