CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-05-20 23:44:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

Dispatch new dimensions with photoview resize, resize all layers

Browse Source 
-Adds ability to resize OpenStreetCam and Bing Streetside layers
-Also slightly increases the width of the resize handles
-Also limits max resize so it won't go larger than the map
This commit is contained in:
Bryan Housel
2018-07-17 17:05:08 -04:00
parent b9a6996048
commit e221dcae58
4 changed files with 95 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/services/openstreetcam.js
+27 -17
View File
@@ -34,17 +34,17 @@ import {
} from '../util';
var apibase = 'https://openstreetcam.org',
maxResults = 1000,
tileZoom = 14,
dispatch = d3_dispatch('loadedImages'),
imgZoom = d3_zoom()
.extent([[0, 0], [320, 240]])
.translateExtent([[0, 0], [320, 240]])
.scaleExtent([1, 15])
.on('zoom', zoomPan),
_oscCache,
_oscSelectedImage;
var apibase = 'https://openstreetcam.org';
var maxResults = 1000;
var tileZoom = 14;
var dispatch = d3_dispatch('loadedImages');
var imgZoom = d3_zoom()
.extent([[0, 0], [320, 240]])
.translateExtent([[0, 0], [320, 240]])
.scaleExtent([1, 15])
.on('zoom', zoomPan);
var _oscCache;
var _oscSelectedImage;
function abortRequest(i) {
@@ -129,12 +129,12 @@ function loadNextTilePage(which, currZoom, url, tile) {
var maxPages = maxPageAtZoom(currZoom);
var nextPage = cache.nextPage[tile.id] || 1;
var params = utilQsString({
ipp: maxResults,
page: nextPage,
// client_id: clientId,
bbTopLeft: [bbox.maxY, bbox.minX].join(','),
bbBottomRight: [bbox.minY, bbox.maxX].join(',')
}, true);
ipp: maxResults,
page: nextPage,
// client_id: clientId,
bbTopLeft: [bbox.maxY, bbox.minX].join(','),
bbBottomRight: [bbox.minY, bbox.maxX].join(',')
}, true);
if (nextPage > maxPages) return;
@@ -367,6 +367,16 @@ export default {
.attr('class', 'osc-image-wrap');
// Register viewer resize handler
context.ui().on('photoviewerResize', function(dimensions) {
imgZoom = d3_zoom()
.extent([[0, 0], dimensions])
.translateExtent([[0, 0], dimensions])
.scaleExtent([1, 15])
.on('zoom', zoomPan);
});
function rotate(deg) {
return function() {
if (!_oscSelectedImage) return;
modules/services/streetside.js
+8
View File
@@ -669,6 +669,14 @@ export default {
.attr('src', context.asset(pannellumViewerJS));
// Register viewer resize handler
context.ui().on('photoviewerResize', function() {
if (_pannellumViewer) {
_pannellumViewer.resize();
}
});
function step(stepBy) {
return function() {
var viewer = d3_select('#photoviewer');
modules/ui/init.js
+52 -42
View File
@@ -44,46 +44,6 @@ import { uiVersion } from './version';
import { uiZoom } from './zoom';
import { uiCmd } from './cmd';
function buildResizeListener(target, eventName, dispatch, options) {
var resizeOnX = !!options.resizeOnX;
var resizeOnY = !!options.resizeOnY;
var minHeight = options.minHeight || 240;
var minWidth = options.minWidth || 320;
var startX;
var startY;
var startWidth;
var startHeight;
function startResize() {
if (resizeOnX) {
var newWidth = Math.max(minWidth, startWidth + d3_event.clientX - startX);
target.style('width', newWidth + 'px');
}
if (resizeOnY) {
var newHeight = Math.max(minHeight, startHeight + startY - d3_event.clientY);
target.style('height', newHeight + 'px');
}
dispatch.call(eventName, target);
}
function stopResize() {
d3_select(window)
.on('.' + eventName, null);
}
return function initResize() {
startX = d3_event.clientX;
startY = d3_event.clientY;
startWidth = target.node().getBoundingClientRect().width;
startHeight = target.node().getBoundingClientRect().height;
d3_select(window)
.on('mousemove.' + eventName, startResize, false)
.on('mouseup.' + eventName, stopResize, false);
};
}
export function uiInit(context) {
var uiInitCounter = 0;
@@ -382,8 +342,8 @@ export function uiInit(context) {
.call(uiShortcuts(context));
}
var osm = context.connection(),
auth = uiLoading(context).message(t('loading_auth')).blocking(true);
var osm = context.connection();
var auth = uiLoading(context).message(t('loading_auth')).blocking(true);
if (osm && auth) {
osm
@@ -402,6 +362,56 @@ export function uiInit(context) {
hash.startWalkthrough = false;
context.container().call(uiIntro(context));
}
function buildResizeListener(target, eventName, dispatch, options) {
var resizeOnX = !!options.resizeOnX;
var resizeOnY = !!options.resizeOnY;
var minHeight = options.minHeight || 240;
var minWidth = options.minWidth || 320;
var startX;
var startY;
var startWidth;
var startHeight;
function startResize() {
var mapSize = context.map().dimensions();
if (resizeOnX) {
var maxWidth = mapSize[0];
var newWidth = clamp((startWidth + d3_event.clientX - startX), minWidth, maxWidth);
target.style('width', newWidth + 'px');
}
if (resizeOnY) {
var maxHeight = mapSize[1] - 90; // preserve space at top/bottom of map
var newHeight = clamp((startHeight + startY - d3_event.clientY), minHeight, maxHeight);
target.style('height', newHeight + 'px');
}
dispatch.call(eventName, target, utilGetDimensions(target, true));
}
function clamp(num, min, max) {
return Math.max(min, Math.min(num, max));
}
function stopResize() {
d3_select(window)
.on('.' + eventName, null);
}
return function initResize() {
startX = d3_event.clientX;
startY = d3_event.clientY;
startWidth = target.node().getBoundingClientRect().width;
startHeight = target.node().getBoundingClientRect().height;
d3_select(window)
.on('mousemove.' + eventName, startResize, false)
.on('mouseup.' + eventName, stopResize, false);
};
}
}