1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
/**
* @license
* Copyright (C) 2016 The Android Open Source Project
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
(function() {
'use strict';
Polymer({
is: 'gr-selection-action-box',
/**
* Fired when the comment creation action was taken (hotkey, click).
*
* @event create-comment
*/
properties: {
keyEventTarget: {
type: Object,
value() { return document.body; },
},
range: {
type: Object,
value: {
startLine: NaN,
startChar: NaN,
endLine: NaN,
endChar: NaN,
},
},
positionBelow: Boolean,
side: {
type: String,
value: '',
},
},
behaviors: [
Gerrit.KeyboardShortcutBehavior,
],
listeners: {
mousedown: '_handleMouseDown', // See https://crbug.com/gerrit/4767
},
keyBindings: {
c: '_handleCKey',
},
placeAbove(el) {
Polymer.dom.flush();
const rect = this._getTargetBoundingRect(el);
const boxRect = this.$.tooltip.getBoundingClientRect();
const parentRect = this.parentElement.getBoundingClientRect();
this.style.top =
rect.top - parentRect.top - boxRect.height - 6 + 'px';
this.style.left =
rect.left - parentRect.left + (rect.width - boxRect.width) / 2 + 'px';
},
placeBelow(el) {
Polymer.dom.flush();
const rect = this._getTargetBoundingRect(el);
const boxRect = this.$.tooltip.getBoundingClientRect();
const parentRect = this.parentElement.getBoundingClientRect();
this.style.top =
rect.top - parentRect.top + boxRect.height - 6 + 'px';
this.style.left =
rect.left - parentRect.left + (rect.width - boxRect.width) / 2 + 'px';
},
_getTargetBoundingRect(el) {
let rect;
if (el instanceof Text) {
const range = document.createRange();
range.selectNode(el);
rect = range.getBoundingClientRect();
range.detach();
} else {
rect = el.getBoundingClientRect();
}
return rect;
},
_handleCKey(e) {
if (this.shouldSuppressKeyboardShortcut(e) ||
this.modifierPressed(e)) { return; }
e.preventDefault();
this._fireCreateComment();
},
_handleMouseDown(e) {
if (e.button !== 0) { return; } // 0 = main button
e.preventDefault();
e.stopPropagation();
this._fireCreateComment();
},
_fireCreateComment() {
this.fire('create-comment', {side: this.side, range: this.range});
},
});
})();
|