https://www.goo-net.com/existing_https/common_v2/js/suggest.js

1/*
2--------------------------------------------------------
3suggest.js - Input Suggest
4Version 2.1 (Update 2008/04/02)
5
6Copyright (c) 2006-2008 onozaty (http://www.enjoyxstudy.com)
7
8Released under an MIT-style license.
9
10For details, see the web site:
11 http://www.enjoyxstudy.com/javascript/suggest/
12
13--------------------------------------------------------
14*/
15
16if (!Suggest) {
17  var Suggest = {};
18}
19/*-- KeyCodes -----------------------------------------*/
20Suggest.Key = {
21  TAB:     9,
22  RETURN: 13,
23  ESC:    27,
24  UP:     38,
25  DOWN:   40
26};
27
28Suggest.isFreeword = false;
29/*-- Utils --------------------------------------------*/
30Suggest.copyProperties = function(dest, src) {
31  for (var property in src) {
32    dest[property] = src[property];
33  }
34  return dest;
35};
36
37/*-- Suggest.Local ------------------------------------*/
38Suggest.Local = function() {
39  this.initialize.apply(this, arguments);
40};
41Suggest.Local.prototype = {
42  initialize: function(input, suggestArea, candidateList) {
43
44    if( suggestArea == "suggest" ) Suggest.isFreeword = true;
45    
46    this.input = this._getElement(input);
47    this.suggestArea = this._getElement(suggestArea);
48    this.candidateList = candidateList;
49    this.list1st = candidateList;
50    this.oldText = this.getInputText();
51
52    if (arguments[3]) this.setOptions(arguments[3]);
53
54    // reg event
55    this._addEvent(this.input, 'focus', this._bind(this.checkLoop));
56    this._addEvent(this.input, 'blur', this._bind(this.inputBlur));
57
58    var keyevent = 'keydown';
59    if (window.opera || (navigator.userAgent.indexOf('Gecko') >= 0 && navigator.userAgent.indexOf('KHTML') == -1)) {
60      keyevent = 'keypress';
61    }
62    this._addEvent(this.input, keyevent, this._bindEvent(this.keyEvent));
63
64    // init
65    this.clearSuggestArea();
66  },
67
68  // options
69  interval: 500,
70  dispMax: 20,
71  listTagName: 'div',
72  prefix: false,
73  ignoreCase: true,
74  highlight: false,
75  dispAllKey: false,
76  classMouseOver: 'over',
77  classSelect: 'select',
78  mailAddress: false,
79  list1st: null,
80  list2nd: null,
81  listno: 1,
82  delim: ' ',
83  
84  hookBeforeSearch: function(){
85    if(this.mailAddress){
86      this.candidateList = ( this.listno == 1) ? this.list1st : this.list2nd ;
87    }
88  },
89
90  setOptions: function(options) {
91    Suggest.copyProperties(this, options);
92  },
93
94  inputBlur: function() {
95
96    this.changeUnactive();
97    this.oldText = this.getInputText();
98
99    if (this.timerId) clearTimeout(this.timerId);
100    this.timerId = null;
101
102    setTimeout(this._bind(this.clearSuggestArea), 500);
103  },
104
105  checkLoop: function() {
106    var text = this.getInputText();
107    if (text != this.oldText) {
108      this.oldText = text;
109      this.search();
110    }
111    if (this.timerId) clearTimeout(this.timerId);
112    this.timerId = setTimeout(this._bind(this.checkLoop), this.interval);
113  },
114
115  search: function() {
116
117    // init
118    this.clearSuggestArea();
119    this.listno = 1;
120    var text = this.getInputText();
121    if (text == '' || text == null) return;
122
123    this.hookBeforeSearch(text);
124    var resultList = this._search(text);
125    if (resultList != 0){
126      this.createSuggestArea(resultList);
127    }
128    else{
129      if(this.mailAddress && this.list2nd != null){
130        
131        this.listno = 2;
132        var text = this.getInputText();
133        if (text == '' || text == null) return;
134        
135        this.hookBeforeSearch(text);
136        var resultList = this._search(text);
137        if (resultList != 0){
138          this.createSuggestArea(resultList);
139        }
140        else{
141          this.listno = 1;
142          this.hookBeforeSearch(text);
143        }
144      }
145    }
146  },
147
148  _search: function(text) {
149
150    var resultList = [];
151    var temp; 
152    this.suggestIndexList = [];
153    for (var i = 0, length = this.candidateList.length; i < length; i++) {
154      if ((temp = this.isMatch(this.candidateList[i], text)) != null) {
155        resultList.push(temp);
156        this.suggestIndexList.push(i);
157
158        if (this.dispMax != 0 && resultList.length >= this.dispMax) break;
159      }
160    }
161    return resultList;
162  },
163
164  isMatch: function(value, pattern) {
165
166    if (value == null) return null;
167
168    var pos = (this.ignoreCase) ?
169      value.toLowerCase().indexOf(pattern.toLowerCase())
170      : value.indexOf(pattern);
171
172    if ((pos == -1) || (this.prefix && pos != 0)) return null;
173
174    if (this.highlight) {
175      return (this._escapeHTML(value.substr(0, pos)) + '<strong>' 
176             + this._escapeHTML(value.substr(pos, pattern.length)) 
177               + '</strong>' + this._escapeHTML(value.substr(pos + pattern.length)));
178    } else {
179      return this._escapeHTML(value);
180    }
181  },
182
183  clearSuggestArea: function() {
184    this.suggestArea.innerHTML = '';
185    this.suggestArea.style.display = 'none';
186    this.suggestList = null;
187    this.suggestIndexList = null;
188    this.activePosition = null;
189  },
190
191  createSuggestArea: function(resultList) {
192
193    this.suggestList = [];
194    this.inputValueBackup = this.input.value;
195
196    for (var i = 0, length = resultList.length; i < length; i++) {
197      var element = document.createElement(this.listTagName);
198      element.innerHTML = resultList[i];
199      this.suggestArea.appendChild(element);
200
201      this._addEvent(element, 'click', this._bindEvent(this.listClick, i));
202      this._addEvent(element, 'mouseover', this._bindEvent(this.listMouseOver, i));
203      this._addEvent(element, 'mouseout', this._bindEvent(this.listMouseOut, i));
204
205      this.suggestList.push(element);
206    }
207
208    this.suggestArea.style.display = 'block';
209  },
210
211  getInputText: function() {
212    var result = this.input.value;
213    if(Suggest.isFreeword) {
214      result = _suggestTrim(result);
215      result = hanToZen1(_toKatakanaCase(result));
216    }
217    if(this.mailAddress) {
218      var pos = this.getLastTokenPos();
219      if (pos == -1) {
220        return "\n"; // ÆþÎϤǤ­¤Ê¤¤Ê¸»ú¤ò¥À¥ß¡¼¤È¤·¤Æ
221      } else {
222        return this.input.value.substr(pos + 1);
223      }
224    }
225    return result;
226  },
227  

228  getLastTokenPos: function() {
229    var delimIndex = this.input.value.lastIndexOf(this.delim);
230    var atIndex = -1;
231    if( this.listno === 1 ){
232      atIndex  = this.input.value.lastIndexOf('@');
233    }
234    else{
235      //var matchStr = (this.input.value.match(/[?!#-9A-~]+@+[a-z0-9]{1,5}[.][#-9A-~]+$/i));
236      var matchStr = (this.input.value.match(/[?!#-9A-~]+@([a-zA-Z0-9-]{1,5}\.)+[#-9A-~]+$/i));
237      if( matchStr ){
238        var tmpIndex  = this.input.value.lastIndexOf('@');
239        atIndex  = this.input.value.indexOf('.', tmpIndex);
240      }
241    }
242    
243    if (delimIndex < atIndex) {
244      return atIndex;
245    } else {
246      return -1;
247    }
248  },
249
250  setInputText: function(text) {
251    if(this.mailAddress){
252      var pos = this.getLastTokenPos();
253      if (pos == -1) {
254        this.input.value = text;
255      } else {
256        this.input.value = this.input.value.substr(0 , pos + 1) + text;
257      }
258    }
259    else{
260      this.input.value = text;
261    }
262  },
263
264  // key event
265  keyEvent: function(event) {
266
267    if (!this.timerId) {
268      this.timerId = setTimeout(this._bind(this.checkLoop), this.interval);
269    }
270
271    if (this.dispAllKey && event.ctrlKey 
272        && this.getInputText() == ''
273        && !this.suggestList
274        && event.keyCode == Suggest.Key.DOWN) {
275      // dispAll
276      this._stopEvent(event);
277      this.keyEventDispAll();
278    } else if (event.keyCode == Suggest.Key.UP ||
279               event.keyCode == Suggest.Key.DOWN) {
280      // key move
281      if (this.suggestList && this.suggestList.length != 0) {
282        this._stopEvent(event);
283        this.keyEventMove(event.keyCode);
284      }
285    } else if (event.keyCode == Suggest.Key.RETURN) {
286      // fix
287      if (this.suggestList && this.suggestList.length != 0) {
288        this._stopEvent(event);
289        this.keyEventReturn();
290      }
291    } else if (event.keyCode == Suggest.Key.ESC) {
292      // cancel
293      if (this.suggestList && this.suggestList.length != 0) {
294        this._stopEvent(event);
295        this.keyEventEsc();
296      }
297    } else {
298      this.keyEventOther(event);
299    }
300  },
301
302  keyEventDispAll: function() {
303
304    // init
305    this.clearSuggestArea();
306
307    this.oldText = this.getInputText();
308
309    this.suggestIndexList = [];
310    for (var i = 0, length = this.candidateList.length; i < length; i++) {
311      this.suggestIndexList.push(i);
312    }
313
314    this.createSuggestArea(this.candidateList);
315  },
316
317  keyEventMove: function(keyCode) {
318
319    this.changeUnactive();
320
321    if (keyCode == Suggest.Key.UP) {
322      // up
323      if (this.activePosition == null) {
324        this.activePosition = this.suggestList.length -1;
325      }else{
326        this.activePosition--;
327        if (this.activePosition < 0) {
328          this.activePosition = null;
329          this.input.value = this.inputValueBackup;
330          return;
331        }
332      }
333    }else{
334      // down
335      if (this.activePosition == null) {
336        this.activePosition = 0;
337      }else{
338        this.activePosition++;
339      }
340
341      if (this.activePosition >= this.suggestList.length) {
342        this.activePosition = null;
343        this.input.value = this.inputValueBackup;
344        return;
345      }
346    }
347
348    this.changeActive(this.activePosition);
349  },
350
351  keyEventReturn: function() {
352
353    this.clearSuggestArea();
354    this.moveEnd();
355  },
356
357  keyEventEsc: function() {
358
359    this.clearSuggestArea();
360    this.input.value = this.inputValueBackup;
361    this.oldText = this.getInputText();
362
363    if (window.opera) setTimeout(this._bind(this.moveEnd), 5);
364  },
365
366  keyEventOther: function(event) {},
367
368  changeActive: function(index) {
369
370    this.setStyleActive(this.suggestList[index]);
371
372    this.setInputText(this.candidateList[this.suggestIndexList[index]]);
373
374    this.oldText = this.getInputText();
375    this.input.focus();
376  },
377
378  changeUnactive: function() {
379
380    if (this.suggestList != null 
381        && this.suggestList.length > 0
382        && this.activePosition != null) {
383      this.setStyleUnactive(this.suggestList[this.activePosition]);
384    }
385  },
386
387  listClick: function(event, index) {
388
389    this.changeUnactive();
390    this.activePosition = index;
391    this.changeActive(index);
392
393    this.moveEnd();
394  },
395
396  listMouseOver: function(event, index) {
397    this.setStyleMouseOver(this._getEventElement(event));
398  },
399
400  listMouseOut: function(event, index) {
401
402    if (!this.suggestList) return;
403
404    var element = this._getEventElement(event);
405
406    if (index == this.activePosition) {
407      this.setStyleActive(element);
408    }else{
409      this.setStyleUnactive(element);
410    }
411  },
412
413  setStyleActive: function(element) {
414    element.className = this.classSelect;
415  },
416
417  setStyleUnactive: function(element) {
418    element.className = '';
419  },
420
421  setStyleMouseOver: function(element) {
422    element.className = this.classMouseOver;
423  },
424
425  moveEnd: function() {
426
427    if (this.input.createTextRange) {
428      this.input.focus(); // Opera
429      var range = this.input.createTextRange();
430      range.move('character', this.input.value.length);
431      range.select();
432    } else if (this.input.setSelectionRange) {
433      this.input.setSelectionRange(this.input.value.length, this.input.value.length);
434    }
435  },
436
437  // Utils
438  _getElement: function(element) {
439    return (typeof element == 'string') ? document.getElementById(element) : element;
440  },
441  _addEvent: (window.addEventListener ?
442    function(element, type, func) {
443      element.addEventListener(type, func, false);
444    } :
445    function(element, type, func) {
446      element.attachEvent('on' + type, func);
447    }),
448  _stopEvent: function(event) {
449    if (event.preventDefault) {
450      event.preventDefault();
451      event.stopPropagation();
452    } else {
453      event.returnValue = false;

454      event.cancelBubble = true;
455    }
456  },
457  _getEventElement: function(event) {
458    return event.target || event.srcElement;
459  },
460  _bind: function(func) {
461    var self = this;
462    var args = Array.prototype.slice.call(arguments, 1);
463    return function(){ func.apply(self, args); };
464  },
465  _bindEvent: function(func) {
466    var self = this;
467    var args = Array.prototype.slice.call(arguments, 1);
468    return function(event){ event = event || window.event; func.apply(self, [event].concat(args)); };
469  },
470  _escapeHTML: function(value) {
471    return value.replace(/\&/g, '&amp;').replace( /</g, '&lt;').replace(/>/g, '&gt;')
472             .replace(/\"/g, '&quot;').replace(/\'/g, '&#39;');
473  }
474};
475
476// GA4¤ÎString.prototype.trim±øÀ÷¤òËɤ°¤¿¤á¡¢¥×¥í¥È¥¿¥¤¥×³ÈÄ¥¤òÇѻߤ·¤Æ¥í¡¼¥«¥ë´Ø¿ô¤ËÊѹ¹
477function _suggestTrim(str) {
478    return str.replace(/¡¡/, " ");
479//    return str.replace(/\s+$/g, "");
480}
481
482function _toKatakanaCase(str)
483{
484    var i, c, a = [];
485    for(i=str.length-1;0<=i;i--)
486    {
487        c = str.charCodeAt(i);
488        a[i] = (0x3041 <= c && c <= 0x3096) ? c + 0x0060 : c;
489    };
490    return String.fromCharCode.apply(null, a);
491};
492
493function hanToZen1(src) {
494  return src.replace(/(\w)/g,
495    function ($0) {
496      return String.fromCharCode($0.charCodeAt(0) + 65248);
497    });
498};
499
500function jsCheckZenKataArray(cd) {
501  var ZenKataArray = new Array(
502  "¡£","¡Ö","¡×","¡¢","¡¦","¥ò","¥¡","¥£","¥¥","¥§","¥©","¥ã","¥å","¥ç","¥Ã","¡¼",
503  "¥¢","¥¤","¥¦","¥¨","¥ª","¥«","¥­","¥¯","¥±","¥³","¥µ","¥·","¥¹","¥»","¥½","¥¿",
504  "¥Á","¥Ä","¥Æ","¥È","¥Ê","¥Ë","¥Ì","¥Í","¥Î","¥Ï","¥Ò","¥Õ","¥Ø","¥Û","¥Þ","¥ß",
505  "¥à","¥á","¥â","¥ä","¥æ","¥è","¥é","¥ê","¥ë","¥ì","¥í","¥ï","¥ó","¡«","¡¬"
506  );
507  return ZenKataArray[cd - 0xFF61];
508};
509
510
511function hanToZen2(src) {
512  var code;
513  var chr;
514  var pos = 0;
515  var len = src.length;
516  var res = '';
517  while (pos < len) {
518    code = src.charCodeAt(pos);
519    if (code >= 0xFF61 && code <= 0xFF9F) {
520      chr = jsCheckZenKataArray(code);
521      if (pos < len - 1) {
522        switch (src.charCodeAt(pos + 1)) {
523        case 0xFF9E:
524          if ((code >= 0xFF76 && code <= 0xFF84)||(code >= 0xFF8A && code <= 0xFF8E)) {
525            chr = String.fromCharCode(chr.charCodeAt(0) + 1);
526            pos++;
527          } else if (code == 0xFF73) {
528            chr = "¥ô";
529            pos++;
530          }
531          break;
532        case 0xFF9F:
533          if (code >= 0xFF8A && code <= 0xFF8E) {
534            chr = String.fromCharCode(chr.charCodeAt(0) + 2);
535            pos++;
536          }
537          break;
538        }
539      }
540      res += chr;
541    } else {
542      res += src.charAt(pos);
543    }
544    pos++;
545  }
546  return (res);
547};
548
549
550window.onload = function () {
551  if(document.getElementById("freewordTxt") == null) return;
552
553  new Suggest.Local(
554    "freewordTxt",
555    "suggest",
556    list,
557    {
558      prefix: true
559    }
560  ); 
561}