Changed export/render mode switch to tabs (2494dde4) · Commits · GREYC-DDA / IVOIRe

index.html

+30 −7

Changes for index.html: 30 added lines, 7 removed lines.
Original line number	Diff line number	Diff line
		@@ -46,7 +46,21 @@
		</header>

		<div class="controls" v-cloak>
		<label v-show="phase === 'render'" for="select-rendermode"><span v-t="controls.rendermode"></span>
		<div class="tab-buttons">
		<button @click="fn.setExportPhase(false)"
		:class="{selected: phase === 'render'}"
		:disabled="phase !== 'export'">
		<span v-icon.self="light"></span> Light
		</button>
		<button @click="fn.setExportPhase(true)"
		:class="{selected: phase === 'export'}"
		:disabled="phase !== 'render'">
		<span v-icon.self="export"></span> Export
		</button>
		</div>
		<div class="render-controls">
		<label v-show="phase === 'render'" for="select-rendermode">
		<span v-t="controls.rendermode"></span>
		<span v-t="colon"></span></label>
		<select v-show="phase === 'render'" name="rendermode" id="select-rendermode">
		<option value="relight" v-t="controls.mode.relight"></option>
		@@ -95,6 +109,7 @@
		@click="fn.resetControls"></button>
		<label for="button-reset-controls" v-t="controls.reset"></label>
		</span>
		</div>
		<div class="export-panel" v-show="phase === 'export'">
		<div class="export-area-matrix">
		<div></div>
		@@ -133,20 +148,28 @@
		@click="fn.setExportParams('view')"></button> <span v-t="export.settoview"></span></span>
		<span><button class="btn-dark btn-icon" v-icon="zoom-fit"
		@click="fn.setExportParams('full')"></button> <span v-t="export.settofull"></span></span>
		<span>Zoom:
		<span>Zoom: <br>
		<label><input type="radio" v-model="exportParams.zoomtype"
		value="highest" name="zoom-highest">Highest</label><br>
		<label><input type="radio" v-model="exportParams.zoomtype"
		value="view" name="zoom-view">View</label><br>
		<label><input type="radio" v-model="exportParams.zoomtype"
		value="manual" name="zoom-manual">Manual
		<input aria-label="Zoom numerator" type="number" name="export-zoom-num"
		min="1" max="1024" step="1"
		min="1" max="1024" step="1" :disabled="exportParams.zoomtype !== 'manual'"
		:value="exportParams.zoom[0]" @change="fn.setExportZoom(0, $el.value)"> :
		<input aria-label="Zoom denominator" type="number" name="export-zoom-denom"
		min="1" max="1024" step="1"
		min="1" max="1024" step="1" :disabled="exportParams.zoomtype !== 'manual'"
		:value="exportParams.zoom[1]" @change="fn.setExportZoom(1, $el.value)">
		</label>
		</span>
		<span>Export image size: {{fn.getExportSize().join(' : ')}}</span>
		</div>
		<span v-show="phase === 'render' \|\| phase === 'export'">
		<span>Export size: {{fn.getExportSize().join(' : ')}}</span>
		<span>Max export size: {{maxCanvasSize ? maxCanvasSize.join(' : ') : 'unknown'}}</span>
		<span>
		<button id="button-export" class="btn-dark btn-icon" @click="fn.exportImage()" v-icon="export"></button>
		<label for="button-export" v-t="export.button"></label>
		</span>
		</div>
		<hr>
		<div class="description-container">
		<div v-if="description">

public/icons.svg

+33 −0

