Move website related code outside of the engine.

This commit is contained in:
kovacsv 2022-03-06 20:16:02 +01:00
parent 43d707ed8e
commit f4f6228426
6 changed files with 108 additions and 110 deletions

View File

@ -63,7 +63,7 @@ import { ModelToThreeConversionParams, ModelToThreeConversionOutput, ThreeConver
import { ThreeModelLoader } from './threejs/threemodelloader.js';
import { HasHighpDriverIssue, GetShadingType, ConvertThreeColorToColor, ConvertColorToThreeColor, ConvertThreeGeometryToMesh, ShadingType } from './threejs/threeutils.js';
import { Camera, CameraIsEqual3D } from './viewer/camera.js';
import { GetIntegerFromStyle, GetDomElementExternalWidth, GetDomElementExternalHeight, GetDomElementInnerDimensions, GetDomElementClientCoordinates, CreateDomElement, AddDomElement, AddDiv, ClearDomElement, InsertDomElementBefore, InsertDomElementAfter, ShowDomElement, IsDomElementVisible, SetDomElementWidth, SetDomElementHeight, GetDomElementOuterWidth, GetDomElementOuterHeight, SetDomElementOuterWidth, SetDomElementOuterHeight, AddCheckbox, AddRadioButton, AddRangeSlider, AddSelect, AddToggle, CreateDiv } from './viewer/domutils.js';
import { GetIntegerFromStyle, GetDomElementExternalWidth, GetDomElementExternalHeight, GetDomElementInnerDimensions, GetDomElementClientCoordinates, CreateDomElement, AddDomElement, AddDiv, ClearDomElement, InsertDomElementBefore, InsertDomElementAfter, ShowDomElement, IsDomElementVisible, SetDomElementWidth, SetDomElementHeight, GetDomElementOuterWidth, GetDomElementOuterHeight, SetDomElementOuterWidth, SetDomElementOuterHeight, CreateDiv } from './viewer/domutils.js';
import { EmbeddedViewer, Init3DViewerElement, Init3DViewerElements } from './viewer/embeddedviewer.js';
import { MouseInteraction, TouchInteraction, ClickDetector, Navigation, NavigationType } from './viewer/navigation.js';
import { UpVector, ShadingModel, Viewer, GetDefaultCamera, TraverseThreeObject, GetShadingTypeOfObject } from './viewer/viewer.js';
@ -293,11 +293,6 @@ export {
GetDomElementOuterHeight,
SetDomElementOuterWidth,
SetDomElementOuterHeight,
AddCheckbox,
AddRadioButton,
AddRangeSlider,
AddSelect,
AddToggle,
CreateDiv,
EmbeddedViewer,
Init3DViewerElement,

View File

@ -135,106 +135,6 @@ export function SetDomElementOuterHeight (element, height)
SetDomElementHeight (element, height - GetDomElementExternalHeight (style));
}
export function AddCheckbox (parentElement, id, text, isChecked, onChange)
{
let label = AddDomElement (parentElement, 'label');
label.setAttribute ('for', id);
let check = AddDomElement (label, 'input', 'ov_checkbox');
check.setAttribute ('type', 'checkbox');
check.setAttribute ('id', id);
check.checked = isChecked;
AddDomElement (label, 'span', null, text);
if (onChange) {
check.addEventListener ('change', onChange);
}
return check;
}
export function AddRadioButton (parentElement, id, name, text, isChecked, onChange)
{
let label = AddDomElement (parentElement, 'label');
label.setAttribute ('for', id);
let radio = AddDomElement (label, 'input', 'ov_radio_button');
radio.setAttribute ('type', 'radio');
radio.setAttribute ('id', id);
radio.setAttribute ('name', name);
radio.checked = isChecked;
AddDomElement (label, 'span', null, text);
if (onChange) {
radio.addEventListener ('change', onChange);
}
return radio;
}
export function AddRangeSlider (parentElement, min, max)
{
let slider = AddDomElement (parentElement, 'input', 'ov_slider');
slider.setAttribute ('type', 'range');
slider.setAttribute ('min', min.toString ());
slider.setAttribute ('max', max.toString ());
return slider;
}
export function AddSelect (parentElement, options, selectedIndex, onChange)
{
let container = AddDiv (parentElement, 'ov_select_container');
let select = AddDomElement (container, 'select', 'ov_select');
for (let option of options) {
AddDomElement (select, 'option', null, option);
}
select.selectedIndex = selectedIndex;
if (onChange) {
select.addEventListener ('change', () => {
onChange (select.selectedIndex);
});
}
return select;
}
export function AddToggle (parentElement, className)
{
function UpdateStatus (toggle, status)
{
if (status) {
toggle.classList.add ('on');
} else {
toggle.classList.remove ('on');
}
}
let status = false;
let onChange = null;
let toggleClassName = 'ov_toggle';
if (className) {
toggleClassName += ' ' + className;
}
let toggle = AddDiv (parentElement, toggleClassName);
AddDiv (toggle, 'ov_toggle_slider');
toggle.addEventListener ('click', () => {
status = !status;
UpdateStatus (toggle, status);
if (onChange) {
onChange ();
}
});
return {
element : toggle,
GetStatus : () => {
return status;
},
SetStatus : (newStatus) => {
status = newStatus;
UpdateStatus (toggle, status);
},
OnChange : (onChangeHandler) => {
onChange = onChangeHandler;
}
};
}
export function CreateDiv (className, innerHTML)
{
return CreateDomElement ('div', className, innerHTML);

View File

@ -5,9 +5,10 @@ import { FileFormat } from '../engine/io/fileutils.js';
import { LoadExternalLibrary } from '../engine/io/externallibs.js';
import { Exporter } from '../engine/export/exporter.js';
import { ExporterModel, ExporterSettings } from '../engine/export/exportermodel.js';
import { AddDiv, AddRadioButton, AddSelect, CreateDomElement, ClearDomElement } from '../engine/viewer/domutils.js';
import { ShowMessageDialog } from './dialogs.js';
import { AddDiv, CreateDomElement, ClearDomElement } from '../engine/viewer/domutils.js';
import { AddRadioButton, AddSelect } from '../website/utils.js';
import { ButtonDialog, ProgressDialog } from './dialog.js';
import { ShowMessageDialog } from './dialogs.js';
import { DownloadArrayBufferAsFile, DownloadUrlAsFile } from './utils.js';
import { CookieGetStringVal, CookieSetStringVal } from './cookiehandler.js';
import { HandleEvent } from './eventhandler.js';

View File

@ -1,5 +1,6 @@
import { FileSource } from '../engine/io/fileutils.js';
import { AddDiv, AddDomElement, AddCheckbox } from '../engine/viewer/domutils.js';
import { AddDiv, AddDomElement } from '../engine/viewer/domutils.js';
import { AddCheckbox } from '../website/utils.js';
import { CreateUrlBuilder } from '../engine/parameters/parameterlist.js';
import { ShowMessageDialog } from './dialogs.js';
import { ButtonDialog } from './dialog.js';

View File

@ -1,5 +1,6 @@
import { Color, ColorToHexString } from '../engine/model/color.js';
import { AddDiv, AddDomElement, AddRangeSlider, AddToggle, AddCheckbox, ShowDomElement, SetDomElementOuterHeight } from '../engine/viewer/domutils.js';
import { AddDiv, AddDomElement, ShowDomElement, SetDomElementOuterHeight } from '../engine/viewer/domutils.js';
import { AddRangeSlider, AddToggle, AddCheckbox } from '../website/utils.js';
import { CalculatePopupPositionToElementTopLeft } from './dialogs.js';
import { FeatureSet } from './featureset.js';
import { PopupDialog } from './dialog.js';

View File

@ -264,3 +264,103 @@ export function GetFilesFromDataTransfer (dataTransfer, onReady)
onReady (dataTransfer.files);
}
}
export function AddCheckbox (parentElement, id, text, isChecked, onChange)
{
let label = AddDomElement (parentElement, 'label');
label.setAttribute ('for', id);
let check = AddDomElement (label, 'input', 'ov_checkbox');
check.setAttribute ('type', 'checkbox');
check.setAttribute ('id', id);
check.checked = isChecked;
AddDomElement (label, 'span', null, text);
if (onChange) {
check.addEventListener ('change', onChange);
}
return check;
}
export function AddRadioButton (parentElement, id, name, text, isChecked, onChange)
{
let label = AddDomElement (parentElement, 'label');
label.setAttribute ('for', id);
let radio = AddDomElement (label, 'input', 'ov_radio_button');
radio.setAttribute ('type', 'radio');
radio.setAttribute ('id', id);
radio.setAttribute ('name', name);
radio.checked = isChecked;
AddDomElement (label, 'span', null, text);
if (onChange) {
radio.addEventListener ('change', onChange);
}
return radio;
}
export function AddRangeSlider (parentElement, min, max)
{
let slider = AddDomElement (parentElement, 'input', 'ov_slider');
slider.setAttribute ('type', 'range');
slider.setAttribute ('min', min.toString ());
slider.setAttribute ('max', max.toString ());
return slider;
}
export function AddSelect (parentElement, options, selectedIndex, onChange)
{
let container = AddDiv (parentElement, 'ov_select_container');
let select = AddDomElement (container, 'select', 'ov_select');
for (let option of options) {
AddDomElement (select, 'option', null, option);
}
select.selectedIndex = selectedIndex;
if (onChange) {
select.addEventListener ('change', () => {
onChange (select.selectedIndex);
});
}
return select;
}
export function AddToggle (parentElement, className)
{
function UpdateStatus (toggle, status)
{
if (status) {
toggle.classList.add ('on');
} else {
toggle.classList.remove ('on');
}
}
let status = false;
let onChange = null;
let toggleClassName = 'ov_toggle';
if (className) {
toggleClassName += ' ' + className;
}
let toggle = AddDiv (parentElement, toggleClassName);
AddDiv (toggle, 'ov_toggle_slider');
toggle.addEventListener ('click', () => {
status = !status;
UpdateStatus (toggle, status);
if (onChange) {
onChange ();
}
});
return {
element : toggle,
GetStatus : () => {
return status;
},
SetStatus : (newStatus) => {
status = newStatus;
UpdateStatus (toggle, status);
},
OnChange : (onChangeHandler) => {
onChange = onChangeHandler;
}
};
}