147 | | <script type="text/javascript">(function(){ |
148 | | |
149 | | function Hash(){ |
150 | | this.length = 0; |
151 | | this.items = new Array(); |
152 | | |
153 | | for (var i = 0; i < arguments.length; i += 2) { |
154 | | if (typeof(arguments[i + 1]) != 'undefined') { |
155 | | this.items[arguments[i]] = arguments[i + 1]; |
156 | | this.length++; |
157 | | } |
158 | | } |
159 | | }; |
160 | | |
161 | | Hash.prototype = { |
162 | | removeItem: function(in_key) { |
163 | | var tmp_value; |
164 | | if (typeof(this.items[in_key]) != 'undefined') { |
165 | | this.length--; |
166 | | tmp_value = this.items[in_key]; |
167 | | delete this.items[in_key]; |
168 | | } |
169 | | return tmp_value; |
170 | | }, |
171 | | |
172 | | getItem: function(in_key) { |
173 | | return this.items[in_key]; |
174 | | }, |
175 | | |
176 | | setItem: function(in_key, in_value) { |
177 | | if (typeof(in_value) != 'undefined') { |
178 | | if (typeof(this.items[in_key]) == 'undefined') { |
179 | | this.length++; |
180 | | } |
181 | | this.items[in_key] = in_value; |
182 | | } |
183 | | return in_value; |
184 | | }, |
185 | | |
186 | | hasItem: function(in_key) { |
187 | | return typeof(this.items[in_key]) != 'undefined'; |
188 | | }, |
189 | | |
190 | | getLength: function(){ |
191 | | return this.length; |
192 | | } |
193 | | }; |
194 | | |
195 | | var LOCATION = new Hash(); |
196 | | var ELEMENT = new Hash(); |
197 | | var EVENT = new Hash(); |
198 | | var BIG_EVENT = new Hash(); |
199 | | var PEOPLE = new Hash(); |
200 | | var PEOPLE_ARRAY = new Array(); |
201 | | var CURRENT_EVENT_HASH = new Hash(); |
202 | | var CURRENT_ELEMENT_HASH = new Hash(); |
203 | | var CURRENT_EVENT = Array(); |
204 | | var CURRENT_ELEMENT = new Array(); |
205 | | var HIGH_LIGHT_ELEMENT = new Array(); |
206 | | var CURRENT_OVERLAY_ID = ""; |
207 | | var BASE = 'http://redcliff.googlecode.com/svn/trunk/'; |
208 | | var CN_BASE = 'http://www.google.cn/staticcn/chibi/'; |
209 | | var LAIBA_BASE = ''; |
210 | | var NULL_PIC = 'http://laiba.tianya.cn/laiba/images/274/12295005600705035805/A/1/o.png'; |
211 | | |
212 | | var CURRENT_BIG_EVENT = null; |
213 | | var CURRENT_PEOPLE = null; |
214 | | |
215 | | var CURRENT_TAB = null; |
216 | | |
217 | | var URL = { |
218 | | location_url: BASE + 'data_tc/location.json?bpc=12191314', |
219 | | element_url: BASE + 'data_tc/element.json?bpc=12191328', |
220 | | event_url: BASE + 'data_tc/event.json?bpc=12191540', |
221 | | big_event_url: BASE + 'data_tc/big_event.json?bpc=12191303', |
222 | | people_url: BASE +'data_tc/people.json?bpc=12191540', |
223 | | tile_url: 'http://mt.google.cn/mt?v=cnsg1.2&hl=zh-CN&x={X}&y={Y}&z={Z}' |
224 | | }; |
225 | | |
226 | | var FLAGS = { |
227 | | '蜀': 'G', |
228 | | '魏': 'B', |
229 | | '吳': 'R' |
230 | | }; |
231 | | |
232 | | var INFOWIN_TAB_LABELS = ['事件一', '事件二', '事件三', '事件四', '事件五', '事件六']; // add more if there are more overlap... |
233 | | |
234 | | var G_MAP; |
235 | | |
236 | | // Google Analytics Account |
237 | | var UAACCT = "UA-6735343-1"; |
238 | | |
239 | | var C_POLYLINE_WEIGHT = 10 |
240 | | |
241 | | |
242 | | |
243 | | function Location(raw_location) { |
244 | | var me = this; |
245 | | this.location = raw_location; |
246 | | this.name = location.name; |
247 | | this.point = new GLatLng(raw_location.lat, raw_location.lng); |
248 | | }; |
249 | | |
250 | | |
251 | | function Element(raw_element) { |
252 | | var me = this; |
253 | | this.id = raw_element.id |
254 | | this.element = raw_element; |
255 | | this.type = raw_element.type; |
256 | | |
257 | | var getHiddenPolylineOverlay = function(points, weigth, id) { |
258 | | var latlngs = new Array(); |
259 | | $.each(points, function(index, point){ |
260 | | latlngs.push(new GLatLng(point.lat, point.lng)); |
261 | | }); |
262 | | var polyline = new GPolygon(latlngs, "#000000", 10, 0.0); |
263 | | GEvent.addListener(polyline, 'click', function(latlng) { |
264 | | G_MAP.openInfoWindow("ELEMENT", id, latlng); |
265 | | }); |
266 | | return polyline; |
267 | | }; |
268 | | |
269 | | var getArrowGroundOverlay = function(arrow_url, sw, ne) { |
270 | | var bound = new GLatLngBounds(new GLatLng(ne.lat, ne.lng), new GLatLng(sw.lat, sw.lng)); |
271 | | var arrow = new GGroundOverlay(CN_BASE + 'arrow/' + arrow_url + '.png', bound); |
272 | | return arrow; |
273 | | } |
274 | | |
275 | | var getMarker = function(icon_url, point, id) { |
276 | | var image = CN_BASE + 'icon/' + icon_url + '.png'; |
277 | | var icon = new GIcon(G_DEFAULT_ICON, image); |
278 | | if (icon_url.length == 2) |
279 | | icon.iconSize = new GSize(45,32); |
280 | | else |
281 | | icon.iconSize = new GSize(25,32); |
282 | | var marker = new GMarker(point, {icon:icon}); |
283 | | GEvent.addListener(marker, 'click', function() { |
284 | | G_MAP.openInfoWindow("ELEMENT", id, point); |
285 | | }); |
286 | | return marker; |
287 | | } |
288 | | if (this.type == 'point') { |
289 | | this.point = new GLatLng(raw_element.lat, raw_element.lng); |
290 | | this.marker = getMarker(raw_element.pic, this.point, this.id); |
291 | | } else { |
292 | | this.hidden_polyline = getHiddenPolylineOverlay(raw_element.hot_points, C_POLYLINE_WEIGHT, this.id); |
293 | | this.arrow = getArrowGroundOverlay(raw_element.arrow, raw_element.arrow_points[0], raw_element.arrow_points[1]); |
294 | | |
295 | | } |
296 | | this.events = raw_element.event_ids; |
297 | | }; |
298 | | |
299 | | Element.prototype = { |
300 | | drawOnMap: function() { |
301 | | if (this.type == 'line') { |
302 | | G_MAP.addOverlay(this.hidden_polyline); |
303 | | G_MAP.addOverlay(this.arrow); |
304 | | } else { |
305 | | G_MAP.addOverlay(this.marker); |
306 | | } |
307 | | }, |
308 | | |
309 | | removeFromMap: function() { |
310 | | if (this.type == 'line') { |
311 | | G_MAP.removeOverlay(this.hidden_polyline); |
312 | | G_MAP.removeOverlay(this.arrow); |
313 | | } else { |
314 | | G_MAP.removeOverlay(this.marker); |
315 | | } |
316 | | } |
317 | | |
318 | | /* |
319 | | highLight: function() { |
320 | | G_MAP.removeOverlay(this.current_overlay); |
321 | | G_MAP.addOverlay(this.highlight_overlay); |
322 | | this.current_overlay = this.highlight_overlay; |
323 | | }, |
324 | | |
325 | | deHighLight: function() { |
326 | | G_MAP.removeOverlay(this.current_overlay); |
327 | | G_MAP.addOverlay(this.overlay); |
328 | | this.current_overlay = this.overlay; |
329 | | }, |
330 | | |
331 | | adjustZoomLevel: function() { |
332 | | } |
333 | | */ |
334 | | }; |
335 | | |
336 | | var encapsulateActiveEventOrPeople = function(people_id) { |
337 | | if (CURRENT_BIG_EVENT != null) { |
338 | | var big_event = BIG_EVENT.getItem(CURRENT_BIG_EVENT); |
339 | | big_event.hideDetails(); |
340 | | CURRENT_BIG_EVENT = null; |
341 | | } |
342 | | if (CURRENT_PEOPLE != null && people_id && CURRENT_PEOPLE == people_id) |
343 | | return; |
344 | | if (CURRENT_PEOPLE != null) { |
345 | | var people = PEOPLE.getItem(CURRENT_PEOPLE); |
346 | | people.node.encapsulate(); |
347 | | CURRENT_PEOPLE = null; |
348 | | } |
349 | | } |
350 | | |
351 | | function Event(raw_event) { |
352 | | this.id = raw_event.id; |
353 | | this.name = raw_event.name; |
354 | | this.element_ids = raw_event.element_ids; |
355 | | this.people = raw_event.people; |
356 | | this.search = raw_event.search; |
357 | | this.time = raw_event.time; |
358 | | this.time_ad = raw_event.ad; |
359 | | this.desc = raw_event.desc; |
360 | | this.point = new GLatLng(raw_event.popup.lat, raw_event.popup.lng); |
361 | | }; |
362 | | |
363 | | function BigEvent(raw_event) { |
364 | | var me = this; |
365 | | this.id = raw_event.id |
366 | | this.name = raw_event.name; |
367 | | this.element_ids = raw_event.element_ids; |
368 | | this.event_ids = raw_event.event_ids; |
369 | | this.time = raw_event.time; |
370 | | this.time_ad = raw_event.ad; |
371 | | this.desc = raw_event.desc; |
372 | | this.pic = raw_event.pic; |
373 | | this.is_details_shown = false; |
374 | | this.details = null; |
375 | | this.images = raw_event.images; |
376 | | this.center = new GLatLng(raw_event.center.lat, raw_event.center.lng); |
377 | | var genNode = function() { |
378 | | var node = $('<div class="big-event-item"></div>'); |
379 | | |
380 | | var table = $('<table><tbody><tr></tr></tbody></table>'); |
381 | | var row = table.children().children(); |
382 | | var time_cell = $('<td class="big-event-item-time" title="' + me.time_ad + '">' + me.time + '</div>'); |
383 | | var link_cell = $('<td class="big-event-item-link"></td>'); |
384 | | row.append(time_cell); |
385 | | row.append(link_cell); |
386 | | row.append('<td class="big-event-item-pic"><img src="' + CN_BASE + 'icon/' + me.pic + '.gif"></td>'); |
387 | | node.append(table); |
388 | | |
389 | | var event_link = $('<a href=#>' + me.name + '</a>'); |
390 | | event_link.click(function(){ |
391 | | if (me.is_details_shown) { |
392 | | me.hideDetails(); |
393 | | } else { |
394 | | me.showDetails(); |
395 | | } |
396 | | G_MAP.updateOverlay('E', me.id); |
397 | | G_MAP.setCenter(me.center, 8); |
398 | | _IG_Analytics(UAACCT, '/click/eventLink/' + me.name); |
399 | | return false; |
400 | | }); |
401 | | link_cell.append(event_link); |
402 | | |
403 | | me.details = $('<div class="big-event-detail" style="display:none;"></div>'); |
404 | | me.details.append($('<p>' + me.desc + '</p>')); |
405 | | |
406 | | var imgs = $('<div class="big-event-imgs"></div>'); |
407 | | $.each(me.images, function(index, img_url) { |
408 | | var img = $('<img src="' + img_url + '">'); |
409 | | imgs.append(img); |
410 | | }); |
411 | | me.details.append(imgs); |
412 | | |
413 | | |
414 | | var event_list = $('<table class="events-div"></table>'); |
415 | | genEventList(event_list, me.event_ids); |
416 | | me.details.append(event_list); |
417 | | node.append(me.details); |
418 | | $('#big_event_list').append(node); |
419 | | return node; |
420 | | }; |
421 | | |
422 | | this.node = genNode(); |
423 | | this.is_shown = true; |
424 | | }; |
425 | | |
426 | | BigEvent.prototype = { |
427 | | showDetails: function() { |
428 | | encapsulateActiveEventOrPeople(null); |
429 | | this.details.show(); |
430 | | _IG_AdjustIFrameHeight(); |
431 | | this.is_details_shown = true; |
432 | | CURRENT_BIG_EVENT = this.id; |
433 | | }, |
434 | | |
435 | | hideDetails: function() { |
436 | | this.details.hide(); |
437 | | _IG_AdjustIFrameHeight(); |
438 | | this.is_details_shown = false; |
439 | | } |
440 | | }; |
441 | | |
442 | | var genEventList = function(table, event_ids) { |
443 | | var tbody = table.append('<tbody></tbody>').children(); |
444 | | $.each(event_ids, function(index, event_id){ |
445 | | var event = EVENT.getItem(event_id); |
446 | | var row = $('<tr></tr>'); |
447 | | genEventItem(row, event); |
448 | | tbody.append(row); |
449 | | }); |
450 | | }; |
451 | | |
452 | | var genEventItem = function(row, event) { |
453 | | var time_cell = $('<td class="events-item-time" title="' + event.time_ad + '">' + event.time + '</div>'); |
454 | | var link_cell = $('<td class="events-item-link"></td>'); |
455 | | var event_link = $('<a href=#>' + event.name + '</a>'); |
456 | | event_link.click(function(){ |
457 | | G_MAP.openInfoWindow("EVENT", event.id, event.point); |
458 | | _IG_Analytics(UAACCT, '/click/eventItemLink/' + event.name); |
459 | | return false; |
460 | | }); |
461 | | link_cell.append(event_link); |
462 | | row.append(time_cell); |
463 | | row.append(link_cell); |
464 | | }; |
465 | | |
466 | | function PeopleDigestNode(parent_node, desc, people_id) { |
467 | | this.people_id = people_id; |
468 | | var me = this; |
469 | | var node = $('<div class="character-digest-div"></div>'); |
470 | | this.digest = $('<div class="character-digest-div-short">' + desc.substring(0,65) + '...</div>'); |
471 | | this.detail = $('<div class="character-digest-div-long" style="display:none;">' + desc + '</div>'); |
472 | | var show_detail = $('<a href=#>[詳細]</a>'); |
473 | | var hide_detail = $('<a href=#>[隱藏]</a>'); |
474 | | |
475 | | this.digest.append(show_detail); |
476 | | this.detail.append(hide_detail); |
477 | | |
478 | | show_detail.click(function(){ |
479 | | me.showDetail(); |
480 | | _IG_Analytics(UAACCT, '/click/peopleShowDetailLink/' + me.people_id); |
481 | | return false; |
482 | | }); |
483 | | |
484 | | hide_detail.click(function(){ |
485 | | me.hideDetail(); |
486 | | _IG_Analytics(UAACCT, '/click/peopleHideDetailLink/' + me.people_id); |
487 | | return false; |
488 | | }); |
489 | | |
490 | | node.append(this.digest); |
491 | | node.append(this.detail); |
492 | | parent_node.append(node); |
493 | | }; |
494 | | |
495 | | PeopleDigestNode.prototype = { |
496 | | showDetail: function() { |
497 | | encapsulateActiveEventOrPeople(this.people_id); |
498 | | this.detail.slideDown('fast', _IG_AdjustIFrameHeight); |
499 | | this.digest.fadeOut('fast'); |
500 | | CURRENT_PEOPLE = this.people_id; |
501 | | }, |
502 | | hideDetail: function() { |
503 | | this.detail.slideUp('fast', _IG_AdjustIFrameHeight); |
504 | | this.digest.fadeIn('fast'); |
505 | | } |
506 | | }; |
507 | | |
508 | | function PeopleEventListNode(parent_node, event_ids, people_id, center) { |
509 | | this.people_id = people_id; |
510 | | var me = this; |
511 | | var node = $('<div class="events-div"></div>'); |
512 | | this.show_events = $('<a class="events-div-show" href=#>歷史事件</a>'); |
513 | | this.hide_events = $('<a class="events-div-hide" style="display:none;" href=#>隱藏歷史事件</a>'); |
514 | | this.event_list = $('<table class="events-list" style="display:none;"></table>'); |
515 | | |
516 | | genEventList(this.event_list, event_ids); |
517 | | |
518 | | this.show_events.click(function(){ |
519 | | me.showEvents(); |
520 | | G_MAP.updateOverlay('P', people_id); |
521 | | G_MAP.setCenter(center, 7); |
522 | | _IG_Analytics(UAACCT, '/click/peopleShowEventsLink/' + me.people_id); |
523 | | return false; |
524 | | }); |
525 | | |
526 | | this.hide_events.click(function(){ |
527 | | me.hideEvents(); |
528 | | _IG_Analytics(UAACCT, '/click/peopleHideEventsLink/' + me.people_id); |
529 | | return false; |
530 | | }); |
531 | | |
532 | | node.append(this.show_events); |
533 | | node.append(this.hide_events); |
534 | | node.append(this.event_list); |
535 | | parent_node.append(node); |
536 | | }; |
537 | | |
538 | | PeopleEventListNode.prototype = { |
539 | | showEvents: function() { |
540 | | encapsulateActiveEventOrPeople(this.people_id); |
541 | | this.event_list.slideDown('fast', _IG_AdjustIFrameHeight); |
542 | | this.hide_events.show(); |
543 | | this.show_events.hide(); |
544 | | CURRENT_PEOPLE = this.people_id; |
545 | | }, |
546 | | hideEvents: function() { |
547 | | this.event_list.slideUp('fast', _IG_AdjustIFrameHeight); |
548 | | this.show_events.show(); |
549 | | this.hide_events.hide(); |
550 | | } |
551 | | }; |
552 | | |
553 | | function PeopleNode(parent_node, people) { |
554 | | this.people_id = people.id; |
555 | | var me = this; |
556 | | this.digest = null; |
557 | | this.event = null; |
558 | | this.table = $('<table class="character-item"><tbody><tr></tr></tbody></table>'); |
559 | | var img_node = $('<td class="character-img-div"></td>'); |
560 | | img_node.append('<img width=60 height=75 src="' + (people.pic == 'null' ? NULL_PIC : people.pic) + '">'); |
561 | | var intro_node = $('<td class="character-intro-div"></td>'); |
562 | | var title_node = $('<div class="character-title"></div>'); |
563 | | var link_node = $('<a href="#">' + people.name + '</a>' + (people.nick ? '<span>字' + people.nick + '</span>' : '')); |
564 | | |
565 | | var gicon_node = $('<a title="搜尋" target="_blank" href="http://www.google.com.tw/search?ie=utf8&source=redcliff&q=' + encodeURIComponent(people.name) + '"><img border=0 src="' + CN_BASE + 'search_icon.gif"></a>'); |
566 | | var flag_node = $('<div class="character-title-img" style="background-image:url(\'' + CN_BASE + 'icon/' + FLAGS[people.kingdom] + '.gif\')"></div>'); |
567 | | |
568 | | gicon_node.click(function(){ |
569 | | _IG_Analytics(UAACCT, '/click/searchIcon'); |
570 | | return true; |
571 | | }); |
572 | | title_node.append(flag_node); |
573 | | title_node.append(link_node); |
574 | | title_node.append(gicon_node); |
575 | | intro_node.append(title_node); |
576 | | this.digest = new PeopleDigestNode(intro_node, people.desc, people.id); |
577 | | |
578 | | var row = this.table.children().children(); |
579 | | row.append(img_node); |
580 | | row.append(intro_node); |
581 | | |
582 | | var event_node = row.after('<tr><td></td><td></td></tr>').next().children(':last'); |
583 | | this.event = new PeopleEventListNode(event_node, people.event_ids, people.id, people.center); |
584 | | |
585 | | link_node.click(function(){ |
586 | | if (!me.is_shown) { |
587 | | me.extend(); |
588 | | G_MAP.updateOverlay('P', people.id); |
589 | | G_MAP.setCenter(people.center, 7); |
590 | | me.is_shown = true; |
591 | | } else { |
592 | | me.encapsulate(); |
593 | | me.is_shown = false; |
594 | | } |
595 | | _IG_Analytics(UAACCT, '/click/peopleLink/' + people.id); |
596 | | return false; |
597 | | }); |
598 | | parent_node.append(this.table); |
599 | | this.is_shown = false; |
600 | | }; |
601 | | |
602 | | PeopleNode.prototype = { |
603 | | extend: function() { |
604 | | encapsulateActiveEventOrPeople(this.people_id); |
605 | | this.event.showEvents(); |
606 | | this.digest.showDetail(); |
607 | | CURRENT_PEOPLE = this.people_id; |
608 | | }, |
609 | | encapsulate: function() { |
610 | | this.event.hideEvents(); |
611 | | this.digest.hideDetail(); |
612 | | }, |
613 | | hide: function() { |
614 | | this.encapsulate(); |
615 | | this.table.hide(); |
616 | | }, |
617 | | show: function() { |
618 | | this.table.show(); |
619 | | } |
620 | | }; |
621 | | |
622 | | |
623 | | function People(raw_people) { |
624 | | var me = this; |
625 | | this.id = raw_people.name; |
626 | | this.name = raw_people.name; |
627 | | this.nick = raw_people.zi; |
628 | | this.birth = raw_people.birth; |
629 | | this.death = raw_people.death; |
630 | | this.birthplace = raw_people.birthplace; |
631 | | this.desc = raw_people.desc; |
632 | | this.kingdom = raw_people.kindom; |
633 | | this.event_ids = raw_people.event_ids; |
634 | | this.element_ids = raw_people.element_ids; |
635 | | this.pic = raw_people.pic; |
636 | | this.digest = null; |
637 | | this.event = null; |
638 | | this.center = new GLatLng(raw_people.center.lat, raw_people.center.lng); |
639 | | this.node = new PeopleNode($('#character_list'), this); |
640 | | this.is_shown = true; |
641 | | }; |
642 | | |
643 | | People.prototype = { |
644 | | showNode: function() { |
645 | | if (this.is_shown) |
646 | | return; |
647 | | this.node.show(); |
648 | | this.is_shown = true; |
649 | | }, |
650 | | hideNode: function() { |
651 | | if (!this.is_shown) |
652 | | return; |
653 | | this.node.hide(); |
654 | | this.is_shown = false; |
655 | | } |
656 | | }; |
657 | | |
658 | | function LoadElement() { |
659 | | _IG_FetchContent(URL.element_url, function(data) { |
660 | | var json = eval(data); |
661 | | $.each(json, function(index, element) { |
662 | | ELEMENT.setItem(element.id, new Element(element)); |
663 | | }); |
664 | | LoadDone(); |
665 | | }) |
666 | | }; |
667 | | |
668 | | function LoadEvent() { |
669 | | _IG_FetchContent(URL.event_url, function(data) { |
670 | | var json = eval(data); |
671 | | $.each(json, function(index, event) { |
672 | | EVENT.setItem(event.id, new Event(event)); |
673 | | }); |
674 | | LoadBigEvent(); |
675 | | LoadPeople(); |
676 | | }); |
677 | | |
678 | | }; |
679 | | |
680 | | function LoadPeople() { |
681 | | _IG_FetchContent(URL.people_url, function(data) { |
682 | | var json = eval(data); |
683 | | $.each(json, function(index, raw_people) { |
684 | | var people = new People(raw_people) |
685 | | PEOPLE.setItem(people.name, people); |
686 | | PEOPLE_ARRAY.push(people); |
687 | | }); |
688 | | LoadDone(); |
689 | | }); |
690 | | }; |
691 | | |
692 | | function LoadBigEvent() { |
693 | | _IG_FetchContent(URL.big_event_url, function(data) { |
694 | | var json = eval(data); |
695 | | $.each(json, function(index, big_event) { |
696 | | BIG_EVENT.setItem(big_event.id, new BigEvent(big_event)); |
697 | | }); |
698 | | LoadDone(); |
699 | | }); |
700 | | }; |
701 | | |
702 | | function LoadLocation() { |
703 | | _IG_FetchContent(URL.location_url, function(data) { |
704 | | var json = eval(data); |
705 | | $.each(json, function(index, location) { |
706 | | LOCATION.setItem(location.name, new Location(location)); |
707 | | }); |
708 | | LoadElement(); |
709 | | LoadEvent(); |
710 | | }); |
711 | | }; |
712 | | |
713 | | var LOAD_STATES = 0; |
714 | | function LoadDone() { |
715 | | LOAD_STATES++; |
716 | | if (LOAD_STATES == 3) { // shan zhai! |
717 | | makeShareButton(); |
718 | | $('#loading').hide(); |
719 | | $('#main').show(); |
720 | | |
721 | | _IG_AdjustIFrameHeight(); |
722 | | } |
723 | | }; |
724 | | |
725 | | function _un(str) {return str.replace(/&([^;]+);/g, function(s,entity) {switch (entity) {case 'amp':return '&';case 'lt':return '<'; case 'gt':return '>';case 'quot':return '"';default:if (entity.charAt(0) == '#') {var n=Number('0' + entity.substr(1));if (!isNaN(n)){return String.fromCharCode(n);}}return s;}});}; |
726 | | function makeShareButton() { |
727 | | if (!google || !google.share || !google.share.SharingWidget) return; |
728 | | // TODO: refine the text here !!!! |
729 | | var g = { |
730 | | 'linkText': '將此地圖分享給朋友', |
731 | | 'url': 'http://maps.google.com.tw/chibi/', |
732 | | 'title': 'Google 『赤壁之戰』 地圖', |
733 | | 'image': CN_BASE + 'email_logo.png', |
734 | | 'subject_template': _un('{FROM}邀請您來看看 Google『赤壁之戰』地圖'), |
735 | | 'comments_template': _un('您的朋友({FROM})覺得您可能對這篇文章感興趣,來看看吧:'), |
736 | | 'description': '赤壁之戰地圖,Google團隊再現一千八百年前的三足鼎立時代!', |
737 | | 'buttonStyle': 'link', 'tabs': 'email,email', 'popup': true, 'nopreview': true, 'noaddto': true |
738 | | }; |
739 | | new google.share.SharingWidget("share_button", g); |
740 | | }; |
741 | | |
742 | | var Utils = { |
743 | | |
744 | | constructEventHtml : function(event, i) { |
745 | | var html = []; |
746 | | html.push('<div style="' + (i != 0 ? 'border-top:1px dashed #CCC; margin-top:5px;' : '') + '">'); |
747 | | html.push('<div style="font-size:14px; font-weight:bold; padding-top:10px;">' + event.name + '</div>'); |
748 | | html.push('<div style="color:#AAAAAA;">' + event.time + ' (' + event.time_ad + ')</div>'); |
749 | | html.push('<div style="color:#666666; padding:5px 0px;">' + event.desc + '</div>'); |
750 | | html.push('<div style="text-align:right; color:#AAA;">相關搜尋: '); |
751 | | $.each(event.search, function(j, keyword) { |
752 | | html.push('<a style="color:#915E00;margin-left:3px;" target=_blank href="http://www.google.com.tw/search?ie=utf8&source=redcliff&q=' + encodeURIComponent(keyword) + '">' + keyword + '</a>'); |
753 | | }); |
754 | | html.push('</div>'); |
755 | | html.push('</div>'); |
756 | | return html.join(''); |
757 | | }, |
758 | | |
759 | | constructInfoWindowHtml : function(events) { |
760 | | var html = ['<div style="width:320px; font-size:12px; padding-right:5px;">']; |
761 | | $.each(events, function(i, event){ |
762 | | html.push(Utils.constructEventHtml(event, i)); |
763 | | }); |
764 | | html.push('</div>'); |
765 | | return html.join(''); |
766 | | }, |
767 | | |
768 | | constructInfoWindowTabsHtml : function(events) { |
769 | | var tabs = []; |
770 | | $.each(events, function(i, event){ |
771 | | var html = ['<div style="width:320px; font-size:12px; padding-right:5px;">']; |
772 | | html.push(Utils.constructEventHtml(event, 0)); |
773 | | html.push('</div>'); |
774 | | tabs.push(new GInfoWindowTab(INFOWIN_TAB_LABELS[i], html.join(''))); |
775 | | }); |
776 | | return tabs; |
777 | | } |
778 | | }; |
779 | | |
780 | | function RedcliffMap(node) { |
781 | | var me = this; |
782 | | this.gmap = new GMap2(); |
783 | | this.gmap.setCenter(new GLatLng(29.833, 113.618), 7, G_PHYSICAL_MAP); |
784 | | this.tileLayerOverlay = new GTileLayerOverlay( |
785 | | new GTileLayer(null, null, null, { |
786 | | tileUrlTemplate: URL.tile_url, |
787 | | isPng:true, |
788 | | opacity:1.0 |
789 | | }) |
790 | | ); |
791 | | this.gmap.addOverlay(this.tileLayerOverlay); |
792 | | }; |
793 | | |
794 | | |
795 | | RedcliffMap.prototype = { |
796 | | changeTiles: function(opacity_val) { |
797 | | // IE6 does not support opacity, so we remove the layer if opacity is 0 |
798 | | if (this.tileLayerOverlay != null) { |
799 | | this.gmap.removeOverlay(this.tileLayerOverlay); |
800 | | } |
801 | | if (opacity_val < 0.01) { |
802 | | this.tileLayerOverlay = null; |
803 | | } else { |
804 | | this.tileLayerOverlay = new GTileLayerOverlay( |
805 | | new GTileLayer(null, null, null, { |
806 | | tileUrlTemplate: URL.tile_url, |
807 | | isPng:true, |
808 | | opacity:opacity_val |
809 | | }) |
810 | | ); |
811 | | this.gmap.addOverlay(this.tileLayerOverlay); |
812 | | } |
813 | | }, |
814 | | addOverlay: function(overlay) { |
815 | | this.gmap.addOverlay(overlay); |
816 | | }, |
817 | | removeOverlay: function(overlay) { |
818 | | this.gmap.removeOverlay(overlay); |
819 | | }, |
820 | | openInfoWindow: function(type, id, latlng) { |
821 | | if (type == "EVENT") { |
822 | | var event = EVENT.getItem(id); |
823 | | var info_div = Utils.constructInfoWindowHtml([event]); |
824 | | this.gmap.openInfoWindowHtml(latlng, info_div); |
825 | | //this.highLightOverlay(event.element_ids); |
826 | | } |
827 | | if (type == "ELEMENT") { |
828 | | var element = ELEMENT.getItem(id); |
829 | | var events = new Array(); |
830 | | $.each(element.events, function(index, event_id) { |
831 | | if (CURRENT_EVENT_HASH.hasItem(event_id)) { |
832 | | var event = EVENT.getItem(event_id); |
833 | | events.push(event); |
834 | | } |
835 | | }); |
836 | | if (events.length > 1) { |
837 | | var info_tabs = Utils.constructInfoWindowTabsHtml(events); |
838 | | this.gmap.openInfoWindowTabsHtml(latlng, info_tabs); |
839 | | } else { |
840 | | var info_div = Utils.constructInfoWindowHtml(events); |
841 | | this.gmap.openInfoWindowHtml(latlng, info_div); |
842 | | } |
843 | | //this.highLightOverlay(id); |
844 | | } |
845 | | }, |
846 | | highLightOverlay: function(element_ids) { |
847 | | $.each(element_ids, function(index, element_id) { |
848 | | if (CURRENT_ELEMENT_HASH.hasItem(element_id)) { |
849 | | var element = ELEMENT.getItem(element_id); |
850 | | element.highLight(); |
851 | | HIGH_LIGHT_ELEMENT.push(element_id); |
852 | | } |
853 | | }); |
854 | | }, |
855 | | |
856 | | deHighLightOverlay: function() { |
857 | | while (HIGH_LIGHT_ELEMENT.length > 0) { |
858 | | var element_id = HIGH_LIGHT_ELEMENT.pop(); |
859 | | var element = ELEMENT.getItem(element_id); |
860 | | //element.deHighLight(); |
861 | | } |
862 | | }, |
863 | | |
864 | | setCenter: function(center, level) { |
865 | | this.gmap.panTo(center); |
866 | | }, |
867 | | |
868 | | clearOverlays: function() { |
869 | | this.gmap.closeInfoWindow(); |
870 | | while (CURRENT_ELEMENT.length > 0) { |
871 | | var element_id = CURRENT_ELEMENT.pop(); |
872 | | var elem = ELEMENT.getItem(element_id); |
873 | | CURRENT_ELEMENT_HASH.removeItem(element_id); |
874 | | elem.removeFromMap(); |
875 | | } |
876 | | |
877 | | while (CURRENT_EVENT.length > 0) { |
878 | | var event_id = CURRENT_EVENT.pop(); |
879 | | CURRENT_EVENT_HASH.removeItem(element_id); |
880 | | } |
881 | | CURRENT_OVERLAY_ID = ""; |
882 | | }, |
883 | | |
884 | | updateOverlay: function(type, id) { |
885 | | if (type + '_' + id == CURRENT_OVERLAY_ID) |
886 | | return; |
887 | | CURRENT_OVERLAY_ID = type + '_' + id; |
888 | | this.clearOverlays(); |
889 | | |
890 | | var element_ids; |
891 | | var event_ids; |
892 | | if (type == 'E') { |
893 | | var big_event = BIG_EVENT.getItem(id); |
894 | | element_ids = big_event.element_ids; |
895 | | event_ids = big_event.event_ids; |
896 | | } else { |
897 | | var people = PEOPLE.getItem(id); |
898 | | element_ids = people.element_ids; |
899 | | event_ids = people.event_ids; |
900 | | } |
901 | | |
902 | | $.each(element_ids, function(index, element_id) { |
903 | | var elem = ELEMENT.getItem(element_id); |
904 | | elem.drawOnMap(); |
905 | | CURRENT_ELEMENT.push(element_id); |
906 | | CURRENT_ELEMENT_HASH.setItem(element_id, ""); |
907 | | }); |
908 | | |
909 | | $.each(event_ids, function(index, event_id) { |
910 | | CURRENT_EVENT.push(event_id); |
911 | | CURRENT_EVENT_HASH.setItem(event_id, ""); |
912 | | }); |
913 | | } |
914 | | }; |
915 | | |
916 | | function CharacterFilter() { |
917 | | var filter = function() { |
918 | | var shu_selected = false; |
919 | | var wei_selected = false; |
920 | | var wu_selected = false; |
921 | | if ($('#checkbox_shu').attr('checked')) shu_selected = true; |
922 | | if ($('#checkbox_wei').attr('checked')) wei_selected = true; |
923 | | if ($('#checkbox_wu').attr('checked')) wu_selected = true; |
924 | | $.each(PEOPLE_ARRAY, function(index, character){ |
925 | | if (character.kingdom == '蜀') { |
926 | | if (shu_selected) character.showNode(); |
927 | | else character.hideNode(); |
928 | | } |
929 | | if (character.kingdom == '魏') { |
930 | | if (wei_selected) character.showNode(); |
931 | | else character.hideNode(); |
932 | | } |
933 | | if (character.kingdom == '吳') { |
934 | | if (wu_selected) character.showNode(); |
935 | | else character.hideNode(); |
936 | | } |
937 | | }); |
938 | | _IG_AdjustIFrameHeight(); |
939 | | _IG_Analytics(UAACCT, '/click/characterFilter'); |
940 | | }; |
941 | | $('#checkbox_shu').click(filter); |
942 | | $('#checkbox_wei').click(filter); |
943 | | $('#checkbox_wu').click(filter); |
944 | | }; |
945 | | |
946 | | // Add the handler for changing the tile option using the drop down. |
947 | | function TilesSelect() { |
948 | | // remove half transparent version for IE6 |
949 | | if (navigator.appName == 'Microsoft Internet Explorer' && |
950 | | (navigator.appVersion.indexOf('MSIE 6') > 0)) { |
951 | | var sel = $('#select_tiles').get(0); |
952 | | for (var i = sel.length - 1; i >= 0; i--) { |
953 | | if (sel.options[i].value > 0.01 && sel.options[i].value < 0.99) { |
954 | | sel.remove(i); |
955 | | } |
956 | | } |
957 | | } |
958 | | var change_tiles = function() { |
959 | | var selVal = $('#select_tiles').attr('options')[$('#select_tiles').attr('options').selectedIndex].value; |
960 | | G_MAP.changeTiles(selVal); |
961 | | _IG_Analytics(UAACCT, '/click/tilesSelect/' + selVal); |
962 | | }; |
963 | | $('#select_tiles').change(change_tiles); |
964 | | }; |
965 | | |
966 | | function TabManager(in_tabs, active_tab) { |
967 | | var tabs = new Array(); |
968 | | var current_tab = ''; |
969 | | var shiftTab = function(active_tab) { |
970 | | if (active_tab == current_tab) return; |
971 | | $.each([active_tab, current_tab], function(index, tab){ |
972 | | var tab_container = $('#' + tab + '_cnt'); |
973 | | var tab_item = $('#' + tab + '_tab'); |
974 | | var tab_parent = tab_item.parent(); |
975 | | if (tab == active_tab) { |
976 | | tab_container.show(); |
977 | | tab_parent.removeClass('tab-inactive'); |
978 | | tab_parent.addClass('tab-active'); |
979 | | } else { |
980 | | tab_container.hide(); |
981 | | tab_parent.removeClass('tab-active'); |
982 | | tab_parent.addClass('tab-inactive'); |
983 | | } |
984 | | }); |
985 | | current_tab = active_tab; |
986 | | }; |
987 | | |
988 | | $.each(in_tabs, function(index, tab){ |
989 | | $('#' + tab + '_tab').click(function(){ |
990 | | shiftTab(tab); |
991 | | _IG_AdjustIFrameHeight(); |
992 | | _IG_Analytics(UAACCT, '/view/tab/' + tab); |
993 | | return false; |
994 | | }); |
995 | | tabs.push(tab); |
996 | | }); |
997 | | |
998 | | shiftTab(active_tab); |
999 | | }; |
1000 | | |
1001 | | function Disclaimer() { |
1002 | | var is_show = false; |
1003 | | var box = $('#disclaimer_box'); |
1004 | | $('#disclaimer_show').click(function(){ |
1005 | | if (is_show) { |
1006 | | box.hide(); |
1007 | | is_show = false; |
1008 | | } else { |
1009 | | box.show(); |
1010 | | is_show = true; |
1011 | | } |
1012 | | return false; |
1013 | | }); |
1014 | | $('#disclaimer_close').click(function(){ |
1015 | | box.hide(); |
1016 | | is_show = false; |
1017 | | return false; |
1018 | | }); |
1019 | | } |
1020 | | |
| 136 | }}} |
| 137 | * [註] 底下開始會稍微變動一下原始碼的順序,我們先來看 jQuery 的 main 進入點 |
| 138 | {{{ |