{"id":300,"date":"2018-04-12T14:19:31","date_gmt":"2018-04-12T08:49:31","guid":{"rendered":"https:\/\/ssjtourism.com\/?page_id=300"},"modified":"2018-04-12T14:20:37","modified_gmt":"2018-04-12T08:50:37","slug":"direction","status":"publish","type":"page","link":"https:\/\/ssjtourism.com\/index.php\/direction\/","title":{"rendered":"Direction"},"content":{"rendered":"            <script type=\"text\/javascript\">\r\n                jQuery(document).ready(function ($) {\r\n                    var wgm_map = new google.maps.Map(document.getElementById(\"srm_gmp_embed_1\"), {\r\n                        center: new google.maps.LatLng(12.9715987,77.59456269999998),\r\n                        zoom:13,\r\n                        mapTypeId: google.maps.MapTypeId.ROADMAP,\r\n                        scrollwheel: true,\r\n                        zoomControl: true,\r\n                        mapTypeControl: true,\r\n                        streetViewControl: true,\r\n                        fullscreenControl: true,\r\n                        draggable: true,\r\n                        disableDoubleClickZoom: false,\r\n                        panControl: true                    });\r\n                    var wgm_theme_json = '';\r\n                    if (wgm_theme_json.length > 0) {\r\n                        wgm_map.setOptions({styles: JSON.parse(wgm_theme_json)});\r\n                    }\r\n                    \/\/ To view directions form and data\r\n                                        var wgm_directionsDisplay_1 = new google.maps.DirectionsRenderer();\r\n                    wgm_directionsDisplay_1.setMap(wgm_map);\r\n                    wgm_directionsDisplay_1.setPanel(document.getElementById(\"wp_gmap_directions_1\"));\r\n\r\n                    var wgm_get_direction_btn_1 = document.getElementById('wp_gmap_submit_1');\r\n                    wgm_get_direction_btn_1.addEventListener('click', function () {\r\n                        var wgm_selectedMode_1 = document.getElementById(\"srm_gmap_mode_1\").value,\r\n                            wgm_dirction_start_1 = document.getElementById(\"srm_gmap_from_1\").value,\r\n                            wgm_direction_end_1 = document.getElementById(\"srm_gmap_to_1\").value;\r\n\r\n                        if (wgm_dirction_start_1 === '' || wgm_direction_end_1 === '') {\r\n                            \/\/ cannot calculate route\r\n                            document.getElementById(\"wp_gmap_results_1\").style.display = 'none';\r\n                            return false;\r\n                        } else {\r\n\r\n\r\n                            document.getElementById('wp_gmap_loading_1').style.display = 'block';\r\n\r\n                            var wgm_direction_request_1 = {\r\n                                origin: wgm_dirction_start_1,\r\n                                destination: wgm_direction_end_1,\r\n                                travelMode: google.maps.DirectionsTravelMode[wgm_selectedMode_1],\r\n                                unitSystem: google.maps.UnitSystem.METRIC                            };\r\n                            var wgm_directionsService_1 = new google.maps.DirectionsService();\r\n                            wgm_directionsService_1.route(wgm_direction_request_1, function (response, status) {\r\n                                document.getElementById('wp_gmap_loading_1').style.display = 'none';\r\n                                if (status === google.maps.DirectionsStatus.OK) {\r\n                                    wgm_directionsDisplay_1.setDirections(response);\r\n                                    document.getElementById(\"wp_gmap_results_1\").style.display = 'block';\r\n                                } else {\r\n                                    document.getElementById(\"wp_gmap_results_1\").style.display = 'none';\r\n                                }\r\n                            });\r\n\r\n                        }\r\n                    });\r\n                                        var wgm_data_1 = {\r\n                        'action': 'wpgmapembed_p_get_markers_by_map_id',\r\n                        'data': {\r\n                            map_id: '297',\r\n                            ajax_nonce: '88023709cb'\r\n                        }\r\n                    };\r\n                    var wgm_ajaxurl_1 = 'https:\/\/ssjtourism.com\/wp-admin\/admin-ajax.php'\r\n                    jQuery.post(wgm_ajaxurl_1, wgm_data_1, function (response) {\r\n                        response = JSON.parse(response);\r\n                        if (response.markers.length === 1) {\r\n                            var wgm_marker_to_1 = response.markers[0].marker_desc.replace(\/&gt;\/g, '>').replace(\/&lt;\/g, '<');\r\n                            jQuery('#srm_gmap_to_1').val(wgm_marker_to_1.replace(\/(<([^>]+)>)\/gi, \"\"));\r\n                        }\r\n                        var wgm_default_marker_icon_1 = 'https:\/\/maps.gstatic.com\/mapfiles\/api-3\/images\/spotlight-poi2.png';\r\n                        if (response.markers.length > 0) {\r\n                            var custom_markers = [];\r\n                            var custom_marker_infowindows = [];\r\n                            response.markers.forEach(function (wgm_marker, i) {\r\n                                var wgm_marker_lat_lng_1 = wgm_marker.lat_lng.split(',');\r\n                                wgm_custom_marker_1 = new google.maps.Marker({\r\n                                    position: new google.maps.LatLng(wgm_marker_lat_lng_1[0], wgm_marker_lat_lng_1[1]),\r\n                                    title: wgm_marker.marker_name,\r\n                                    animation: google.maps.Animation.DROP,\r\n                                    icon: (wgm_marker.icon === '') ? wgm_default_marker_icon_1 : wgm_marker.icon\r\n                                });\r\n                                custom_markers[i] = wgm_custom_marker_1;\r\n                                wgm_custom_marker_1.setMap(wgm_map);\r\n                                var wgm_marker_name_1 = (wgm_marker.marker_name !== null) ? ('<span class=\"info_content_title\" style=\"font-size:18px;font-weight: bold;font-family: Arial;\">'\r\n                                    + wgm_marker.marker_name +\r\n                                    '<\/span><br\/>') : '';\r\n                                wgm_marker.marker_desc = wgm_marker.marker_desc.replace(\/&gt;\/g, '>').replace(\/&lt;\/g, '<');\r\n                                custom_marker_infowindow = new google.maps.InfoWindow({\r\n                                    content: wgm_marker_name_1 + wgm_marker.marker_desc\r\n                                });\r\n                                custom_marker_infowindows[i] = custom_marker_infowindow;\r\n                                if (wgm_marker.show_desc_by_default === '1') {\r\n                                    custom_marker_infowindow.open({\r\n                                        anchor: wgm_custom_marker_1,\r\n                                        shouldFocus: false\r\n                                    });\r\n                                } else {\r\n                                    google.maps.event.addListener(wgm_custom_marker_1, 'click', function () {\r\n                                        custom_marker_infowindows[i].open({\r\n                                            anchor: custom_markers[i],\r\n                                            shouldFocus: false\r\n                                        });\r\n                                    });\r\n                                }\r\n                                if (wgm_marker.have_marker_link === '1') {\r\n                                    google.maps.event.addListener(wgm_custom_marker_1, 'click', function () {\r\n                                        var wgm_target = '_self';\r\n                                        if (wgm_marker.marker_link_new_tab === '1') {\r\n                                            wgm_target = '_blank';\r\n                                        }\r\n                                        window.open(wgm_marker.marker_link, wgm_target);\r\n                                    });\r\n                                }\r\n                            });\r\n                        }\r\n                    });\r\n                });\r\n\r\n            <\/script>\r\n\r\n            <div id=\"srm_gmp_embed_1\"\r\n                 style=\"width:100% !important;height:300px  !important; \">\r\n            <\/div>\r\n                            <style type=\"text\/css\">\r\n                    .wp_gmap_direction_box {\r\n                        width: 100%;\r\n                        height: auto;\r\n                    }\r\n\r\n                    .fieldcontain {\r\n                        margin: 8px 0;\r\n                    }\r\n\r\n                    #wp_gmap_submit {\r\n                        background-color: #333;\r\n                        border: 0;\r\n                        color: #fff;\r\n                        cursor: pointer;\r\n                        font-family: \"Noto Sans\", sans-serif;\r\n                        font-size: 12px;\r\n                        font-weight: 700;\r\n                        padding: 13px 24px;\r\n                        text-transform: uppercase;\r\n                    }\r\n\r\n                    #wp_gmap_directions {\r\n                        border: 1px #ddd solid;\r\n                    }\r\n                <\/style>\r\n                <div class=\"wp_gmap_direction_box\">\r\n                    <div class=\"ui-bar-c ui-corner-all ui-shadow\">\r\n                        <div data-role=\"fieldcontain\" class=\"fieldcontain\">\r\n                            <label for=\"srm_gmap_from_1\">From<\/label>\r\n                            <input type=\"text\" id=\"srm_gmap_from_1\" value=\"\"\r\n                                   style=\"width: 100%;\"\/>\r\n                        <\/div>\r\n                        <div data-role=\"fieldcontain\" class=\"fieldcontain\">\r\n                            <label for=\"srm_gmap_to_1\">To<\/label>\r\n                            <input type=\"text\" id=\"srm_gmap_to_1\"\r\n                                   value=\"\"\r\n                                   style=\"width: 100%\"\/>\r\n                        <\/div>\r\n                        <div data-role=\"fieldcontain\" class=\"fieldcontain\">\r\n                            <label for=\"srm_gmap_mode_1\"\r\n                                   class=\"select\">Transportation method:<\/label>\r\n                            <select name=\"select_choice_1\"\r\n                                    id=\"srm_gmap_mode_1\"\r\n                                    style=\"padding: 5px;width: 100%;\">\r\n                                <option value=\"DRIVING\">Driving<\/option>\r\n                                <option value=\"WALKING\">Walking<\/option>\r\n                                <option value=\"BICYCLING\">Bicycling<\/option>\r\n                                <option value=\"TRANSIT\">Transit<\/option>\r\n                            <\/select>\r\n                        <\/div>\r\n                        <button type=\"button\" data-icon=\"search\" data-role=\"button\" href=\"#\" style=\"padding:8px;\"\r\n                                id=\"wp_gmap_submit_1\">Get Directions                        <\/button>\r\n                        <span id=\"wp_gmap_loading_1\"\r\n                              style=\"display: none;\">Loading...<\/span>\r\n                    <\/div>\r\n\r\n                    <!-- Directions will be listed here-->\r\n                    <div id=\"wp_gmap_results_1\"\r\n                         style=\"display:none;max-height: 300px;overflow-y: scroll;\">\r\n                        <div id=\"wp_gmap_directions_1\"><\/div>\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n                        \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-300","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/pages\/300","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/comments?post=300"}],"version-history":[{"count":2,"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/pages\/300\/revisions"}],"predecessor-version":[{"id":304,"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/pages\/300\/revisions\/304"}],"wp:attachment":[{"href":"https:\/\/ssjtourism.com\/index.php\/wp-json\/wp\/v2\/media?parent=300"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}