{ "id": "ahv-page-our-villas-desktop", "file": "AHV Page Our Villas Desktop.dc.html", "sourceSha256": "62b4003df7b5c4452fa2139a4f2ba9da8778ae059309e4063afd35a7d7438a80", "variant": "desktop", "template": "\n\n\n\n\nAyurvedic Villas in Kerala | Kairali Healing Village\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
\n跳至主要内容\n\n
\n
\n \n

在我们的别墅中感受宁静

\n

我们的别墅

\n \"别墅旁的花园小径与棕榈树\"\n
\n\n
\n

精致的 Vastu（瓦斯图）风格别墅

\n

{{ D.intro }}

\n
\n\n
\n \n \n \n
\n\n
\n
\n

为何选择 Vastu 风格别墅？

\n

{{ D.vastu.paragraph }}

\n
    \n
  • ◆{{ it }}
    • \n
\n
\n
\n
{{ D.vastu.quote }}
\n
\n 联系专家\n
\n
\n
\n\n
\n \"装饰花卉\"\n
\n

Kairali，纯粹的喜悦，一生难得的体验！

\n

{{ D.closing.text }}

\n
\n
\n
\n\n\n
\n
\n
{{ counter }}
\n \n
\n \"{{\n
\n \n \n
\n
\n
\n", "logic": "\nclass Component extends DCLogic {\n state = { open: false, set: null, i: 0, ret: null, label: '' };\n componentDidMount() { document.documentElement.lang = 'zh-Hans'; }\n componentWillUnmount() { document.body.style.overflow = ''; }\n openSet(set, idx, ret, label) {\n this.setState({ open: true, set, i: idx, ret, label });\n document.body.style.overflow = 'hidden';\n setTimeout(() => { const c = document.getElementById('villa-close'); if (c) c.focus(); }, 30);\n }\n closeViewer() {\n const ret = this.state.ret;\n this.setState({ open: false });\n document.body.style.overflow = '';\n setTimeout(() => { const btn = ret ? document.querySelector(ret) : null; if (btn) btn.focus(); }, 30);\n }\n renderVals() {\n const D = window.AHV_OUR_VILLAS || { intro: '', cards: [], vastu: { items: [], quote: '', paragraph: '' }, closing: { text: '' } };\n const A = 'https://ayurvedichealingvillage.com';\n const cards = (D.cards || []).map((c, ci) => ({\n ...c, i: ci, url: A + c.href, hid: 'villa-' + c.key.toLowerCase() + '-h',\n factsLabel: c.title + ' facts', galleryLabel: c.title + ' photographs',\n images: c.images.map((g, gi) => ({ ...g, i: gi, btnLabel: '查看图片： ' + g.alt,\n open: () => this.openSet(c.images, gi, 'button[data-card=\"' + ci + '\"][data-img=\"' + gi + '\"]', c.title + ' photographs') }))\n }));\n const set = this.state.set || [];\n const n = set.length, i = this.state.i;\n const cur = set[i] || { image: '', alt: '', width: 1400, height: 1000 };\n const go = (d) => this.setState(s => ({ i: (s.i + d + n) % n }));\n return {\n guard: () => {} /* preview-only nav guard neutralised for the published site */,\n D, cards,\n dlgDisplay: this.state.open ? 'flex' : 'none', dlgOpen: this.state.open, dlgLabel: this.state.label || '别墅照片',\n cur,\n // New closure per render, so React re-attaches and assigns the current source each time cur changes.\n curRef: (el) => { if (el && cur.image) { el.setAttribute('src', cur.image); } },\n counter: n ? (i + 1) + ' / ' + n : '',\n close: () => this.closeViewer(), prev: () => go(-1), next: () => go(1),\n dlgKey: (e) => {\n if (e.key === 'Escape') { e.preventDefault(); this.closeViewer(); return; }\n if (e.key === 'ArrowLeft') { e.preventDefault(); go(-1); return; }\n if (e.key === 'ArrowRight') { e.preventDefault(); go(1); return; }\n if (e.key === 'Tab') {\n const f = [...e.currentTarget.querySelectorAll('button')];\n const first = f[0], last = f[f.length - 1];\n if (e.shiftKey && document.activeElement === first) { e.preventDefault(); last.focus(); }\n else if (!e.shiftKey && document.activeElement === last) { e.preventDefault(); first.focus(); }\n }\n }\n };\n }\n}\n", "props": "", "scripts": [ "/ahv/l10n/zh/assets/our-villas-data.js" ], "locale": "zh-Hans" }