Language
Login
Language Setting
X
English
日本語 [Japanese]
about this App
須坂の歴史年表~すざかのできごと~
useful
6
Loading...
if (!HIS) { var HIS = {}; } HIS.main = function() { this._init.apply(this, arguments); }; HIS.main.prototype = { _infoList : null, _property : null, _subjectList : null, _cons : { MAX_ITEM_COUNT : 300, INFO_SELECTOR : ".info", KEY_WORD_SELECTOR : "#keyword", INFO_LIST_SELECTOR : "#infoList", TAG_SELECTOR : ".tag", SEARCH_IMAGE_SELECTOR : ".searchImage", PAGE_TITLE_SELECTOR : ".pageTitle", }, _init : function() { this._infoList = []; this._property = new HIS.property(); this._initInfoList(); this._initView(); this._initListener(); }, _initInfoList : function() { var self = this, workId = self._property.getWorkId(), fileName = self._property.getFileName(); var subjectList = LinkData.getSubjects(workId, fileName); for (var i = 0; i < subjectList.length; i++) { var subject = subjectList[i]; var info = new HIS.info(); info.setName(LinkData.getObjects(workId, fileName, subject, self._property.getNameProperty())[0]); info.setAd(LinkData.getObjects(workId, fileName, subject, self._property.getAdProperty())[0]); info.setJc(LinkData.getObjects(workId, fileName, subject, self._property.getJcProperty())[0]); info.setDate(LinkData.getObjects(workId, fileName, subject, self._property.getDateProperty())[0]); info.setEvent(LinkData.getObjects(workId, fileName, subject, self._property.getEventProperty())[0]); self._infoList.push(info); } }, _initView : function() { }, _initListener : function() { this._initPageTitleListener(); this._initAutoCompleter(); this._initKeywordListener(); this._initSearchImageListener(); }, _initPageTitleListener : function() { var self = this; $(self._cons.PAGE_TITLE_SELECTOR).click(function() { $(self._cons.KEY_WORD_SELECTOR).val(""); var infoList = self._getInfoListByIndex(1, self._cons.MAX_ITEM_COUNT); self._addHtml(infoList); }); }, _initAutoCompleter : function() { var self = this; $(self._cons.KEY_WORD_SELECTOR).autocomplete({ minLength: 1, source: function(req, res) { var keyword = req.term; res(self._getMatchWordListByKeyword(keyword)); }, select : function(event, ui) { var keyword = ui.item.value; var infoList = self._getInfoListByIndex(1, self._cons.MAX_ITEM_COUNT, keyword); self._addHtml(infoList, keyword); } }) }, _initKeywordListener : function() { var self = this; $(self._cons.KEY_WORD_SELECTOR).keydown(function(evt) { if (evt.which == 13) { $(self._cons.KEY_WORD_SELECTOR).autocomplete("close"); var keyword = $(this).val(); var infoList = self._getInfoListByIndex(1, self._cons.MAX_ITEM_COUNT, keyword); self._addHtml(infoList, keyword); } }); }, _initSearchImageListener : function() { var self = this; $(self._cons.SEARCH_IMAGE_SELECTOR).click(function() { $(self._cons.KEY_WORD_SELECTOR).autocomplete("close"); var keyword = $(self._cons.KEY_WORD_SELECTOR).val(); var infoList = self._getInfoListByIndex(1, self._cons.MAX_ITEM_COUNT, keyword); self._addHtml(infoList, keyword); }); }, _initTagListener : function() { var self = this; $(self._cons.INFO_LIST_SELECTOR + " " + self._cons.TAG_SELECTOR).unbind("click"); $(self._cons.INFO_LIST_SELECTOR + " " + self._cons.TAG_SELECTOR).click(function() { var keyword = $(this).text().trim(); $(self._cons.KEY_WORD_SELECTOR).val(keyword); var infoList = self._getInfoListByIndex(1, self._cons.MAX_ITEM_COUNT, keyword); self._addHtml(infoList, keyword); }); }, _addHtml : function(infoList, keyword) { var self = this; if (infoList.length != 0) { var html = self._getContentHtml(infoList, keyword); $(self._cons.INFO_LIST_SELECTOR).html(html); self._initTagListener(); } else { var html = self._getNotFoundHtml(); $(self._cons.INFO_LIST_SELECTOR).html(html); } }, _appendHtml : function(infoList, keyword) { var self = this; var html = self._getContentHtml(infoList, keyword); $(self._cons.INFO_LIST_SELECTOR).append(html); self._initTagListener(); }, _getInfoList : function(start, itemCount) { var self = this, list = []; var workId = self._property.getWorkId(), fileName = self._property.getFileName(); var sList = self._getSubjectList(start, itemCount); for (var i = 0; i < sList.length; i++) { var subject = sList[i]; var info = new HIS.info(); info.setName(LinkData.getObjects(workId, fileName, subject, self._property.getNameProperty())[0]); info.setAd(LinkData.getObjects(workId, fileName, subject, self._property.getAdProperty())[0]); info.setJc(LinkData.getObjects(workId, fileName, subject, self._property.getJcProperty())[0]); info.setDate(LinkData.getObjects(workId, fileName, subject, self._property.getDateProperty())[0]); info.setEvent(LinkData.getObjects(workId, fileName, subject, self._property.getEventProperty())[0]); list.push(info); } return list; }, _getMatchWordListByKeyword : function(keyword) { var self = this, list = []; var infoList = self._getInfoListByIndex(2, self._cons.MAX_ITEM_COUNT, keyword); $.each(infoList, function(key, info) { if (info.getName().toLowerCase().indexOf(keyword.toLowerCase()) > -1 && $.inArray(info.getName(), list)) { list.push(info.getName()); } if (info.getAd().toLowerCase().indexOf(keyword.toLowerCase()) > -1 && $.inArray(info.getAd(), list)) { list.push(info.getAd()); } if (info.getEvent().toLowerCase().indexOf(keyword.toLowerCase()) > -1 && $.inArray(info.getEvent(), list)) { list.push(info.getEvent()); } if (info.getJc().toLowerCase().indexOf(keyword.toLowerCase()) > -1 && $.inArray(info.getJc(), list)) { list.push(info.getJc()); } if (info.getDate().toLowerCase().indexOf(keyword.toLowerCase()) > -1 && $.inArray(info.getDate(), list)) { list.push(info.getDate()); } }); return list; }, _getInfoListByIndex : function(page, itemCount, keyword) { var self = this, list = [], count = 0; var end = (page * itemCount) - 1; var start = end - itemCount + 1; for (var i = 0; i < self._infoList.length; i++) { var info = self._infoList[i]; if ((!keyword || keyword.trim().length == 0) || self._isHitInfo(info, keyword)) { if (count >= start && count <= end) { list.push(info); } count++; } if (list.length == itemCount) { return list; } } return list; }, _isHitInfo : function(info, keyword) { if (!keyword || keyword.trim().length == 0) { return false; } if (info.getName().toLowerCase().indexOf(keyword.toLowerCase()) > -1) { return true; } else if (info.getAd().toLowerCase().indexOf(keyword.toLowerCase()) > -1) { return true; } else if (info.getEvent().toLowerCase().indexOf(keyword.toLowerCase()) > -1) { return true; } else if (info.getJc().toLowerCase().indexOf(keyword.toLowerCase()) > -1) { return true; } else if (info.getDate().toLowerCase().indexOf(keyword.toLowerCase()) > -1) { return true; } return false; }, _getContentHtml : function(infoList, keyword) {/* 情報ウィンドの表示設定 */ var self = this, sb = []; for (var i = 0; i < infoList.length; i++) { var info = infoList[i]; sb[sb.length] = "<div class='info cf'>"; sb[sb.length] = "<div class='profileInfoArea left'>"; sb[sb.length] = ""+"<div class='name'>" + self._getHighLightKeywordHtml(info.getAd(), keyword) + "年(" + self._getHighLightKeywordHtml(info.getJc(), keyword) +"年) " + self._getHighLightKeywordHtml(info.getDate(), keyword); if (info.getEvent().trim().length != 0) { sb[sb.length] = "<br><span class='nextTo'>" + self._getHighLightKeywordHtml(info.getEvent(), keyword) + "</span>"; } sb[sb.length] = "</div>"; sb[sb.length] = "<div class='cf'>"; sb[sb.length] = "</div>"; sb[sb.length] = "</div>"; sb[sb.length] = "</div>"; sb[sb.length] = "</div>"; } return sb.join(""); }, _getHighLightKeywordHtml : function(text, keyword) { if (!keyword || keyword.trim().length == 0) { return text; } var regex = new RegExp('(' + keyword + ')', 'gi'); return text.replace(regex, "<span class='highlight'>$1</span>"); }, _getNotFoundHtml : function() { var sb = []; sb[sb.length] = "<div class='info error'>出来事は見つかりませんでした</div>"; return sb.join(""); }, _getTagListHtml : function(tagList, keyword) { var self = this, sb = []; for (var i = 0; i < tagList.length; i++) { var tag = tagList[i]; sb[sb.length] = "<span class='tag left'>" + self._getHighLightKeywordHtml(tag.trim(), keyword) + "</span>"; } return sb.join(""); } }; HIS.property = function() { this._init.apply(this, arguments); }; HIS.property.prototype = { _workId : null, _fileName : null, _nameProperty : null, _adProperty : null, _jcProperty : null, _dateProperty : null, _eventProperty : null, _cons : { NAME : "label", AD : "ad", DATE : "date", JC : "jc", EVENT : "event" }, _init : function() { this._initProperty(); }, _initProperty : function() { var self = this; $.each(LinkData.getWorks(), function(workKey, workId) { $.each(LinkData.getFiles(workId), function(fileKey, fileName) { self._workId = workId; self._fileName = fileName; $.each(LinkData.getProperties(workId, fileName), function(propKey, propValue) { if (propValue.indexOf(self._cons.NAME) > -1) { self._nameProperty = propValue; } else if (propValue.indexOf(self._cons.AD) > -1) { self._adProperty = propValue; } else if (propValue.indexOf(self._cons.JC) > -1) { self._jcProperty = propValue; } else if (propValue.indexOf(self._cons.DATE) > -1) { self._dateProperty = propValue; } else if (propValue.indexOf(self._cons.EVENT) > -1) { self._eventProperty = propValue; } }); return false; }); return false; }); }, getWorkId : function() { return this._workId; }, getFileName : function() { return this._fileName; }, getNameProperty : function() { return this._nameProperty; }, getAdProperty : function() { return this._adProperty; }, getJcProperty : function() { return this._jcProperty; }, getDateProperty : function() { return this._dateProperty; }, getEventProperty : function() { return this._eventProperty; } }; HIS.info = function() { this._init.apply(this, arguments); }; HIS.info.prototype = { _name : null, _ad : null, _jc : null, _date : null, _event : null, _init : function() {}, getName : function() { if (!this._name) { this._name = ""; } return this._name; }, setName : function(name) { this._name = name; }, getAd : function() { if (!this._ad) { this._ad = ""; } return this._ad; }, setAd : function(ad) { this._ad = ad; }, getJc : function() { if (!this._jc) { this._jc = ""; } return this._jc; }, setJc : function(jc) { this._jc = jc; }, getDate : function() { if (!this._date) { this._date = ""; } return this._date; }, setDate : function(date) { this._date = date; }, getEvent : function() { if (!this._event) { this._event = ""; } return this._event; }, setEvent : function(event) { this._event = event; } }; $(document).ready(function() { new HIS.main(); });
body, input { font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"MS Pゴシック","MS PGothic",sans-serif; font-size: 12px; margin: 0; padding: 0; } .left { float: left; } .right { float: right; } .cf:after { display: block; content: ""; clear: both; } .hide { display: none; } .nextTo { padding-right: 2em; } .icon { height: 7px; width: 7px; display: inline-block; margin-right: 3px; vertical-align: middle; background-repeat: no-repeat; } .icon-about, .icon-contact { margin-right: 0px; } .icon-list, .icon-user, .icon-comment, .icon-briefcase, .icon-envelope, } .icon-about { background-position: -96px -96px; } .icon-contact { background-position: -72px 0; } .icon-briefcase { background-position: -432px -144px; } .icon-envelope { background-position: -72px 0; } .icon-comment { background-position: -240px -120px; } .icon-user { background-position: -168px 0; } .icon-list { background-position: -264px -24px; margin-top: 3px; } .icon-home { background-position: 0 -24px; } .icon-hand-right { background-position: -144px -144px; } #pageContainer { background-color: #f5deb3; min-width: 200px; width: 100%; min-height: 500px; } #pageContainer .body { height: auto; text-align: center; } #pageContainer .header { background: #ff7f50; /* Old browsers */ background: -moz-linear-gradient(top, #ff7f50 0%, #ff7f50 11%, #ff7f50 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7f50), color-stop(11%,#888888), color-stop(100%,#ff7f50)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* IE10+ */ background: linear-gradient(to bottom, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f50', endColorstr='#ff7f50',GradientType=0 ); /* IE6-9 */ -moz-box-shadow: 2px 2px 3px 2px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 2px 2px 3px 2px rgba(0, 0, 0, 0.4); box-shadow: 2px 2px 3px 2px rgba(0, 0, 0, 0.4); } #pageContainer .footer { background: #ff7f50; /* Old browsers */ background: -moz-linear-gradient(top, #ff7f50 0%, #ff7f50 11%, #ff7f50 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7f50), color-stop(11%,#ff7f50), color-stop(100%,#ff7f50)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* IE10+ */ background: linear-gradient(to bottom, #ff7f50 0%,#ff7f50 11%,#ff7f50 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f50', endColorstr='#ff7f50',GradientType=0 ); /* IE6-9 */ } #pageContainer .footer a { color: #FFF; } #pageContainer .body .bodyContainer { width: 100%; } #pageContainer .header .headerContent { width: 100%; } #pageContainer .header, #pageContainer .footer { background-color: #ff7f50; height: 50px; color: #FFFFFF; text-align: center; } #pageContainer .header .headerContent { margin-left: auto; margin-right: auto; } #pageContainer .header .headerContent .contact, #pageContainer .header .headerContent .about, #pageContainer .header .headerContent .pageTitle { font-size: 14px; font-weight: bold; text-shadow: 0 2px 3px #555555; padding: 5px; } #pageContainer .header .headerContent .pageTitle{ cursor: pointer; margin: 0; } #pageContainer .header .headerContent .contact, #pageContainer .header .headerContent .about{ cursor: pointer; margin: 7px 0 0 20px; } #pageContainer .header .headerContent .contact a, #pageContainer .header .headerContent .about a { text-decoration: none; color: #FFFFFF; } #pageContainer .body .bodyContainer { height: auto; padding-top: 20px; margin-left: auto; margin-right: auto; } #pageContainer .body .bodyContainer .searchBox {/* 検索窓自体の設定 */ height: auto; margin-left: auto; margin-right: auto; display: inline-block; background: #FFF; width: 90%; margin: 5px auto; border-radius: 10px; padding: 5px 10px; box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.4) inset; } #pageContainer .body .bodyContainer .searchBox #keyword { /* 検索窓内の設定 */ width: 80%; font-size: 1.4em; line-height: 100%; float: left; border: none; } #pageContainer .body .bodyContainer .searchBox input:focus { border: none; outline:none; } #pageContainer .body .bodyContainer .searchBox .searchImage { vertical-align: middle; cursor: pointer; padding: 0px 0; width: auto; } #pageContainer #infoBox { margin: 0 5px; } #pageContainer #infoList .info { /* 情報ウィンド内の設定 */ margin: 7px 7px; padding: 2px 5px; text-align: left; background-color: #FFFFFF; } #pageContainer #infoList .error { text-align: center; } #pageContainer #infoList .info .tagList { width: 100%; } #pageContainer #infoList .info .highlight { color: #0084F7; } #pageContainer .bodyContainer .moreInfo, #pageContainer #infoList .info { border: 1px solid #666666; border-radius: 3px; } #pageContainer #infoList .info .profileImageArea { margin-right: 1px; min-width: 100px; position: relative; } #pageContainer #infoList .info .profileInfoArea { width: 100%; } #pageContainer #infoList .info .profileInfoArea .name { font-size: 1.0em; position: relative; } #pageContainer #infoList .info .profileInfoArea .orgName { margin-right: 3px; } #pageContainer #infoList .info .profileInfoArea .tag { background-color: #FFFCE2; border: 1px solid #E6CB00; color: #E6CB00; margin: 3px 3px 3px 0; padding: 0 3px; border-radius: 5px; cursor: pointer; } #pageContainer #infoList .info .profileInfoArea .mainPaper { max-width: 90%; margin: 0 0 3px; } #pageContainer .bodyContainer .moreInfo { margin: 3px 0 3px; padding: 5px; background-color: #ff7f50; color: #FFF; font-weight: bold; cursor: pointer; }
<div id="pageContainer"> <div class="header"> <div class="headerContent cf"> <div class="pageTitle">須坂の歴史年表<br> ~すざかのできごと~</div> </div> </div> <style type="text/css"> <!-- select{ font-size:150%; } --> </style> <div class="body"> <div class="bodyContainer"> <div> <span class="searchBox"> <input id="keyword" type="text" name="myext"/> <img class="searchImage" src="http://app.linkdata.org/asset/95f23270.png"/> </span> <br>年・月日・単語で検索できます<br>(例:1990、平成25、1/1、臥竜) </div> <div id="infoBox"> <div id="infoList"></div> </div> </div> </div> <div class="footer">このアプリは長野県須坂市のオープンデータ <a href="http://opendata.city.suzaka.nagano.jp/" target="_blank"> 須坂市の歴史</a> を利用しています。</div> </div>
Preview
Input Data
ReadMe
Snapshots
LinkData Work
Table Data
須坂の歴史年表
Contributor:長野県須坂市
Update:Aug 24, 2020
1408 Downloads, 1 Applications
長野県の須坂市で起きた出来事です。紀元前から直近まで収録してあります。データの加除は随時で行います。 【データ収録範囲】 紀元前~平成30年12月31日まで 【更新履歴】 2015.10.28 データ追加(H26) 2020.08.24 データ更新(H30)
suzakacity_history
Add LinkData work(LinkData)
Link http://app.linkdata.org/run/app1s846i?tab=readme
jquery-1.7.1.min.js
jquery-ui-1.8.18.min.js
Work
Add
Clear
insert work id or work name.