https://www.shimane-u.ac.jp/_common/js/navigation.js

1/**
2 * Navigation
3 */
4function Navigation() {
5}
6
7Navigation.initialize = function(settings) {
8  Navigation.settings = settings
9
10  if (Navigation.settings['theme']) {
11    jQuery.each(Navigation.settings['theme'], function(key, val) {
12      $(key).on('click', function(){
13        Navigation.theme(val);
14        return false;
15      });
16    });
17    Navigation.theme();
18  }
19
20  if (Navigation.settings['fontSize']) {
21    jQuery.each(Navigation.settings['fontSize'], function(key, val) {
22      $(key).on('click', function(){
23        Navigation.fontSize(val);
24        return false;
25      });
26    });
27    Navigation.fontSize();
28  }
29
30  if (Navigation.settings['zoom']) {
31    jQuery.each(Navigation.settings['zoom'], function(key, val) {
32      $(key).on('click', function(){
33        Navigation.zoom(val);
34        return false;
35      });
36    });
37    Navigation.zoom();
38  }
39
40  if (Navigation.settings['ruby']) {
41    $(Navigation.settings['ruby']).on('click', function() {
42      var flag = ($(this).attr('class') + '').match(/(^| )rubyOn( |$)/);
43      Navigation.ruby( (flag ? 'off' : 'on'), 'kana' );
44      return false;
45    });
46    if (Navigation.settings['rubyKana']) {
47      $(Navigation.settings['rubyKana']).on('click', function() {
48        Navigation.ruby(undefined, 'kana');
49        return false;
50      });
51    }
52    if (Navigation.settings['rubyRoman']) {
53      $(Navigation.settings['rubyRoman']).on('click', function() {
54        Navigation.ruby(undefined, 'roman');
55        return false;
56      });
57    }
58    Navigation.ruby();
59  }
60
61  if (Navigation.settings['talk']) {
62    $(Navigation.settings['talk']).on('click', function(){
63      var flag = ($(this).attr('class') + '').match(/(^| )talkOn( |$)/);
64      Navigation.talk( (flag ? 'off' : 'on') );
65      return false;
66    });
67  }
68
69  // trigger navigation after updating piece
70  $(document).ajaxComplete(function(e, xhr) {
71    if (xhr.status == 200 || xhr.getResponseHeader("content-type").match(/^text\/html/)) {
72      if ($.cookie('navigation_ruby') == 'on') {
73        if ($.cookie('navigation_ruby_type') == 'roman') {
74          $(Navigation.settings['rubyRoman']).trigger('click');
75        } else {
76          $(Navigation.settings['rubyKana']).trigger('click');
77        }
78      }
79    }
80  });
81};
82
83Navigation.theme = function(theme) {
84  if (theme) {
85    $.cookie('navigation_theme', theme, {path: '/'});
86  } else {
87    theme = $.cookie('navigation_theme');
88  }
89  if (theme) {
90    var element = '<link rel="alternate stylesheet" href="/_themes/css/colors/' + theme + '.css" title="' + theme + '">';
91    if ($('link[rel="alternate stylesheet"]:not([disabled])').attr("title") != theme) {
92      $(element).appendTo('head');
93    }
94    $('link[title]').each(function() {
95      this.disabled = true;
96      if (theme == $(this).attr('title')) this.disabled = false;
97    });
98  }
99};
100
101Navigation.fontSize = function(size) {
102  var changeFont = $.cookie('navigation_font_size') || 100;
103  if (changeFont) {
104    changeFont = parseInt(changeFont);
105    if (size == 'small' &&  changeFont > 40) changeFont -= 20;
106    if (size == 'middle') changeFont = 100;
107    if (size == 'large' && changeFont < 200) changeFont += 20;
108    $('html').css('font-size', changeFont / 100 + 'rem');
109    $.cookie('navigation_font_size', changeFont, {path: '/'});
110  }
111};
112
113Navigation.zoom = function(zoom) {
114  if (zoom) {
115    $.cookie('navigation_zoom', zoom, {path: '/'});
116  } else {
117    zoom = $.cookie('navigation_zoom');
118  }
119  if (zoom) {
120    $('#container').css('transform-origin', 'top left')
121                   .css('transform', 'scale(' + zoom + ')');
122  }
123};
124
125Navigation.ruby = function(flag, type) {
126  if (flag) {
127    $.cookie('navigation_ruby', flag, {path: '/'});
128  } else {
129    flag = $.cookie('navigation_ruby');
130  }
131  if (type) {
132    $.cookie('navigation_ruby_type', type, {path: '/'});
133  } else {
134    type = $.cookie('navigation_ruby_type');
135  }
136
137  var path;
138
139  if (flag == 'on') {
140    if (location.pathname.search(/\/$/i) != -1) {
141      path = location.pathname + "index.html.r";
142    } else if (location.pathname.search(/\.html\.mp3$/i) != -1) {
143      path = location.pathname.replace(/\.html\.mp3$/, ".html.r");
144    } else if (location.pathname.search(/\.html$/i) != -1) {
145      path = location.pathname.replace(/\.html$/, ".html.r");
146    }
147  } else if (flag == 'off') {
148    if (location.pathname.search(/\.html\.r$/i) != -1) {
149      path = location.pathname.replace(/\.html\.r$/, ".html");
150    }
151  }
152
153  if (path) {
154    var host = location.protocol + "//" + location.hostname + (location.port ? ':' + location.port : '');
155    location.href = host + path + location.search;
156    return;
157  }
158
159  var elem = $(Navigation.settings['ruby']);
160  var elemKana = $(Navigation.settings['rubyKana']);

161  var elemRoman = $(Navigation.settings['rubyRoman']);
162
163  elemKana.removeClass('current');
164  elemRoman.removeClass('current');
165  $('rt.kana, rt.roman').hide();
166
167  if (flag == 'on') {
168    if (type == 'roman') {
169      $('rt.roman').show();
170      elemRoman.addClass('current');
171    } else {
172      $('rt.kana').show();
173      elemKana.addClass('current');
174    }
175    elem.not(elemKana).not(elemRoman).removeClass('rubyOff');
176    elem.not(elemKana).not(elemRoman).addClass('rubyOn');
177    Navigation.notice();
178  } else {
179    elem.not(elemKana).not(elemRoman).removeClass('rubyOn');
180    elem.not(elemKana).not(elemRoman).addClass('rubyOff');
181  }
182};
183
184Navigation.talk = function(flag) {
185  var player = $(Navigation.settings['player']);
186  var elem   = $(Navigation.settings['talk']);
187  if (!player || !elem) return false;
188
189  Navigation.notice();
190
191  if (flag == 'off') {
192    elem.removeClass('talkOn');
193    elem.addClass('talkOff');
194  } else {
195    elem.removeClass('talkOff');
196    elem.addClass('talkOn');
197  }
198
199  var host = location.protocol + "//" + location.hostname + (location.port ? ':' + location.port : '');
200  var path = location.pathname;
201  var now   = new Date();
202  var param = '?85' + now.getDay() + now.getHours();
203
204  if (path.match(/\/$/)) path += 'index.html';
205  path = path.replace(/\.html\.r$/, '.html');
206  path += '.mp3' + param;
207
208  if (!player) {
209    location.href = host + path;
210    return false;
211  }
212
213  if (player.html() == '') {
214    html = '<div id="navigationTalkCreatingFileNotice" style="display: none;">ただいま音声ファイルを作成しています。しばらくお待ちください。</div>';
215    html += '<audio src=" ' + host + path + '" id="naviTalkPlayer" controls autoplay />';
216    player.html(html);
217
218    $.ajax({type: "HEAD", url: host + path, data: {file_check: '1'}, success: function(data, status, xhr) {
219      var type = xhr.getResponseHeader('Content-Type');
220      if (type.match(/^audio/)) {
221        $('#navigationTalkCreatingFileNotice').hide();
222      } else {
223        $('#navigationTalkCreatingFileNotice').show();
224      }
225    }});
226
227    $('#naviTalkPlayer').on('canplaythrough', function(e) {
228      $('#navigationTalkCreatingFileNotice').hide();
229    });
230  } else {
231    player.html('');
232    if ($.cookie('navigation_ruby') != 'on') Navigation.notice('off');
233  }
234};
235
236Navigation.notice = function(flag) {
237  var wrap   = Navigation.settings['notice'] || 'container';
238  var notice = $('#navigationNotice');
239
240  if (flag == 'off') {
241    notice.remove();
242    return false;
243  }
244  if (notice.length) return false;
245
246  var elem = $(Navigation.settings['notice']);
247  notice = document.createElement('div');
248  notice.id = 'navigationNotice';
249  notice.innerHTML = 'ふりがなとよみあげ音声は、人名、地名、用語等が正確に発音されない場合があります。ふりがな機能の利用中は、よみあげ機能は利用できません。';
250  $('#accessibilityTool').prepend(notice);
251  if ( location.pathname.match(/\.html\.r$/) ) {
252    $('#navigationTalk').parent().hide();
253  }
254};