Doni/ModelHandle
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Introduce camera settings class.

Browse Source
This commit is contained in:
kovacsv 2023-10-14 08:33:51 +02:00
parent 34a64b5d83
commit 37a21aab36
12 changed files with 67 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
source/engine/parameters/parameterlist.js
View File

@ -56,7 +56,7 @@ export let ParameterConverter =
return cameraParameters;
},
CameraModeToString : function (projectionMode)
ProjectionModeToString : function (projectionMode)
{
if (projectionMode === ProjectionMode.Perspective) {
return 'perspective';
@ -90,7 +90,7 @@ export let ParameterConverter =
return camera;
},
StringToCameraMode : function (str)
StringToProjectionMode : function (str)
{
if (str === 'perspective') {
return ProjectionMode.Perspective;
@ -245,9 +245,9 @@ export class ParameterListBuilder
return this;
}
AddCameraMode (projectionMode)
AddProjectionMode (projectionMode)
{
this.AddUrlPart ('projectionmode', ParameterConverter.CameraModeToString (projectionMode));
this.AddUrlPart ('projectionmode', ParameterConverter.ProjectionModeToString (projectionMode));
return this;
}
@ -317,13 +317,13 @@ export class ParameterListParser
return ParameterConverter.StringToCamera (keywordParams);
}
GetCameraMode ()
GetProjectionMode ()
{
let keywordParams = this.GetKeywordParams ('cameramode'); // for compatibility
if (keywordParams === null) {
keywordParams = this.GetKeywordParams ('projectionmode');
}
return ParameterConverter.StringToCameraMode (keywordParams);
return ParameterConverter.StringToProjectionMode (keywordParams);
}
GetEnvironmentSettings ()

4
source/engine/viewer/embeddedviewer.js
View File

@ -48,7 +48,7 @@ export class EmbeddedViewer
this.viewer.Resize (width, height);
if (this.parameters.projectionMode) {
this.viewer.SetCameraMode (this.parameters.projectionMode);
this.viewer.SetProjectionMode (this.parameters.projectionMode);
}
if (this.parameters.backgroundColor) {
@ -260,7 +260,7 @@ export function Init3DViewerElements (onReady)
let projectionMode = null;
let cameraModeParams = element.getAttribute ('projectionmode');
if (cameraModeParams) {
projectionMode = ParameterConverter.StringToCameraMode (cameraModeParams);
projectionMode = ParameterConverter.StringToProjectionMode (cameraModeParams);
}
let backgroundColor = null;

2
source/engine/viewer/shadingmodel.js
View File

@ -60,7 +60,7 @@ export class ShadingModel
this.UpdateShading ();
}
SetCameraMode (projectionMode)
SetProjectionMode (projectionMode)
{
this.projectionMode = projectionMode;
this.UpdateShading ();

6
source/engine/viewer/viewer.js
View File

@ -260,7 +260,7 @@ export class Viewer
return this.navigation.GetCamera ();
}
GetCameraMode ()
GetProjectionMode ()
{
return this.projectionMode;
}
@ -272,7 +272,7 @@ export class Viewer
this.Render ();
}
SetCameraMode (projectionMode)
SetProjectionMode (projectionMode)
{
if (this.projectionMode === projectionMode) {
return;
@ -287,7 +287,7 @@ export class Viewer
this.scene.add (this.camera);
this.projectionMode = projectionMode;
this.shadingModel.SetCameraMode (projectionMode);
this.shadingModel.SetProjectionMode (projectionMode);
this.cameraValidator.ForceUpdate ();
this.AdjustClippingPlanes ();

4
source/website/embed.js
View File

@ -51,9 +51,9 @@ export class Embed
let environmentSettings = new EnvironmentSettings (envMapTextures, bgIsEnvMap);
this.viewer.SetEnvironmentMapSettings (environmentSettings);
let projectionMode = this.hashHandler.GetCameraModeFromHash ();
let projectionMode = this.hashHandler.GetProjectionModeFromHash ();
if (projectionMode !== null) {
this.viewer.SetCameraMode (projectionMode);
this.viewer.SetProjectionMode (projectionMode);
}
let background = this.hashHandler.GetBackgroundFromHash ();
if (background !== null) {

4
source/website/hashhandler.js
View File

@ -48,10 +48,10 @@ export class HashHandler
return parser.GetCamera ();
}
GetCameraModeFromHash ()
GetProjectionModeFromHash ()
{
let parser = CreateUrlParser (this.GetHash ());
return parser.GetCameraMode ();
return parser.GetProjectionMode ();
}
GetBackgroundFromHash ()

22
source/website/settings.js
View File

@ -1,3 +1,4 @@
import { NavigationMode, ProjectionMode } from '../engine/viewer/camera.js';
import { RGBAColor, RGBColor } from '../engine/model/color.js';
import { EdgeSettings } from '../engine/viewer/viewermodel.js';
import { CookieGetBoolVal, CookieGetRGBColorVal, CookieGetIntVal, CookieGetStringVal, CookieSetBoolVal, CookieSetRGBColorVal, CookieSetIntVal, CookieSetStringVal, CookieSetRGBAColorVal, CookieGetRGBAColorVal } from './cookiehandler.js';
@ -49,3 +50,24 @@ export class Settings
CookieSetIntVal ('ov_edge_threshold', this.edgeSettings.edgeThreshold);
}
}
export class CameraSettings
{
constructor ()
{
this.navigationMode = NavigationMode.FixedUpVector;
this.projectionMode = ProjectionMode.Perspective;
}
LoadFromCookies ()
{
this.navigationMode = CookieGetIntVal ('ov_navigation_mode', NavigationMode.FixedUpVector);
this.projectionMode = CookieGetIntVal ('ov_projection_mode', ProjectionMode.Perspective);
}
SaveToCookies ()
{
CookieSetIntVal ('ov_navigation_mode', this.navigationMode);
CookieSetIntVal ('ov_projection_mode', this.projectionMode);
}
}

