SGC Crisis Response Navigator

SGC Crisis Responseは、外国人住民・支援者・地域住民が災害時に信頼できる一次情報へ素早くアクセスするための多言語防災リンクナビゲーションアプリです。LinkDATA.orgのオープンデータを利用し、行政・気象・ライフライン等の公式情報を検索・閲覧できます。

Rating

useful

Application

Play
JavaScript
CSS
HTML
ReadMe
Snapshots

window.onload = function() {
  var keyword = getParameterFromURL("q");
  var list = "";

$("#result").append("<h2>SGC Crisis Response Navigator</h2>");
  $("#result").append("<p>防災・災害対応に関するリンクを検索できます。</p>");

$("#result").append(
    '<input id="searchBox" type="text" placeholder="キーワード検索" value="' + escapeHtml(keyword) + '">' +
    '<button onclick="runSearch()">検索</button>' +
    '<div id="cards"></div>'
  );

renderCards(keyword);
};

function renderCards(keyword) {
  $("#cards").empty();

$.each(LinkData.getWorks(), function(workKey, workValue) {
    $.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
      $.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {

var item = {
          subject: decodeURIComponent(subjValue),
          title: "",
          category: "",
          area: "",
          description: "",
          url: "",
          source: "",
          last_checked: ""
        };

$.each(LinkData.getTriplesBySubject(workValue, fileValue, subjValue), function(tripleKey, tripleValue) {
          var prop = getLastName(tripleValue.property);
          var obj = tripleValue.object;

if (prop == "title" || prop == "name" || prop == "label") item.title = obj;
          if (prop == "category") item.category = obj;
          if (prop == "area") item.area = obj;
          if (prop == "description") item.description = obj;
          if (prop == "url" || prop == "link") item.url = obj;
          if (prop == "source") item.source = obj;
          if (prop == "last_checked") item.last_checked = obj;
        });

var text = [
          item.subject,
          item.title,
          item.category,
          item.area,
          item.description,
          item.url,
          item.source
        ].join(" ");

if (keyword && text.indexOf(keyword) === -1) return;

$("#cards").append(makeCard(item, keyword));
      });
    });
  });
}

function makeCard(item, keyword) {
  var title = item.title || item.subject;
  var urlHtml = "";

if (item.url && item.url.indexOf("http") === 0) {
    urlHtml = '<p><a href="' + item.url + '" target="_blank">公式リンクを開く</a></p>';
  }

return (
    '<div class="card">' +
      '<h3>' + highlight(escapeHtml(title), keyword) + '</h3>' +
      '<p><strong>カテゴリ:</strong> ' + highlight(escapeHtml(item.category), keyword) + '</p>' +
      '<p><strong>地域:</strong> ' + highlight(escapeHtml(item.area), keyword) + '</p>' +
      '<p>' + highlight(escapeHtml(item.description), keyword) + '</p>' +
      urlHtml +
      '<p class="meta">出典: ' + escapeHtml(item.source) + '</p>' +
      '<p class="meta">確認日: ' + escapeHtml(item.last_checked) + '</p>' +
    '</div>'
  );
}

function runSearch() {
  var q = $("#searchBox").val();
  renderCards(q);
}

function highlight(string, keyword) {
  if (!keyword || keyword.length === 0) return string;
  return string.split(keyword).join('<span class="highlight">' + keyword + '</span>');
}

function getLastName(string) {
  string = decodeURIComponent(string);
  var sharp = string.split("#");
  var slash = sharp[sharp.length - 1].split("/");
  return slash[slash.length - 1];
}

function escapeHtml(str) {
  if (!str) return "";
  return String(str)
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;")
    .replace(/>/g, "&gt;")
    .replace(/"/g, "&quot;")
    .replace(/'/g, "&#039;");
}