| 1 |
<?php |
| 2 |
if (!defined('ABSPATH')) { |
| 3 |
die; |
| 4 |
} |
| 5 |
|
| 6 |
global $post; |
| 7 |
wp_nonce_field('meta_box_nonce_action', 'meta_box_nonce_field'); |
| 8 |
|
| 9 |
$gvnsql_meta = function ($key) use ($post) { |
| 10 |
return get_post_meta($post->ID, $key, true); |
| 11 |
}; |
| 12 |
|
| 13 |
$gvnsql_rawtype = $gvnsql_meta('guaven_sqlcharts_graphtype'); |
| 14 |
if ($gvnsql_rawtype == '') $gvnsql_rawtype = 'pie_l'; |
| 15 |
$gvnsql_type = guaven_sqlcharts_normalize_type($gvnsql_rawtype); |
| 16 |
$gvnsql_catalog = guaven_sqlcharts_type_catalog(); |
| 17 |
if (!isset($gvnsql_catalog[$gvnsql_type])) $gvnsql_type = 'pie_l'; |
| 18 |
|
| 19 |
$gvnsql_icons = array( |
| 20 |
'pie_l' => '<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9" fill="none" stroke="currentColor" stroke-width="2"/><path d="M12 12V3a9 9 0 0 1 8.6 6.2L12 12z" fill="currentColor"/></svg>', |
| 21 |
'donut_l' => '<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="8.5" fill="none" stroke="currentColor" stroke-width="3.4" opacity=".35"/><path d="M12 3.5a8.5 8.5 0 0 1 8.1 5.9" fill="none" stroke="currentColor" stroke-width="3.4" stroke-linecap="round"/></svg>', |
| 22 |
'polar_l' => '<svg viewBox="0 0 24 24"><path d="M12 12V4a8 8 0 0 1 8 8h-8z" fill="currentColor" opacity=".85"/><path d="M12 12h5.5a5.5 5.5 0 1 1-5.5-5.5V12z" fill="currentColor" opacity=".45"/><circle cx="12" cy="12" r="9.5" fill="none" stroke="currentColor" stroke-width="1.4" opacity=".5"/></svg>', |
| 23 |
'radar_l' => '<svg viewBox="0 0 24 24"><path d="M12 2.5l9 6.5-3.4 10.5H6.4L3 9z" fill="none" stroke="currentColor" stroke-width="1.6"/><path d="M12 7l5 3.6-1.9 5.9H8.9L7 10.6z" fill="currentColor" opacity=".4"/></svg>', |
| 24 |
'line_l' => '<svg viewBox="0 0 24 24"><path d="M3 18l6-7 4 3 8-9" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"/></svg>', |
| 25 |
'area_l' => '<svg viewBox="0 0 24 24"><path d="M3 18l6-7 4 3 8-9v14H3z" fill="currentColor" opacity=".45"/><path d="M3 18l6-7 4 3 8-9" fill="none" stroke="currentColor" stroke-width="2"/></svg>', |
| 26 |
'steppedline_l' => '<svg viewBox="0 0 24 24"><path d="M3 18h4v-5h5V8h5V4h4" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"/></svg>', |
| 27 |
'bar_l' => '<svg viewBox="0 0 24 24"><rect x="4" y="11" width="4" height="9" fill="currentColor"/><rect x="10" y="5" width="4" height="15" fill="currentColor" opacity=".7"/><rect x="16" y="8" width="4" height="12" fill="currentColor" opacity=".45"/></svg>', |
| 28 |
'horizontalbar_l' => '<svg viewBox="0 0 24 24"><rect x="3" y="4" width="15" height="4" fill="currentColor"/><rect x="3" y="10" width="18" height="4" fill="currentColor" opacity=".7"/><rect x="3" y="16" width="10" height="4" fill="currentColor" opacity=".45"/></svg>', |
| 29 |
'stackedbar_l' => '<svg viewBox="0 0 24 24"><rect x="4" y="12" width="4" height="8" fill="currentColor"/><rect x="4" y="7" width="4" height="5" fill="currentColor" opacity=".45"/><rect x="10" y="9" width="4" height="11" fill="currentColor"/><rect x="10" y="4" width="4" height="5" fill="currentColor" opacity=".45"/><rect x="16" y="14" width="4" height="6" fill="currentColor"/><rect x="16" y="10" width="4" height="4" fill="currentColor" opacity=".45"/></svg>', |
| 30 |
'scatter_l' => '<svg viewBox="0 0 24 24"><circle cx="6" cy="16" r="2" fill="currentColor"/><circle cx="10" cy="9" r="2" fill="currentColor" opacity=".75"/><circle cx="15" cy="13" r="2" fill="currentColor" opacity=".55"/><circle cx="19" cy="5" r="2" fill="currentColor" opacity=".85"/><circle cx="13" cy="19" r="2" fill="currentColor" opacity=".4"/></svg>', |
| 31 |
); |
| 32 |
|
| 33 |
$gvnsql_svg_kses = array( |
| 34 |
'svg' => array('viewbox' => array(), 'xmlns' => array()), |
| 35 |
'path' => array('d' => array(), 'fill' => array(), 'stroke' => array(), 'stroke-width' => array(), 'stroke-linecap' => array(), 'stroke-linejoin' => array(), 'opacity' => array()), |
| 36 |
'circle' => array('cx' => array(), 'cy' => array(), 'r' => array(), 'fill' => array(), 'stroke' => array(), 'stroke-width' => array(), 'opacity' => array()), |
| 37 |
'rect' => array('x' => array(), 'y' => array(), 'width' => array(), 'height' => array(), 'fill' => array(), 'opacity' => array()), |
| 38 |
); |
| 39 |
?> |
| 40 |
|
| 41 |
<div id="gvnsql-app"> |
| 42 |
|
| 43 |
<?php if ($gvnsql_rawtype != $gvnsql_type) { ?> |
| 44 |
<div class="gvnsql-note gvnsql-note-migrate"> |
| 45 |
This chart used the deprecated Google Chart type "<?php echo esc_html($gvnsql_rawtype); ?>". |
| 46 |
It has been automatically mapped to the equivalent modern chart type below — just press Update to finish the migration. Nothing else changes. |
| 47 |
</div> |
| 48 |
<?php } ?> |
| 49 |
|
| 50 |
<nav class="gvnsql-tabs" id="gvnsql-tabs"> |
| 51 |
<button type="button" class="gvnsql-tab active" data-tab="data">Chart & Data</button> |
| 52 |
<button type="button" class="gvnsql-tab" data-tab="filters">Input Filters</button> |
| 53 |
<button type="button" class="gvnsql-tab" data-tab="style">Style</button> |
| 54 |
<button type="button" class="gvnsql-tab" data-tab="advanced">Advanced</button> |
| 55 |
</nav> |
| 56 |
|
| 57 |
<!-- ============ TAB 1: CHART & DATA ============ --> |
| 58 |
<section class="gvnsql-section active" data-tab="data"> |
| 59 |
|
| 60 |
<h4 class="gvnsql-step">Pick a chart type</h4> |
| 61 |
<div class="gvnsql-typegrid"> |
| 62 |
<?php foreach ($gvnsql_catalog as $slug => $info) { ?> |
| 63 |
<label class="gvnsql-typecard<?php echo $slug == $gvnsql_type ? ' selected' : ''; ?>" data-type="<?php echo esc_attr($slug); ?>"> |
| 64 |
<input type="radio" name="guaven_sqlcharts_graphtype" value="<?php echo esc_attr($slug); ?>" <?php checked($slug, $gvnsql_type); ?>> |
| 65 |
<span class="gvnsql-typeicon"><?php echo wp_kses($gvnsql_icons[$slug], $gvnsql_svg_kses); ?></span> |
| 66 |
<span class="gvnsql-typelabel"><?php echo esc_html($info['label']); ?></span> |
| 67 |
</label> |
| 68 |
<?php } ?> |
| 69 |
</div> |
| 70 |
|
| 71 |
<?php foreach ($gvnsql_catalog as $slug => $info) { ?> |
| 72 |
<div class="gvnsql-guide" data-guide="<?php echo esc_attr($slug); ?>" <?php echo $slug == $gvnsql_type ? '' : 'style="display:none"'; ?>> |
| 73 |
<div class="gvnsql-guide-text"> |
| 74 |
<strong><?php echo esc_html($info['label']); ?> chart — when to use it:</strong> |
| 75 |
<?php echo esc_html($info['guide']); ?> |
| 76 |
</div> |
| 77 |
<div class="gvnsql-guide-example"> |
| 78 |
<code><?php echo esc_html($info['example_sql']); ?></code> |
| 79 |
<button type="button" class="button gvnsql-use-example" |
| 80 |
data-sql="<?php echo esc_attr($info['example_sql']); ?>" |
| 81 |
data-x="<?php echo esc_attr($info['example_x']); ?>" |
| 82 |
data-y="<?php echo esc_attr(strpos($info['example_y'], ';') === false ? $info['example_y'] : 'postcount'); ?>" |
| 83 |
data-yl="<?php echo esc_attr($info['example_y']); ?>">Use this example</button> |
| 84 |
</div> |
| 85 |
</div> |
| 86 |
<?php } ?> |
| 87 |
|
| 88 |
<h4 class="gvnsql-step">Build your SQL query</h4> |
| 89 |
|
| 90 |
<div class="gvnsql-toolbar" id="gvnsql-toolbar"> |
| 91 |
<span class="gvnsql-toolbar-group"> |
| 92 |
<button type="button" class="gvnsql-kw" data-insert="SELECT ">SELECT</button> |
| 93 |
<button type="button" class="gvnsql-kw" data-insert="COUNT(*) ">COUNT(*)</button> |
| 94 |
<button type="button" class="gvnsql-kw" data-insert="FROM ">FROM</button> |
| 95 |
<button type="button" class="gvnsql-kw" data-insert="WHERE ">WHERE</button> |
| 96 |
<button type="button" class="gvnsql-kw" data-insert="AND ">AND</button> |
| 97 |
<button type="button" class="gvnsql-kw" data-insert="GROUP BY ">GROUP BY</button> |
| 98 |
<button type="button" class="gvnsql-kw" data-insert="ORDER BY ">ORDER BY</button> |
| 99 |
<button type="button" class="gvnsql-kw" data-insert="DESC ">DESC</button> |
| 100 |
<button type="button" class="gvnsql-kw" data-insert="LIMIT 10 ">LIMIT</button> |
| 101 |
</span> |
| 102 |
<span class="gvnsql-toolbar-group"> |
| 103 |
<select id="gvnsql-table-select"><option value="">Insert table…</option></select> |
| 104 |
<select id="gvnsql-column-select"><option value="">Insert column…</option></select> |
| 105 |
<select id="gvnsql-tag-select"><option value="">Insert filter tag…</option></select> |
| 106 |
</span> |
| 107 |
</div> |
| 108 |
|
| 109 |
<div class="gvnsql-editorwrap"> |
| 110 |
<textarea name="guaven_sqlcharts_code" id="guaven_sqlcharts_code" rows="8" spellcheck="false" |
| 111 |
placeholder="Start typing your query — autocomplete will suggest SQL keywords, your real table names and column names. Or click the buttons above to build the query step by step."><?php |
| 112 |
echo esc_textarea(guaven_sqlcharts_get_code($post->ID)); |
| 113 |
?></textarea> |
| 114 |
</div> |
| 115 |
<p class="gvnsql-hint"> |
| 116 |
Tip: press <b>Ctrl+Space</b> for suggestions at any point. Separate multiple queries with <b>;</b> to build comparison charts. |
| 117 |
Supported dynamic tags: <code>{current_user_id}</code>, <code>{current_user_login}</code>, <code>{current_user_email}</code>, <code>{current_user_display_name}</code> |
| 118 |
— plus every filter you define in the Input Filters tab. |
| 119 |
</p> |
| 120 |
|
| 121 |
<div class="gvnsql-mapbox"> |
| 122 |
<h4 class="gvnsql-step gvnsql-mapbox-title"><span class="gvnsql-mapbox-badge">Final step</span> Map query columns to the chart</h4> |
| 123 |
<p class="gvnsql-hint gvnsql-mapbox-hint">Tell the chart which query column goes to which axis. The dropdowns are filled with the columns found in your SQL query above.</p> |
| 124 |
<div class="gvnsql-grid2"> |
| 125 |
<div class="gvnsql-field"> |
| 126 |
<label for="guaven_sqlcharts_xarg_s_select">X axis — column from your query</label> |
| 127 |
<select id="guaven_sqlcharts_xarg_s_select" class="gvnsql-colselect" data-target="guaven_sqlcharts_xarg_s"></select> |
| 128 |
<input type="text" name="guaven_sqlcharts_xarg_s" id="guaven_sqlcharts_xarg_s" class="gvnsql-colcustom" list="gvnsql-columns" |
| 129 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_xarg_s')); ?>" placeholder="e.g. monthandyear"> |
| 130 |
<small>The column whose values become the labels/X positions.</small> |
| 131 |
</div> |
| 132 |
<div class="gvnsql-field"> |
| 133 |
<label for="guaven_sqlcharts_yarg_s_select">Y axis — column from your query</label> |
| 134 |
<select id="guaven_sqlcharts_yarg_s_select" class="gvnsql-colselect" data-target="guaven_sqlcharts_yarg_s"></select> |
| 135 |
<input type="text" name="guaven_sqlcharts_yarg_s" id="guaven_sqlcharts_yarg_s" class="gvnsql-colcustom" list="gvnsql-columns" |
| 136 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_yarg_s')); ?>" placeholder="e.g. postcount"> |
| 137 |
<small>The numeric column that becomes the chart values. Use one output name even with multiple queries.</small> |
| 138 |
</div> |
| 139 |
<div class="gvnsql-field"> |
| 140 |
<label for="guaven_sqlcharts_xarg_l">X axis label (display text)</label> |
| 141 |
<input type="text" name="guaven_sqlcharts_xarg_l" id="guaven_sqlcharts_xarg_l" |
| 142 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_xarg_l')); ?>" placeholder="e.g. Months"> |
| 143 |
<small>Shown as the X axis title on Bar, Line and Scatter charts, and as the first table-view header.</small> |
| 144 |
</div> |
| 145 |
<div class="gvnsql-field"> |
| 146 |
<label for="guaven_sqlcharts_yarg_l">Y axis label / series name(s)</label> |
| 147 |
<input type="text" name="guaven_sqlcharts_yarg_l" id="guaven_sqlcharts_yarg_l" |
| 148 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_yarg_l')); ?>" placeholder="e.g. Post count"> |
| 149 |
<small>Shown in the legend and as the Y axis title. With multiple queries, separate one name per query with ";" (then only the legend is used).</small> |
| 150 |
</div> |
| 151 |
</div> |
| 152 |
</div> |
| 153 |
<datalist id="gvnsql-columns"></datalist> |
| 154 |
|
| 155 |
<p class="gvnsql-checkbox-row"><label><input type="checkbox" name="guaven_sqlcharts_tablepart" value="1" <?php echo $gvnsql_meta('guaven_sqlcharts_tablepart') != '' ? 'checked' : ''; ?>> |
| 156 |
Show table-view data below the graph</label></p> |
| 157 |
</section> |
| 158 |
|
| 159 |
<!-- ============ TAB 2: INPUT FILTERS ============ --> |
| 160 |
<section class="gvnsql-section" data-tab="filters"> |
| 161 |
<h4 class="gvnsql-step">Input filters — no code needed</h4> |
| 162 |
<p class="gvnsql-hint">Each filter becomes an input field above your chart at the front-end, and a <code>{tag}</code> placed inside the SQL query. |
| 163 |
The tag dropdown suggests <code>{tags}</code> already written in your query and columns from its WHERE part. |
| 164 |
Example: pick or type <b>fromdate</b> with type <b>date</b>, click "Insert into query" and complete the condition, e.g. <code>WHERE post_date > {fromdate}</code>.</p> |
| 165 |
|
| 166 |
<div id="gvnsql-filters-rows"></div> |
| 167 |
<p> |
| 168 |
<button type="button" class="button button-secondary" id="gvnsql-add-filter">+ Add filter</button> |
| 169 |
<button type="button" class="button-link" id="gvnsql-raw-toggle">Edit raw format</button> |
| 170 |
</p> |
| 171 |
|
| 172 |
<textarea name="guaven_sqlcharts_variables" id="guaven_sqlcharts_variables" class="gvnsql-raw" rows="2"><?php |
| 173 |
echo esc_textarea(trim($gvnsql_meta('guaven_sqlcharts_variables'))); |
| 174 |
?></textarea> |
| 175 |
<p class="gvnsql-hint gvnsql-raw">Raw format: <i>name~default~label~type | name~default~label~type</i> (type: text, number or date)</p> |
| 176 |
|
| 177 |
<div class="gvnsql-grid2" style="margin-top:14px"> |
| 178 |
<div class="gvnsql-field"> |
| 179 |
<label>Visibility</label> |
| 180 |
<label class="gvnsql-inlinecheck"><input type="checkbox" name="guaven_sqlcharts_formpartrole" value="1" |
| 181 |
<?php echo $gvnsql_meta('guaven_sqlcharts_formpartrole') !== '' ? 'checked' : ''; ?>> |
| 182 |
Hide the filters form from not-logged-in visitors</label> |
| 183 |
</div> |
| 184 |
<div class="gvnsql-field"> |
| 185 |
<label for="guaven_sqlcharts_formpartbutton">Submit button text</label> |
| 186 |
<input type="text" name="guaven_sqlcharts_formpartbutton" id="guaven_sqlcharts_formpartbutton" |
| 187 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_formpartbutton')); ?>" placeholder="OK"> |
| 188 |
</div> |
| 189 |
</div> |
| 190 |
</section> |
| 191 |
|
| 192 |
<!-- ============ TAB 3: STYLE ============ --> |
| 193 |
<section class="gvnsql-section" data-tab="style"> |
| 194 |
<h4 class="gvnsql-step">Colors</h4> |
| 195 |
<p class="gvnsql-hint">One color per data series (or per slice for circular charts). Leave empty to use the built-in palette.</p> |
| 196 |
<div id="gvnsql-colors-rows" class="gvnsql-colors"></div> |
| 197 |
<p><button type="button" class="button button-secondary" id="gvnsql-add-color">+ Add color</button></p> |
| 198 |
<input type="hidden" name="guaven_sqlcharts_colors" id="guaven_sqlcharts_colors" |
| 199 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_colors')); ?>"> |
| 200 |
|
| 201 |
<div class="gvnsql-grid2"> |
| 202 |
<div class="gvnsql-field"> |
| 203 |
<label for="guaven_sqlcharts_legend_position">Legend position</label> |
| 204 |
<?php $gvnsql_legend = esc_attr($gvnsql_meta('guaven_sqlcharts_legend_position')); ?> |
| 205 |
<select name="guaven_sqlcharts_legend_position" id="guaven_sqlcharts_legend_position"> |
| 206 |
<option value="default">Hidden (default)</option> |
| 207 |
<option value="top" <?php selected($gvnsql_legend, 'top'); ?>>Show at the top</option> |
| 208 |
<option value="bottom" <?php selected($gvnsql_legend, 'bottom'); ?>>Show at the bottom</option> |
| 209 |
<option value="left" <?php selected($gvnsql_legend, 'left'); ?>>Show at the left</option> |
| 210 |
<option value="right" <?php selected($gvnsql_legend, 'right'); ?>>Show at the right</option> |
| 211 |
</select> |
| 212 |
<small>The legend lists your series names (Y label field).</small> |
| 213 |
</div> |
| 214 |
<div class="gvnsql-field"> |
| 215 |
<label>Value labels</label> |
| 216 |
<label class="gvnsql-inlinecheck"><input type="checkbox" name="guaven_sqlcharts_forcetooltips" id="guaven_sqlcharts_forcetooltips" value="1" |
| 217 |
<?php echo $gvnsql_meta('guaven_sqlcharts_forcetooltips') != '' ? 'checked' : ''; ?>> |
| 218 |
Always show values on the chart (not only on mouse-over). Works with every chart type.</label> |
| 219 |
</div> |
| 220 |
<div class="gvnsql-field"> |
| 221 |
<label for="guaven_sqlcharts_chartwidth">Max width (px)</label> |
| 222 |
<input type="number" name="guaven_sqlcharts_chartwidth" id="guaven_sqlcharts_chartwidth" |
| 223 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_chartwidth')); ?>" placeholder="auto"> |
| 224 |
<small>Leave empty for full container width (responsive).</small> |
| 225 |
</div> |
| 226 |
<div class="gvnsql-field"> |
| 227 |
<label for="guaven_sqlcharts_chartheight">Height (px)</label> |
| 228 |
<input type="number" name="guaven_sqlcharts_chartheight" id="guaven_sqlcharts_chartheight" |
| 229 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_chartheight')); ?>" placeholder="auto"> |
| 230 |
<small>Leave empty to keep the natural aspect ratio.</small> |
| 231 |
</div> |
| 232 |
</div> |
| 233 |
</section> |
| 234 |
|
| 235 |
<!-- ============ TAB 4: ADVANCED ============ --> |
| 236 |
<section class="gvnsql-section" data-tab="advanced"> |
| 237 |
<h4 class="gvnsql-step">Axis behavior (Line and Bar charts)</h4> |
| 238 |
<div class="gvnsql-checkgrid"> |
| 239 |
<label class="gvnsql-inlinecheck"><input type="checkbox" name="guaven_sqlcharts_begin_with_0_x" value="1" |
| 240 |
<?php echo $gvnsql_meta('guaven_sqlcharts_begin_with_0_x') !== '' ? 'checked' : ''; ?>> Force X axis to start at 0</label> |
| 241 |
<label class="gvnsql-inlinecheck"><input type="checkbox" name="guaven_sqlcharts_begin_with_0_y" value="1" |
| 242 |
<?php echo $gvnsql_meta('guaven_sqlcharts_begin_with_0_y') !== '' ? 'checked' : ''; ?>> Force Y axis to start at 0</label> |
| 243 |
<label class="gvnsql-inlinecheck"><input type="checkbox" name="guaven_sqlcharts_round_y_values" value="1" |
| 244 |
<?php echo $gvnsql_meta('guaven_sqlcharts_round_y_values') !== '' ? 'checked' : ''; ?>> Show only round numbers on the Y axis</label> |
| 245 |
<label class="gvnsql-inlinecheck"><input type="checkbox" name="guaven_sqlcharts_nostacked" value="1" |
| 246 |
<?php echo $gvnsql_meta('guaven_sqlcharts_nostacked') !== '' ? 'checked' : ''; ?>> Disable stacking of multiple datasets (Bar charts)</label> |
| 247 |
</div> |
| 248 |
|
| 249 |
<h4 class="gvnsql-step">Remote MySQL database (optional)</h4> |
| 250 |
<p class="gvnsql-hint">Leave all fields empty to use this WordPress site's own database.</p> |
| 251 |
<div class="gvnsql-grid2"> |
| 252 |
<div class="gvnsql-field"> |
| 253 |
<label for="guaven_sqlcharts_dbhost">Database host</label> |
| 254 |
<input type="text" name="guaven_sqlcharts_dbhost" id="guaven_sqlcharts_dbhost" |
| 255 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_dbhost')); ?>" placeholder="e.g. 127.0.0.1"> |
| 256 |
</div> |
| 257 |
<div class="gvnsql-field"> |
| 258 |
<label for="guaven_sqlcharts_dbname">Database name</label> |
| 259 |
<input type="text" name="guaven_sqlcharts_dbname" id="guaven_sqlcharts_dbname" |
| 260 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_dbname')); ?>"> |
| 261 |
</div> |
| 262 |
<div class="gvnsql-field"> |
| 263 |
<label for="guaven_sqlcharts_dblogin">Database username</label> |
| 264 |
<input type="text" name="guaven_sqlcharts_dblogin" id="guaven_sqlcharts_dblogin" |
| 265 |
value="<?php echo esc_attr($gvnsql_meta('guaven_sqlcharts_dblogin')); ?>"> |
| 266 |
</div> |
| 267 |
<div class="gvnsql-field"> |
| 268 |
<label for="guaven_sqlcharts_dbpass">Database password</label> |
| 269 |
<?php |
| 270 |
$gvnsql_dbpass = $gvnsql_meta('guaven_sqlcharts_dbpass'); |
| 271 |
if (is_array($gvnsql_dbpass)) { |
| 272 |
$gvnsql_dbpass = guaven_sqlcharts_encrypt_decrypt('decrypt', $gvnsql_dbpass[1]); |
| 273 |
} |
| 274 |
?> |
| 275 |
<input type="password" name="guaven_sqlcharts_dbpass" id="guaven_sqlcharts_dbpass" |
| 276 |
value="<?php echo esc_attr($gvnsql_dbpass); ?>" autocomplete="new-password"> |
| 277 |
<small>Stored encrypted. WordPress supports MySQL databases; for other engines |
| 278 |
<a target="_blank" href="https://guaven.com/contact/solution-request/">contact us</a>.</small> |
| 279 |
</div> |
| 280 |
</div> |
| 281 |
</section> |
| 282 |
|
| 283 |
</div><!-- /gvnsql-app --> |
| 284 |
|
| 285 |
<script> |
| 286 |
if (jQuery("#post").attr("action") && jQuery("#post").attr("action").indexOf("#") === -1){ |
| 287 |
jQuery("#post").attr("action", jQuery("#post").attr("action") + "#sqldemo"); |
| 288 |
} |
| 289 |
</script> |
| 290 |
|
| 291 |
<?php |
| 292 |
$postfix = guaven_sqlcharts_graphtype($post); |
| 293 |
if ($postfix !== '' or $gvnsql_meta('guaven_sqlcharts_code') != '') { |
| 294 |
// legacy google types ($postfix === '') render via the [gvn_schart] alias shortcode |
| 295 |
?> |
| 296 |
<div class="gf-alert-success gf-alert"> |
| 297 |
<h4> |
| 298 |
Text shortcode: [gvn_schart<?php |
| 299 |
echo esc_attr($postfix); |
| 300 |
?> id="<?php |
| 301 |
echo esc_attr($post->ID); |
| 302 |
?>"<?php echo $gvnsql_meta('guaven_sqlcharts_tablepart') !== '' ? ' table="1"' : ''; ?>] |
| 303 |
<br> |
| 304 |
<br> |
| 305 |
PHP shortcode: <?php echo do_shortcode(' [gvn_schart<?php |
| 306 |
echo esc_attr($postfix); |
| 307 |
?> id="<?php |
| 308 |
echo esc_attr($post->ID); |
| 309 |
?>"<?php echo $gvnsql_meta('guaven_sqlcharts_tablepart') !== '' ? ' table="1"' : ''; ?>]'); ?> |
| 310 |
</h4> |
| 311 |
<p>Note: Shortcodes support width and height attributes, f.e. [gvn_schart<?php |
| 312 |
echo esc_attr($postfix); |
| 313 |
?> id="1" width="500" height="400"]. Without attributes, the width/height from the Style tab is used. |
| 314 |
</div> |
| 315 |
<hr> |
| 316 |
<h3 id="sqldemo" name="sqldemo">Live Preview <small style="font-weight:normal">(reflects the last saved state — press Update to refresh)</small></h3> |
| 317 |
<?php |
| 318 |
echo do_shortcode('[gvn_schart' . esc_attr($postfix) . ' id="' . esc_attr($post->ID) . '" ' . ($gvnsql_meta('guaven_sqlcharts_tablepart') !== '' ? ' table="1"' : '') . ']'); |
| 319 |
|
| 320 |
} |
| 321 |
?> |
| 322 |
|
