Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 1 | /** |
| 2 | * The result panel |
| 3 | * |
| 4 | * @author Nils Diewald |
| 5 | */ |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 6 | "use strict"; |
| 7 | |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 8 | define([ |
| 9 | 'panel', |
| 10 | 'view/result/koralquery' |
| 11 | ], function (panelClass, kqViewClass) { |
| 12 | |
| 13 | const d = document; |
| 14 | |
| 15 | // Localization values |
| 16 | const loc = KorAP.Locale; |
| 17 | loc.TOGGLE_ALIGN = loc.TOGGLE_ALIGN || 'toggle alignment'; |
| 18 | loc.SHOW_KQ = loc.SHOW_KQ || 'show KoralQuery'; |
Akron | ece4bb7 | 2020-10-19 12:24:20 +0200 | [diff] [blame] | 19 | |
| 20 | const aRoll = ['left', 'right','center']; |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 21 | |
| 22 | return { |
Akron | 6112b52 | 2018-07-25 13:48:53 +0200 | [diff] [blame] | 23 | create : function (opened) { |
| 24 | return Object.create(panelClass)._init(['result']).upgradeTo(this)._init(opened); |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 25 | }, |
| 26 | |
| 27 | // Initialize panel |
Akron | 6112b52 | 2018-07-25 13:48:53 +0200 | [diff] [blame] | 28 | _init : function (opened) { |
| 29 | this._opened = opened; |
hebasta | 043e96f | 2019-11-28 12:33:00 +0100 | [diff] [blame] | 30 | |
hebasta | 043e96f | 2019-11-28 12:33:00 +0100 | [diff] [blame] | 31 | // If plugins are enabled, add all buttons for the result panel |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 32 | if (KorAP.Plugin) { |
hebasta | 043e96f | 2019-11-28 12:33:00 +0100 | [diff] [blame] | 33 | |
| 34 | // Add all result buttons in order |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 35 | KorAP.Plugin |
| 36 | .buttonGroup("result") |
| 37 | .forEach(i => this.actions.add.apply(this.actions, i)); |
hebasta | 043e96f | 2019-11-28 12:33:00 +0100 | [diff] [blame] | 38 | |
| 39 | KorAP.Plugin.clearButtonGroup("result"); |
| 40 | }; |
| 41 | |
hebasta | d025eb9 | 2019-12-07 21:04:42 +0100 | [diff] [blame] | 42 | this.prepend = true; |
hebasta | 043e96f | 2019-11-28 12:33:00 +0100 | [diff] [blame] | 43 | |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 44 | return this; |
| 45 | }, |
| 46 | |
| 47 | |
| 48 | /** |
| 49 | * Add KoralQuery action to panel |
| 50 | */ |
| 51 | addKqAction : function () { |
| 52 | |
| 53 | // Open KoralQuery view |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 54 | const kqButton = this.actions.add( |
| 55 | loc.SHOW_KQ, |
| 56 | {'cls':['show-kq','button-icon']}, |
| 57 | function () { |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 58 | |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 59 | const t = this; |
| 60 | |
| 61 | // Show only once - otherwise toggle |
| 62 | if (t._kq && t._kq.shown()) { |
| 63 | t._kq.close(); |
| 64 | return; |
| 65 | }; |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 66 | |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 67 | t._kq = kqViewClass.create(); |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 68 | |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 69 | // On close, remove session info on KQ |
| 70 | t._kq.onClose = function () { |
| 71 | delete this._opened['kq']; |
| 72 | }.bind(t); |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 73 | |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 74 | t._opened['kq'] = true; |
| 75 | t.add(t._kq); |
| 76 | } |
| 77 | ); |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 78 | |
| 79 | // Show KoralQuery in case it's meant to be shown |
Akron | 6112b52 | 2018-07-25 13:48:53 +0200 | [diff] [blame] | 80 | if (this._opened['kq']) |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 81 | kqButton.click(); |
| 82 | }, |
| 83 | |
Akron | 14f3ee9 | 2020-10-19 11:59:40 +0200 | [diff] [blame] | 84 | |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 85 | /** |
| 86 | * Add align action to panel |
| 87 | */ |
| 88 | addAlignAction : function () { |
| 89 | /** |
| 90 | * Toggle the alignment (left <=> right) |
| 91 | */ |
Akron | 792b1a4 | 2020-09-14 18:56:38 +0200 | [diff] [blame] | 92 | this.actions.add(loc.TOGGLE_ALIGN, {'cls':['align','right','button-icon']}, function (e) { |
Akron | ece4bb7 | 2020-10-19 12:24:20 +0200 | [diff] [blame] | 93 | var olCl = d.querySelector('#search > ol').classList; |
| 94 | |
| 95 | aRoll.find(function(align, i) { |
| 96 | if (olCl.contains('align-' + align)) { |
| 97 | const n = i >= 2 ? 0 : i+1; |
| 98 | const nn = n >= 2 ? 0 : n+1; |
| 99 | olCl.remove('align-' + align); |
| 100 | olCl.add('align-' + aRoll[n]); |
| 101 | this.button.toggleClass(aRoll[n], aRoll[nn]); |
| 102 | return true; |
| 103 | }; |
| 104 | }, this); |
| 105 | }); |
Akron | 5cb9b2b | 2018-07-24 17:01:09 +0200 | [diff] [blame] | 106 | } |
| 107 | } |
| 108 | }); |