ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add keyboard controls to side-by-side demo

Browse Source
This commit is contained in:
Tom Payne
2012-08-07 14:55:49 +02:00
parent 49dc2788d5
commit afe85dd620
2 changed files with 65 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
demos/side-by-side/index.html.in
View File

@@ -40,6 +40,26 @@
<td>Rotate:</td>
<td>shift+drag (WebGL only)</td>
</tr>
<tr>
<td>Brightness/contrast:</td>
<td><code>b</code>/<code>B</code>/<code>c</code>/<code>C</code> keys (WebGL only)</td>
</tr>
<tr>
<td>Hue/saturation:</td>
<td><code>h</code>/<code>H</code>/<code>s</code>/<code>S</code> keys (WebGL only)</td>
</tr>
<tr>
<td>Opacity:</td>
<td><code>o</code>/<code>O</code> keys</td>
</tr>
<tr>
<td>Visibility:</td>
<td><code>v</code>/<code>V</code> keys</td>
</tr>
<tr>
<td>Reset</td>
<td><code>0</code> key</td>
</tr>
</table>
<script src="@SRC@" type="text/javascript"></script>
</body>

45
demos/side-by-side/side-by-side.js
View File

@@ -1,4 +1,5 @@
goog.require('ol.RendererHint');
goog.require('ol.control.Keyboard');
goog.require('ol.createMap');
goog.require('ol.layer.MapQuestOpenAerial');
goog.require('ol.view.Attribution');
@@ -29,6 +30,50 @@ var attributionView = new ol.view.Attribution(domMap);
document.getElementById('attribution').appendChild(
attributionView.getElement());
var keyboardControl = new ol.control.Keyboard();
keyboardControl.addCallback('0', function() {
layer.setBrightness(0);
layer.setContrast(0);
layer.setHue(0);
layer.setSaturation(0);
layer.setOpacity(1);
layer.setVisible(true);
});
keyboardControl.addCallback('b', function() {
layer.setBrightness(layer.getBrightness() - 0.1);
});
keyboardControl.addCallback('B', function() {
layer.setBrightness(layer.getBrightness() + 0.1);
});
keyboardControl.addCallback('c', function() {
layer.setContrast(layer.getContrast() - 0.1);
});
keyboardControl.addCallback('C', function() {
layer.setContrast(layer.getContrast() + 0.1);
});
keyboardControl.addCallback('h', function() {
layer.setHue(layer.getHue() - 0.1);
});
keyboardControl.addCallback('H', function() {
layer.setHue(layer.getHue() + 0.1);
});
keyboardControl.addCallback('o', function() {
layer.setOpacity(layer.getOpacity() - 0.1);
});
keyboardControl.addCallback('O', function() {
layer.setOpacity(layer.getOpacity() + 0.1);
});
keyboardControl.addCallback('s', function() {
layer.setSaturation(layer.getSaturation() - 0.1);
});
keyboardControl.addCallback('S', function() {
layer.setSaturation(layer.getSaturation() + 0.1);
});
keyboardControl.addCallback('vV', function() {
layer.setVisible(!layer.getVisible());
});
domMap.getControls().push(keyboardControl);
goog.exportSymbol('layer', layer);
goog.exportSymbol('layers', layers);
goog.exportSymbol('domMap', domMap);