テンプレート:飲食店のソースを表示

======  ======
<div class="img-crop">
{{#if: {{{画像|}}} 
  | [[File:{{{画像}}}|middle|class=crop-img]]
  | {{{備考|}}}
}}
</div>

<div style="font-size: calc(1em - 3px);">
{{#if: {{{最寄り|}}} | {{{最寄り}}} }}
{{#if: {{{ジャンル|}}} | {{{ジャンル}}} }}
<br />
昼：
{{#if: {{{予算_昼_下限|}}} | ￥{{{予算_昼_下限}}} | - }}
～
{{#if: {{{予算_昼_上限|}}} | ￥{{{予算_昼_上限}}} | - }}
　夜：
{{#if: {{{予算_夜_下限|}}} | ￥{{{予算_夜_下限}}} | - }}
～
{{#if: {{{予算_夜_上限|}}} | ￥{{{予算_夜_上限}}} | - }}
</div>

====基本情報====
<div class="flex-box">
<div class="flex-left">
{| class="wikitable"
|-
! 店名
| {{{店名|不明}}}
|-
! ジャンル
| {{{ジャンル|不明}}}
|-
! 郵便番号
| {{{郵便番号|不明}}}
|-
! 住所
| {{{住所|不明}}}
{{#if: {{{最寄り|}}} 
  | {{!}}-
    ! 最寄り
     {{!}} {{{最寄り}}}
}}
|-
! 営業時間
| {{#if: {{{営業時間_月|}}} | 月　{{{営業時間_月}}}<br />}}
{{#if: {{{営業時間_火|}}} | 火　{{{営業時間_火}}}<br />}}
{{#if: {{{営業時間_水|}}} | 水　{{{営業時間_水}}}<br />}}
{{#if: {{{営業時間_木|}}} | 木　{{{営業時間_木}}}<br />}}
{{#if: {{{営業時間_金|}}} | 金　{{{営業時間_金}}}<br />}}
{{#if: {{{営業時間_土|}}} | 土　{{{営業時間_土}}}<br />}}
{{#if: {{{営業時間_日|}}} | 日　{{{営業時間_日}}}<br />}}
{{#if: {{{営業時間_祝日|}}} | 祝日　{{{営業時間_祝日}}}}}
{{#if: {{{定休日|}}} 
  | {{!}}-
    ! 定休日
     {{!}} {{{定休日}}}
}}
{{#if: {{{電話番号|}}} 
  | {{!}}-
    ! 電話番号
     {{!}} {{{電話番号}}}
}}
{{#if: {{{メニュー1|}}} 
  | {{!}}-
    ! おすすめメニュー
 {{!}} {{{メニュー1}}}　{{#if: {{{メニュー1_価格|}}}|￥{{{メニュー1_価格}}}}}
{{#if: {{{メニュー2|}}} | {{{メニュー2}}}　{{#if: {{{メニュー2_価格|}}} | ￥{{{メニュー2_価格}}}}}}}<br />
{{#if: {{{メニュー3|}}} | {{{メニュー3}}}　{{#if: {{{メニュー3_価格|}}} | ￥{{{メニュー3_価格}}}}}}}<br />
{{#if: {{{メニュー4|}}} | {{{メニュー4}}}　{{#if: {{{メニュー4_価格|}}} | ￥{{{メニュー4_価格}}}}}}}<br />
{{#if: {{{メニュー5|}}} | {{{メニュー5}}}　{{#if: {{{メニュー5_価格|}}} | ￥{{{メニュー5_価格}}}}}}}
}}
|-
! 平均予算
| 昼：{{#if: {{{予算_昼_下限|}}} |￥{{{予算_昼_下限}}}| -}}～{{#if: {{{予算_昼_上限|}}}|￥{{{予算_昼_上限}}}| -}}
夜：{{#if: {{{予算_夜_下限|}}} |￥{{{予算_夜_下限}}}| -}}～{{#if: {{{予算_夜_上限|}}} |￥{{{予算_夜_上限}}}| -}}
|-
! 支払い方法
| 現金 {{{支払い方法_現金|不明}}}
カード {{{支払い方法_カード|不明}}}<br>
電子マネー {{{支払い方法_電子マネー|不明}}}<br>
QR決済 {{{支払い方法_QR|不明}}}<br>
その他 {{{支払い方法_その他|なし}}}
{{#if: {{{料金備考|}}} 
  | {{!}}-
    ! 料金備考
     {{!}} {{{料金備考}}}
}}
{{#if: {{{テイクアウト|}}} 
  | {{!}}-
    ! テイクアウト
     {{!}} {{{テイクアウト}}}
}}
|-
! SNS
| <div class="twitter-id" style="display:none;">{{{X|}}}</div><br>
<div class="instagram-id" style="display:none;">{{{Instagram|}}}</div>
<div class="tictok-id" style="display:none;">{{{TicTok|}}}</div>
<div class="facebook-id" style="display:none;">{{{Facebook|}}}</div>
|-
! リンク
| {{#if: {{{公式HP|}}} 
  | 公式HP {{{公式HP}}}}}
{{#if: {{{食べログURL|}}} 
  | 食べログ {{{食べログURL}}}}}
{{#if: {{{ホットペッパーURL|}}} 
  | ホットペッパー {{{ホットペッパーURL}}}}}
{{#if: {{{予約|}}} 
  | {{!}}-
    ! 予約
     {{!}} {{{予約}}}
}}
{{#if: {{{備考|}}} 
  | {{!}}-
    ! 備考
     {{!}} {{{備考}}}
}}
|}
</div>
<div class="flex-right">
<div class="img-crop">
{{#if: {{{画像|}}} 
  | [[File:{{{画像}}}|middle|class=crop-img]]
}}
</div>
</div>
</div>

<div class="map-embed" data-name="{{{店名}}}" style="width:100%;max-width:800px;height:400px;margin:0 auto;">
</div>

====たばこ====
{| class="wikitable"
|-
! 禁煙・喫煙
| {{{禁煙喫煙|不明}}}
|-
! 喫煙専用室
| {{{喫煙専用室|不明}}}
|}
====お席====
{| class="wikitable"
|-
! 総席数
| {{{総席数|不明}}}
|-
! 個室
| {{{個室|不明}}}
|-
! 貸切
| {{{貸切|不明}}}
|}
====設備====
{| class="wikitable"
|-
! Wi-Fi
| {{{WiFi|不明}}}
|-
! バリアフリー
| {{{バリアフリー|不明}}}
|-
! 駐車場
| {{{駐車場|不明}}}
|-
! その他設備
| {{{その他設備|不明}}}
|}
====その他====
{| class="wikitable"
|-
! 飲み放題
| {{{飲み放題|不明}}}
|-
! 食べ放題
| {{{食べ放題|不明}}}
|-
! お子様連れ
| {{{お子様連れ|不明}}}
|}

<html>
<style>
.img-crop {
  width: 400px;
  height: 300px;
  overflow: hidden;
  position: relative;
  margin: 0 auto; /* 中央寄せ（任意） */
  border-radius: 24px;
}

.img-crop p,
.img-crop span,
.img-crop a {
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  line-height: 0 !important;
}

.crop-img img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* ← これが「クロップ風拡大」 */
  object-position: center; /* 中心に寄せる */
  display: block;
}

.flex-box {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

/* 左がテーブル、右が画像 */
.flex-left {
  flex: 1;
  order: 1;
}
.flex-right {
  flex: 1;
  order: 2;
}

/* スマホ表示では縦並び＆画像を上へ */
@media screen and (max-width: 768px) {
  .flex-box {
    flex-direction: column;
  }
  .flex-left {
    order: 2;  /* テーブルを下へ */
  }
  .flex-right {
    order: 1;  /* 画像を上へ */
    display: none;
  }
}

.map-embed {
    position: relative;
    background: #dfe3e8;     /* これが読み込み中の背景 */
    border-radius: 8px;
    overflow: hidden;
}

/* 読み込み中のアニメーション */
.map-embed::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: linear-gradient(
        90deg,
        #dfe3e8 0%,
        #f5f5f5 50%,
        #dfe3e8 100%
    );
    animation: shimmer 1.6s infinite;
}

@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* iframe が入ったら Skeleton 非表示 */
.map-embed.loaded {
    background: none;
}

.map-embed.loaded::before {
    display: none;
}
</style>
<script>
document.addEventListener("DOMContentLoaded", function() {
  const twitterdiv = document.querySelector('.twitter-id');
  if(twitterdiv) {
    const username = twitterdiv.textContent.trim();
    if(username) { // 空文字なら生成しない
      const a = document.createElement('a');
      a.href = `https://twitter.com/${username}?ref_src=twsrc%5Etfw`;
      a.className = "twitter-follow-button";
      a.dataset.showCount = "false";
      a.textContent = `Follow @${username}`;
      twitterdiv.parentNode.replaceChild(a, twitterdiv);

      const script = document.createElement('script');
      script.async = true;
      script.src = "https://platform.twitter.com/widgets.js";
      script.charset = "utf-8";
      document.body.appendChild(script);
    }
  }
  const instagramdiv = document.querySelector('.instagram-id');
  if(instagramdiv) {
    const username = instagramdiv.textContent.trim();
    if(username) {
      const a = document.createElement('a');
      a.href = `https://instagram.com/${username}/`;
      a.target = "_blank";
      a.rel = "noopener noreferrer";

      const img = document.createElement('img');
      img.src = "/images/3/3d/Instagram_Glyph_Gradient.png";
      img.alt = "Instagram";
      img.style.width = "50px";
      img.style.height = "50px";
      img.style.marginRight = "15px";

      a.appendChild(img);
      instagramdiv.parentNode.replaceChild(a, instagramdiv);
    }
  }
  const tictokdiv = document.querySelector('.tictok-id');
  if(tictokdiv) {
    const username = tictokdiv.textContent.trim();
    if(username) {
      const a = document.createElement('a');
      a.href = `https://tictok.com/@${username}/`;
      a.target = "_blank";
      a.rel = "noopener noreferrer";

      const img = document.createElement('img');
      img.src = "/images/f/fa/TikTok-logo-RGB-Tag.png";
      img.alt = "TicTok";
      img.style.width = "50px";
      img.style.height = "50px";
      img.style.marginRight = "15px";

      a.appendChild(img);
      tictokdiv.parentNode.replaceChild(a, tictokdiv);
    }
  }
  const facebookdiv = document.querySelector('.facebook-id');
  if(facebookdiv) {
    const username = facebookdiv.textContent.trim();
    if(username) {
      const a = document.createElement('a');
      a.href = `https://facebook.com/${username}/`;
      a.target = "_blank";
      a.rel = "noopener noreferrer";

      const img = document.createElement('img');
      img.src = "/images/8/82/Facebook_Logo_Primary.png";
      img.alt = "Facebook";
      img.style.width = "50px";
      img.style.height = "50px";

      a.appendChild(img);
      facebookdiv.parentNode.replaceChild(a, facebookdiv);
    }
  }
    document.querySelectorAll(".wikitable p").forEach(function(p) {
        if (!p.textContent.trim()) {
            p.remove();
        }
    });
    document.querySelectorAll(".wikitable tr").forEach(function(tr) {
        const th = tr.querySelector("th");
        const td = tr.querySelector("td");

        if (!th || !td) return;

        if (th.textContent.trim() === "郵便番号") {
            // 郵便番号らしい数字のみ抽出
            const match = td.textContent.replace(/\D/g, "").match(/^(\d{3})(\d{4})$/);
            if (match) {
                td.textContent = match[1] + "-" + match[2];
            }
        }
    });
});
//# sourceURL=foobar.js
</script>
</html>

<noinclude>{{#cargo_declare:
_table = 飲食店情報
| 店名 = String
| 画像 = String
| ジャンル = String
| 郵便番号 = String
| 住所 = String
| 座標 = String
| 最寄り = String
| 営業時間_月 = String
| 営業時間_火 = String
| 営業時間_水 = String
| 営業時間_木 = String
| 営業時間_金 = String
| 営業時間_土 = String
| 営業時間_日 = String
| 営業時間_祝日 = String
| 定休日 = String
| 電話番号 = String
| メニュー1 = String
| メニュー1_価格 = Integer
| メニュー2 = String
| メニュー2_価格 = Integer
| メニュー3 = String
| メニュー3_価格 = Integer
| メニュー4 = String
| メニュー4_価格 = Integer
| メニュー5 = String
| メニュー5_価格 = Integer
| 予算_昼_下限 = Integer
| 予算_昼_上限 = Integer
| 予算_夜_下限 = Integer
| 予算_夜_上限 = Integer
| 支払い方法_現金 = String
| 支払い方法_カード = String
| 支払い方法_電子マネー = String
| 支払い方法_QR = String
| 支払い方法_その他 = String
| 料金備考 = String
| Instagram = String
| X = String
| TicTok = String
| Facebook = String
| 公式HP = String
| 食べログURL = String
| ホットペッパーURL = String
| 予約 = String
| テイクアウト = String
| 備考 = String
| 禁煙喫煙 = String
| 喫煙専用室 = String
| 総席数 = String
| 個室 = String
| 貸切 = String
| WiFi = String
| バリアフリー = String
| 駐車場 = String
| その他設備 = String
| 飲み放題 = String
| 食べ放題 = String
| お子様連れ = String
}}</noinclude>

<includeonly>{{#cargo_store:}}</includeonly>

[[Category:飲食店]]
{{#arraymap: {{{ジャンル|}}} | , | @@ | [[Category:@@]] | }}

{{#if: {{{最寄り|}}} | [[Category:{{{最寄り}}}]] }}
{{#if: {{{テイクアウト|}}} | [[Category:テイクアウト{{{テイクアウト}}}]] }}
{{#if: {{{禁煙喫煙|}}} | [[Category:{{{禁煙喫煙}}}]] }}
{{#ifeq: {{{喫煙専用室|}}} | あり | [[Category:喫煙専用室あり]] }}
{{#ifeq: {{{個室|}}} | あり | [[Category:個室]] }}
{{#ifeq: {{{貸切|}}} | あり | [[Category:貸切]] }}
{{#ifeq: {{{Wi-Fi|}}} | あり | [[Category:Wi-Fi]] }}
{{#ifeq: {{{バリアフリー|}}} | あり | [[Category:バリアフリー]] }}
{{#ifeq: {{{駐車場|}}} | あり | [[Category:駐車場あり]] }}
{{#ifeq: {{{飲み放題|}}} | あり | [[Category:飲み放題]] }}
{{#ifeq: {{{食べ放題|}}} | あり | [[Category:食べ放題]] }}
{{#ifeq: {{{お子様連れ|}}} | あり | [[Category:お子様連れOK]] }}

{{#switch: {{{郵便番号}}}
| 6660148 = [[Category:赤松]]
| 6660156 = [[Category:石道]]
| 6660146 = [[Category:芋生]]
| 6660007 = [[Category:鴬が丘]]
| 6660133 = [[Category:鴬台]]
| 6660001 = [[Category:鴬の森町]]
| 6660014 = [[Category:小戸]]
| 6660015 = [[Category:小花]]
| 6660031 = [[Category:霞ケ丘]]
| 6660025 = [[Category:加茂]]
| 6660012 = [[Category:絹延町]]
| 6660135 = [[Category:錦松台]]
| 6660024 = [[Category:久代]]
| 6660103 = [[Category:国崎]]
| 6660101 = [[Category:黒川]]
| 6660145 = [[Category:けやき坂]]
| 6660107 = [[Category:下財町]]
| 6660115 = [[Category:向陽台]]
| 6660033 = [[Category:栄町]]
| 6660021 = [[Category:栄根]]
| 6660104 = [[Category:笹部]]
| 6660022 = [[Category:下加茂]]
| 6660125 = [[Category:新田]]
| 6660116 = [[Category:水明台]]
| 6660158 = [[Category:清流台]]
| 6660143 = [[Category:清和台西]]
| 6660142 = [[Category:清和台東]]
| 6660002 = [[Category:滝山町]]
| 6660126 = [[Category:多田院]]
| 6660127 = [[Category:多田院多田所町]]
| 6660128 = [[Category:多田院西]]
| 6660124 = [[Category:多田桜木]]
| 6660112 = [[Category:大和西]]
| 6660111 = [[Category:大和東]]
| 6660016 = [[Category:中央町]]
| 6660123 = [[Category:鼓が滝]]
| 6660034 = [[Category:寺畑]]
| 6660011 = [[Category:出在家町]]
| 6660113 = [[Category:長尾町]]
| 6660155 = [[Category:西畦野]]
| 6660138 = [[Category:西多田]]
| 6660004 = [[Category:萩原]]
| 6660006 = [[Category:萩原台西]]
| 6660134 = [[Category:萩原台西]]
| 6660005 = [[Category:萩原台東]]
| 6660035 = [[Category:花屋敷]]
| 6660036 = [[Category:花屋敷山手町]]
| 6660017 = [[Category:火打]]
| 6660117 = [[Category:東畦野]]
| 6660114 = [[Category:東畦野山手]]
| 6660023 = [[Category:東久代]]
| 6660122 = [[Category:東多田]]
| 6660032 = [[Category:日高町]]
| 6660153 = [[Category:一庫]]
| 6660121 = [[Category:平野]]
| 6660037 = [[Category:松が丘町]]
| 6660003 = [[Category:丸の内町]]
| 6660152 = [[Category:丸山台]]
| 6650891 = [[Category:満願寺町]]
| 6660013 = [[Category:美園町]]
| 6660157 = [[Category:緑が丘]]
| 6660129 = [[Category:緑台]]
| 6660136 = [[Category:南野坂]]
| 6660026 = [[Category:南花屋敷]]
| 6660105 = [[Category:見野]]
| 6660151 = [[Category:美山台]]
| 6660141 = [[Category:虫生]]
| 6660131 = [[Category:矢問]]
| 6660132 = [[Category:矢問東町]]
| 6660144 = [[Category:柳谷]]
| 6660106 = [[Category:山下町]]
| 6660154 = [[Category:山原]]
| 6660137 = [[Category:湯山台]]
| 6660102 = [[Category:横路]]
| 6660147 = [[Category:若宮]]
}}