Move website related code outside of the engine.
This commit is contained in:
parent
43d707ed8e
commit
f4f6228426
@ -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,
|
||||
|
||||
@ -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);
|
||||
|
||||
@ -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';
|
||||
|
||||
@ -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';
|
||||
|
||||
@ -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';
|
||||
|
||||
@ -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;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user