{"id":5237,"date":"2023-11-21T18:42:44","date_gmt":"2023-11-21T18:42:44","guid":{"rendered":"https:\/\/castinginternationalcomposites.com\/configurador\/"},"modified":"2023-12-11T19:53:58","modified_gmt":"2023-12-11T19:53:58","slug":"configurador","status":"publish","type":"page","link":"https:\/\/castinginternationalcomposites.com\/es\/configurador\/","title":{"rendered":"Configurador"},"content":{"rendered":"\n<link href=\"https:\/\/assets.expivi.net\/options\/latest\/css\/app.css\" rel=\"stylesheet\"\/><style>#app {\n    display: flex;\n    width: 100%;\n  }\n  #top-menu {\n    align-items: center;\n    background: rgba(255, 255, 255, 0.4);\n    box-shadow: 20px 0 30px rgba(0, 0, 0, 0.035),\n      10px 0 10px rgba(0, 0, 0, 0.025);\n    display: flex;\n    justify-content: space-between;\n    padding: 0.5rem 1rem;\n    position: absolute;\n    right: 0;\n    z-index: 10;\n  }\n  #viewer-container {\n    height: calc(100dvh - 5rem);\n    min-height: 450px;\n    width: calc(100% - 400px);\n  }\n  #options {\n    box-shadow: 20px 0 30px rgba(0, 0, 0, 0.035),\n      10px 0 10px rgba(0, 0, 0, 0.025);\n    max-height: calc(100dvh - 5rem);\n    min-height: 450px;\n    overflow: auto;\n    width: 400px;\n    z-index: 5;\n  }\n  @media (max-width: 768px) {\n    #app {\n      flex-direction: column;\n    }\n    #options {\n      width: 100%;\n    }\n    #viewer-container {\n      order: -1;\n      height: 50dvh;\n      min-height: 450px;\n      width: 100%;\n    }\n  }\n  button#finish {\n    background-color: #000;\n    border-radius: 4px;\n    border: none;\n    color: #fff;\n    margin-left: auto;\n    padding: 0.5rem 1rem;\n  }\n  .v-card__title {\n    padding-inline: 0;\n  }\n  .image-tile {\n    background-position: center !important;\n  }\n  .x-p-v h3 {\n    font-weight: 400;\n  }\n  .v-sheet.v-card:not(.v-card--flat) {\n    font-weight: 800;\n  }\n  .thumbnail-item.active + span {\n    font-weight: 800;\n  }\n  .tile-card-active h3 {\n    font-weight: 800;\n  }\n  dialog {\n    border-radius: 8px;\n    border: none;\n    box-shadow: 0 0 #0000, 0 0 #0000, 0 25px 50px -12px rgba(0, 0, 0, 0.25);\n    display: none;\n    text-align: center;\n  }\n  dialog[open] {\n    display: flex;\n    flex-direction: column;\n    height: 90dvh;\n    justify-content: space-between;\n    width: 90dvw;\n  }\n  dialog .body {\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n    padding: 1rem;\n  }\n  dialog .body .item {\n    align-items: center;\n    display: flex;\n    gap: 1rem;\n    justify-content: center;\n    margin-inline: auto;\n    text-align: start;\n    width: 70%;\n  }\n  dialog .body .item a {\n    color: inherit;\n    font-size: 1.5rem;\n    flex-basis: 50%;\n  }\n  dialog .actions {\n    display: flex;\n    gap: 1rem;\n    justify-content: center;\n  }\n  dialog .actions button {\n    background-color: #000;\n    border-radius: 4px;\n    border: none;\n    color: #fff;\n    padding: 0.5rem 1rem;\n  }\n  @media (max-width: 768px) {\n    dialog {\n      height: 100dvh;\n      width: 100dvw;\n    }\n    dialog .body .item {\n      flex-direction: column;\n      width: 100%;\n    }\n    dialog .body .item a {\n      font-size: 1rem;\n      flex-basis: 100%;\n    }\n  }\n<\/style><div id=\"top-menu\"><button id=\"finish\">Buy now<\/button><\/div><div id=\"app\"><div id=\"options\"><div id=\"options-container\"><\/div><\/div><div id=\"viewer-container\"><\/div><\/div><dialog class=\"order-review\"><h2>Order Review<\/h2><div class=\"body\"><\/div><div class=\"actions\"><\/div><\/dialog><script src=\"https:\/\/assets.expivi.net\/viewer\/latest\/viewer.js\"><\/script><script src=\"https:\/\/assets.expivi.net\/options\/latest\/js\/app.js\"><\/script><script>\/\/@ts-check\n  const BASE_URL = \"https:\/\/castinginternationalcomposites.com\/\";\n\n  \/\/ Simple map by object key\n  function toDictionaryBy(items, key, valueKey) {\n    const result = {};\n    for (const item of items) {\n      result[item[key]] = item[valueKey];\n    }\n    return result;\n  }\n\n  const kits = [\n    \/\/ L\/R base Graphite\n    \/\/ Left \/ Right Universal Drain\t32\" x 60\" x 84\"\t  Graphite\t    Carrara\t      Slate \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-w-Carrara-Walls-and-L-R-Graphite-Slate-Shower-Pan-Base-K1B2S3260GRCACA\/320406292\n    \/\/ Left \/ Right Universal Drain\t32\" x 60\" x 84\"\t  Graphite\t    Subway\t      Sand\n    \/\/ Left \/ Right Universal Drain\t32\" x 60\" x 84\"\t  Graphite\t    Gray Picket\t  Sand  \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Gray-Picket-Walls-and-L-R-Graphite-Sand-Shower-Pan-K1B1S3260GRGPGP\/319983042\n    \/\/ Left \/ Right Universal Drain\t36\" x 60\" x 84\"\t  Graphite\t    Carrara\t      Sand\n    {\n      drain: \"L\/R\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Slate\",\n      wall: \"Carrara\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-w-Carrara-Walls-and-L-R-Graphite-Slate-Shower-Pan-Base-K1B2S3260GRCACA\/320406292\",\n    },\n    {\n      drain: \"L\/R\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Subway Tile\",\n    },\n    {\n      drain: \"L\/R\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Gray Picket\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Gray-Picket-Walls-and-L-R-Graphite-Sand-Shower-Pan-K1B1S3260GRGPGP\/319983042\",\n    },\n    {\n      drain: \"L\/R\",\n      width: 36,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Carrara\",\n    },\n\n    \/\/ L\/R base White\n    \/\/ Left \/ Right Universal Drain\t32\" x 60\" x 84\"\t  White\t        Caramel\t      Slate \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Caramel-Walls-and-L-R-White-Slate-Shower-Pan-Base-K1B2S3260WHCCCC\/320406461\n    \/\/ Left \/ Right Universal Drain\t32\" x 60\" x 84\"\t  White\t        Sierra Light\tSand  \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Sierra-Light-Walls-and-L-R-White-Sand-Shower-Pan-K1B1S3260WHSLSL\/320406424\n    \/\/ Left \/ Right Universal Drain\t32\" x 60\" x 84\"\t  White\t        Subway\t      Sand\n    {\n      drain: \"L\/R\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"White\",\n      texture: \"Slate\",\n      wall: \"Caramel\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Caramel-Walls-and-L-R-White-Slate-Shower-Pan-Base-K1B2S3260WHCCCC\/320406461\",\n    },\n    {\n      drain: \"L\/R\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"White\",\n      texture: \"Sand\",\n      wall: \"Sierra Light\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Sierra-Light-Walls-and-L-R-White-Sand-Shower-Pan-K1B1S3260WHSLSL\/320406424\",\n    },\n    {\n      drain: \"L\/R\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"White\",\n      texture: \"Sand\",\n      wall: \"Subway Tile\",\n    },\n\n    \/\/ Center Drain base Graphite\n    \/\/ Center Drain\t                32\" x 60\" x 84\"\t  Graphite\t    Carrara\t      Slate \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Carrara-Walls-Cntr-Graphite-Slate-Shower-Pan-Base-K1C2S3260GRCACA\/323704232\n    \/\/ Center Drain\t                32\" x 60\" x 84\"\t  Graphite\t    Gray Picket\t  Sand  \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Gray-Picket-Walls-Cntr-Graphite-Sand-Shower-Pan-K1C1S3260GRGPGP\/323704214\n    \/\/ Center Drain\t                32\" x 60\" x 84\"\t  Graphite\t    Subway\t      Sand\n    \/\/ Center Drain\t                34\" x 48\" x 84\"\t  Graphite\t    Carrara\t      Slate \thttps:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Carrara-Walls-Cntr-Graphite-Slate-Shower-Pan-Base-K1C2S3448GRCACA\/325035054\n    \/\/ Center Drain\t                34\" x 48\" x 84\"\t  Graphite\t    Gray Picket\t  Sand  \thttps:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Gray-Picket-Walls-Cntr-Graphite-Sand-Shower-Pan-K1C1S3448GRGPGP\/325035040\n    \/\/ Center Drain\t                36\" x 60\" x 84\"\t  Graphite\t    Carrara\t      Sand\n    {\n      drain: \"center\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Slate\",\n      wall: \"Carrara\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Carrara-Walls-Cntr-Graphite-Slate-Shower-Pan-Base-K1C2S3260GRCACA\/323704232\",\n    },\n    {\n      drain: \"center\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Gray Picket\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Gray-Picket-Walls-Cntr-Graphite-Sand-Shower-Pan-K1C1S3260GRGPGP\/323704214\",\n    },\n    {\n      drain: \"center\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Subway Tile\",\n    },\n    {\n      drain: \"center\",\n      width: 34,\n      len: 48,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Slate\",\n      wall: \"Carrara\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Carrara-Walls-Cntr-Graphite-Slate-Shower-Pan-Base-K1C2S3448GRCACA\/325035054\",\n    },\n    {\n      drain: \"center\",\n      width: 34,\n      len: 48,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Gray Picket\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Gray-Picket-Walls-Cntr-Graphite-Sand-Shower-Pan-K1C1S3448GRGPGP\/325035040\",\n    },\n    {\n      drain: \"center\",\n      width: 36,\n      len: 60,\n      height: 84,\n      base: \"Graphite\",\n      texture: \"Sand\",\n      wall: \"Carrara\",\n    },\n\n    \/\/ Center Drain base White\n    \/\/ Center Drain\t                32\" x 60\" x 84\"\t  White\t        Caramel       Slate \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Caramel-Walls-Cntr-White-Slate-Shower-Pan-Base-K1C2S3260WHCCCC\/323704229\n    \/\/ Center Drain\t                32\" x 60\" x 84\"\t  White\t        Sierra Light\tSlate \thttps:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Sierra-Light-Walls-Cntr-White-Sand-Shower-Pan-K1C1S3260WHSLSL\/323704239\n    \/\/ Center Drain\t                32\" x 60\" x 84\"\t  White\t        Subway        Sand\n    \/\/ Center Drain\t                34\" x 48\" x 84\"\t  White\t        Caramel       Slate \thttps:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Caramel-Walls-Cntr-White-Slate-Shower-Pan-Base-K1C2S3448WHCCCC\/325035124\n    \/\/ Center Drain\t                34\" x 48\" x 84\"\t  White\t        Sierra Light\tSand  \thttps:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Sierra-Light-Walls-Cntr-White-Sand-Shower-Pan-K1C1S3448WHSLSL\/325035148\n    {\n      drain: \"center\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"White\",\n      texture: \"Slate\",\n      wall: \"Caramel\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Caramel-Walls-Cntr-White-Slate-Shower-Pan-Base-K1C2S3260WHCCCC\/323704229\",\n    },\n    {\n      drain: \"center\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"White\",\n      texture: \"Slate\",\n      wall: \"Sierra Light\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-60-in-L-x-32-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Sierra-Light-Walls-Cntr-White-Sand-Shower-Pan-K1C1S3260WHSLSL\/323704239\",\n    },\n    {\n      drain: \"center\",\n      width: 32,\n      len: 60,\n      height: 84,\n      base: \"White\",\n      texture: \"Sand\",\n      wall: \"Subway Tile\",\n    },\n    {\n      drain: \"center\",\n      width: 34,\n      len: 48,\n      height: 84,\n      base: \"White\",\n      texture: \"Slate\",\n      wall: \"Caramel\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Caramel-Walls-Cntr-White-Slate-Shower-Pan-Base-K1C2S3448WHCCCC\/325035124\",\n    },\n    {\n      drain: \"center\",\n      width: 34,\n      len: 48,\n      height: 84,\n      base: \"White\",\n      texture: \"Sand\",\n      wall: \"Sierra Light\",\n      url: \"https:\/\/www.homedepot.com\/p\/CASTICO-48-in-L-x-34-in-W-x-84-in-H-Solid-Composite-Stone-Shower-Kit-with-Sierra-Light-Walls-Cntr-White-Sand-Shower-Pan-K1C1S3448WHSLSL\/325035148\",\n    },\n  ];\n\n  const drains = [\n    {\n      title: 'Drain Plate 5\" x 10\" Powder Coat - Champagne',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-5-x-10-powder-coat\/?attribute_pa_color-finish=champagne\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-champagne-01-300x300.jpg\",\n      style: \"Powder Coated\",\n      color: \"Champagne\",\n    },\n    {\n      title: 'Drain Plate 5\" x 10\" Powder Coat - Black Matte',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-5-x-10-powder-coat\/?attribute_pa_color-finish=black-matte\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-black-01-300x300.jpg\",\n      style: \"Powder Coated\",\n      color: \"Black Matte\",\n    },\n    {\n      title: 'Drain Plate 5\" x 10\" Powder Coat - White',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-5-x-10-powder-coat\/?attribute_pa_color-finish=white\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-white-01-300x300.jpg\",\n      style: \"Powder Coated\",\n      color: \"White\",\n    },\n    {\n      title: 'Drain Plate Steel - 5\" x 10\"',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-steel\/?attribute_pa_dimension-nom=5-x-10\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-steel-01-300x300.jpg\",\n      style: \"Stainless\",\n      color: \"Steel\",\n    },\n    {\n      title: 'Drain Plate 5\" x 10\" Casted - Black onyx',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-5-x-10\/?attribute_pa_color-finish=black-onyx\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-cblackonyx-01-300x300.jpg\",\n      style: \"Casted\",\n      color: \"Black onyx\",\n    },\n    {\n      title: 'Drain Plate 5\" x 10\" Casted - Graphite',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-5-x-10\/?attribute_pa_color-finish=graphite\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-cgraphite-01-300x300.jpg\",\n      style: \"Casted\",\n      color: \"Graphite\",\n    },\n    {\n      title: 'Drain Plate 5\" x 10\" Casted - White',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/drain-plate-5-x-10\/?attribute_pa_color-finish=white\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-cwhite-01-300x300.jpg\",\n      style: \"Casted\",\n      color: \"White\",\n    },\n    {\n      title:\n        'Carrara Drain Plate 5\" x 10\" Casted - Left \/ Right Universal Drain',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/carrara-drain-plate-5-x-10-casted\/?attribute_pa_drain-location=left-right-universal-drain\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-ccarrara-01-300x300.jpg\",\n      style: \"Casted\",\n      color: \"Carrara\",\n    },\n    {\n      title: 'Carrara Drain Plate 5\" x 10\" Casted - Center Drain',\n      url: \"https:\/\/castinginternationalcomposites.com\/product\/carrara-drain-plate-5-x-10-casted\/?attribute_pa_drain-location=center-drain\",\n      thumb:\n        \"https:\/\/castinginternationalcomposites.com\/wp-content\/uploads\/2023\/11\/CASTICO-SPB-drainplate-5x10-ccarrara-01-300x300.jpg\",\n      style: \"Casted\",\n      color: \"Carrara\",\n    },\n  ];\n\n  window.addEventListener(\"load\", function () {\n    new ExpiviComponent.default({\n      catalogueId: \"20531\",\n      viewerContainer: \"#viewer-container\",\n      optionContainer: \"#options-container\",\n      currency: \"USD\",\n      locale: \"en-US\",\n      token:\n        \"eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIxIiwianRpIjoiNzIwNWFkMDU0MGZkMWMxNzZiZmY3ODE1ZjI1ZjNjOGRkMjRjMzkzMGVjNzFmZjgxOGI4ZjBkY2M0YzZhMGMzZGRkZDgwNWU2ZWZjNjNlNTUiLCJpYXQiOjE2OTkyNzczNDkuMTM4NDIyLCJuYmYiOjE2OTkyNzczNDkuMTM4NDI0LCJleHAiOjIwMTQ4OTY1NDguOTg0NDQ1LCJzdWIiOiI1Nzk2Iiwic2NvcGVzIjpbXX0.fV5AL5xQxM_gkI5uBhf7IJxEmBx3VHzG9aIDDyEEQL-ABB7CEoFryz637TZqON5BYd8doPGGtBNFLMhBXzW48Pbq56OR0gfSBhWcyn70lwtn3mLIBfl7sKjgli3LdfdGUnB5f5jbqOEsxNnrWM8mQ91cIZvymSlqUWDPr7debdNNzGfk2L8-kRTIipOGcOWQdPLo-eh8amKazD-gjuVjJPalmMqVFg5iNtS8ltT-lSN6eUO9yFLLnKMU-09qa87lUBmAdj4mcsqcSPdQY3X4sLXL43PjG8FgcIf5rdvvYf64e9C1ecJ5za594ppKzytA-xY3nlWRi1LiZOTlfT6R-cVYgwDZFP2KYo8olTZTmwk-zh_epOld_OVYsolqtMGp-t_drXJ7ID2t26sUDohhfUhVqksHev70EAgvPWgmlR6WqYdfH_WBb1SwJ1Q27zF0P_A8AoYg1R1j-sszSTJwnKXLm9IqF_9SpZCzrtxQpAldZWgGcfjsrDQJ3rGO56Ug8bs27x77fBlRA8EV73BDAip4X_6bec0glg6u50_LNVo64sHAnP9OFvsKaxIbjrHV_PNIsc11qi6MpdhenXv5l4EBaZzW3HQVIylofn6ss6jOvGoG95y9oO9ZWMeFUutTMc2rgQFWMaQDCnZH7I4yIA6F1yTUpAGcT4_bUrvf9_U\",\n    });\n\n    const finishButton = document.querySelector(\"button#finish\");\n    finishButton.addEventListener(\"click\", async () => {\n      const config = await expivi.saveConfiguration(300, 300);\n      const product = config.configured_products[0];\n      const attrs = toDictionaryBy(\n        product.attributes,\n        \"attribute_name\",\n        \"attribute_value_name\"\n      );\n\n      \/\/ Match attributes to kits\n      let result = kits;\n      console.log(\"All attrs\", attrs);\n\n      \/\/ Match width and length (height is always 84\")\n      const modelSize = attrs[\"Step 1 - Select Model Size\"];\n      \/\/ Extract from `32\" X 60\"` string (width X length)\n      const [width, length] = modelSize\n        .split(\" X \")\n        .map((x) => parseInt(x, 10));\n      result = result.filter(\n        (kit) => kit.width === width && kit.len === length\n      );\n\n      \/\/ Match wall color\n      const wallColor = attrs[\"Step 1 - Select Wall Color Finish\"];\n      result = result.filter((kit) => kit.wall === wallColor);\n\n      \/\/ Match drain location\n      const drainLocation = attrs[\"Step 2 - Select Showerpan Drain Location\"];\n      result = result.filter((kit) =>drainLocation === \"Center Drain\"\n          ? kit.drain === \"center\"\n          : kit.drain === \"L\/R\"\n      );\n\n      \/\/ Match color finish\n      \/** @type {\"Graphite\" | \"White\"} *\/\n      const baseFinish = attrs[\"Step 3 - Select Finish\"];\n      \/** @type {\"Sand\" | \"Slate\"} *\/\n      const texture = attrs[\"Step 5 - Select Slip Resistant Texture\"];\n      result = result.filter(\n        (kit) => kit.base === baseFinish && kit.texture === texture\n      );\n\n      \/\/ Match drain plate\n      let drainResult = drains;\n\n      \/** @type {\"Powder Coated\" | \"Stainless\" | \"Casted\"} *\/\n      const drainPlateStyle = attrs[\"Step 4 - Select Drain Plate Style\"];\n      drainResult = drainResult.filter(\n        (drain) => drain.style === drainPlateStyle\n      );\n\n      if (drainPlateStyle === \"Powder Coated\") {\n        const color = attrs[\"Powder Coat Colors\"];\n        drainResult = drainResult.filter((drain) => drain.color === color);\n      }\n\n      \/\/ Display the \"Are you sure?\" modal\n      const modal = document.querySelector(\"dialog.order-review\");\n      const body = modal.querySelector(\".body\");\n      const actions = modal.querySelector(\".actions\");\n      body.innerHTML = \"\";\n      if (result[0]?.url) {\n        \/\/ Example 60\" L x 32\" W x 84\" H Solid Composite Stone Shower Kit with Carrara Walls & Cntr Graphite Slate Shower Pan Base\n        const title = `${result[0].len}\" L x ${result[0].width}\" W x ${result[0].height}\" H Solid Composite Stone Shower Kit with ${result[0].wall} Walls & ${result[0].base} ${result[0].texture} Shower Pan Base`;\n        const div = document.createElement(\"div\");\n        div.className = \"item\";\n        body.appendChild(div);\n\n        const img = document.createElement(\"img\");\n        img.src = product.thumbnail;\n        img.width = 300;\n        img.height = 300;\n        div.appendChild(img);\n\n        const kitLink = document.createElement(\"a\");\n        kitLink.href = result[0].url;\n        kitLink.target = \"_blank\";\n        kitLink.appendChild(document.createTextNode(title));\n        div.appendChild(kitLink);\n\n        if (drainResult[0]?.url) {\n          const drainItem = document.createElement(\"div\");\n          drainItem.className = \"item\";\n\n          const drainImg = document.createElement(\"img\");\n          drainImg.src = drainResult[0].thumb;\n          drainImg.width = 300;\n          drainImg.height = 300;\n          drainItem.appendChild(drainImg);\n\n          const drainLink = document.createElement(\"a\");\n          drainLink.href = drainResult[0].url;\n          drainLink.target = \"_blank\";\n          drainLink.appendChild(document.createTextNode(drainResult[0].title));\n          drainItem.appendChild(drainLink);\n\n          body.appendChild(drainItem);\n        }\n      } else {\n        body.appendChild(\n          document.createTextNode(\n            \"Sorry, we don't have a kit for this configuration.\"\n          )\n        );\n      }\n      actions.innerHTML = \"\";\n      const keepEditing = document.createElement(\"button\");\n      keepEditing.type = \"button\";\n      keepEditing.appendChild(document.createTextNode(\"Keep Editing\"));\n      keepEditing.addEventListener(\"click\", () => modal.close());\n      actions.appendChild(keepEditing);\n\n      if (result[0]) {\n        const checkout = document.createElement(\"button\");\n        checkout.type = \"button\";\n        checkout.appendChild(\n          document.createTextNode(\"Looks good, proceed to checkout\")\n        );\n        checkout.addEventListener(\"click\", () => {\n          modal.close();\n        });\n        actions.appendChild(checkout);\n      }\n      modal.showModal();\n    });\n  });\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Buy now Order Review<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-full-width.php","meta":{"footnotes":""},"class_list":["post-5237","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/pages\/5237","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/comments?post=5237"}],"version-history":[{"count":1,"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/pages\/5237\/revisions"}],"predecessor-version":[{"id":5238,"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/pages\/5237\/revisions\/5238"}],"wp:attachment":[{"href":"https:\/\/castinginternationalcomposites.com\/es\/wp-json\/wp\/v2\/media?parent=5237"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}