wp_yuvakumar
Forum Replies Created
Viewing 6 replies - 1 through 6 (of 6 total)
-
Forum: Plugins
In reply to: [ImageMapper] Hover with click?4. Update this function to get link of tooltip
function imgmap_get_link_url($meta) { return isset($meta->tooltip_url) ? $meta->tooltip_url : ''; exit; if($meta->type != 'link') return '#'; switch($meta->link_type) { case 'post': return get_permalink($meta->link_post); case 'page': return get_permalink($meta->link_page); default: return isset($meta->tooltip_url) ? $meta->tooltip_url : ''; } }Forum: Plugins
In reply to: [ImageMapper] Hover with click?3. Update this function for tooltip with link
function imgmap_create_area_element($id, $title) { $imgmap_colors = get_option('imgmap_colors'); $meta = imgmap_get_imgmap_area_vars($id); if($meta === null) $meta = new StdClass(); if(!isset($meta->color) || !isset($imgmap_colors['colors'][$meta->color])) $meta->color = $imgmap_colors['last_chosen']; if(!isset($imgmap_colors['colors'][$meta->color])) $color = array( 'fillColor' => 'fefefe', 'strokeColor' => 'fefefe', 'fillOpacity' => 0.3, 'strokeOpacity' => 0.6, 'strokeWidth' => 1); else $color = $imgmap_colors['colors'][$meta->color]; $meta->type = isset($meta->type) ? $meta->type : ''; $meta->tooltip_text = isset($meta->tooltip_text) ? $meta->tooltip_text : ''; $link = imgmap_get_link_url($meta); $meta->title_attribute = isset($meta->title_attribute) ? $meta->title_attribute : ''; if($link == "" || $link == "#"){ $newTooltip = $meta->tooltip_text; } else { $newTooltip = '<a href="'.esc_attr($link).'" target="_blank">'.$meta->tooltip_text.'</a>'; } return '<area data-type="'.esc_attr($meta->type).'" data-tooltip="'.esc_attr($meta->type == 'tooltip' ? $newTooltip : false ). '" data-fill-color="'.esc_attr(str_replace('#', '', $color['fillColor'])).'" data-fill-opacity="'.esc_attr($color['fillOpacity']).'" data-stroke-color="'.esc_attr(str_replace('#', '', $color['strokeColor'])).'" data-stroke-opacity="'.esc_attr($color['strokeOpacity']).'" data-stroke-width="'.esc_attr($color['strokeWidth']).'" data-mapkey="area-'.$id.'" shape="poly" coords="'.esc_attr(get_post_meta($id, 'coords', true)).'" href="'.esc_attr($link) .'" title="'.(isset($meta->title_attribute) ? $meta->title_attribute : $title).'" />'; }Forum: Plugins
In reply to: [ImageMapper] Hover with click?2. Update this function – to save link in database
function imgmap_save_meta($id = false) { if(get_post_type($id) == IMAGEMAP_POST_TYPE) { if(isset($_FILES['imgmap_image'])) { $uploadedFile = $_FILES['imgmap_image']; if($uploadedFile['error'] == 0){ $file = wp_handle_upload($uploadedFile, array('test_form' => FALSE)); if(!strpos('image/', $file['type']) == 0) wp_die('This is not an image!'); update_post_meta($id, 'imgmap_image', $file['url']); } } } if(get_post_type($id) == IMAGEMAP_AREA_POST_TYPE) { $area_vars = imgmap_get_imgmap_area_vars($id); $area_vars->type = $_POST['area-type']; $area_vars->tooltip_text = wp_kses_post($_POST['area-tooltip-text']); $area_vars->tooltip_url = wp_kses_post($_POST['area-tooltip-url']); $area_vars->title_attribute = esc_attr($_POST['area-title-attribute']); $area_vars->link_url = esc_url($_POST['area-link-url']); $area_vars->link_type = esc_attr($_POST['area-link-type']); $area_vars->link_post = esc_attr($_POST['area-link-post']); $area_vars->link_page = esc_attr($_POST['area-link-page']); // Save area settings in JSON format. // Basically when you need one of them, you need all others as well, so it's inefficient to save them in separate columns. update_post_meta($id, 'imgmap_area_vars', $area_vars); } }Forum: Plugins
In reply to: [ImageMapper] Hover with click?1. Update this function – to add link to tooltip
function imgmap_area_form_types($post) { // Get area variables from post meta $meta = imgmap_get_imgmap_area_vars($post->ID); $meta->type = isset($meta->type) ? $meta->type : 'tooltip'; $meta->tooltip_text = isset($meta->tooltip_text) ? $meta->tooltip_text : ''; $meta->link_url = isset($meta->link_url) ? $meta->link_url : ''; $meta->link_type = isset($meta->link_type) ? $meta->link_type : 'absolute'; $meta->link_page = isset($meta->link_page) ? $meta->link_page : -1; ?> <div style="width: 20%; float: left;" id="area-form-types"> <p><input type="radio" name="area-type" onclick="ShowTypes('link')" value="link" <?php echo $meta->type == 'link' ? 'checked' : '' ?>> <input type="button" class="button" onclick="ShowTypes('link')" value="Link" /></p> <p><input type="radio" name="area-type" onclick="ShowTypes('tooltip')" value="tooltip" <?php echo $meta->type == 'tooltip' ? 'checked' : '' ?>> <input type="button" class="button" onclick="ShowTypes('tooltip')" value="Tooltip" /></p> <p><input type="radio" name="area-type" onclick="ShowTypes('popup')" value="popup" <?php echo $meta->type == 'popup' ? 'checked' : '' ?>> <input type="button" class="button" onclick="ShowTypes('popup')" value="Popup window" /></p> </div> <div id="imagemap-area-type-editors"> <div id="imagemap-area-popup-editor" class="area-type-editors <?php echo $meta->type == 'popup' ? 'area-type-editor-current' : '' ?>"> <h4>Show text and images in a popup window when user clicks the area</h4> <p><label>Map Area Link <br /> <input type="text" name="area-tooltip-url" value="<?php echo $meta->tooltip_url; ?>"/> </label></p> <?php if(function_exists('wp_editor')) { wp_editor($post->post_content, 'content', array( 'editor_css' => '<style> body { min-height: 300px; background-color: white; } </style>' )); } else if(function_exists('the_editor')) { the_editor($post->post_content, 'content', array( 'textarea_rows' => 8 )); } else { echo 'Something went wrong when loading editor.'; } ?></div> <div id="imagemap-area-tooltip-editor" class="area-type-editors <?php echo $meta->type == 'tooltip' ? 'area-type-editor-current' : '' ?>"> <h4>Show a small tooltip when users move their mouse on the area</h4> <p><label>Tooltip text <br /> <textarea name="area-tooltip-text" cols="50" rows="6"><?php echo $meta->tooltip_text; ?></textarea> </label></p> <p>HTML elements such as links and images are allowed. Javascript not so much.</p> <p><label>Map Area Link <br /> <input type="text" name="area-tooltip-url" value="<?php echo $meta->tooltip_url; ?>"/> </label></p> </div> <div id="imagemap-area-link-editor" class="area-type-editors <?php echo $meta->type == 'link' ? 'area-type-editor-current' : '' ?>"> <h4>Select where users should be redirected when they click the area</h4> <table> <tr> <td><label><input type="radio" name="area-link-type" value="post" <?php echo $meta->link_type == 'post' ? 'checked' : ''; ?>> Link to an existing post:</label></td> <td> <select name="area-link-post"><?php $posts = get_posts(array('numberposts' => -1)); foreach($posts as $post) { echo '<option value="'.$post->ID.'" '.($meta->link_post == $post->ID ? 'selected' : '').'>'.(strlen($post->post_title) ? $post->post_title : '(untitled, id: '.$post->ID.')').'</option>'; } ?></select> </td> <tr><td><label><input type="radio" name="area-link-type" value="page" <?php echo $meta->link_type == 'page' ? 'checked' : ''; ?>> Link to an existing page:</label></td><td><?php wp_dropdown_pages(array('name' => 'area-link-page', 'selected' => $meta->link_page)); ?></td></tr> <tr><td><label><input type="radio" name="area-link-type" value="absolute" <?php echo $meta->link_type == 'absolute' ? 'checked' : ''; ?>> Link to an url address:</label></td><td><input type="text" name="area-link-url" value="<?php echo $meta->link_url; ?>"></td></tr> </tr> </table> </div> <div id="wp-content-media-buttons" class="wp-media-buttons"> <a href="#" class="button insert-media add_media" data-editor="content" title="Add Media"> <span class="wp-media-buttons-icon"></span> Add Media </a> </div> </div> <br style="clear:both"> <?php }Forum: Plugins
In reply to: [ImageMapper] Hover with click?1. Imagemapper.php // in plugin directory
change this function as bellow,function imgmap_area_form_types($post) { // Get area variables from post meta $meta = imgmap_get_imgmap_area_vars($post->ID); $meta->type = isset($meta->type) ? $meta->type : 'tooltip'; $meta->tooltip_text = isset($meta->tooltip_text) ? $meta->tooltip_text : ''; $meta->link_url = isset($meta->link_url) ? $meta->link_url : ''; $meta->link_type = isset($meta->link_type) ? $meta->link_type : 'absolute'; $meta->link_page = isset($meta->link_page) ? $meta->link_page : -1; ?> <div style="width: 20%; float: left;" id="area-form-types"> <p><input type="radio" name="area-type" onclick="ShowTypes('link')" value="link" <?php echo $meta->type == 'link' ? 'checked' : '' ?>> <input type="button" class="button" onclick="ShowTypes('link')" value="Link" /></p> <p><input type="radio" name="area-type" onclick="ShowTypes('tooltip')" value="tooltip" <?php echo $meta->type == 'tooltip' ? 'checked' : '' ?>> <input type="button" class="button" onclick="ShowTypes('tooltip')" value="Tooltip" /></p> <p><input type="radio" name="area-type" onclick="ShowTypes('popup')" value="popup" <?php echo $meta->type == 'popup' ? 'checked' : '' ?>> <input type="button" class="button" onclick="ShowTypes('popup')" value="Popup window" /></p> </div> <div id="imagemap-area-type-editors"> <div id="imagemap-area-popup-editor" class="area-type-editors <?php echo $meta->type == 'popup' ? 'area-type-editor-current' : '' ?>"> <h4>Show text and images in a popup window when user clicks the area</h4> <p><label>Map Area Link <br /> <input type="text" name="area-tooltip-url" value="<?php echo $meta->tooltip_url; ?>"/> </label></p> <?php if(function_exists('wp_editor')) { wp_editor($post->post_content, 'content', array( 'editor_css' => '<style> body { min-height: 300px; background-color: white; } </style>' )); } else if(function_exists('the_editor')) { the_editor($post->post_content, 'content', array( 'textarea_rows' => 8 )); } else { echo 'Something went wrong when loading editor.'; } ?></div> <div id="imagemap-area-tooltip-editor" class="area-type-editors <?php echo $meta->type == 'tooltip' ? 'area-type-editor-current' : '' ?>"> <h4>Show a small tooltip when users move their mouse on the area</h4> <p><label>Tooltip text <br /> <textarea name="area-tooltip-text" cols="50" rows="6"><?php echo $meta->tooltip_text; ?></textarea> </label></p> <p>HTML elements such as links and images are allowed. Javascript not so much.</p> <p><label>Map Area Link <br /> <input type="text" name="area-tooltip-url" value="<?php echo $meta->tooltip_url; ?>"/> </label></p> </div> <div id="imagemap-area-link-editor" class="area-type-editors <?php echo $meta->type == 'link' ? 'area-type-editor-current' : '' ?>"> <h4>Select where users should be redirected when they click the area</h4> <table> <tr> <td><label><input type="radio" name="area-link-type" value="post" <?php echo $meta->link_type == 'post' ? 'checked' : ''; ?>> Link to an existing post:</label></td> <td> <select name="area-link-post"><?php $posts = get_posts(array('numberposts' => -1)); foreach($posts as $post) { echo '<option value="'.$post->ID.'" '.($meta->link_post == $post->ID ? 'selected' : '').'>'.(strlen($post->post_title) ? $post->post_title : '(untitled, id: '.$post->ID.')').'</option>'; } ?></select> </td> <tr><td><label><input type="radio" name="area-link-type" value="page" <?php echo $meta->link_type == 'page' ? 'checked' : ''; ?>> Link to an existing page:</label></td><td><?php wp_dropdown_pages(array('name' => 'area-link-page', 'selected' => $meta->link_page)); ?></td></tr> <tr><td><label><input type="radio" name="area-link-type" value="absolute" <?php echo $meta->link_type == 'absolute' ? 'checked' : ''; ?>> Link to an url address:</label></td><td><input type="text" name="area-link-url" value="<?php echo $meta->link_url; ?>"></td></tr> </tr> </table> </div> <div id="wp-content-media-buttons" class="wp-media-buttons"> <a href="#" class="button insert-media add_media" data-editor="content" title="Add Media"> <span class="wp-media-buttons-icon"></span> Add Media </a> </div> </div> <br style="clear:both"> <?php }2. In same page change other function, which i have mentioned bellow.
function imgmap_save_meta($id = false) { if(get_post_type($id) == IMAGEMAP_POST_TYPE) { if(isset($_FILES['imgmap_image'])) { $uploadedFile = $_FILES['imgmap_image']; if($uploadedFile['error'] == 0){ $file = wp_handle_upload($uploadedFile, array('test_form' => FALSE)); if(!strpos('image/', $file['type']) == 0) wp_die('This is not an image!'); update_post_meta($id, 'imgmap_image', $file['url']); } } } if(get_post_type($id) == IMAGEMAP_AREA_POST_TYPE) { $area_vars = imgmap_get_imgmap_area_vars($id); $area_vars->type = $_POST['area-type']; $area_vars->tooltip_text = wp_kses_post($_POST['area-tooltip-text']); $area_vars->tooltip_url = wp_kses_post($_POST['area-tooltip-url']); $area_vars->title_attribute = esc_attr($_POST['area-title-attribute']); $area_vars->link_url = esc_url($_POST['area-link-url']); $area_vars->link_type = esc_attr($_POST['area-link-type']); $area_vars->link_post = esc_attr($_POST['area-link-post']); $area_vars->link_page = esc_attr($_POST['area-link-page']); // Save area settings in JSON format. // Basically when you need one of them, you need all others as well, so it's inefficient to save them in separate columns. update_post_meta($id, 'imgmap_area_vars', $area_vars); } }3. Update below function in same page
function imgmap_create_area_element($id, $title) { $imgmap_colors = get_option('imgmap_colors'); $meta = imgmap_get_imgmap_area_vars($id); if($meta === null) $meta = new StdClass(); if(!isset($meta->color) || !isset($imgmap_colors['colors'][$meta->color])) $meta->color = $imgmap_colors['last_chosen']; if(!isset($imgmap_colors['colors'][$meta->color])) $color = array( 'fillColor' => 'fefefe', 'strokeColor' => 'fefefe', 'fillOpacity' => 0.3, 'strokeOpacity' => 0.6, 'strokeWidth' => 1); else $color = $imgmap_colors['colors'][$meta->color]; $meta->type = isset($meta->type) ? $meta->type : ''; $meta->tooltip_text = isset($meta->tooltip_text) ? $meta->tooltip_text : ''; $link = imgmap_get_link_url($meta); $meta->title_attribute = isset($meta->title_attribute) ? $meta->title_attribute : ''; if($link == "" || $link == "#"){ $newTooltip = $meta->tooltip_text; } else { $newTooltip = '<a href="'.esc_attr($link).'" target="_blank">'.$meta->tooltip_text.'</a>'; } return '<area data-type="'.esc_attr($meta->type).'" data-tooltip="'.esc_attr($meta->type == 'tooltip' ? $newTooltip : false ). '" data-fill-color="'.esc_attr(str_replace('#', '', $color['fillColor'])).'" data-fill-opacity="'.esc_attr($color['fillOpacity']).'" data-stroke-color="'.esc_attr(str_replace('#', '', $color['strokeColor'])).'" data-stroke-opacity="'.esc_attr($color['strokeOpacity']).'" data-stroke-width="'.esc_attr($color['strokeWidth']).'" data-mapkey="area-'.$id.'" shape="poly" coords="'.esc_attr(get_post_meta($id, 'coords', true)).'" href="'.esc_attr($link) .'" title="'.(isset($meta->title_attribute) ? $meta->title_attribute : $title).'" />'; }4. Update bellow function also in same page
function imgmap_get_link_url($meta) { return isset($meta->tooltip_url) ? $meta->tooltip_url : ''; exit; if($meta->type != 'link') return '#'; switch($meta->link_type) { case 'post': return get_permalink($meta->link_post); case 'page': return get_permalink($meta->link_page); default: return isset($meta->tooltip_url) ? $meta->tooltip_url : ''; } }Good luck.
Forum: Plugins
In reply to: [ImageMapper] Hover with click?Hi,
I did it, if you need it still, i will share code.
Reply back to me.
Viewing 6 replies - 1 through 6 (of 6 total)