MediaWiki:Gadget-SearchInshokuten.js

注意: 保存後、変更を確認するにはブラウザーのキャッシュを消去する必要がある場合があります。

• Firefox / Safari: Shift を押しながら 再読み込み をクリックするか、Ctrl-F5 または Ctrl-R を押してください (Mac では ⌘-R)
• Google Chrome: Ctrl-Shift-R を押してください (Mac では ⌘-Shift-R)
• Microsoft Edge: Ctrl を押しながら 最新の情報に更新 をクリックするか、Ctrl-F5 を押してください。

if (document.querySelector('#searchForm')) {
document.getElementById('searchForm').addEventListener('submit', function (e) {
  const searchText = document.getElementById('searchText');
  const genre = document.getElementById('genre');
  const station = document.getElementById('station');
  const budget_min = document.getElementById('budget_min');
  const budget_max = document.getElementById('budget_max');

  if (searchText.value === '') {
    searchText.removeAttribute('name'); // 空のとき name属性を削除
  }
  if (genre.value === '') {
    genre.removeAttribute('name'); // 空のとき name属性を削除
  }
  if (station.value === '') {
    station.removeAttribute('name'); // 空のとき name属性を削除
  }
  if (budget_min.value === '') {
    budget_min.removeAttribute('name'); // 空のとき name属性を削除
  }
  if (budget_max.value === '') {
    budget_max.removeAttribute('name'); // 空のとき name属性を削除
  }
});

  const params = new URLSearchParams(window.location.search);

  params.forEach((value, key) => {
    // input, select, checkbox, radio 全対応
    const el = document.querySelector(`[name="${key}"]`);
    if (!el) return;

    // checkbox / radio (name[] の対応含む)
    if (el.type === "checkbox" || el.type === "radio") {
      document.querySelectorAll(`[name="${key}"]`).forEach(input => {
        if (input.value === value) {
          input.checked = true;
        }
      });
    } else {
      // text / select など
      el.value = value;
    }
  });

  const clearBtn = document.querySelector('.clear-btn');
  const form = document.getElementById('searchForm');

  clearBtn.addEventListener('click', function () {

    form.reset();
  });

  // URLパラメータ取得
  var area = params.get("station");
  var category = params.get("genre");
  var count = document.getElementById("count");

    // タイトル生成
    let title = "川西市でおすすめのグルメ情報をご紹介！ | 川西図鑑";

    if (area) {
        if (category) {
            title = `${area}でおすすめのおいしい${category}をご紹介！ | 川西図鑑`;
        } else {
            title = `${area}でおすすめのおいしいグルメをご紹介！ | 川西図鑑`;
        }
    } else if (category) {
        title = `川西市でおすすめのおいしい${category}をご紹介！ | 川西図鑑`;
    }

    // タイトル更新
    document.title = title;

  if (area) {
    area = "の" + area;
  } else {
    area = "";
  }

  if (category) {
    category = "の" + category;
  } else {
    category = "";
  }

  if (count) {
    count = count.textContent;
  } else {
    count = "";
  }

  // description生成
  let desc = `「川西図鑑」では、兵庫県川西市${area}で人気${category}のお店を ${count}掲載中。営業時間、アクセス、写真、地図などの詳細情報をまとめています。ランチやディナー、テイクアウトなど条件で絞り込みができ、地元でおすすめのお店が見つかります。`;

  let meta = document.querySelector("meta[name='description']");
  if (!meta) {
    meta = document.createElement("meta");
    meta.name = "description";
    document.head.appendChild(meta);
  }

  meta.content = desc;
  
      // 既存の canonical があれば削除
    $('link[rel="canonical"]').remove();

    // 現在のURL取得
    let url = window.location.href;

    // 余計なパラメータ（例：&limit=50 とか）を除外したい場合
    const removeParams = ['limit', 'offset'];
    let cleanUrl = new URL(url);

    removeParams.forEach(param => cleanUrl.searchParams.delete(param));

    // canonical タグ作成
    let canonical = document.createElement('link');
    canonical.setAttribute("rel", "canonical");
    canonical.setAttribute("href", cleanUrl.toString());

    // head に追加
    document.head.appendChild(canonical);
}