{"id":302,"date":"2025-05-12T10:14:38","date_gmt":"2025-05-12T15:14:38","guid":{"rendered":"https:\/\/31.220.104.24\/?page_id=302"},"modified":"2025-05-16T12:47:55","modified_gmt":"2025-05-16T17:47:55","slug":"seminario","status":"publish","type":"page","link":"https:\/\/previanza.com\/old2024\/seminario\/","title":{"rendered":"Seminarios"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"302\" class=\"elementor elementor-302\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fef7a85 e-con-full e-flex e-con e-parent\" data-id=\"fef7a85\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-42b3219 elementor-widget elementor-widget-image\" data-id=\"42b3219\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/previanza.com\/wp-content\/plugins\/elementor\/assets\/images\/placeholder.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-203883b e-con-full e-flex e-con e-parent\" data-id=\"203883b\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2882392 elementor-widget elementor-widget-html\" data-id=\"2882392\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==========  ESTRUCTURA  ========== -->\r\n<div class=\"locations-wrapper\">\r\n  <!-- Mapa \/ vista previa est\u00e1tica -->\r\n  <div id=\"map-holder\">\r\n    <img decoding=\"async\" id=\"staticMap\" class=\"static-preview\"\r\n         src=\"https:\/\/api.mapbox.com\/styles\/v1\/mapbox\/dark-v10\/static\/-79.5,-1.8312,6.3,0\/800x500@2x?access_token=pk.eyJ1Ijoid3VodWlodWFuZzkwIiwiYSI6ImNqZXA5MXVyNzFkMHQzM3BuZWFibTkxZ3AifQ.ZKLS-x6vqhbyoF5MTF3hAw\"\r\n         alt=\"Mapa de ubicaciones \u2014 haz clic para interactuar\" loading=\"lazy\">\r\n  <\/div>\r\n\r\n  <!-- Lista \/ acorde\u00f3n -->\r\n  <div class=\"accordion\" id=\"locationsAccordion\"><\/div>\r\n<\/div>\r\n\r\n<!-- ==========  ESTILOS  ========== -->\r\n<style>\r\n\/* ----- Layout desktop: 65\u202f% mapa \/ 35\u202f% lista ----- *\/\r\n.locations-wrapper{display:flex;flex-wrap:nowrap;gap:1rem;width:100%}\r\n#map-holder           {flex:0 0 65%;min-height:500px;position:relative}\r\n.accordion            {flex:0 0 35%;max-height:500px;overflow:auto;border-left:2px solid #eee}\r\n\r\n\/* Vista previa est\u00e1tica cubre todo el contenedor *\/\r\n.static-preview{width:100%;height:100%;object-fit:cover;cursor:pointer}\r\n\r\n\/* ----- Acorde\u00f3n sin bordes ni fondo ----- *\/\r\n.acc-item   {transition:flex-basis .3s ease}\r\n.acc-header {background:transparent;padding:.75rem 4rem;color:#59b9d3;cursor:pointer;\r\n             font-weight:600;display:flex;justify-content:space-between;align-items:center;border:none}\r\n.acc-header:hover{background:transparent}\r\n.acc-panel  {max-height:0;overflow:hidden;transition:max-height .35s ease}\r\n.acc-panel.open{padding:0 1rem 1rem}\r\n.acc-panel p{margin:.5rem 0}\r\n.acc-panel img{display:block;width:auto;max-width:100%;height:86px;object-fit:cover;margin:.5rem auto}\r\n\r\n\/* ----- Mobile: lista arriba en 2 columnas ----- *\/\r\n@media(max-width:768px){\r\n  .locations-wrapper{flex-wrap:wrap}\r\n  .accordion{order:-1;flex:0 0 100%;max-height:none;border-left:0;border-top:2px solid #eee;\r\n             display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}\r\n  .acc-item{grid-column:span 1;width:100%}\r\n  .acc-item.expanded{grid-column:1 \/ -1}\r\n  #map-holder{flex:0 0 100%;min-height:400px}\r\n}\r\n<\/style>\r\n\r\n<!-- ==========  SCRIPT PRINCIPAL  ========== -->\r\n<script>\r\n(function(){\r\n  \/* ----- 1. Datos de ubicaciones ----- *\/\r\n  const locations=[\r\n    {name:\"Quito\",coords:[-78.4832382,-0.1714058],\r\n     address:\"Matriz: Calle Alfonso Pereira y Julio Alarc\u00f3n Ayala, edificio Zaigen, piso 14.\",\r\n     image:\"\/wp-content\/uploads\/2025\/03\/quito.jpg\"},\r\n    {name:\"Guayaquil\",coords:[-79.889754,-2.1553637],\r\n     address:\"Av. Joaqu\u00edn J. Orrantia Gonz\u00e1lez y 1 pasaje 1A NE, Trade Building, torre\u00a0A,\u00a0MZ\u00a0006\",\r\n     image:\"\/web\/image\/1551-18a6efa4\/2.webp\"},\r\n    {name:\"Loja\",coords:[-79.1980218,-3.993218],\r\n     address:\"Zoilo\u00a0Rodr\u00edguez y C.\u00a0Antisana, frente al Hotel\u00a0Sonesta\",\r\n     image:\"\/web\/image\/1552-91f0c3d7\/3.webp\"},\r\n    {name:\"Cuenca\",coords:[-79.0021985,-2.9085029],\r\n     address:\"Av. Manuel\u00a0J.\u00a0Calle\u00a03\u201191 y Cornelio\u00a0Merch\u00e1n\",\r\n     image:\"\/web\/image\/1553-705d9819\/4.webp\"},\r\n    {name:\"Ibarra\",coords:[-78.114839,0.339176],\r\n     address:\"Av. Galo\u00a0Plaza Lasso y Gudi\u00f1o\u00a0V\u00e1zquez\",\r\n     image:\"\/wp-content\/uploads\/2025\/03\/ibarra.jpg\"},\r\n    {name:\"Manta\",coords:[-80.65445,-0.946852],\r\n     address:\"Av.\u00a0M1, entre\u00a023 y\u00a024. Edif.\u00a0Manta\u00a0Business\u00a0Center\",\r\n     image:\"\/wp-content\/uploads\/2025\/03\/manta.jpg\"}\r\n  ];\r\n\r\n  \/* ----- 2. Construir acorde\u00f3n ----- *\/\r\n  const acc=document.getElementById('locationsAccordion');\r\n  locations.forEach((loc,i)=>{\r\n    const item=document.createElement('div');item.className='acc-item';\r\n    item.innerHTML=`\r\n      <button class=\"acc-header\" id=\"hdr-${i}\" aria-expanded=\"false\" aria-controls=\"panel-${i}\">\r\n        <span>${loc.name}<\/span><span aria-hidden=\"true\">\u27a4<\/span>\r\n      <\/button>\r\n      <div class=\"acc-panel\" id=\"panel-${i}\" role=\"region\" aria-labelledby=\"hdr-${i}\">\r\n        <img decoding=\"async\" src=\"${loc.image}\" alt=\"${loc.name}\" loading=\"lazy\">\r\n        <p>${loc.address}<\/p>\r\n      <\/div>`;\r\n    acc.appendChild(item);\r\n  });\r\n\r\n  \/* ----- 3. Lazy\u2011load Mapbox ----- *\/\r\n  let mapLoaded=false,map,mapMarkers=[];\r\n  function loadMap(){\r\n    if(mapLoaded) return;\r\n    mapLoaded=true;\r\n    document.getElementById('staticMap').remove();\r\n\r\n    const css=document.createElement('link');\r\n    css.rel='stylesheet';\r\n    css.href='https:\/\/api.mapbox.com\/mapbox-gl-js\/v2.15.0\/mapbox-gl.css';\r\n    document.head.appendChild(css);\r\n\r\n    const s=document.createElement('script');\r\n    s.src='https:\/\/api.mapbox.com\/mapbox-gl-js\/v2.15.0\/mapbox-gl.js';\r\n    s.async=true;\r\n    s.onload=initMap;\r\n    document.head.appendChild(s);\r\n  }\r\n\r\n  \/\/ Clic en la imagen est\u00e1tica \u2192 carga el mapa\r\n  document.getElementById('staticMap').addEventListener('click',loadMap);\r\n\r\n  \/* ----- 4. Inicializar mapa ----- *\/\r\n  function initMap(){\r\n    mapboxgl.accessToken='pk.eyJ1Ijoid3VodWlodWFuZzkwIiwiYSI6ImNqZXA5MXVyNzFkMHQzM3BuZWFibTkxZ3AifQ.ZKLS-x6vqhbyoF5MTF3hAw';\r\n    map=new mapboxgl.Map({\r\n      container:'map-holder',\r\n      style:'mapbox:\/\/styles\/mapbox\/dark-v10?optimize=true',\r\n      center:[-79.5,-1.8312],zoom:6.3,pitch:60,antialias:true\r\n    });\r\n\r\n    locations.forEach((loc,i)=>{\r\n      const m=new mapboxgl.Marker().setLngLat(loc.coords).addTo(map);\r\n      const popup=new mapboxgl.Popup({offset:25}).setHTML(\r\n        `<div class=\"popup-content\"><h3>${loc.name}<\/h3>\r\n         <img decoding=\"async\" src=\"${loc.image}\" alt=\"${loc.name}\" loading=\"lazy\">\r\n         <p>${loc.address}<\/p><\/div>`);\r\n      m.setPopup(popup);\r\n      mapMarkers[i]=m;\r\n      m.getElement().addEventListener('click',()=>openPanel(i,true));\r\n    });\r\n  }\r\n\r\n  \/* ----- 5. Manejo del acorde\u00f3n ----- *\/\r\n  function openPanel(idx,fromMap=false){\r\n    acc.querySelectorAll('.acc-item').forEach((item,i)=>{\r\n      const panel=item.querySelector('.acc-panel');\r\n      const header=item.querySelector('.acc-header');\r\n      if(i===idx){\r\n        const open=!panel.classList.contains('open');\r\n        panel.classList.toggle('open',open);\r\n        panel.style.maxHeight=open?panel.scrollHeight+'px':0;\r\n        header.setAttribute('aria-expanded',open);\r\n        item.classList.toggle('expanded',open);\r\n        if(!fromMap && map){\r\n          map.flyTo({center:locations[i].coords,zoom:10});\r\n          mapMarkers[i].togglePopup();\r\n        }\r\n      }else{\r\n        panel.classList.remove('open');\r\n        panel.style.maxHeight=0;\r\n        header.setAttribute('aria-expanded','false');\r\n        item.classList.remove('expanded');\r\n      }\r\n    });\r\n  }\r\n\r\n  \/\/ Clic en cabecera del acorde\u00f3n\r\n  acc.addEventListener('click',e=>{\r\n    const btn=e.target.closest('.acc-header');\r\n    if(!btn) return;\r\n    const id=parseInt(btn.id.split('-')[1],10);\r\n    loadMap();           \/\/ Lazy\u2011load Mapbox si a\u00fan no\r\n    openPanel(id,false);\r\n\r\n    \/* ----- 6. Scroll autom\u00e1tico SOLO en m\u00f3viles ----- *\/\r\n    if(window.innerWidth <= 768){\r\n      \/\/ peque\u00f1o retardo para evitar bloquear la animaci\u00f3n del panel\r\n      setTimeout(()=>document.getElementById('map-holder')\r\n        .scrollIntoView({behavior:'smooth',block:'start'}),100);\r\n    }\r\n  });\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","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-302","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/pages\/302","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/comments?post=302"}],"version-history":[{"count":34,"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/pages\/302\/revisions"}],"predecessor-version":[{"id":1550,"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/pages\/302\/revisions\/1550"}],"wp:attachment":[{"href":"https:\/\/previanza.com\/old2024\/wp-json\/wp\/v2\/media?parent=302"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}