Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 /** | 5 /** |
| 6 * @constructor | 6 * @constructor |
| 7 * @extends {WebInspector.VBox} | 7 * @extends {WebInspector.VBox} |
| 8 */ | 8 */ |
| 9 WebInspector.SensorsView = function() | 9 WebInspector.SensorsView = function() |
| 10 { | 10 { |
| 11 WebInspector.VBox.call(this, true); | 11 WebInspector.VBox.call(this, true); |
| 12 this.registerRequiredCSS("emulation/sensors.css"); | 12 this.registerRequiredCSS("emulation/sensors.css"); |
| 13 this.contentElement.classList.add("sensors-view"); | 13 this.contentElement.classList.add("sensors-view"); |
| 14 | |
| 15 this._geolocationSetting = WebInspector.settings.createSetting("emulation.ge olocationOverride", ""); | |
| 16 this._geolocation = WebInspector.Geolocation.parseSetting(this._geolocationS etting.get()); | |
| 17 this._geolocationEnabled = false; | |
| 14 this._appendGeolocationOverrideControl(); | 18 this._appendGeolocationOverrideControl(); |
| 19 | |
| 20 this._deviceOrientationSetting = WebInspector.settings.createSetting("emulat ion.deviceOrientationOverride", ""); | |
| 21 this._deviceOrientation = WebInspector.DeviceOrientation.parseSetting(this._ deviceOrientationSetting.get()); | |
| 22 this._deviceOrientationEnabled = false; | |
| 15 this._appendDeviceOrientationOverrideControl(); | 23 this._appendDeviceOrientationOverrideControl(); |
| 16 } | 24 } |
| 17 | 25 |
| 18 WebInspector.SensorsView.prototype = { | 26 WebInspector.SensorsView.prototype = { |
| 19 _appendGeolocationOverrideControl: function() | 27 _appendGeolocationOverrideControl: function() |
| 20 { | 28 { |
| 21 const geolocationSetting = WebInspector.overridesSupport.settings.geoloc ationOverride.get(); | |
| 22 var geolocation = WebInspector.OverridesSupport.GeolocationPosition.pars eSetting(geolocationSetting); | |
| 23 var checkboxLabel = createCheckboxLabel(WebInspector.UIString("Emulate g eolocation coordinates")); | 29 var checkboxLabel = createCheckboxLabel(WebInspector.UIString("Emulate g eolocation coordinates")); |
| 24 this._geolocationOverrideCheckbox = checkboxLabel.checkboxElement; | 30 this._geolocationOverrideCheckbox = checkboxLabel.checkboxElement; |
| 25 this._geolocationOverrideCheckbox.addEventListener("click", this._geoloc ationOverrideCheckboxClicked.bind(this)); | 31 this._geolocationOverrideCheckbox.addEventListener("click", this._geoloc ationOverrideCheckboxClicked.bind(this)); |
| 26 this.contentElement.appendChild(checkboxLabel); | 32 this.contentElement.appendChild(checkboxLabel); |
| 27 this._geolocationFieldset = this._createGeolocationOverrideElement(geolo cation); | 33 this._geolocationFieldset = this._createGeolocationOverrideElement(this. _geolocation); |
| 28 this._geolocationFieldset.disabled = true; | 34 this._geolocationFieldset.disabled = true; |
| 29 this.contentElement.appendChild(this._geolocationFieldset); | 35 this.contentElement.appendChild(this._geolocationFieldset); |
| 30 }, | 36 }, |
| 31 | 37 |
| 32 _geolocationOverrideCheckboxClicked: function() | 38 _geolocationOverrideCheckboxClicked: function() |
| 33 { | 39 { |
| 34 var enabled = this._geolocationOverrideCheckbox.checked; | 40 var enabled = this._geolocationOverrideCheckbox.checked; |
| 35 WebInspector.overridesSupport.setGeolocationOverrideEnabled(enabled); | 41 |
| 42 this._geolocationEnabled = enabled; | |
| 43 this._applyGeolocation(); | |
| 44 | |
| 36 if (enabled && !this._latitudeElement.value) | 45 if (enabled && !this._latitudeElement.value) |
| 37 this._latitudeElement.focus(); | 46 this._latitudeElement.focus(); |
| 38 this._geolocationFieldset.disabled = !enabled; | 47 this._geolocationFieldset.disabled = !enabled; |
| 39 }, | 48 }, |
| 40 | 49 |
| 41 _applyGeolocationUserInput: function() | 50 _applyGeolocationUserInput: function() |
| 42 { | 51 { |
| 43 this._setGeolocationPosition(WebInspector.OverridesSupport.GeolocationPo sition.parseUserInput(this._latitudeElement.value.trim(), this._longitudeElement .value.trim(), this._geolocationErrorElement.checked), true); | 52 var geolocation = WebInspector.Geolocation.parseUserInput(this._latitude Element.value.trim(), this._longitudeElement.value.trim(), this._geolocationErro rElement.checked); |
| 53 if (!geolocation) | |
| 54 return; | |
| 55 | |
| 56 this._geolocation = geolocation; | |
| 57 this._applyGeolocation(); | |
| 58 }, | |
| 59 | |
| 60 _applyGeolocation: function() | |
| 61 { | |
| 62 if (this._geolocationEnabled) { | |
| 63 this._geolocationSetting.set(this._geolocation.toSetting()); | |
|
pfeldman
2016/01/27 17:53:18
If those models are not a part of sdk, you could e
| |
| 64 this._geolocation.apply(); | |
| 65 } else { | |
| 66 this._geolocation.clear(); | |
| 67 } | |
| 44 }, | 68 }, |
| 45 | 69 |
| 46 /** | 70 /** |
| 47 * @param {?WebInspector.OverridesSupport.GeolocationPosition} geolocation | 71 * @param {!WebInspector.Geolocation} geolocation |
| 48 * @param {boolean} userInputModified | |
| 49 */ | |
| 50 _setGeolocationPosition: function(geolocation, userInputModified) | |
| 51 { | |
| 52 if (!geolocation) | |
| 53 return; | |
| 54 | |
| 55 if (!userInputModified) { | |
| 56 this._latitudeElement.value = geolocation.latitude; | |
| 57 this._longitudeElement.value = geolocation.longitude; | |
| 58 } | |
| 59 | |
| 60 var value = geolocation.toSetting(); | |
| 61 WebInspector.overridesSupport.settings.geolocationOverride.set(value); | |
| 62 }, | |
| 63 | |
| 64 /** | |
| 65 * @param {!WebInspector.OverridesSupport.GeolocationPosition} geolocation | |
| 66 * @return {!Element} | 72 * @return {!Element} |
| 67 */ | 73 */ |
| 68 _createGeolocationOverrideElement: function(geolocation) | 74 _createGeolocationOverrideElement: function(geolocation) |
| 69 { | 75 { |
| 70 var fieldsetElement = createElement("fieldset"); | 76 var fieldsetElement = createElement("fieldset"); |
| 71 fieldsetElement.id = "geolocation-override-section"; | 77 fieldsetElement.id = "geolocation-override-section"; |
| 72 | 78 |
| 73 var tableElement = fieldsetElement.createChild("table"); | 79 var tableElement = fieldsetElement.createChild("table"); |
| 74 var rowElement = tableElement.createChild("tr"); | 80 var rowElement = tableElement.createChild("tr"); |
| 75 var cellElement = rowElement.createChild("td"); | 81 var cellElement = rowElement.createChild("td"); |
| (...skipping 11 matching lines...) Expand all Loading... | |
| 87 geolocationErrorCheckboxElement.id = "geolocation-error"; | 93 geolocationErrorCheckboxElement.id = "geolocation-error"; |
| 88 geolocationErrorCheckboxElement.addEventListener("click", this._applyGeo locationUserInput.bind(this), false); | 94 geolocationErrorCheckboxElement.addEventListener("click", this._applyGeo locationUserInput.bind(this), false); |
| 89 this._geolocationErrorElement = geolocationErrorCheckboxElement; | 95 this._geolocationErrorElement = geolocationErrorCheckboxElement; |
| 90 cellElement.appendChild(geolocationErrorLabelElement); | 96 cellElement.appendChild(geolocationErrorLabelElement); |
| 91 | 97 |
| 92 return fieldsetElement; | 98 return fieldsetElement; |
| 93 }, | 99 }, |
| 94 | 100 |
| 95 _appendDeviceOrientationOverrideControl: function() | 101 _appendDeviceOrientationOverrideControl: function() |
| 96 { | 102 { |
| 97 const deviceOrientationSetting = WebInspector.overridesSupport.settings. deviceOrientationOverride.get(); | |
| 98 var deviceOrientation = WebInspector.OverridesSupport.DeviceOrientation. parseSetting(deviceOrientationSetting); | |
| 99 var checkboxLabel = createCheckboxLabel(WebInspector.UIString("Emulate a ccelerometer")); | 103 var checkboxLabel = createCheckboxLabel(WebInspector.UIString("Emulate a ccelerometer")); |
| 100 this._overrideDeviceOrientationCheckbox = checkboxLabel.checkboxElement; | 104 this._overrideDeviceOrientationCheckbox = checkboxLabel.checkboxElement; |
| 101 this._overrideDeviceOrientationCheckbox.addEventListener("click", this._ deviceOrientationOverrideCheckboxClicked.bind(this)); | 105 this._overrideDeviceOrientationCheckbox.addEventListener("click", this._ deviceOrientationOverrideCheckboxClicked.bind(this)); |
| 102 this.contentElement.appendChild(checkboxLabel); | 106 this.contentElement.appendChild(checkboxLabel); |
| 103 this._deviceOrientationFieldset = this._createDeviceOrientationOverrideE lement(deviceOrientation); | 107 this._deviceOrientationFieldset = this._createDeviceOrientationOverrideE lement(this._deviceOrientation); |
| 104 this._deviceOrientationFieldset.disabled = true; | 108 this._deviceOrientationFieldset.disabled = true; |
| 105 this.contentElement.appendChild(this._deviceOrientationFieldset); | 109 this.contentElement.appendChild(this._deviceOrientationFieldset); |
| 106 }, | 110 }, |
| 107 | 111 |
| 108 _deviceOrientationOverrideCheckboxClicked: function() | 112 _deviceOrientationOverrideCheckboxClicked: function() |
| 109 { | 113 { |
| 110 var enabled = this._overrideDeviceOrientationCheckbox.checked; | 114 var enabled = this._overrideDeviceOrientationCheckbox.checked; |
| 111 WebInspector.overridesSupport.setDeviceOrientationOverrideEnabled(enable d); | 115 |
| 116 this._deviceOrientationEnabled = enabled; | |
| 117 this._applyDeviceOrientation(); | |
| 118 | |
| 112 if (enabled && !this._alphaElement.value) | 119 if (enabled && !this._alphaElement.value) |
| 113 this._alphaElement.focus(); | 120 this._alphaElement.focus(); |
| 114 this._deviceOrientationFieldset.disabled = !enabled; | 121 this._deviceOrientationFieldset.disabled = !enabled; |
| 115 }, | 122 }, |
| 116 | 123 |
| 124 _applyDeviceOrientation: function() | |
| 125 { | |
| 126 if (this._deviceOrientationEnabled) { | |
| 127 this._deviceOrientationSetting.set(this._deviceOrientation.toSetting ()); | |
| 128 this._deviceOrientation.apply(); | |
| 129 } else { | |
| 130 this._deviceOrientation.clear(); | |
| 131 } | |
| 132 }, | |
| 133 | |
| 117 _applyDeviceOrientationUserInput: function() | 134 _applyDeviceOrientationUserInput: function() |
| 118 { | 135 { |
| 119 this._setDeviceOrientation(WebInspector.OverridesSupport.DeviceOrientati on.parseUserInput(this._alphaElement.value.trim(), this._betaElement.value.trim( ), this._gammaElement.value.trim()), WebInspector.SensorsView.DeviceOrientationM odificationSource.UserInput); | 136 this._setDeviceOrientation(WebInspector.DeviceOrientation.parseUserInput (this._alphaElement.value.trim(), this._betaElement.value.trim(), this._gammaEle ment.value.trim()), WebInspector.SensorsView.DeviceOrientationModificationSource .UserInput); |
| 120 }, | 137 }, |
| 121 | 138 |
| 122 _resetDeviceOrientation: function() | 139 _resetDeviceOrientation: function() |
| 123 { | 140 { |
| 124 this._setDeviceOrientation(new WebInspector.OverridesSupport.DeviceOrien tation(0, 0, 0), WebInspector.SensorsView.DeviceOrientationModificationSource.Re setButton); | 141 this._setDeviceOrientation(new WebInspector.DeviceOrientation(0, 0, 0), WebInspector.SensorsView.DeviceOrientationModificationSource.ResetButton); |
| 125 }, | 142 }, |
| 126 | 143 |
| 127 /** | 144 /** |
| 128 * @param {?WebInspector.OverridesSupport.DeviceOrientation} deviceOrientati on | 145 * @param {?WebInspector.DeviceOrientation} deviceOrientation |
| 129 * @param {!WebInspector.SensorsView.DeviceOrientationModificationSource} mo dificationSource | 146 * @param {!WebInspector.SensorsView.DeviceOrientationModificationSource} mo dificationSource |
| 130 */ | 147 */ |
| 131 _setDeviceOrientation: function(deviceOrientation, modificationSource) | 148 _setDeviceOrientation: function(deviceOrientation, modificationSource) |
| 132 { | 149 { |
| 133 if (!deviceOrientation) | 150 if (!deviceOrientation) |
| 134 return; | 151 return; |
| 135 | 152 |
| 136 if (modificationSource != WebInspector.SensorsView.DeviceOrientationModi ficationSource.UserInput) { | 153 if (modificationSource != WebInspector.SensorsView.DeviceOrientationModi ficationSource.UserInput) { |
| 137 this._alphaElement.value = deviceOrientation.alpha; | 154 this._alphaElement.value = deviceOrientation.alpha; |
| 138 this._betaElement.value = deviceOrientation.beta; | 155 this._betaElement.value = deviceOrientation.beta; |
| 139 this._gammaElement.value = deviceOrientation.gamma; | 156 this._gammaElement.value = deviceOrientation.gamma; |
| 140 } | 157 } |
| 141 | 158 |
| 142 if (modificationSource != WebInspector.SensorsView.DeviceOrientationModi ficationSource.UserDrag) | 159 if (modificationSource != WebInspector.SensorsView.DeviceOrientationModi ficationSource.UserDrag) |
| 143 this._setBoxOrientation(deviceOrientation); | 160 this._setBoxOrientation(deviceOrientation); |
| 144 | 161 |
| 145 var value = deviceOrientation.toSetting(); | 162 this._deviceOrientation = deviceOrientation; |
| 146 WebInspector.overridesSupport.settings.deviceOrientationOverride.set(val ue); | 163 this._applyDeviceOrientation(); |
| 147 }, | 164 }, |
| 148 | 165 |
| 149 /** | 166 /** |
| 150 * @param {!Element} parentElement | 167 * @param {!Element} parentElement |
| 151 * @param {string} id | 168 * @param {string} id |
| 152 * @param {string} label | 169 * @param {string} label |
| 153 * @param {string} defaultText | 170 * @param {string} defaultText |
| 154 * @return {!Element} | 171 * @return {!Element} |
| 155 */ | 172 */ |
| 156 _createAxisInput: function(parentElement, id, label, defaultText) | 173 _createAxisInput: function(parentElement, id, label, defaultText) |
| 157 { | 174 { |
| 158 var div = parentElement.createChild("div", "accelerometer-axis-input-con tainer"); | 175 var div = parentElement.createChild("div", "accelerometer-axis-input-con tainer"); |
| 159 div.createTextChild(label); | 176 div.createTextChild(label); |
| 160 return WebInspector.SettingsUI.createInput(div, id, defaultText, this._a pplyDeviceOrientationUserInput.bind(this), true); | 177 return WebInspector.SettingsUI.createInput(div, id, defaultText, this._a pplyDeviceOrientationUserInput.bind(this), true); |
| 161 }, | 178 }, |
| 162 | 179 |
| 163 /** | 180 /** |
| 164 * @param {!WebInspector.OverridesSupport.DeviceOrientation} deviceOrientati on | 181 * @param {!WebInspector.DeviceOrientation} deviceOrientation |
| 165 */ | 182 */ |
| 166 _createDeviceOrientationOverrideElement: function(deviceOrientation) | 183 _createDeviceOrientationOverrideElement: function(deviceOrientation) |
| 167 { | 184 { |
| 168 var fieldsetElement = createElement("fieldset"); | 185 var fieldsetElement = createElement("fieldset"); |
| 169 fieldsetElement.classList.add("device-orientation-override-section"); | 186 fieldsetElement.classList.add("device-orientation-override-section"); |
| 170 var tableElement = fieldsetElement.createChild("table"); | 187 var tableElement = fieldsetElement.createChild("table"); |
| 171 var rowElement = tableElement.createChild("tr"); | 188 var rowElement = tableElement.createChild("tr"); |
| 172 var cellElement = rowElement.createChild("td", "accelerometer-inputs-cel l"); | 189 var cellElement = rowElement.createChild("td", "accelerometer-inputs-cel l"); |
| 173 | 190 |
| 174 this._alphaElement = this._createAxisInput(cellElement, "device-orientat ion-override-alpha", "\u03B1: ", String(deviceOrientation.alpha)); | 191 this._alphaElement = this._createAxisInput(cellElement, "device-orientat ion-override-alpha", "\u03B1: ", String(deviceOrientation.alpha)); |
| (...skipping 11 matching lines...) Expand all Loading... | |
| 186 this._boxElement.createChild("section", "left"); | 203 this._boxElement.createChild("section", "left"); |
| 187 this._boxElement.createChild("section", "right"); | 204 this._boxElement.createChild("section", "right"); |
| 188 this._boxElement.createChild("section", "bottom"); | 205 this._boxElement.createChild("section", "bottom"); |
| 189 | 206 |
| 190 WebInspector.installDragHandle(this._stageElement, this._onBoxDragStart. bind(this), this._onBoxDrag.bind(this), this._onBoxDragEnd.bind(this), "move"); | 207 WebInspector.installDragHandle(this._stageElement, this._onBoxDragStart. bind(this), this._onBoxDrag.bind(this), this._onBoxDragEnd.bind(this), "move"); |
| 191 this._setBoxOrientation(deviceOrientation); | 208 this._setBoxOrientation(deviceOrientation); |
| 192 return fieldsetElement; | 209 return fieldsetElement; |
| 193 }, | 210 }, |
| 194 | 211 |
| 195 /** | 212 /** |
| 196 * @param {!WebInspector.OverridesSupport.DeviceOrientation} deviceOrientati on | 213 * @param {!WebInspector.DeviceOrientation} deviceOrientation |
| 197 */ | 214 */ |
| 198 _setBoxOrientation: function(deviceOrientation) | 215 _setBoxOrientation: function(deviceOrientation) |
| 199 { | 216 { |
| 200 var matrix = new WebKitCSSMatrix(); | 217 var matrix = new WebKitCSSMatrix(); |
| 201 this._boxMatrix = matrix.rotate(-deviceOrientation.beta, deviceOrientati on.gamma, -deviceOrientation.alpha); | 218 this._boxMatrix = matrix.rotate(-deviceOrientation.beta, deviceOrientati on.gamma, -deviceOrientation.alpha); |
| 202 this._boxElement.style.webkitTransform = this._boxMatrix.toString(); | 219 this._boxElement.style.webkitTransform = this._boxMatrix.toString(); |
| 203 }, | 220 }, |
| 204 | 221 |
| 205 /** | 222 /** |
| 206 * @param {!MouseEvent} event | 223 * @param {!MouseEvent} event |
| 207 * @return {boolean} | 224 * @return {boolean} |
| 208 */ | 225 */ |
| 209 _onBoxDrag: function(event) | 226 _onBoxDrag: function(event) |
| 210 { | 227 { |
| 211 var mouseMoveVector = this._calculateRadiusVector(event.x, event.y); | 228 var mouseMoveVector = this._calculateRadiusVector(event.x, event.y); |
| 212 if (!mouseMoveVector) | 229 if (!mouseMoveVector) |
| 213 return true; | 230 return true; |
| 214 | 231 |
| 215 event.consume(true); | 232 event.consume(true); |
| 216 var axis = WebInspector.Geometry.crossProduct(this._mouseDownVector, mou seMoveVector); | 233 var axis = WebInspector.Geometry.crossProduct(this._mouseDownVector, mou seMoveVector); |
| 217 axis.normalize(); | 234 axis.normalize(); |
| 218 var angle = WebInspector.Geometry.calculateAngle(this._mouseDownVector, mouseMoveVector); | 235 var angle = WebInspector.Geometry.calculateAngle(this._mouseDownVector, mouseMoveVector); |
| 219 var matrix = new WebKitCSSMatrix(); | 236 var matrix = new WebKitCSSMatrix(); |
| 220 var rotationMatrix = matrix.rotateAxisAngle(axis.x, axis.y, axis.z, angl e); | 237 var rotationMatrix = matrix.rotateAxisAngle(axis.x, axis.y, axis.z, angl e); |
| 221 this._currentMatrix = rotationMatrix.multiply(this._boxMatrix); | 238 this._currentMatrix = rotationMatrix.multiply(this._boxMatrix); |
| 222 this._boxElement.style.webkitTransform = this._currentMatrix; | 239 this._boxElement.style.webkitTransform = this._currentMatrix; |
| 223 var eulerAngles = WebInspector.Geometry.EulerAngles.fromRotationMatrix(t his._currentMatrix); | 240 var eulerAngles = WebInspector.Geometry.EulerAngles.fromRotationMatrix(t his._currentMatrix); |
| 224 var newOrientation = new WebInspector.OverridesSupport.DeviceOrientation (-eulerAngles.alpha, -eulerAngles.beta, eulerAngles.gamma); | 241 var newOrientation = new WebInspector.DeviceOrientation(-eulerAngles.alp ha, -eulerAngles.beta, eulerAngles.gamma); |
| 225 this._setDeviceOrientation(newOrientation, WebInspector.SensorsView.Devi ceOrientationModificationSource.UserDrag); | 242 this._setDeviceOrientation(newOrientation, WebInspector.SensorsView.Devi ceOrientationModificationSource.UserDrag); |
| 226 return false; | 243 return false; |
| 227 }, | 244 }, |
| 228 | 245 |
| 229 /** | 246 /** |
| 230 * @param {!MouseEvent} event | 247 * @param {!MouseEvent} event |
| 231 * @return {boolean} | 248 * @return {boolean} |
| 232 */ | 249 */ |
| 233 _onBoxDragStart: function(event) | 250 _onBoxDragStart: function(event) |
| 234 { | 251 { |
| (...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 301 * @param {!WebInspector.Context} context | 318 * @param {!WebInspector.Context} context |
| 302 * @param {string} actionId | 319 * @param {string} actionId |
| 303 * @return {boolean} | 320 * @return {boolean} |
| 304 */ | 321 */ |
| 305 handleAction: function(context, actionId) | 322 handleAction: function(context, actionId) |
| 306 { | 323 { |
| 307 WebInspector.inspectorView.showViewInDrawer("sensors"); | 324 WebInspector.inspectorView.showViewInDrawer("sensors"); |
| 308 return true; | 325 return true; |
| 309 } | 326 } |
| 310 } | 327 } |
| OLD | NEW |