Language
Login
Language Setting
X
English
日本語 [Japanese]
about this App
長野県酒蔵めぐり
useful
6
Loading...
window.onload = function () { var keyword = getParameterFromURL("subject"); // obtain keyword from the URL "?subject=" var count = 0; // number of subjects whose URI matches keyword // Work loop $.each(LinkData.getWorks(), function (workKey, workValue) { // File loop $.each(LinkData.getFiles(workValue), function (fileKey, fileValue) { // Subject loop $.each(LinkData.getSubjects(workValue, fileValue), function (subjKey, subjValue) { var s = ""; // subject to be displayed s += "<hr><a href=\"" + subjValue + "\" target=\"_top\"><span class=\"subject\">" + highlight(decodeURIComponent(subjValue), keyword) + "</span></a>"; var data = new Array(); var tableRow = '<tr>'; $.each(LinkData.getTriplesBySubject(workValue, fileValue, subjValue), function (tripleKey, tripleValue) { var prop = tripleValue.property; var obj = tripleValue.object; var propertyName = getLastName(prop); data[propertyName] = obj; }); // 行の内容を生成 tableRow += '<td>' + addLinkToSite(data['URL'], data['蔵元名']) + '<br>' + '<span class="mainItem">【' + addLinkToAmazon(data['代表銘柄']) + '】</span></td>'; tableRow += '<td>' + data['郵便番号'] + '<br>' + //data['住所'] + '</td>'; addLinkToMap(data['Latitude'], data['Longitude'], data['住所']) + '</td>'; tableRow += '<td>' + data['電話番号'] + '</td>'; tableRow += '<td>' + (data['営業時間'] ? data['営業時間'] : ' ') + '</td>'; tableRow += '<td>' + (data['定休日'] ? data['定休日'] : ' ') + '</td>'; tableRow += '</tr>'; $('#kura tr:last').after(tableRow); ++count; }); }); }); if (count > 0) { $("#resultCount").append(count + " 件のデータを表示しています。"); } window.find(highlight); }; // Get a parameter value in URL (e.g. ?paramString=value ) function getParameterFromURL(paramString) { var value = ""; var topWindow = top.window.location.search; if (topWindow) { var q = decodeURIComponent(topWindow.substring(1, topWindow.length)).split("&"); for (var i = 0; i < q.length; i++) { var r = q[i].split("="); if (r[0] == paramString) value = r[1]; } } return value; } // Highlight keyword in the string function highlight(string, keyword) { if (keyword.length > 0) { var ss = string.split(keyword); var len = ss.length; if (len > 1) { string = ss[0]; for (i = 1; i < len; i++) // string += "<font color=\"red\">"+keyword+"</font>"+ss[i]; string += "<span class=\"highlight\">" + keyword + "</span>" + ss[i]; } } return string; } // get the last name of the string separated with # and / function getLastName(string) { string = decodeURIComponent(string); var sharp = string.split("#"); var slash = sharp[sharp.length - 1].split("/"); var lastName = slash[slash.length - 1]; return lastName; } // return a link to Google map search function addLinkToMap(latitude, longitude, subject) { var s = '<a target="_blank" href="http://www.google.com/maps/?q=' + latitude + ',' + longitude + '">' + subject + '</a>'; return s; } /** * 蔵の名前にサイトへのリンクを張る * @param {type} url * @param {type} subject * @returns {undefined} */ function addLinkToSite(url, subject) { if (url) { return '<a target="_blank" href="' + url + '">' + subject + '</a>'; } else { return subject; } } function addLinkToAmazon(subject) { return '<a target="_blank" href="http://www.amazon.co.jp/s/ref=nb_sb_noss_1?url=search-alias%3Dfood-beverage&' + 'field-keywords=' + subject + '">' + subject + '</a>'; } // shortening URL e.g. http://.../123.jpg function shortenURL(url) { url = decodeURIComponent(url); var slash = url.split("/"); var lastName = slash[slash.length - 1]; return url.split(":")[0] + "://.../" + lastName; }
span.highlight {color: red;} span.propertyName {color: gray;} span.subject { color: blue; } span.object{ color: black; } body { background: white; font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; padding: 1em 2em 4em; } a, a span { text-decoration: underline; } a:hover, a span:hover { text-decoration: none; } /* 代表銘柄 */ span.mainItem { color: #333; font-size: 90%; } .name {} .address {} .tel { width: 7em; } .businessHours { width: 7em; } .shopHoliday {} /* -------------------------------------------------- coder Table -------------------------------------------------- */ .coder { border-spacing: 0; border: 1px solid #CCC; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px; box-shadow: 0 1px 1px #CCC; } .coder th, .coder td { padding:10px; background:#FFF; border-bottom:solid 1px #CCC; border-right:solid 1px #CCC; font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; } .coder td a { text-decoration: none; } .coder th { background:#e3dcd5; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset; color: black; } /* ----------------------- 左上角丸 最初の行の最初のセル ----------------------- */ .coder tr:first-child th:first-child, .coder tr:first-child td:first-child { -webkit-border-radius: 6px 0 0 0; -moz-border-radius: 6px 0 0 0; -o-border-radius: 6px 0 0 0; border-radius: 6px 0 0 0; } /* ----------------------- 右上角丸 最初の行の最後のセル ----------------------- */ .coder tr:first-child th:last-child, .coder tr:first-child td:last-child { -webkit-border-radius: 0 6px 0 0; -moz-border-radius: 0 6px 0 0; -o-border-radius: 0 6px 0 0; border-radius: 0 6px 0 0; } /* ----------------------- 左下角丸 最後の行の最初のセル ----------------------- */ .coder tr:last-child th:first-child, .coder tr:last-child td:first-child { -webkit-border-radius: 0 0 0 6px; -moz-border-radius: 0 0 0 6px; -o-border-radius: 0 0 0 6px; border-radius: 0 0 0 6px; } /* ----------------------- 右下角丸 最後の行の最後のセル ----------------------- */ .coder tr:last-child th:last-child, .coder tr:last-child td:last-child { -webkit-border-radius: 0 0 6px 0; -moz-border-radius: 0 0 6px 0; -o-border-radius: 0 0 6px 0; border-radius: 0 0 6px 0; } /* -------------------------------------------- thaed,tbodyを使う場合の設定 -------------------------------------------- */ .coder thead th {background:#e3dcd5;} .coder thead+tbody th {background:#f4ede6;} .coder tbody th {text-align:left;}/*IE*/ /* ----------------------- 左上角丸 thead内 最初の行の最初のセル ----------------------- */ .coder thead tr:first-child th:first-child, .coder thead tr:first-child td:first-child { -webkit-border-radius: 6px 0 0 0; -moz-border-radius: 6px 0 0 0; -o-border-radius: 6px 0 0 0; border-radius: 6px 0 0 0; } /* ----------------------- 右上角丸 thead内 最初の行の最後のセル ----------------------- */ .coder thead tr:first-child th:last-child, .coder thead tr:first-child td:last-child { -webkit-border-radius: 0 6px 0 0; -moz-border-radius: 0 6px 0 0; -o-border-radius: 0 6px 0 0; border-radius: 0 6px 0 0; } /* ----------------------- 角丸なし thaedの後のtbody 最初の行の最初のセル 角丸なし thaedの後のtbody 最初の行の最後のセル ----------------------- */ .coder thead+tbody tr:first-child th:first-child, .coder thead+tbody tr:first-child td:first-child, .coder thead+tbody tr:first-child th:last-child, .coder thead+tbody tr:first-child td:last-child { -webkit-border-radius:0px; -moz-border-radius:0px; -o-border-radius:0px; border-radius:0px; } /* ----------------------- 左下角丸 thaedの後のtbody 最後の行の最初のセル ----------------------- */ .coder thead+tbody tr:last-child th:first-child, .coder thead+tbody tr:last-child td:first-child { -webkit-border-radius: 0 0 0 6px; -moz-border-radius: 0 0 0 6px; -o-border-radius: 0 0 0 6px; border-radius: 0 0 0 6px; } /* ----------------------- 右下角丸 thaedの後のtbody 最後の行の最後のセル ----------------------- */ .coder thead+tbody tr:last-child th:last-child, .coder thead+tbody tr:last-child td:last-child { -webkit-border-radius: 0 0 6px 0; -moz-border-radius: 0 0 6px 0; -o-border-radius: 0 0 6px 0; border-radius: 0 0 6px 0; }
<h1>長野県酒蔵めぐり</h1> <p id="resultCount"></p> <table class="coder" id="kura"> <tr> <th class="name">蔵元名<br><span class="mainItem">【代表銘柄】</span></th> <th class="address">住所</th> <th class="tel">電話番号</th> <th class="businessHours">営業時間</th> <th class="shopHoliday">定休日</th> </tr> </table>
Preview
Input Data
ReadMe
Snapshots
LinkData Work
Table Data
長野県酒蔵
Contributor:Yuji Chino
Update:Mar 11, 2015
299 Downloads, 3 Applications
長野県酒造組合の酒蔵の一覧
Nagano_Sakagura
Add LinkData work(LinkData)
Link http://app.linkdata.org/run/app1s947i?tab=readme
jquery-1.11.2.min.js
Work
Add
Clear
insert work id or work name.