Nils Diewald | a297f06 | 2015-04-02 00:23:46 +0000 | [diff] [blame^] | 1 | /** |
| 2 | * These are utility functions for the frontend |
| 3 | */ |
| 4 | |
| 5 | // Add toggleClass method similar to jquery |
| 6 | HTMLElement.prototype.toggleClass = function (c1, c2) { |
| 7 | var cl = this.classList; |
| 8 | if (cl.contains(c1)) { |
| 9 | cl.add(c2); |
| 10 | cl.remove(c1); |
| 11 | } |
| 12 | else { |
| 13 | cl.remove(c2); |
| 14 | cl.add(c1); |
| 15 | }; |
| 16 | }; |
| 17 | |
| 18 | |
| 19 | // Don't let events bubble up |
| 20 | if (Event.halt === undefined) { |
| 21 | // Don't let events bubble up |
| 22 | Event.prototype.halt = function () { |
| 23 | this.stopPropagation(); |
| 24 | this.preventDefault(); |
| 25 | }; |
| 26 | }; |
| 27 | |
| 28 | var KorAP = KorAP || {}; |
| 29 | |
| 30 | |
| 31 | (function (KorAP) { |
| 32 | "use strict"; |
| 33 | |
| 34 | KorAP.init = function () { |
| 35 | |
| 36 | /** |
| 37 | * Add actions to match entries |
| 38 | */ |
| 39 | var inactiveLi = document.querySelectorAll('#search > ol > li:not(.active)'); |
| 40 | var i = 0; |
| 41 | for (i = 0; i < inactiveLi.length; i++) { |
| 42 | inactiveLi[i].addEventListener('click', function () { |
| 43 | |
| 44 | if (this._match !== undefined) { |
| 45 | this._match.open(); |
| 46 | console.log('already open'); |
| 47 | } |
| 48 | else { |
| 49 | KorAP.Match.create(this).open(); |
| 50 | console.log('newly open'); |
| 51 | } |
| 52 | |
| 53 | |
| 54 | }); |
| 55 | }; |
| 56 | |
| 57 | /** |
| 58 | * Toggle the alignment (left <=> right) |
| 59 | */ |
| 60 | if (i > 0) { |
| 61 | var br = document.getElementById('button-right'); |
| 62 | if (br !== undefined) { |
| 63 | var toggle = document.createElement('a'); |
| 64 | toggle.setAttribute('title', 'toggle Alignment'); |
| 65 | // Todo: Reuse old alignment from cookie! |
| 66 | var cl = toggle.classList; |
| 67 | cl.add('align'); |
| 68 | cl.add('right'); |
| 69 | toggle.addEventListener( |
| 70 | 'click', |
| 71 | function (e) { |
| 72 | var ol = document.querySelector('#search > ol'); |
| 73 | ol.toggleClass("align-left", "align-right"); |
| 74 | this.toggleClass("left", "right"); |
| 75 | }); |
| 76 | toggle.appendChild(document.createElement('span')) |
| 77 | .appendChild(document.createTextNode('Alignment')); |
| 78 | br.appendChild(toggle); |
| 79 | }; |
| 80 | }; |
| 81 | }; |
| 82 | |
| 83 | /* |
| 84 | function _openMatch (e) { |
| 85 | e.halt(); |
| 86 | this.classList.add("active"); |
| 87 | var matchElement = this; |
| 88 | |
| 89 | // Todo: Add object to element |
| 90 | var ul = document.createElement('ul'); |
| 91 | ul.classList.add('action', 'right'); |
| 92 | matchElement.appendChild(ul); |
| 93 | |
| 94 | // Todo:: Localize! |
| 95 | var close = document.createElement('li'); |
| 96 | close.appendChild(document.createElement('span')) |
| 97 | .appendChild(document.createTextNode('Close')); |
| 98 | close.classList.add('close'); |
| 99 | close.setAttribute('title', 'Close'); |
| 100 | |
| 101 | close.addEventListener('click', function (ie) { |
| 102 | ie.halt(); |
| 103 | var match = matchElement['_match']; |
| 104 | match.destroy(); |
| 105 | matchElement.classList.remove('active'); |
| 106 | matchElement.removeChild(ul); |
| 107 | }); |
| 108 | |
| 109 | // Todo:: Localize! |
| 110 | var info = document.createElement('li'); |
| 111 | info.appendChild(document.createElement('span')) |
| 112 | .appendChild(document.createTextNode('Info')); |
| 113 | info.classList.add('info'); |
| 114 | info.setAttribute('title', 'Information'); |
| 115 | |
| 116 | // Add information, unless it already exists |
| 117 | info.addEventListener('click', function (ie) { |
| 118 | ie.halt(); |
| 119 | KorAP.Match.create(matchElement).addInfo(); |
| 120 | }); |
| 121 | |
| 122 | ul.appendChild(close); |
| 123 | ul.appendChild(info); |
| 124 | }; |
| 125 | */ |
| 126 | |
| 127 | /** |
| 128 | function _closeMatch (e) { |
| 129 | e.halt(); |
| 130 | this.parentNode.parentNode.classList.remove("active"); |
| 131 | }; |
| 132 | */ |
| 133 | |
| 134 | }(this.KorAP)); |