-
Notifications
You must be signed in to change notification settings - Fork 8.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
A complete working version. The findbox does not look shiny and also the
shortkey does not make the input box active (Ctrl + F).
- Loading branch information
1 parent
9b1cf9f
commit 055a8fc
Showing
10 changed files
with
451 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
34 changes: 34 additions & 0 deletions
34
samples/webview-samples/multi-tab-browser/exit_box_controller.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
var exitTool = (function() { | ||
var containerElement = null; | ||
var browserInstance = null; | ||
var controller = null; | ||
var yes = null; no = null; | ||
function query(id) { return containerElement.querySelector(id);} | ||
var ExitController = function(container, browser) { | ||
containerElement = container; | ||
browserInstance = browser; | ||
controller = this; | ||
yes = query('#exit-yes'); | ||
no = query('#exit-no'); | ||
yes.onclick = function() { | ||
window.close(); | ||
}; | ||
no.onclick = deactivate; | ||
this.overlay = document.createElement('div'); | ||
this.overlay.className = 'overlay-gray'; | ||
document.body.appendChild(this.overlay); | ||
}; | ||
|
||
ExitController.prototype.activate = function() { | ||
containerElement.style.display = 'block'; | ||
this.overlay.style.display = 'block'; | ||
}; | ||
|
||
function deactivate() { | ||
containerElement.style.display = 'none'; | ||
controller.overlay.style.display = 'none'; | ||
}; | ||
|
||
return {'ExitController': ExitController}; | ||
|
||
})(); |
139 changes: 139 additions & 0 deletions
139
samples/webview-samples/multi-tab-browser/find_box_controller.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,139 @@ | ||
var findTool = (function() { | ||
var VISIBLE_STYLE = 'block'; | ||
var HIDDEN_STYLE = 'none'; | ||
var containerElement = null, browserInstance = null, controller = null; | ||
var form = null, findText = null, matchCase = null, findBackward = null, | ||
findForward = null, findResult = null; | ||
var findMatchCase = false; | ||
function query(id) { | ||
return containerElement.querySelector(id); | ||
} | ||
var FindController = function(container, browser) { | ||
containerElement = container; | ||
browserInstance = browser; | ||
form = query('#find-form'); | ||
findText = query('#find-text'); | ||
findResults = query('#find-results'); | ||
findBackward = query("#find-backward"); | ||
findForward = query("#find-forward"); | ||
matchCase = query("#match-case"); | ||
controller = this; | ||
initHandlers(); | ||
} | ||
|
||
function isVisible() { | ||
return containerElement.style.display == VISIBLE_STYLE; | ||
} | ||
|
||
function hideBox() { | ||
containerElement.style.display = HIDDEN_STYLE; | ||
} | ||
|
||
function showBox() { | ||
setWebviewFindUpdateHandler(); | ||
containerElement.style.display = VISIBLE_STYLE; | ||
} | ||
|
||
FindController.prototype.toggleVisibility = function() { | ||
if (isVisible()) { | ||
hideBox(); | ||
} else { | ||
showBox(); | ||
} | ||
}; | ||
|
||
function findTextOnInput(e) { | ||
browserInstance.tabs.getSelected().webview.find( | ||
findText.value, {matchCase: findMatchCase}); | ||
} | ||
|
||
function findTextOnKeyDown(e) { | ||
if (e.ctrlKey && e.keyCode == 13) { | ||
e.preventDefault(); | ||
browserInstance.tabs.getSelected().webview.stopFinding('activate'); | ||
hideBox(); | ||
} | ||
} | ||
function matchCaseOnClick(e) { | ||
e.preventDefault(); | ||
findMatchCase = !findMatchCase; | ||
if (findMatchCase) { | ||
matchCase.style.color = 'blue'; | ||
matchCase.style['font-weight'] = 'bold'; | ||
} else { | ||
matchCase.style.color = 'black'; | ||
matchCase.style['font-weight'] = ""; | ||
} | ||
browserInstance.tabs.getSelected().webview.find( | ||
findText.value, {matchCase: findMatchCase}); | ||
} | ||
|
||
function formOnSubmit(e) { | ||
e.preventDefault(); | ||
browserInstance.tabs.getSelected().webview.find( | ||
findText.value, {matchCase: findMatchCase}); | ||
} | ||
|
||
function findBackwardOnClick(e) { | ||
e.preventDefault(); | ||
browserInstance.tabs.getSelected().webview.find( | ||
findText.value, {backward: true, matchCase: findMatchCase}); | ||
} | ||
|
||
function handleFindUpdate(e) { | ||
if (e.searchText == "") { | ||
findResults.innerText = ""; | ||
} else { | ||
findResults.innerText = | ||
event.activeMatchOrdinal + " of " + event.numberOfMatches; | ||
} | ||
// Ensure that the find box does not obscure the active match | ||
if (e.finalUpdate && !e.canceled) { | ||
containerElement.style.left = ''; | ||
containerElement.style.opacity = ''; | ||
var rect = containerElement.getBoundingClientRect(); | ||
if (containerElementObscuresActiveMatch(rect, e.selectionRect)) { | ||
var potentialLeft = e.selectionRect.left - rect.width - 10; | ||
if (potentialLeft >= 5) { | ||
containerElement.style.left = potentialLeft + 'px'; | ||
} else { | ||
containerElement.style.opacity = "0.5"; | ||
} | ||
} | ||
} | ||
} | ||
|
||
function containerElementObscuresActiveMatch(findBoxRect, matchRect) { | ||
return findBoxRect.left < matchRect.left + matchRect.width && | ||
findBoxRect.right > matchRect.left && | ||
findBoxRect.top < matchRect.top + matchRect.height && | ||
findBoxRect.bottom > matchRect.top; | ||
|
||
} | ||
|
||
function handleKeydown(e) { | ||
// Check for Ctrl + F | ||
if (e.ctrlKey && e.keyCode == 70) { | ||
showBox(); | ||
} | ||
} | ||
|
||
function initHandlers() { | ||
findText.addEventListener('input', findTextOnInput); | ||
findText.addEventListener('keydown', findTextOnKeyDown); | ||
matchCase.addEventListener('click', matchCaseOnClick); | ||
form.addEventListener('submit', formOnSubmit); | ||
window.addEventListener('keydown', handleKeydown); | ||
} | ||
|
||
function setWebviewFindUpdateHandler() { | ||
if (browserInstance && browserInstance.tabs) { | ||
for (var index = 0; index < browserInstance.tabs.getNumTabs(); ++index) { | ||
var wv = browserInstance.tabs.selectIdx(index).webview; | ||
wv.onfindupdate = handleFindUpdate; | ||
wv.stopFinding(); | ||
} | ||
} | ||
} | ||
return {'FindController': FindController}; | ||
})(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.