icon_popup.php in Virtue/Ascend/Pinnacle Toolkit 2.9, at shortcodes/icons/icon_popup.php
| 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 Icon", 'kadencetoolkit'); ?></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 language="javascript" type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/lib/icons/js/icon-select.js"></script> |
| 17 | <link href="<?php echo get_template_directory_uri() ?>/lib/icons/css/icon-select.css" rel="stylesheet"/> |
| 18 | <link href="<?php echo get_template_directory_uri() ?>/assets/css/icons.css" rel="stylesheet"/> |
| 19 | <script type="text/javascript"> |
| 20 | |
| 21 | var ButtonDialog = { |
| 22 | local_ed : 'ed', |
| 23 | init : function(ed) { |
| 24 | ButtonDialog.local_ed = ed; |
| 25 | tinyMCEPopup.resizeToInnerSize(); |
| 26 | }, |
| 27 | insert : function insertButton(ed) { |
| 28 | |
| 29 | // Try and remove existing style / blockquote |
| 30 | tinyMCEPopup.execCommand('mceRemoveNode', false, null); |
| 31 | |
| 32 | // set up variables to contain our input values |
| 33 | var icon = jQuery('#icon-dialog select#icon-icon').val(); |
| 34 | var size = jQuery('#icon-dialog select#icon-size').val(); |
| 35 | var color = jQuery('#icon-dialog select#icon-color').val(); |
| 36 | var colorhex = jQuery('#icon-dialog input#icon-color-hex').val(); |
| 37 | var float = jQuery('#icon-dialog select#icon-align').val(); |
| 38 | |
| 39 | var output = ''; |
| 40 | |
| 41 | // setup the output of our shortcode |
| 42 | output = '[icon '; |
| 43 | output += 'icon=' + icon + ' '; |
| 44 | output += 'size=' + size + ' '; |
| 45 | if(colorhex) |
| 46 | output += ' color=' + colorhex + ' '; |
| 47 | else { |
| 48 | output += 'color=' + color + ' '; |
| 49 | } |
| 50 | if(float == 'none') |
| 51 | output += ''; |
| 52 | else { |
| 53 | output += 'float=' + float; |
| 54 | } |
| 55 | |
| 56 | // check to see if the TEXT field is blank |
| 57 | output += ']'; |
| 58 | |
| 59 | tinyMCEPopup.execCommand('mceInsertContent', false, output); |
| 60 | |
| 61 | // Return |
| 62 | tinyMCEPopup.close(); |
| 63 | } |
| 64 | }; |
| 65 | tinyMCEPopup.onInit.add(ButtonDialog.init, ButtonDialog); |
| 66 | |
| 67 | </script> |
| 68 | <?php $icons = array( 'icon-glass', 'icon-music', 'icon-search', 'icon-envelope-alt', 'icon-heart', 'icon-star', 'icon-star-empty', 'icon-user', 'icon-film', 'icon-th-large', 'icon-th', 'icon-th-list', 'icon-ok', 'icon-remove', 'icon-zoom-in', 'icon-zoom-out', 'icon-power-off', 'icon-off', 'icon-signal', 'icon-gear', 'icon-cog', 'icon-trash', 'icon-home', 'icon-file-alt', 'icon-time', 'icon-road', 'icon-download-alt', 'icon-download', 'icon-upload', 'icon-inbox', 'icon-play-circle', 'icon-rotate-right', 'icon-repeat', 'icon-refresh', 'icon-list-alt', 'icon-lock', 'icon-flag', 'icon-headphones', 'icon-volume-off', 'icon-volume-down', 'icon-volume-up', 'icon-qrcode', 'icon-barcode', 'icon-tag', 'icon-tags', 'icon-book', 'icon-bookmark', 'icon-print', 'icon-camera', 'icon-font', 'icon-bold', 'icon-italic', 'icon-text-height', 'icon-text-width', 'icon-align-left', 'icon-align-center', 'icon-align-right', 'icon-align-justify', 'icon-list', 'icon-indent-left', 'icon-indent-right', 'icon-facetime-video', 'icon-picture', 'icon-pencil', 'icon-map-marker', 'icon-adjust', 'icon-tint', 'icon-edit', 'icon-share', 'icon-check', 'icon-move', 'icon-step-backward', 'icon-fast-backward', 'icon-backward', 'icon-play', 'icon-pause', 'icon-stop', 'icon-forward', 'icon-fast-forward', 'icon-step-forward', 'icon-eject', 'icon-chevron-left', 'icon-chevron-right', 'icon-plus-sign', 'icon-minus-sign', 'icon-remove-sign', 'icon-ok-sign', 'icon-question-sign', 'icon-info-sign', 'icon-screenshot', 'icon-remove-circle', 'icon-ok-circle', 'icon-ban-circle', 'icon-arrow-left', 'icon-arrow-right', 'icon-arrow-up', 'icon-arrow-down', 'icon-mail-forward', 'icon-share-alt', 'icon-resize-full', 'icon-resize-small', 'icon-plus', 'icon-minus', 'icon-asterisk', 'icon-exclamation-sign', 'icon-gift', 'icon-leaf', 'icon-fire', 'icon-eye-open', 'icon-eye-close', 'icon-warning-sign', 'icon-plane', 'icon-calendar', 'icon-random', 'icon-comment', 'icon-magnet', 'icon-chevron-up', 'icon-chevron-down', 'icon-retweet', 'icon-shopping-cart', 'icon-folder-close', 'icon-folder-open', 'icon-resize-vertical', 'icon-resize-horizontal', 'icon-bar-chart', 'icon-twitter-sign', 'icon-facebook-sign', 'icon-camera-retro', 'icon-key', 'icon-gears', 'icon-cogs', 'icon-comments', 'icon-thumbs-up-alt', 'icon-thumbs-down-alt', 'icon-star-half', 'icon-heart-empty', 'icon-signout', 'icon-linkedin-sign', 'icon-pushpin', 'icon-external-link', 'icon-signin', 'icon-trophy', 'icon-github-sign', 'icon-upload-alt', 'icon-lemon', 'icon-phone', 'icon-unchecked', 'icon-check-empty', 'icon-bookmark-empty', 'icon-phone-sign', 'icon-twitter', 'icon-facebook', 'icon-github', 'icon-unlock', 'icon-credit-card', 'icon-rss', 'icon-hdd', 'icon-bullhorn', 'icon-bell', 'icon-certificate', 'icon-hand-right', 'icon-hand-left', 'icon-hand-up', 'icon-hand-down', 'icon-circle-arrow-left', 'icon-circle-arrow-right', 'icon-circle-arrow-up', 'icon-circle-arrow-down', 'icon-globe', 'icon-wrench', 'icon-tasks', 'icon-filter', 'icon-briefcase', 'icon-fullscreen', 'icon-group', 'icon-link', 'icon-cloud', 'icon-beaker', 'icon-cut', 'icon-copy', 'icon-paperclip', 'icon-paper-clip', 'icon-save', 'icon-sign-blank', 'icon-reorder', 'icon-list-ul', 'icon-list-ol', 'icon-strikethrough', 'icon-underline', 'icon-table', 'icon-magic', 'icon-truck', 'icon-pinterest', 'icon-pinterest-sign', 'icon-google-plus-sign', 'icon-google-plus', 'icon-money', 'icon-caret-down', 'icon-caret-up', 'icon-caret-left', 'icon-caret-right', 'icon-columns', 'icon-sort', 'icon-sort-down', 'icon-sort-up', 'icon-envelope', 'icon-linkedin', 'icon-rotate-left', 'icon-undo', 'icon-legal', 'icon-dashboard', 'icon-comment-alt', 'icon-comments-alt', 'icon-bolt', 'icon-sitemap', 'icon-umbrella', 'icon-paste', 'icon-lightbulb', 'icon-exchange', 'icon-cloud-download', 'icon-cloud-upload', 'icon-user-md', 'icon-stethoscope', 'icon-suitcase', 'icon-bell-alt', 'icon-coffee', 'icon-food', 'icon-file-text-alt', 'icon-building', 'icon-hospital', 'icon-ambulance', 'icon-medkit', 'icon-fighter-jet', 'icon-beer', 'icon-h-sign', 'icon-plus-sign-alt', 'icon-double-angle-left', 'icon-double-angle-right', 'icon-double-angle-up', 'icon-double-angle-down', 'icon-angle-left', 'icon-angle-right', 'icon-angle-up', 'icon-angle-down', 'icon-desktop', 'icon-laptop', 'icon-tablet', 'icon-mobile-phone', 'icon-circle-blank', 'icon-quote-left', 'icon-quote-right', 'icon-spinner', 'icon-circle', 'icon-mail-reply', 'icon-reply', 'icon-github-alt', 'icon-folder-close-alt', 'icon-folder-open-alt', 'icon-expand-alt', 'icon-collapse-alt', 'icon-smile', 'icon-frown', 'icon-meh', 'icon-gamepad', 'icon-keyboard', 'icon-flag-alt', 'icon-flag-checkered', 'icon-terminal', 'icon-code', 'icon-reply-all', 'icon-mail-reply-all', 'icon-star-half-full', 'icon-star-half-empty', 'icon-location-arrow', 'icon-crop', 'icon-code-fork', 'icon-unlink', 'icon-question', 'icon-info', 'icon-exclamation', 'icon-superscript', 'icon-subscript', 'icon-eraser', 'icon-puzzle-piece', 'icon-microphone', 'icon-microphone-off', 'icon-shield', 'icon-calendar-empty', 'icon-fire-extinguisher', 'icon-rocket', 'icon-maxcdn', 'icon-chevron-sign-left', 'icon-chevron-sign-right', 'icon-chevron-sign-up', 'icon-chevron-sign-down', 'icon-html5', 'icon-css3', 'icon-anchor', 'icon-unlock-alt', 'icon-bullseye', 'icon-ellipsis-horizontal', 'icon-ellipsis-vertical', 'icon-rss-sign', 'icon-play-sign', 'icon-ticket', 'icon-minus-sign-alt', 'icon-check-minus', 'icon-level-up', 'icon-level-down', 'icon-check-sign', 'icon-edit-sign', 'icon-external-link-sign', 'icon-share-sign', 'icon-compass', 'icon-collapse', 'icon-collapse-top', 'icon-expand', 'icon-euro', 'icon-eur', 'icon-gbp', 'icon-dollar', 'icon-usd', 'icon-rupee', 'icon-inr', 'icon-yen', 'icon-jpy', 'icon-renminbi', 'icon-cny', 'icon-won', 'icon-krw', 'icon-bitcoin', 'icon-btc', 'icon-file', 'icon-file-text', 'icon-sort-by-alphabet', 'icon-sort-by-alphabet-alt', 'icon-sort-by-attributes', 'icon-sort-by-attributes-alt', 'icon-sort-by-order', 'icon-sort-by-order-alt', 'icon-thumbs-up', 'icon-thumbs-down', 'icon-youtube-sign', 'icon-youtube', 'icon-xing', 'icon-xing-sign', 'icon-youtube-play', 'icon-dropbox', 'icon-stackexchange', 'icon-instagram', 'icon-flickr', 'icon-adn', 'icon-bitbucket', 'icon-bitbucket-sign', 'icon-tumblr', 'icon-tumblr-sign', 'icon-long-arrow-down', 'icon-long-arrow-up', 'icon-long-arrow-left', 'icon-long-arrow-right', 'icon-apple', 'icon-windows', 'icon-android', 'icon-linux', 'icon-dribbble', 'icon-skype', 'icon-foursquare', 'icon-trello', 'icon-female', 'icon-male', 'icon-gittip', 'icon-sun', 'icon-moon', 'icon-archive', 'icon-bug', 'icon-vk', 'icon-weibo', 'icon-renren'); |
| 69 | |
| 70 | ?> |
| 71 | <style type="text/css" media="screen"> .kad-popup {padding: 0 8px; font-size: 0;} #icon-dialog {font-size: 12px;} #icon-dialog label {font-size:14px; display:block; padding:4px;} #icon-dialog label.hex {font-size:12px; line-height:24px; display:inline-block; padding:6px 4px 6px 12px;} .linebreak {margin-bottom:6px; border-bottom: solid 1px #d7d7d7; padding-bottom:6px} #icon-dialog input#icon-color-hex {display:inline-block; height:24px;} #icon-dialog a#insert {margin-top:15px;} |
| 72 | |
| 73 | </style> |
| 74 | |
| 75 | </head> |
| 76 | <body class="kad-popup"> |
| 77 | <div id="icon-dialog"> |
| 78 | <form action="/" method="get" accept-charset="utf-8"> |
| 79 | <div class="linebreak"> |
| 80 | <div> |
| 81 | <label for="button-url">Choose Icon</label> |
| 82 | <select name="icon-icon" class="kad_icomoon" id="icon-icon"> |
| 83 | <?php foreach ($icons as $icon) { |
| 84 | echo '<option value="'.$icon. '">'.$icon. '</option>'; |
| 85 | }?> |
| 86 | </select> |
| 87 | </div> |
| 88 | </div> |
| 89 | <div class="linebreak"> |
| 90 | <div> |
| 91 | <label for="icon-size">Icon Size</label> |
| 92 | <select name="icon-icon" class="kad_icomoon" id="icon-size"> |
| 93 | <option value="5px">5px</option> |
| 94 | <option value="6px">6px</option> |
| 95 | <option value="7px">7px</option> |
| 96 | <option value="8px">8px</option> |
| 97 | <option value="9px">9px</option> |
| 98 | <option value="10px">10px</option> |
| 99 | <option value="11px">11px</option> |
| 100 | <option value="12px">12px</option> |
| 101 | <option value="13px">13px</option> |
| 102 | <option value="14px" selected="selected">14px</option> |
| 103 | <option value="15px">15px</option> |
| 104 | <option value="16px">16px</option> |
| 105 | <option value="17px">17px</option> |
| 106 | <option value="18px">18px</option> |
| 107 | <option value="19px">19px</option> |
| 108 | <option value="20px">20px</option> |
| 109 | <option value="21px">21px</option> |
| 110 | <option value="22px">22px</option> |
| 111 | <option value="23px">23px</option> |
| 112 | <option value="24px">24px</option> |
| 113 | <option value="25px">25px</option> |
| 114 | <option value="26px">26px</option> |
| 115 | <option value="27px">27px</option> |
| 116 | <option value="28px">28px</option> |
| 117 | <option value="29px">29px</option> |
| 118 | <option value="30px">30px</option> |
| 119 | <option value="31px">31px</option> |
| 120 | <option value="32px">32px</option> |
| 121 | <option value="33px">33px</option> |
| 122 | <option value="34px">34px</option> |
| 123 | <option value="35px">35px</option> |
| 124 | <option value="36px">36px</option> |
| 125 | <option value="37px">37px</option> |
| 126 | <option value="38px">38px</option> |
| 127 | <option value="39px">39px</option> |
| 128 | <option value="40px">40px</option> |
| 129 | <option value="41px">41px</option> |
| 130 | <option value="42px">42px</option> |
| 131 | <option value="43px">43px</option> |
| 132 | <option value="44px">44px</option> |
| 133 | <option value="45px">45px</option> |
| 134 | <option value="46px">46px</option> |
| 135 | <option value="47px">47px</option> |
| 136 | <option value="48px">48px</option> |
| 137 | <option value="49px">49px</option> |
| 138 | <option value="50px">50px</option> |
| 139 | <option value="51px">51px</option> |
| 140 | <option value="52px">52px</option> |
| 141 | <option value="53px">53px</option> |
| 142 | <option value="54px">54px</option> |
| 143 | <option value="55px">55px</option> |
| 144 | <option value="56px">56px</option> |
| 145 | <option value="57px">57px</option> |
| 146 | <option value="58px">58px</option> |
| 147 | <option value="59px">59px</option> |
| 148 | <option value="60px">60px</option> |
| 149 | <option value="61px">61px</option> |
| 150 | <option value="62px">62px</option> |
| 151 | <option value="63px">63px</option> |
| 152 | <option value="64px">64px</option> |
| 153 | <option value="65px">65px</option> |
| 154 | <option value="66px">66px</option> |
| 155 | <option value="67px">67px</option> |
| 156 | <option value="68px">68px</option> |
| 157 | <option value="69px">69px</option> |
| 158 | <option value="70px">70px</option> |
| 159 | <option value="71px">71px</option> |
| 160 | <option value="72px">72px</option> |
| 161 | <option value="73px">73px</option> |
| 162 | <option value="74px">74px</option> |
| 163 | <option value="75px">75px</option> |
| 164 | <option value="76px">76px</option> |
| 165 | <option value="77px">77px</option> |
| 166 | <option value="78px">78px</option> |
| 167 | <option value="79px">79px</option> |
| 168 | <option value="80px">80px</option> |
| 169 | </select> |
| 170 | </div> |
| 171 | </div> |
| 172 | <div class="linebreak"> |
| 173 | <div> |
| 174 | <label for="icon-color">Icon Color</label> |
| 175 | <select name="icon-color" class="kad_icomoon" id="icon-color"> |
| 176 | <option value="#000">Black</option> |
| 177 | <option value="#CDCDCD">Light-Gray</option> |
| 178 | <option value="#999">Gray</option> |
| 179 | <option value="#444">Dark-Gray</option> |
| 180 | <option value="#CCC">Silver</option> |
| 181 | <option value="#FFF">White</option> |
| 182 | <option value="#F2F2F2">Off-White</option> |
| 183 | <option value="#FF0000">Red</option> |
| 184 | <option value="#0000FF">Blue</option> |
| 185 | <option value="#008000">Green</option> |
| 186 | <option value="#FFFF00">Yellow</option> |
| 187 | <option value="#FFA500">Orange</option> |
| 188 | <option value="#FF00FF">Pink</option> |
| 189 | <option value="#800080">Purple</option> |
| 190 | <option value="#8B4513">Brown</option> |
| 191 | <option value="#800000">Maroon</option> |
| 192 | |
| 193 | </select> |
| 194 | </div> |
| 195 | <div> |
| 196 | <label class="hex"for="icon-color-hex">Or Type Hex Color</label> |
| 197 | <input type="text" name="icon-color-hex" value="" id="icon-color-hex" /> |
| 198 | </div> |
| 199 | </div> |
| 200 | <div class="linebreak"> |
| 201 | <div> |
| 202 | <label for="icon-align">Icon Float</label> |
| 203 | <select name="icon-align" class="kad_icomoon" id="icon-align"> |
| 204 | <option value="none">None</option> |
| 205 | <option value="left">Left</option> |
| 206 | <option value="right">Right</option> |
| 207 | </select> |
| 208 | </div> |
| 209 | </div> |
| 210 | <div> |
| 211 | <a href="javascript:ButtonDialog.insert(ButtonDialog.local_ed)" id="insert" style="display: block; line-height: 24px; text-align:center">Insert</a> |
| 212 | </div> |
| 213 | </form> |
| 214 | </div> |
| 215 | </body> |
| 216 | </html> |