2
source/website/sharingdialog.js
View File

@ -63,7 +63,7 @@ export function ShowSharingDialog (fileList, settings, viewer)
builder.AddModelUrls (modelFiles);
if (useCurrentSettings) {
builder.AddCamera (viewer.GetCamera ());
builder.AddCameraMode (viewer.GetCameraMode ());
builder.AddProjectionMode (viewer.GetProjectionMode ());
let environmentSettings = {
environmentMapName : settings.environmentMapName,
backgroundIsEnvMap : settings.backgroundIsEnvMap

4
source/website/sidebar.js
View File

@ -45,8 +45,8 @@ export class Sidebar
getShadingType : () => {
return this.callbacks.getShadingType ();
},
getCameraMode : () => {
return this.callbacks.getCameraMode ();
getProjectionMode : () => {
return this.callbacks.getProjectionMode ();
},
hasDefaultMaterial : () => {
return this.callbacks.hasDefaultMaterial ();

16
source/website/sidebarsettingspanel.js
View File

@ -121,7 +121,7 @@ class EnvironmentMapPopup extends PopupDialog
});
}
} else if (shadingType === ShadingType.Physical) {
let isPerspective = (callbacks.getCameraMode () === ProjectionMode.Perspective);
let isPerspective = (callbacks.getProjectionMode () === ProjectionMode.Perspective);
if (isPerspective) {
let checkboxDiv = AddDiv (contentDiv, 'ov_environment_map_checkbox');
let backgroundIsEnvMapCheckbox = AddCheckbox (checkboxDiv, 'use_as_background', 'Use as background image', settings.backgroundIsEnvMap, () => {
@ -232,8 +232,8 @@ class SettingsModelDisplaySection extends SettingsSection
this.environmentMapPhongInput.addEventListener ('click', () => {
this.environmentMapPopup = new EnvironmentMapPopup ();
this.environmentMapPopup.ShowPopup (this.environmentMapPhongInput, ShadingType.Phong, this.settings, {
getCameraMode : () => {
return this.callbacks.getCameraMode ();
getProjectionMode : () => {
return this.callbacks.getProjectionMode ();
},
onEnvironmentMapChanged : () => {
this.UpdateEnvironmentMap ();
@ -248,8 +248,8 @@ class SettingsModelDisplaySection extends SettingsSection
this.environmentMapPbrInput.addEventListener ('click', () => {
this.environmentMapPopup = new EnvironmentMapPopup ();
this.environmentMapPopup.ShowPopup (this.environmentMapPbrInput, ShadingType.Physical, this.settings, {
getCameraMode : () => {
return this.callbacks.getCameraMode ();
getProjectionMode : () => {
return this.callbacks.getProjectionMode ();
},
onEnvironmentMapChanged : () => {
this.UpdateEnvironmentMap ();
@ -345,7 +345,7 @@ class SettingsModelDisplaySection extends SettingsSection
{
let isPhysicallyBased = (this.callbacks.getShadingType () === ShadingType.Physical);
if (this.environmentMapPhongDiv !== null) {
let isPerspective = (this.callbacks.getCameraMode () === ProjectionMode.Perspective);
let isPerspective = (this.callbacks.getProjectionMode () === ProjectionMode.Perspective);
ShowDomElement (this.environmentMapPhongDiv, !isPhysicallyBased && isPerspective);
}
if (this.environmentMapPbrDiv !== null) {
@ -462,8 +462,8 @@ export class SidebarSettingsPanel extends SidebarPanel
getShadingType : () => {
return this.callbacks.getShadingType ();
},
getCameraMode : () => {
return this.callbacks.getCameraMode ();
getProjectionMode : () => {
return this.callbacks.getProjectionMode ();
},
onEnvironmentMapChanged : () => {
this.callbacks.onEnvironmentMapChanged ();

21
source/website/website.js
View File

@ -9,7 +9,7 @@ import { CalculatePopupPositionToScreen, ShowListPopup } from './dialogs.js';
import { HandleEvent } from './eventhandler.js';
import { HashHandler } from './hashhandler.js';
import { Navigator, Selection, SelectionType } from './navigator.js';
import { Settings, Theme } from './settings.js';
import { CameraSettings, Settings, Theme } from './settings.js';
import { Sidebar } from './sidebar.js';
import { ThemeHandler } from './themehandler.js';
import { ThreeModelLoaderUI } from './threemodelloaderui.js';
@ -187,6 +187,7 @@ export class Website
{
this.parameters = parameters;
this.settings = new Settings (Theme.Light);
this.cameraSettings = new CameraSettings ();
this.viewer = new Viewer ();
this.measureTool = new MeasureTool (this.viewer, this.settings);
this.hashHandler = new HashHandler ();
@ -204,6 +205,8 @@ export class Website
Load ()
{
this.settings.LoadFromCookies ();
this.cameraSettings.LoadFromCookies ();
this.SwitchTheme (this.settings.themeId, false);
HandleEvent ('theme_on_load', this.settings.themeId === Theme.Light ? 'light' : 'dark');
@ -675,18 +678,22 @@ export class Website
AddSeparator (this.toolbar, ['only_full_width', 'only_on_model']);
AddRadioButton (this.toolbar, ['fix_up_on', 'fix_up_off'], ['Fixed up vector', 'Free orbit'], 0, ['only_full_width', 'only_on_model'], (buttonIndex) => {
if (buttonIndex === 0) {
this.viewer.SetNavigationMode (NavigationMode.FixedUpVector);
this.cameraSettings.navigationMode = NavigationMode.FixedUpVector;
} else if (buttonIndex === 1) {
this.viewer.SetNavigationMode (NavigationMode.FreeOrbit);
this.cameraSettings.navigationMode = NavigationMode.FreeOrbit;
}
this.cameraSettings.SaveToCookies ();
this.viewer.SetNavigationMode (this.cameraSettings.navigationMode);
});
AddSeparator (this.toolbar, ['only_full_width', 'only_on_model']);
AddRadioButton (this.toolbar, ['camera_perspective', 'camera_orthographic'], ['Perspective camera', 'Orthographic camera'], 0, ['only_full_width', 'only_on_model'], (buttonIndex) => {
if (buttonIndex === 0) {
this.viewer.SetCameraMode (ProjectionMode.Perspective);
this.cameraSettings.projectionMode = ProjectionMode.Perspective;
} else if (buttonIndex === 1) {
this.viewer.SetCameraMode (ProjectionMode.Orthographic);
this.cameraSettings.projectionMode = ProjectionMode.Orthographic;
}
this.cameraSettings.SaveToCookies ();
this.viewer.SetProjectionMode (this.cameraSettings.projectionMode);
this.sidebar.UpdateControlsVisibility ();
});
AddSeparator (this.toolbar, ['only_full_width', 'only_on_model']);
@ -780,8 +787,8 @@ export class Website
getShadingType : () => {
return this.viewer.GetShadingType ();
},
getCameraMode : () => {
return this.viewer.GetCameraMode ();
getProjectionMode : () => {
return this.viewer.GetProjectionMode ();
},
hasDefaultMaterial : () => {
return HasDefaultMaterial (this.model);

8
test/tests/parameterlist_test.js
View File

@ -45,11 +45,11 @@ describe ('Parameter List', function () {
assert.strictEqual (urlParams, 'edgesettings=on,1,2,3,15');
}
{
let urlParams = OV.CreateUrlBuilder ().AddCameraMode (OV.ProjectionMode.Perspective).GetParameterList ();
let urlParams = OV.CreateUrlBuilder ().AddProjectionMode (OV.ProjectionMode.Perspective).GetParameterList ();
assert.strictEqual (urlParams, 'projectionmode=perspective');
}
{
let urlParams = OV.CreateUrlBuilder ().AddCameraMode (OV.ProjectionMode.Orthographic).GetParameterList ();
let urlParams = OV.CreateUrlBuilder ().AddProjectionMode (OV.ProjectionMode.Orthographic).GetParameterList ();
assert.strictEqual (urlParams, 'projectionmode=orthographic');
}
});
@ -124,11 +124,11 @@ describe ('Parameter List', function () {
}
{
let parser = OV.CreateUrlParser ('projectionmode=perspective');
assert.deepStrictEqual (parser.GetCameraMode (), OV.ProjectionMode.Perspective);
assert.deepStrictEqual (parser.GetProjectionMode (), OV.ProjectionMode.Perspective);
}
{
let parser = OV.CreateUrlParser ('projectionmode=orthographic');
assert.deepStrictEqual (parser.GetCameraMode (), OV.ProjectionMode.Orthographic);
assert.deepStrictEqual (parser.GetProjectionMode (), OV.ProjectionMode.Orthographic);
}
});
});