Proyectos de Subversion LeadersLinked - Antes de SPA

<?php

$this->inlineScript()->appendFile('https://maps.googleapis.com/maps/api/js?key=' . $google_map_key . '&libraries=places');

// months
$months = [
  'LABEL_MONTH_JANUARY',
  'LABEL_MONTH_FEBRUARY',
  'LABEL_MONTH_MARCH',
  'LABEL_MONTH_APRIL',
  'LABEL_MONTH_MAY',
  'LABEL_MONTH_JUNE',
  'LABEL_MONTH_JULY',
  'LABEL_MONTH_AUGUST',
  'LABEL_MONTH_SEPTEMBER',
  'LABEL_MONTH_OCTOBER',
  'LABEL_MONTH_NOVEMBER',
  'LABEL_MONTH_DECEMBER',
];

// vars to json
$userExperiences = json_encode($user_experiences);
$userEducations = json_encode($user_educations);
$monthsJson = json_encode($months);
$userLanguages = json_encode($user_languages);
$userSkills = json_encode($user_skills);
$companySizesOptions = json_encode($company_sizes);
$degreesOptions = json_encode($degrees);
$industriesOptions = json_encode($industries);
$languagesOptions = json_encode($languages);
$skillsOptions = json_encode($skills);
$googleMapPlacesUrl = 'https://maps.googleapis.com/maps/api/js?key=' . $google_map_key . '&libraries=places';
$error_msg = "Por favor seleccione una ubicación real";



$js = <<<JS


// autoComplete place
let autoComplete;

function handleScriptLoad(updateQuery, autoCompleteRef, setAddresObject, setError) {
  autoComplete = new window.google.maps.places.Autocomplete(
    autoCompleteRef.current,
    { types: ["(cities)"]}
  );
  autoComplete.setFields(["address_components", "formatted_address", "geometry"]);
  autoComplete.addListener("place_changed", () =>
    handlePlaceSelect(updateQuery, setAddresObject, setError)
  );
}

async function handlePlaceSelect(updateQuery, setAddresObject, setError) {
  const addressObject = autoComplete.getPlace();
  // console.log(addressObject.geometry.location.lat());
  // console.log(addressObject.geometry.location.lng());
  const query = addressObject.formatted_address;
  if(query){
    setError("");
    updateQuery(query);
    setAddresObject({...addressObject, address_components:[...addressObject.address_components, {latitude: addressObject.geometry.location.lat(),longitude: addressObject.geometry.location.lng(), types:["geometry"]}]});
  }else{
    setError("$error_msg");
  }
}

const backendVars = {
  userIdEncrypted:"$user_uuid",
  userProfileIdEncrypted:"$user_profile_uuid",
  cover:"$cover",
  following:"$following",
  follower:"$follower",
  image:"$image",
  facebook: "$facebook",
  twitter: "$twitter",
  instagram: "$instagram",
  fullName: `$full_name`,
  overview: `$overview`,
  userExperiences: JSON.parse('$userExperiences'),
  userEducations: JSON.parse('$userEducations'),
  months: JSON.parse('$monthsJson'),
  formattedAddress: "$formatted_address",
  userLanguages: JSON.parse('$userLanguages'),
  userSkills: JSON.parse('$userSkills'),
  imageSizeCover: "$image_size_cover",
  imageProfileCover: "$image_size_profile",
  companySizesOptions: JSON.parse('$companySizesOptions'),
  degreesOptions: JSON.parse('$degreesOptions'),
  industriesOptions: JSON.parse('$industriesOptions'),
  // industriesOptions: [],
  newIndustrisOptions: JSON.parse('$industriesOptions'),
  languagesOptions: JSON.parse('$languagesOptions'),
  skillsOptions: JSON.parse('$skillsOptions'),
}
JS;
$this->inlineScript()->appendScript($js);
$this->inlineScript()->appendFile('/react-bundles/profile/edit/profileEditBundle.js');
?>


<div id="react-my-profile-edit">
  <div class="process-comm" id="paginator-process-comm">
    <div class="spinner">
      <div class="bounce1"></div>
      <div class="bounce2"></div>
      <div class="bounce3"></div>
    </div>
  </div>
</div>
<script src="https://cdn.ckeditor.com/4.16.0/standard/ckeditor.js"></script>