henikseptiana15

Untitled

Jul 29th, 2021
1,060
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml"
  4. xmlns:ui="http://java.sun.com/jsf/facelets"
  5. xmlns:f="http://java.sun.com/jsf/core"
  6. xmlns:h="http://java.sun.com/jsf/html"
  7. xmlns:p="http://primefaces.org/ui"
  8. xmlns:j="http://jleaf.org/faces"
  9. xmlns:jl="http://java.sun.com/jsf/composite/jlcomponents">
  10. <ui:composition template="/WEB-INF/layouts/browse.xhtml">
  11.  <ui:define name="headPart">
  12.        <j:lang id="lang" prefix="org.jleaf.erp.master.web" />
  13.        <title>#{piece['viewGPS']}</title>
  14.        
  15.        <style type="text/css">
  16.             /* Set the size of the div element that contains the map */
  17.             #map {
  18.               height: 400px;
  19.               /* The height is 400 pixels */
  20.               width: 100%;
  21.               /* The width is the width of the web page */
  22.             }              
  23.        </style>
  24.        <script>
  25.             var map;   
  26.            
  27.             function initMap() {
  28.                map = new google.maps.Map(document.getElementById("map"), {
  29.                  zoom: 4,
  30.                  center: #{viewGPSController.getLatLngCenter()},
  31.                  mapTypeId: "terrain",
  32.                });
  33.             }
  34.            
  35.             function setMap(latLngArray) {
  36.                 console.log('Call set map with data : ');
  37.                 console.log(latLngArray);
  38.  
  39.                 const newPolyline = new google.maps.Polyline({
  40.                   path: latLngArray,
  41.                   geodesic: true,
  42.                   strokeColor: "#FF0000",
  43.                   strokeOpacity: 1.0,
  44.                   strokeWeight: 2,
  45.                 });
  46.                
  47.                 if (!latLngArray.length) {
  48.                     console.log("Array is empty!")
  49.                     newPolyline.setMap(null);
  50.                 } else {
  51.  
  52.                     newPolyline.setMap(map);
  53.                 }
  54.             }
  55.         </script>
  56.  
  57.  </ui:define>
  58.  <ui:define name="pageTitle">
  59.       <span>#{piece['viewGPS']}</span>
  60.  </ui:define>
  61.  <ui:define name="filter">
  62.     <j:authorize task="viewGPS">
  63.         <input type="hidden" value="#{viewGPSController}" />
  64.             <p:messages id="messages" autoUpdate="true" />
  65.             <h:panelGrid columns="2" id="panelSearch">
  66.                 <h:outputText value="#{piece['date']}" />              
  67.                 <jl:datePicker value="#{filterBean.data['date']}"
  68.                     id="date" required="true" />
  69.  
  70.                 <h:outputText value="#{piece['salesman']}" />
  71.                 <jl:autoComplete comboName="salesman"
  72.                     id="autoCompleteSalesman"
  73.                     value="#{filterBean.data['salesmanAutoComplete']}"
  74.                     args="Y"
  75.                     itemLabel="#{not empty item['code'] and not empty item['name'] ? item['code'].concat(' - ').concat(item['name']): ''}"
  76.                     label="code, name"
  77.                     styleClass="md" />
  78.  
  79.                 <h:outputText />
  80.                 <p:commandButton id="searchButton" value="#{piece['search']}"
  81.                     actionListener="#{viewGPSController.doSearch()}"
  82.                     icon="ui-icon ui-icon-search"
  83.                     oncomplete="if (args.latLngArray) setMap(JSON.parse( args.latLngArray ))"/>
  84.  
  85.             </h:panelGrid>
  86.             <p:defaultCommand target="searchButton"/>
  87.     </j:authorize>
  88.  </ui:define>
  89.  
  90.  <ui:define name="content">
  91.     <j:authorize task="viewGPS" forbidden="true">
  92.         <h:panelGrid id="mapPanel" width="100%">
  93.             <h3>Google Maps For Tracking Salesman (Ranger)</h3>
  94.             <!--The div element for the map -->
  95.             <div id="map"></div>
  96.        
  97.             <!-- Async script executes immediately and must be after any DOM elements used in callback. -->
  98.             <script async="async" defer="defer"
  99.                 type="text/javascript"
  100.                 src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDHOXjZVF9XrwSemKIBRRFupqm6zYEU8K8&amp;callback=initMap&amp;libraries=&amp;v=weekly&amp;channel=2"></script>
  101.         </h:panelGrid>
  102.     </j:authorize>
  103.  </ui:define>
  104. </ui:composition>
  105. </html>
RAW Paste Data