Changes for public/icons.svg: 33 added lines, 0 removed lines.
Original line number	Diff line number	Diff line
		@@ -180,5 +180,38 @@
		style="stroke-width:16"/>
		</g>
		</g>
		<g
		id="g1071"
		transform="translate(384,128)">
		<g
		id="light"
		style="fill:none;stroke:currentColor;stroke-width:16;stroke-linecap:round;stroke-linejoin:round">
		<circle
		id="path9193"
		cx="64"
		cy="50.453339"
		r="32"
		style="stroke-width:16"/>
		<path
		d="M 24.402021,90.051321 13.088313,101.36503"
		id="path13922"/>
		<path
		d="M 49.506377,104.54428 45.36503,120"
		id="path14190"/>
		<path
		d="M 78.493625,104.54428 82.634973,120"
		id="path14382"/>
		<path
		d="m 103.59798,90.051319 11.31371,11.313711"
		id="path14650"/>
		<rect
		style="fill:currentColor;fill-opacity:1;stroke:none"
		id="rect15306"
		width="32"
		height="20"
		x="48"
		y="0"/>
		</g>
		</g>
		</g>
		</svg>

public/loading.svg

deleted100644 → 0

+0 −188

Changes for public/loading.svg: 0 added lines, 188 removed lines.
Original line number	Diff line number	Diff line
		<?xml version="1.0" encoding="UTF-8" standalone="no"?>
		<!-- Created with Inkscape (http://www.inkscape.org/) -->

		<svg
		width="512"
		height="512"
		viewBox="0 0 135.46666 135.46667"
		version="1.1"
		id="svg5"
		inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
		sodipodi:docname="loading.svg"
		inkscape:export-filename="/home/nevin211/DDA/IMAGE/IVOIRe/public/loading.png"
		inkscape:export-xdpi="96"
		inkscape:export-ydpi="96"
		xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
		xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
		xmlns="http://www.w3.org/2000/svg"
		xmlns:svg="http://www.w3.org/2000/svg">
		<sodipodi:namedview
		id="namedview7"
		pagecolor="#ffffff"
		bordercolor="#666666"
		borderopacity="1.0"
		inkscape:pageshadow="2"
		inkscape:pageopacity="0"
		inkscape:pagecheckerboard="true"
		inkscape:document-units="px"
		showgrid="false"
		units="px"
		width="512px"
		showguides="true"
		inkscape:guide-bbox="true"
		inkscape:snap-bbox="true"
		inkscape:bbox-paths="true"
		inkscape:bbox-nodes="true"
		inkscape:snap-bbox-edge-midpoints="true"
		inkscape:snap-bbox-midpoints="true"
		inkscape:snap-page="true"
		fit-margin-top="0"
		fit-margin-left="0"
		fit-margin-right="0"
		fit-margin-bottom="0"
		inkscape:zoom="1.5405608"
		inkscape:cx="230.43557"
		inkscape:cy="284.63661"
		inkscape:window-width="1916"
		inkscape:window-height="968"
		inkscape:window-x="1920"
		inkscape:window-y="110"
		inkscape:window-maximized="1"
		inkscape:current-layer="layer1"
		inkscape:object-paths="true"
		inkscape:snap-smooth-nodes="true"
		inkscape:snap-intersection-paths="true">
		<sodipodi:guide
		position="67.733332,135.46666"
		orientation="-1,0"
		id="guide824"
		inkscape:label=""
		inkscape:locked="false"
		inkscape:color="rgb(0,0,255)" />
		<sodipodi:guide
		position="67.935459,67.733332"
		orientation="0,1"
		id="guide834"
		inkscape:label=""
		inkscape:locked="false"
		inkscape:color="rgb(0,0,255)" />
		<sodipodi:guide
		position="33.866666,79.977398"
		orientation="-1,0"
		id="guide836"
		inkscape:label=""
		inkscape:locked="false"
		inkscape:color="rgb(0,0,255)" />
		<sodipodi:guide
		position="67.733327,101.7325"
		orientation="0,-1"
		id="guide1242" />
		<sodipodi:guide
		position="101.73249,64.09008"
		orientation="1,0"
		id="guide1244" />
		<sodipodi:guide
		position="67.733327,33.734172"
		orientation="0,-1"
		id="guide1246" />
		<sodipodi:guide
		position="67.733332,67.733332"
		orientation="0.70710678,0.70710678"
		id="guide1248"
		inkscape:label=""
		inkscape:locked="false"
		inkscape:color="rgb(0,0,255)" />
		<sodipodi:guide
		position="67.733332,67.733332"
		orientation="-0.70710678,0.70710678"
		id="guide1250"
		inkscape:label=""
		inkscape:locked="false"
		inkscape:color="rgb(0,0,255)" />
		</sodipodi:namedview>
		<defs
		id="defs2" />
		<g
		inkscape:label="Layer 1"
		inkscape:groupmode="layer"
		id="layer1">
		<g
		id="g847"
		style="opacity:0.3">
		<g
		id="g17500">
		<circle
		style="opacity:1;fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="path1012"
		cx="33.866665"
		cy="67.73333"
		r="8.4666662"
		inkscape:transform-center-x="33.866041"
		inkscape:transform-center-y="-0.00050965358" />
		<circle
		style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1414"
		cx="61.923271"
		cy="0.00029276416"
		r="8.4666662"
		inkscape:transform-center-x="23.94712"
		inkscape:transform-center-y="-23.947469"
		transform="rotate(45)" />
		<circle
		style="opacity:1;fill:#e6e6e6;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1416"
		cx="33.867455"
		cy="-67.733521"
		r="8.4666662"
		inkscape:transform-center-x="-0.00024344316"
		inkscape:transform-center-y="-33.866587"
		transform="rotate(90)" />
		<circle
		style="opacity:1;fill:#cccccc;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1418"
		cx="-33.866047"
		cy="-95.7901"
		r="8.4666662"
		inkscape:transform-center-x="-23.947465"
		inkscape:transform-center-y="-23.947123"
		transform="rotate(135)" />
		<circle
		style="opacity:1;fill:#b3b3b3;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1420"
		cx="-101.59986"
		cy="-67.734283"
		r="8.4666662"
		inkscape:transform-center-x="-33.866586"
		inkscape:transform-center-y="0.00024340043"
		transform="scale(-1)" />
		<circle
		style="opacity:1;fill:#999999;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1422"
		cx="-129.65645"
		cy="-0.00078338379"
		r="8.4666662"
		inkscape:transform-center-x="-23.947124"
		inkscape:transform-center-y="23.947469"
		transform="rotate(-135)" />
		<circle
		style="opacity:1;fill:#666666;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1424"
		cx="-101.60063"
		cy="67.733032"
		r="8.4666662"
		inkscape:transform-center-x="0.00024458426"
		inkscape:transform-center-y="33.866593"
		transform="rotate(-90)" />
		<circle
		style="opacity:1;fill:#333333;fill-opacity:1;stroke:#000000;stroke-width:4.23333;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;paint-order:stroke markers fill"
		id="circle1426"
		cx="-33.86713"
		cy="95.789612"
		inkscape:transform-center-x="23.947471"
		inkscape:transform-center-y="23.947122"
		transform="rotate(-45)"
		r="8.4666662" />
		</g>
		</g>
		</g>
		</svg>

src/app.ts

+23 −17

Changes for src/app.ts: 23 added lines, 17 removed lines.
Original line number	Diff line number	Diff line
		@@ -6,7 +6,7 @@ import {
		resizeCanvasToDisplaySize,
		SHADER_UPDATE_EVENT,
		shaderUpdateNotify,
		WebGLCanvasRenderingContext,
		WebGLCanvasRenderingContext
		} from './gl-program.ts';
		import { ControlUpdateEvent, getStateDefaults, LIGHT_ANGLE_DEFAULTS, State } from './control.ts';
		import {
		@@ -18,7 +18,7 @@ import {
		matToString,
		resetMessage,
		roundTo,
		VERBOSE,
		VERBOSE
		} from './utils.ts';
		import { DownloadManager } from './download.ts';
		import { Dataset, MemoryDataset, SingleDataset, TiledDataset } from './dataset.ts';
		@@ -52,7 +52,6 @@ export class App {
		public readonly rx: typeof this.DEFAULT_RX_STATE;
		public readonly rawRx: typeof this.DEFAULT_RX_STATE;
		private renderRequested = false;
		private maxCanvasSize: [number, number] \| undefined = undefined;
		public readonly gls: {
		readonly relight: WebGLCanvasRenderingContext;
		readonly lightball: WebGLCanvasRenderingContext;
		@@ -199,12 +198,13 @@ export class App {
		this.submitCreateMemoryDataset,
		this.cancelCreateMemoryDataset,
		this.onCreateMemoryFileInput,
		this.exportImage,
		this.onExportDialogClose,
		this.downloadExportImage,
		this.setExportParams,
		this.setExportZoom,
		this.getExportSize,
		this.setExportPhase,
		this.exportImage,
		this.onExportParamInput,
		this.requestRender,
		this.getCursorType,
		@@ -234,6 +234,7 @@ export class App {
		description: null as LocString \| null,
		output: null as string \| null,
		exportParams: App.DEFAULT_EXPORT_PARAMS,
		maxCanvasSize: undefined as [number, number] \| undefined,
		totalSize: [0, 0] as [number, number],
		lightballEdit: false,
		};
		@@ -243,7 +244,7 @@ export class App {
		return {
		area: new Rect(0, 0, 0, 0),
		zoom: [1, 1] as [number, number],
		zoomtype: 'int' as 'float' \| 'int' \| 'pow2',
		zoomtype: 'highest' as 'highest' \| 'view' \| 'manual',
		outerGrab: new Rect(0, 0, 0, 0),
		innerGrab: new Rect(0, 0, 0, 0),
		lockedDim: 'end',
		@@ -314,7 +315,7 @@ export class App {
		let sourcePromise = DownloadManager.withProgressBar(() =>
		ds.getTextureSource(this.gls.relight, () => this.requestRender(), abort),
		);
		if (this.maxCanvasSize === undefined) {
		if (this.rawRx.maxCanvasSize === undefined) {
		sourcePromise = Promise.all([sourcePromise, this.calculateMaxRenderSize()]).then(([s]) => s);
		}
		sourcePromise
		@@ -673,7 +674,7 @@ export class App {
		}

		private async calculateMaxRenderSize(): Promise<void> {
		if (this.maxCanvasSize !== undefined) return;
		if (this.rawRx.maxCanvasSize !== undefined) return;

		let canvas = [16384, 16384];
		try {
		@@ -683,8 +684,8 @@ export class App {
		}

		const webgl = this.gls.relight.getParameter(this.gls.relight.MAX_TEXTURE_SIZE) as number;
		this.maxCanvasSize = [Math.min(canvas[0], webgl), Math.min(canvas[1], webgl)];
		console.debug('Calculated max render size', this.maxCanvasSize);
		this.rx.maxCanvasSize = [Math.min(canvas[0], webgl), Math.min(canvas[1], webgl)];
		console.debug('Calculated max render size', this.rawRx.maxCanvasSize);
		}

		private setExportParams(from?: 'view' \| 'full' \| 'auto') {
		@@ -692,8 +693,8 @@ export class App {
		if (!source) return;
		if (!from \|\| from === 'auto')
		from =
		this.maxCanvasSize &&
		(source.totalSize[0] > this.maxCanvasSize[0] \|\| source.totalSize[1] > this.maxCanvasSize[1])
		this.rawRx.maxCanvasSize &&
		(source.totalSize[0] > this.rawRx.maxCanvasSize[0] \|\| source.totalSize[1] > this.rawRx.maxCanvasSize[1])
		? 'view'
		: 'full';
		let canvas = new Rect(0, 0, ...source.totalSize);
		@@ -774,16 +775,22 @@ export class App {
		this.requestRender();
		}

		private exportImage() {
		const source = this.source;
		if (!source \|\| !this.currentDataset \|\| !this.maxCanvasSize) return;
		if (this.rx.phase === 'render') {
		private setExportPhase(expt: boolean) {
		if (expt && this.rx.phase === 'render') {
		this.rx.phase = 'export';
		if (this.rx.exportParams.area.w === 0 \|\| this.rx.exportParams.area.h === 0) {
		this.setExportParams();
		}
		this.requestRender();
		} else if (this.rx.phase === 'export') {
		} else if (!expt && this.rx.phase === 'export') {
		this.rx.phase = 'render';
		this.requestRender();
		}
		}

		private exportImage() {
		const source = this.source;
		if (!source \|\| !this.currentDataset \|\| !this.rawRx.maxCanvasSize \|\| this.rx.phase !== 'export') return;
		const dataset = this.currentDataset.data;
		const exportedState = exportValues(this.state);
		const data: ExportWorkerData = {
		@@ -828,7 +835,6 @@ export class App {
		.catch(catchError(false))
		.finally(() => this.setDataset(this.lastDataset));
		}
		}

		public onExportDialogClose(exportImg: HTMLImageElement) {
		URL.revokeObjectURL(exportImg.src);

src/icons.inkscape.svg

+53 −7

Changes for src/icons.inkscape.svg: 53 added lines, 7 removed lines.
Original line number	Diff line number	Diff line
		@@ -27,15 +27,15 @@
		showgrid="true"
		width="1024px"
		units="px"
		inkscape:zoom="1.7923965"
		inkscape:cx="162.35247"
		inkscape:cy="170.4422"
		inkscape:zoom="3.569032"
		inkscape:cx="410.05516"
		inkscape:cy="196.27171"
		inkscape:window-width="1916"
		inkscape:window-height="968"
		inkscape:window-x="1920"
		inkscape:window-y="110"
		inkscape:window-maximized="1"
		inkscape:current-layer="close"
		inkscape:current-layer="light"
		showguides="true"
		inkscape:guide-bbox="true"
		inkscape:snap-bbox="true"
		@@ -43,17 +43,18 @@
		inkscape:snap-bbox-midpoints="true"
		inkscape:snap-bbox-edge-midpoints="true"
		inkscape:object-paths="true"
		inkscape:snap-intersection-paths="false"
		inkscape:snap-intersection-paths="true"
		inkscape:snap-page="true"
		inkscape:snap-global="true"
		inkscape:object-nodes="true"
		inkscape:bbox-nodes="true"
		inkscape:snap-smooth-nodes="true"
		inkscape:snap-midpoints="false"
		inkscape:snap-others="false"
		inkscape:snap-others="true"
		gridtolerance="20.9"
		borderlayer="false"
		showborder="true">
		showborder="true"
		inkscape:snap-center="true">
		<inkscape:grid
		type="xygrid"
		id="grid844"
		@@ -281,5 +282,50 @@
		style="stroke-width:16"/>
		</g>
		</g>
		<g
		id="g1071"
		transform="translate(384,128)">
		<g
		id="light"
		style="fill:none;stroke:currentColor;stroke-width:16;stroke-linecap:round;stroke-linejoin:round">
		<circle
		id="path9193"
		cx="64"
		cy="50.453339"
		r="32"
		style="stroke-width:16"/>
		<path
		d="M 24.402021,90.051321 13.088313,101.36503"
		id="path13922"
		sodipodi:nodetypes="cc"
		inkscape:transform-center-y="25.455845"
		inkscape:transform-center-x="25.455843"/>
		<path
		d="M 49.506377,104.54428 45.36503,120"
		id="path14190"
		sodipodi:nodetypes="cc"
		inkscape:transform-center-y="34.77333"
		inkscape:transform-center-x="9.317485"/>
		<path
		d="M 78.493625,104.54428 82.634973,120"
		id="path14382"
		sodipodi:nodetypes="cc"
		inkscape:transform-center-y="34.77333"
		inkscape:transform-center-x="-9.3174865"/>
		<path
		d="m 103.59798,90.051319 11.31371,11.313711"
		id="path14650"
		sodipodi:nodetypes="cc"
		inkscape:transform-center-y="25.455844"
		inkscape:transform-center-x="-25.455845"/>
		<rect
		style="fill:currentColor;fill-opacity:1;stroke:none"
		id="rect15306"
		width="32"
		height="20"
		x="48"
		y="0"/>
		</g>
		</g>
		</g>
		</svg>