diff options
author | Alex Yatskov <alex@foosoft.net> | 2017-08-17 19:19:34 -0700 |
---|---|---|
committer | Alex Yatskov <alex@foosoft.net> | 2017-08-17 19:19:34 -0700 |
commit | 7586572fbaab7de698ec13f8712cc95e24ab6273 (patch) | |
tree | 665417b73c928694b96c00a98dd882c618e1fd1d /ext/fg/js/popup.js | |
parent | 3475150b2d1424d43f5be6fcfbdbb719a576866f (diff) | |
parent | 191336522c220b0a3cfe41515ed23946b3462217 (diff) |
Merge branch 'dev'
Diffstat (limited to 'ext/fg/js/popup.js')
-rw-r--r-- | ext/fg/js/popup.js | 111 |
1 files changed, 54 insertions, 57 deletions
diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index cd7e846a..03958832 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -1,5 +1,5 @@ /* - * Copyright (C) 2016 Alex Yatskov <alex@foosoft.net> + * Copyright (C) 2016-2017 Alex Yatskov <alex@foosoft.net> * Author: Alex Yatskov <alex@foosoft.net> * * This program is free software: you can redistribute it and/or modify @@ -20,10 +20,10 @@ class Popup { constructor() { this.container = document.createElement('iframe'); - this.container.id = 'yomichan-popup'; + this.container.id = 'yomichan-float'; this.container.addEventListener('mousedown', e => e.stopPropagation()); this.container.addEventListener('scroll', e => e.stopPropagation()); - this.container.setAttribute('src', chrome.extension.getURL('/fg/frame.html')); + this.container.setAttribute('src', chrome.extension.getURL('/fg/float.html')); this.container.style.width = '0px'; this.container.style.height = '0px'; this.injected = null; @@ -40,51 +40,56 @@ class Popup { return this.injected; } - show(elementRect, options) { - return this.inject().then(() => { - const containerStyle = window.getComputedStyle(this.container); - const containerHeight = parseInt(containerStyle.height); - const containerWidth = parseInt(containerStyle.width); - - const limitX = document.body.clientWidth; - const limitY = window.innerHeight; - - let x = elementRect.left; - let width = Math.max(containerWidth, options.general.popupWidth); - const overflowX = Math.max(x + width - limitX, 0); - if (overflowX > 0) { - if (x >= overflowX) { - x -= overflowX; - } else { - width = limitX; - x = 0; - } - } + async show(elementRect, options) { + await this.inject(); + + const containerStyle = window.getComputedStyle(this.container); + const containerHeight = parseInt(containerStyle.height); + const containerWidth = parseInt(containerStyle.width); + + const limitX = document.body.clientWidth; + const limitY = window.innerHeight; - let y = 0; - let height = Math.max(containerHeight, options.general.popupHeight); - const yBelow = elementRect.bottom + options.general.popupOffset; - const yAbove = elementRect.top - options.general.popupOffset; - const overflowBelow = Math.max(yBelow + height - limitY, 0); - const overflowAbove = Math.max(height - yAbove, 0); - if (overflowBelow > 0 || overflowAbove > 0) { - if (overflowBelow < overflowAbove) { - height = Math.max(height - overflowBelow, 0); - y = yBelow; - } else { - height = Math.max(height - overflowAbove, 0); - y = Math.max(yAbove - height, 0); - } + let x = elementRect.left; + let width = Math.max(containerWidth, options.general.popupWidth); + const overflowX = Math.max(x + width - limitX, 0); + if (overflowX > 0) { + if (x >= overflowX) { + x -= overflowX; } else { + width = limitX; + x = 0; + } + } + + let y = 0; + let height = Math.max(containerHeight, options.general.popupHeight); + const yBelow = elementRect.bottom + options.general.popupOffset; + const yAbove = elementRect.top - options.general.popupOffset; + const overflowBelow = Math.max(yBelow + height - limitY, 0); + const overflowAbove = Math.max(height - yAbove, 0); + if (overflowBelow > 0 || overflowAbove > 0) { + if (overflowBelow < overflowAbove) { + height = Math.max(height - overflowBelow, 0); y = yBelow; + } else { + height = Math.max(height - overflowAbove, 0); + y = Math.max(yAbove - height, 0); } + } else { + y = yBelow; + } + + this.container.style.left = `${x}px`; + this.container.style.top = `${y}px`; + this.container.style.width = `${width}px`; + this.container.style.height = `${height}px`; + this.container.style.visibility = 'visible'; + } - this.container.style.left = `${x}px`; - this.container.style.top = `${y}px`; - this.container.style.width = `${width}px`; - this.container.style.height = `${height}px`; - this.container.style.visibility = 'visible'; - }); + async showOrphaned(elementRect, options) { + await this.show(elementRect, options); + this.invokeApi('orphaned'); } hide() { @@ -95,22 +100,14 @@ class Popup { return this.injected && this.container.style.visibility !== 'hidden'; } - showTermDefs(elementRect, definitions, options, context) { - this.show(elementRect, options).then(() => { - this.invokeApi('showTermDefs', {definitions, options, context}); - }); - } - - showKanjiDefs(elementRect, definitions, options, context) { - this.show(elementRect, options).then(() => { - this.invokeApi('showKanjiDefs', {definitions, options, context}); - }); + async termsShow(elementRect, definitions, options, context) { + await this.show(elementRect, options); + this.invokeApi('termsShow', {definitions, options, context}); } - showOrphaned(elementRect, options) { - this.show(elementRect, options).then(() => { - this.invokeApi('showOrphaned'); - }); + async kanjiShow(elementRect, definitions, options, context) { + await this.show(elementRect, options); + this.invokeApi('kanjiShow', {definitions, options, context}); } invokeApi(action, params={}) { |