Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(28)

Unified Diff: chrome/common/extensions/docs/examples/api/tabs/zoom/popup.html

Issue 6413014: Original patch from issue 570048 (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: a few fixes Created 9 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/common/extensions/docs/examples/api/tabs/zoom/popup.html
diff --git a/chrome/common/extensions/docs/examples/api/tabs/zoom/popup.html b/chrome/common/extensions/docs/examples/api/tabs/zoom/popup.html
new file mode 100644
index 0000000000000000000000000000000000000000..1bdbf5ee735e73cd87bfb803c3a07b648c2d06b0
--- /dev/null
+++ b/chrome/common/extensions/docs/examples/api/tabs/zoom/popup.html
@@ -0,0 +1,154 @@
+<script>
+
+// The zoom extension API only allows setting of an arbitrary zoom percent.
+// The following functions provide the logic necessary to imitate the exact
+// zoom in/out behavior of the built-in zoom functions.
+
+// From WebViewImpl.cpp
+
+var textSizeMultiplierRatio = 1.2;
+
+function zoomLevelToZoomFactor(zoomLevel) {
+ return Math.pow(textSizeMultiplierRatio, zoomLevel);
+}
+
+function zoomFactorToZoomLevel(factor) {
+ // Since factor = 1.2^level, level = log(factor) / log(1.2)
+ return Math.log(factor) / Math.log(textSizeMultiplierRatio);
+}
+
+// From render_view.cc
+
+var ZoomFunction = {
+ ZoomOut: -1,
+ Reset: 0,
+ ZoomIn: 1
+}
+
+// Test that a float reperesents an integral zoom level
+function isBasicallyIntegral(zoomLevel) {
+ var epsilon = 0.000001;
+ var rounded = Math.round(zoomLevel);
+ return Math.abs(zoomLevel - rounded) < epsilon;
+}
+
+// Calculate a new zoom level for zoom in/out/reset
+function zoom(oldZoomLevel, zoomFunction) {
+ var zoomLevel;
+
+ if (zoomFunction == ZoomFunction.Reset) {
+ zoomLevel = 0;
+ } else if (isBasicallyIntegral(oldZoomLevel)) {
+ // Previous zoom level is a whole number, so just increment/decrement.
+ zoomLevel = Math.round(oldZoomLevel) + zoomFunction;
+ } else {
+ // Either the user hit the zoom factor limit and thus the zoom level is now
+ // not a whole number, or a plugin changed it to a custom value. We want
+ // to go to the next whole number so that the user can always get back to
+ // 100% with the keyboard/menu.
+ if ((oldZoomLevel > 1 && zoomFunction > 0) ||
+ (oldZoomLevel < 1 && zoomFunction < 0)) {
+ zoomLevel = parseInt(oldZoomLevel + zoomFunction);
+ } else {
+ // We're going towards 100%, so first go to the next whole number.
+ zoomLevel = parseInt(oldZoomLevel);
+ }
+ }
+
+ return zoomLevel;
+}
+
+
+// Zoom in/out
+
+function incZoomLevel(oldZoomLevel) {
+ return zoom(oldZoomLevel, ZoomFunction.ZoomIn);
+}
+
+function decZoomLevel(oldZoomLevel) {
+ return zoom(oldZoomLevel, ZoomFunction.ZoomOut);
+}
+
+// Convert zoom percent to zoom level and apply a function,
+// then convert back to zoom percent and return the result
+function applyAsZoomLevel(zoomLevelTransform, zoomPercent) {
+ var zoomLevel = zoomFactorToZoomLevel(zoomPercent / 100);
+ var newZoomLevel = zoomLevelTransform(zoomLevel);
+ var newZoomPercent = zoomLevelToZoomFactor(newZoomLevel) * 100;
+ return newZoomPercent;
+}
+
+// Zoom in the current tab, exactly like the built-in zoom
+function zoomIn() {
+ chrome.tabs.getSelected(null, function(tab) {
+ chrome.tabs.getZoomPercent(tab.id, function(zoomPercent) {
+
+ var newZoomPercent = applyAsZoomLevel(incZoomLevel, zoomPercent);
+ chrome.tabs.setZoomPercent(tab.id, newZoomPercent, function(finalZoomPercent) {
+ displayZoomPercent(finalZoomPercent);
+ });
+ });
+ });
+}
+
+// Zoom out the current tab, exactly like the built-in zoom
+function zoomOut() {
+ chrome.tabs.getSelected(null, function(tab) {
+ chrome.tabs.getZoomPercent(tab.id, function(zoomPercent) {
+
+ var newZoomPercent = applyAsZoomLevel(decZoomLevel, zoomPercent);
+ chrome.tabs.setZoomPercent(tab.id, newZoomPercent, function(finalZoomPercent) {
+ displayZoomPercent(finalZoomPercent);
+ });
+ });
+ });
+}
+
+function zoomReset() {
+ chrome.tabs.getSelected(null, function(tab) {
+ chrome.tabs.setZoomPercent(tab.id, 100, function(finalZoomPercent) {
+ displayZoomPercent(finalZoomPercent);
+ });
+ });
+}
+
+function setZoomPercentFromInput() {
+ chrome.tabs.getSelected(null, function(tab){
+ var zoomPercent = parseFloat(document.getElementById("zoomPercentInput").value);
+
+ if (isNaN(zoomPercent)) {
+ return;
+ }
+
+ chrome.tabs.setZoomPercent(tab.id, zoomPercent, function(finalZoomPercent) {
+ displayZoomPercent(finalZoomPercent);
+ });
+ });
+}
+
+function displayZoomPercent(zoomPercent) {
+ var intZoomPercent = parseInt(zoomPercent);
+ document.getElementById("currentZoom").innerHTML = intZoomPercent;
+}
+
+function getAndDisplayZoomPercent() {
+ chrome.tabs.getSelected(null, function(tab){
+ chrome.tabs.getZoomPercent(tab.id, function(zoomPercent) {
+ displayZoomPercent(zoomPercent);
+ });
+ });
+}
+
+getAndDisplayZoomPercent();
+
+</script>
+
+<p><a id="zoomInLink" href="#" onclick="zoomIn()">zoom in</a></p>
+<p><a id="zoomOutLink" href="#" onclick="zoomOut()">zoom out</a></p>
+<p><a id="zoomResetLink" href="#" onClick="zoomReset()">reset</a></p>
+<p>Zoom: <span id="currentZoom"></span></p>
+
+<form>
+ <input id="zoomPercentInput"/>
+ <button id="zoomPercentButton" onclick="setZoomPercentFromInput()" type="button">Set Zoom</button>
+</form>

Powered by Google App Engine
This is Rietveld 408576698