+
+ Name:
+
-
-
Opacity Map Mode:
-
Do not used
-
Cut off mask
-
Blend
-
Note: For an opacity map, the alpha layer of the Albedo Map will be used.
- 'Blend' mode will used the alpha value to determine the opacity of a pixel.
- 'Cut off mask' mode will use the 'Cut off threshold' to determine if a pixel will be opaque or transparent, based on the alpha value from the map.
-
Cut Off Threshold:
-
-
-
-
-
-
-
-
-
Emissive:
-
+
+
+
-
-
Bloom Factor:
-
-
-
Emissive Map (RGB) URL:
-
+
+
+
+
+
+
Roughness:
+
+
+
+
|< Glossy, polished, lustrous
+
Unpolished, mat, rough >|
+
+
Roughness Map (Red channel) URL:
+
+
+
+
Instead, use Gloss Map
+
+
+
+
+
+
Normal Map URL:
+
+
+
+
Instead, use Bump Map
+
+
+
+
+
+
+
Opacity:
+
+
+
+
|< Transparent
+
Opaque >|
+
+
+
+
+
Opacity Map Mode:
+
Not used
+
Cut off mask
+
Blend
+
Note: For an opacity map, the alpha layer of the Albedo Map will be used.
+ 'Blend' mode will used the alpha value to determine the opacity of a pixel.
+ 'Cut off mask' mode will use the 'Cut off threshold' to determine if a pixel will be opaque or transparent, based on the alpha value from the map.
+
Cut Off Threshold:
+
+
+
+
|< Transparent
+
Opaque >|
+
+
+
+
+
+
+
+
+ Scattering:
+
+
+ Scattering Map (Red channel) URL:
+
+ Scattering or Scattering Map won't be effective without the presence of a Normal/Bump Map.
+
+
+
+
+ Occlusion Map (Red channel) URL:
+
+ Note: 'Occlusion Map' and 'Light Map' are using a separated UV Map.
+
+
+
+
+ Light Map (Red channel) URL:
+
+ Note: 'Light Map' and 'Occlusion Map' are using a separated UV Map.
+
+
+
+
+
+ Procedural (json):
+ Use Basic Template
+
+
+
+
+
+ Material displayed on surface:
+ Outside
+ Inside
+ Both
+
+
-
-
-
- Scattering:
-
-
- Scattering Map (Grayscale) URL:
-
-
-
-
-
- Occlusion Map (Grayscale) URL:
-
-
-
-
- Material displayed on surface:
- Outside
- Inside
- Both
-
-
diff --git a/scripts/system/create/entityProperties/html/js/entityProperties.js b/scripts/system/create/entityProperties/html/js/entityProperties.js
index dd8d67e24d..f94f6d2ffc 100644
--- a/scripts/system/create/entityProperties/html/js/entityProperties.js
+++ b/scripts/system/create/entityProperties/html/js/entityProperties.js
@@ -1841,6 +1841,7 @@ let createAppTooltip = new CreateAppTooltip();
let currentSpaceMode = PROPERTY_SPACE_MODE.LOCAL;
let zonesList = [];
let canViewAssetURLs = false;
+let maSelectedId;
function createElementFromHTML(htmlString) {
let elTemplate = document.createElement('template');
@@ -3613,10 +3614,9 @@ function saveMaterialData() {
function openMaterialAssistant() {
if (materialEditor === null) {
- loadDataInMaUi({});
- } else {
- loadDataInMaUi(materialEditor.getText());
+ newJSONMaterialEditor();
}
+ loadDataInMaUi(materialEditor.getText());
$('#uiMaterialAssistant').show();
$('#properties-list').hide();
}
@@ -4177,7 +4177,16 @@ function handleEntitySelectionUpdate(selections, isPropertiesToolUpdate) {
const multipleSelections = currentSelections.length > 1;
const hasSelectedEntityChanged = !areSetsEqual(selectedEntityIDs, previouslySelectedEntityIDs);
- closeMaterialAssistant();
+ if (selections.length === 1) {
+ if (maSelectedId !== selections[0].id) {
+ closeMaterialAssistant();
+ }
+ maSelectedId = selections[0].id;
+ } else {
+ closeMaterialAssistant();
+ maSelectedId = "";
+ }
+
requestZoneList();
if (selections.length === 0) {
diff --git a/scripts/system/create/entityProperties/html/js/materialAssistant.js b/scripts/system/create/entityProperties/html/js/materialAssistant.js
index 02af601330..5027e25bab 100644
--- a/scripts/system/create/entityProperties/html/js/materialAssistant.js
+++ b/scripts/system/create/entityProperties/html/js/materialAssistant.js
@@ -1,8 +1,9 @@
+//
// materialAssistant.js
//
// Created by Alezia Kurdis on May 19th, 2022.
// Copyright 2022 Vircadia contributors.
-// Copyright 2022 Overte e.V.
+// Copyright 2022-2024 Overte e.V.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
@@ -20,12 +21,15 @@ let maClose,
maMetallic,
maMetallicSlider,
maMetallicMap,
+ maUseSpecular,
maRoughnessIsActive,
maRoughness,
maRoughnessSlider,
maRoughnessMap,
+ maUseGloss,
maNormalMapIsActive,
maNormalMap,
+ maUseBump,
maOpacityIsActive,
maOpacity,
maOpacitySlider,
@@ -47,9 +51,71 @@ let maClose,
maScatteringMap,
maOcclusionMapIsActive,
maOcclusionMap,
+ maLightMapIsActive,
+ maLightMap,
+ maShadeIsActive,
+ maShadeColorPicker,
+ maShadeColorPickerSel,
+ maShadeMapIsActive,
+ maShadeMap,
+ maMatcapIsActive,
+ maMatcapColorPicker,
+ maMatcapColorPickerSel,
+ maMatcapMapIsActive,
+ maMatcapMap,
+ maShadingShiftIsActive,
+ maShadingShift,
+ maShadingShiftSlider,
+ maShadingShiftMapIsActive,
+ maShadingShiftMap,
+ maShadingToonyIsActive,
+ maShadingToony,
+ maShadingToonySlider,
+ maParametricRimIsActive,
+ maParametricRimColorPicker,
+ maParametricRimColorPickerSel,
+ maRimMapIsActive,
+ maRimMap,
+ maParametricRimFresnelPowerIsActive,
+ maParametricRimFresnelPower,
+ maParametricRimFresnelPowerSlider,
+ maParametricRimLiftIsActive,
+ maParametricRimLift,
+ maParametricRimLiftSlider,
+ maRimLightingMixIsActive,
+ maRimLightingMix,
+ maRimLightingMixSlider,
+/* ############## Not yet supported, but the code is ready (commented) ###################
+ maOutlineWidthModeIsActive,
+ maOutlineWidthModeNone,
+ maOutlineWidthModeWorld,
+ maOutlineWidthModeScreen,
+ maOutlineWidthIsActive,
+ maOutlineWidth,
+ maOutlineWidthSlider,
+ maOutlineIsActive,
+ maOutlineColorPicker,
+ maOutlineColorPickerSel,
+*/
+ maUvAnimationMaskMapIsActive,
+ maUvAnimationMaskMap,
+ maUvAnimationScrollXSpeedIsActive,
+ maUvAnimationScrollXSpeed,
+ maUvAnimationScrollXSpeedSlider,
+ maUvAnimationScrollYSpeedIsActive,
+ maUvAnimationScrollYSpeed,
+ maUvAnimationScrollYSpeedSlider,
+ maUvAnimationRotationSpeedIsActive,
+ maUvAnimationRotationSpeed,
+ maUvAnimationRotationSpeedSlider,
+ maProcedural,
+ maAddProceduralTemplate,
maCullFaceModeBack,
maCullFaceModeFront,
- maCullFaceModeNone;
+ maCullFaceModeNone,
+ maModelHifiPbr,
+ maModelVrmMtoon,
+ maModelHifiShaderSimple;
let DEFAULT_ALBEDO = [1,1,1];
let DEFAULT_EMISSIVE = [0,0,0];
@@ -60,6 +126,25 @@ let DEFAULT_METALLIC = 0;
let DEFAULT_OPACITY = 1;
let DEFAULT_OPACITY_CUTOFF = 0.5;
let DEFAULT_SCATTERING = 0;
+let DEFAULT_MODEL = "hifi_pbr";
+let DEFAULT_SHADE = [1,1,1];
+let DEFAULT_MATCAP = [1,1,1];
+let DEFAULT_SHADING_SHIFT = 0.0;
+let DEFAULT_SHADING_TOONY = 0.9;
+let DEFAULT_PARAMETRIC_RIM = [0,0,0];
+let DEFAULT_RIM_LIGHTING_MIX = 1.0;
+let DEFAULT_PARAMETRIC_RIM_FRESNEL_POWER = 5.0;
+let DEFAULT_PARAMETRIC_RIM_LIFT = 0.0;
+
+/* ############## Not yet supported, but the code is ready ###################
+let DEFAULT_OUTLINE = [0,0,0];
+let DEFAULT_OUTLINE_WIDTH_MODE = "none";
+let DEFAULT_OUTLINE_WIDTH = 0.0;
+//#################################################################
+*/
+let DEFAULT_UV_ANIMATION_SCROLL_X_SPEED = 0.0;
+let DEFAULT_UV_ANIMATION_SCROLL_Y_SPEED = 0.0;
+let DEFAULT_UV_ANIMATION_ROTATION_SPEED = 0.0;
function initiateMaUi() {
maClose = document.getElementById("uiMaterialAssistant-closeButton");
@@ -72,12 +157,15 @@ function initiateMaUi() {
maMetallic = document.getElementById("ma-metallic");
maMetallicSlider = document.getElementById("ma-metallic-slider");
maMetallicMap = document.getElementById("ma-metallicMap");
+ maUseSpecular = document.getElementById("ma-useSpecular");
maRoughnessIsActive = document.getElementById("ma-roughness-isActive");
maRoughness = document.getElementById("ma-roughness");
maRoughnessSlider = document.getElementById("ma-roughness-slider");
maRoughnessMap = document.getElementById("ma-roughnessMap");
+ maUseGloss = document.getElementById("ma-useGloss");
maNormalMapIsActive = document.getElementById("ma-normalMap-isActive");
maNormalMap = document.getElementById("ma-normalMap");
+ maUseBump = document.getElementById("ma-useBump");
maOpacityIsActive = document.getElementById("ma-opacity-isActive");
maOpacity = document.getElementById("ma-opacity");
maOpacitySlider = document.getElementById("ma-opacity-slider");
@@ -98,9 +186,69 @@ function initiateMaUi() {
maScatteringMap = document.getElementById("ma-scatteringMap");
maOcclusionMapIsActive = document.getElementById("ma-occlusionMap-isActive");
maOcclusionMap = document.getElementById("ma-occlusionMap");
+ maLightMapIsActive = document.getElementById("ma-lightMap-isActive");
+ maLightMap = document.getElementById("ma-lightMap");
+ maShadeIsActive = document.getElementById("ma-shade-isActive");
+ maShadeColorPicker = document.getElementById("ma-shade-colorPicker");
+ maShadeMapIsActive = document.getElementById("ma-shadeMap-isActive");
+ maShadeMap = document.getElementById("ma-shadeMap");
+ maMatcapIsActive = document.getElementById("ma-matcap-isActive");
+ maMatcapColorPicker = document.getElementById("ma-matcap-colorPicker");
+ maMatcapMapIsActive = document.getElementById("ma-matcapMap-isActive");
+ maMatcapMap = document.getElementById("ma-matcapMap");
+ maShadingShiftIsActive = document.getElementById("ma-shadingShift-isActive");
+ maShadingShift = document.getElementById("ma-shadingShift");
+ maShadingShiftSlider = document.getElementById("ma-shadingShift-slider");
+ maShadingShiftMapIsActive = document.getElementById("ma-shadingShiftMap-isActive");
+ maShadingShiftMap = document.getElementById("ma-shadingShiftMap");
+ maShadingToonyIsActive = document.getElementById("ma-shadingToony-isActive");
+ maShadingToony = document.getElementById("ma-shadingToony");
+ maShadingToonySlider = document.getElementById("ma-shadingToony-slider");
+ maParametricRimIsActive = document.getElementById("ma-parametricRim-isActive");
+ maParametricRimColorPicker = document.getElementById("ma-parametricRim-colorPicker");
+ maRimMapIsActive = document.getElementById("ma-rimMap-isActive");
+ maRimMap = document.getElementById("ma-rimMap");
+ maParametricRimFresnelPowerIsActive = document.getElementById("ma-parametricRimFresnelPower-isActive");
+ maParametricRimFresnelPower = document.getElementById("ma-parametricRimFresnelPower");
+ maParametricRimFresnelPowerSlider = document.getElementById("ma-parametricRimFresnelPower-slider");
+ maParametricRimLiftIsActive = document.getElementById("ma-parametricRimLift-isActive");
+ maParametricRimLift = document.getElementById("ma-parametricRimLift");
+ maParametricRimLiftSlider = document.getElementById("ma-parametricRimLift-slider");
+ maRimLightingMixIsActive = document.getElementById("ma-rimLightingMix-isActive");
+ maRimLightingMix = document.getElementById("ma-rimLightingMix");
+ maRimLightingMixSlider = document.getElementById("ma-rimLightingMix-slider");
+
+/* ############## Not yet supported, but the code is ready ################################
+ maOutlineWidthModeIsActive = document.getElementById("ma-outlineWidthMode-isActive");
+ maOutlineWidthModeNone = document.getElementById("ma-outlineWidthMode-none");
+ maOutlineWidthModeWorld = document.getElementById("ma-outlineWidthMode-world");
+ maOutlineWidthModeScreen = document.getElementById("ma-outlineWidthMode-screen");
+ maOutlineWidthIsActive = document.getElementById("ma-outlineWidth-isActive");
+ maOutlineWidth = document.getElementById("ma-outlineWidth");
+ maOutlineWidthSlider = document.getElementById("ma-outlineWidth-slider");
+ maOutlineIsActive = document.getElementById("ma-outline-isActive");
+ maOutlineColorPicker = document.getElementById("ma-outline-colorPicker");
+ //#################################################################################
+*/
+ maUvAnimationMaskMapIsActive = document.getElementById("ma-uvAnimationMaskMap-isActive");
+ maUvAnimationMaskMap = document.getElementById("ma-uvAnimationMaskMap");
+ maUvAnimationScrollXSpeedIsActive = document.getElementById("ma-uvAnimationScrollXSpeed-isActive");
+ maUvAnimationScrollXSpeed = document.getElementById("ma-uvAnimationScrollXSpeed");
+ maUvAnimationScrollXSpeedSlider = document.getElementById("ma-uvAnimationScrollXSpeed-slider");
+ maUvAnimationScrollYSpeedIsActive = document.getElementById("ma-uvAnimationScrollYSpeed-isActive");
+ maUvAnimationScrollYSpeed = document.getElementById("ma-uvAnimationScrollYSpeed");
+ maUvAnimationScrollYSpeedSlider = document.getElementById("ma-uvAnimationScrollYSpeed-slider");
+ maUvAnimationRotationSpeedIsActive = document.getElementById("ma-uvAnimationRotationSpeed-isActive");
+ maUvAnimationRotationSpeed = document.getElementById("ma-uvAnimationRotationSpeed");
+ maUvAnimationRotationSpeedSlider = document.getElementById("ma-uvAnimationRotationSpeed-slider");
+ maProcedural = document.getElementById("ma-procedural");
+ maAddProceduralTemplate = document.getElementById("ma-addProceduralTemplate");
maCullFaceModeBack = document.getElementById("ma-cullFaceMode-back");
maCullFaceModeFront = document.getElementById("ma-cullFaceMode-front");
maCullFaceModeNone = document.getElementById("ma-cullFaceMode-none");
+ maModelHifiPbr = document.getElementById("ma-Model-hifi_pbr");
+ maModelVrmMtoon = document.getElementById("ma-Model-vrm_mtoon");
+ maModelHifiShaderSimple = document.getElementById("ma-Model-hifi_shader_simple");
maClose.onclick = function() {
closeMaterialAssistant();
@@ -128,8 +276,11 @@ function initiateMaUi() {
maMaterialData.albedoMapIsActive = true;
maAlbedoMapIsActive.className = "uiMaterialAssistant-active";
maAlbedoMap.disabled = false;
+ if (maMaterialData.albedoMap === undefined) {
+ maMaterialData.albedoMap = "";
+ }
}
- maGenerateJsonAndSave();
+ maGenerateJsonAndSave();
};
maMetallicIsActive.onclick = function() {
if (maMaterialData.metallicIsActive) {
@@ -138,12 +289,14 @@ function initiateMaUi() {
maMetallic.disabled = true;
maMetallicSlider.disabled = true;
maMetallicMap.disabled = true;
+ maUseSpecular.disabled = true;
} else {
maMaterialData.metallicIsActive = true;
maMetallicIsActive.className = "uiMaterialAssistant-active";
maMetallic.disabled = false;
maMetallicSlider.disabled = false;
- maMetallicMap.disabled = false;
+ maMetallicMap.disabled = false;
+ maUseSpecular.disabled = false;
}
maGenerateJsonAndSave();
};
@@ -154,12 +307,14 @@ function initiateMaUi() {
maRoughness.disabled = true;
maRoughnessSlider.disabled = true;
maRoughnessMap.disabled = true;
+ maUseGloss.disabled = true;
} else {
maMaterialData.roughnessIsActive = true;
maRoughnessIsActive.className = "uiMaterialAssistant-active";
maRoughness.disabled = false;
maRoughnessSlider.disabled = false;
- maRoughnessMap.disabled = false;
+ maRoughnessMap.disabled = false;
+ maUseGloss.disabled = false;
}
maGenerateJsonAndSave();
};
@@ -168,10 +323,15 @@ function initiateMaUi() {
maMaterialData.normalMapIsActive = false;
maNormalMapIsActive.className = "uiMaterialAssistant-inactive";
maNormalMap.disabled = true;
+ maUseBump.disabled = true;
} else {
maMaterialData.normalMapIsActive = true;
maNormalMapIsActive.className = "uiMaterialAssistant-active";
maNormalMap.disabled = false;
+ maUseBump.disabled = false;
+ if (maMaterialData.normalMap === undefined) {
+ maMaterialData.normalMap = "";
+ }
}
maGenerateJsonAndSave();
};
@@ -244,16 +404,34 @@ function initiateMaUi() {
maMaterialData.occlusionMapIsActive = true;
maOcclusionMapIsActive.className = "uiMaterialAssistant-active";
maOcclusionMap.disabled = false;
+ if (maMaterialData.occlusionMap === undefined) {
+ maMaterialData.occlusionMap = "";
+ }
}
maGenerateJsonAndSave();
};
+ maLightMapIsActive.onclick = function() {
+ if (maMaterialData.lightMapIsActive) {
+ maMaterialData.lightMapIsActive = false;
+ maLightMapIsActive.className = "uiMaterialAssistant-inactive";
+ maLightMap.disabled = true;
+ } else {
+ maMaterialData.lightMapIsActive = true;
+ maLightMapIsActive.className = "uiMaterialAssistant-active";
+ maLightMap.disabled = false;
+ if (maMaterialData.lightMap === undefined) {
+ maMaterialData.lightMap = "";
+ }
+ }
+ maGenerateJsonAndSave();
+ };
maName.oninput = function() {
maMaterialData.name = maName.value;
maGenerateJsonAndSave();
};
maAlbedoMap.oninput = function() {
maMaterialData.albedoMap = maAlbedoMap.value;
- maGenerateJsonAndSave();
+ maGenerateJsonAndSave();
};
maMetallicSlider.oninput = function() {
maMetallic.value = maMetallicSlider.value/1000;
@@ -264,6 +442,10 @@ function initiateMaUi() {
maMaterialData.metallicMap = maMetallicMap.value;
maGenerateJsonAndSave();
};
+ maUseSpecular.oninput = function() {
+ maMaterialData.useSpecular = maUseSpecular.checked;
+ maGenerateJsonAndSave();
+ };
maRoughnessSlider.oninput = function() {
maRoughness.value = maRoughnessSlider.value/1000;
maMaterialData.roughness = parseFloat(maRoughness.value);
@@ -273,10 +455,18 @@ function initiateMaUi() {
maMaterialData.roughnessMap = maRoughnessMap.value;
maGenerateJsonAndSave();
};
+ maUseGloss.oninput = function() {
+ maMaterialData.useGloss = maUseGloss.checked;
+ maGenerateJsonAndSave();
+ };
maNormalMap.oninput = function() {
maMaterialData.normalMap = maNormalMap.value;
maGenerateJsonAndSave();
};
+ maUseBump.oninput = function() {
+ maMaterialData.useBump = maUseBump.checked;
+ maGenerateJsonAndSave();
+ };
maOpacitySlider.oninput = function() {
maOpacity.value = maOpacitySlider.value/1000;
maMaterialData.opacity = parseFloat(maOpacity.value);
@@ -325,6 +515,427 @@ function initiateMaUi() {
maMaterialData.occlusionMap = maOcclusionMap.value;
maGenerateJsonAndSave();
};
+ maLightMap.oninput = function() {
+ maMaterialData.lightMap = maLightMap.value;
+ maGenerateJsonAndSave();
+ };
+ maShadeIsActive.onclick = function() {
+ if (maMaterialData.shadeIsActive) {
+ maMaterialData.shadeIsActive = false;
+ maShadeIsActive.className = "uiMaterialAssistant-inactive";
+ maShadeColorPicker.style.pointerEvents = 'none';
+ maShadeColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.shadeIsActive = true;
+ maShadeIsActive.className = "uiMaterialAssistant-active";
+ maShadeColorPicker.style.pointerEvents = 'auto';
+ maShadeColorPicker.style.backgroundColor = maGetRGB(maMaterialData.shade);
+ }
+ maGenerateJsonAndSave();
+ };
+ maShadeMapIsActive.onclick = function() {
+ if (maMaterialData.shadeMapIsActive) {
+ maMaterialData.shadeMapIsActive = false;
+ maShadeMapIsActive.className = "uiMaterialAssistant-inactive";
+ maShadeMap.disabled = true;
+ } else {
+ maMaterialData.shadeMapIsActive = true;
+ maShadeMapIsActive.className = "uiMaterialAssistant-active";
+ maShadeMap.disabled = false;
+ if (maMaterialData.shadeMap === undefined) {
+ maMaterialData.shadeMap = "";
+ }
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maShadeMap.oninput = function() {
+ maMaterialData.shadeMap = maShadeMap.value;
+ maGenerateJsonAndSave();
+ };
+
+ maMatcapIsActive.onclick = function() {
+ if (maMaterialData.matcapIsActive) {
+ maMaterialData.matcapIsActive = false;
+ maMatcapIsActive.className = "uiMaterialAssistant-inactive";
+ maMatcapColorPicker.style.pointerEvents = 'none';
+ maMatcapColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.matcapIsActive = true;
+ maMatcapIsActive.className = "uiMaterialAssistant-active";
+ maMatcapColorPicker.style.pointerEvents = 'auto';
+ maMatcapColorPicker.style.backgroundColor = maGetRGB(maMaterialData.matcap);
+ }
+ maGenerateJsonAndSave();
+ };
+ maMatcapMapIsActive.onclick = function() {
+ if (maMaterialData.matcapMapIsActive) {
+ maMaterialData.matcapMapIsActive = false;
+ maMatcapMapIsActive.className = "uiMaterialAssistant-inactive";
+ maMatcapMap.disabled = true;
+ } else {
+ maMaterialData.matcapMapIsActive = true;
+ maMatcapMapIsActive.className = "uiMaterialAssistant-active";
+ maMatcapMap.disabled = false;
+ if (maMaterialData.matcapMap === undefined) {
+ maMaterialData.matcapMap = "";
+ }
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maMatcapMap.oninput = function() {
+ maMaterialData.matcapMap = maMatcapMap.value;
+ maGenerateJsonAndSave();
+ };
+
+ maParametricRimIsActive.onclick = function() {
+ if (maMaterialData.parametricRimIsActive) {
+ maMaterialData.parametricRimIsActive = false;
+ maParametricRimIsActive.className = "uiMaterialAssistant-inactive";
+ maParametricRimColorPicker.style.pointerEvents = 'none';
+ maParametricRimColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.parametricRimIsActive = true;
+ maParametricRimIsActive.className = "uiMaterialAssistant-active";
+ maParametricRimColorPicker.style.pointerEvents = 'auto';
+ maParametricRimColorPicker.style.backgroundColor = maGetRGB(maMaterialData.parametricRim);
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maRimMapIsActive.onclick = function() {
+ if (maMaterialData.rimMapIsActive) {
+ maMaterialData.rimMapIsActive = false;
+ maRimMapIsActive.className = "uiMaterialAssistant-inactive";
+ maRimMap.disabled = true;
+ } else {
+ maMaterialData.rimMapIsActive = true;
+ maRimMapIsActive.className = "uiMaterialAssistant-active";
+ maRimMap.disabled = false;
+ if (maMaterialData.rimMap === undefined) {
+ maMaterialData.rimMap = "";
+ }
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maRimMap.oninput = function() {
+ maMaterialData.rimMap = maRimMap.value;
+ maGenerateJsonAndSave();
+ };
+
+ maRimLightingMixIsActive.onclick = function() {
+ if (maMaterialData.rimLightingMixIsActive) {
+ maMaterialData.rimLightingMixIsActive = false;
+ maRimLightingMixIsActive.className = "uiMaterialAssistant-inactive";
+ maRimLightingMix.disabled = true;
+ maRimLightingMixSlider.disabled = true;
+ } else {
+ maMaterialData.rimLightingMixIsActive = true;
+ maRimLightingMixIsActive.className = "uiMaterialAssistant-active";
+ maRimLightingMix.disabled = false;
+ maRimLightingMixSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maRimLightingMixSlider.oninput = function() {
+ maRimLightingMix.value = maRimLightingMixSlider.value/1000;
+ maMaterialData.rimLightingMix = parseFloat(maRimLightingMix.value);
+ maGenerateJsonAndSave();
+ };
+
+ maParametricRimFresnelPowerIsActive.onclick = function() {
+ if (maMaterialData.parametricRimFresnelPowerIsActive) {
+ maMaterialData.parametricRimFresnelPowerIsActive = false;
+ maParametricRimFresnelPowerIsActive.className = "uiMaterialAssistant-inactive";
+ maParametricRimFresnelPower.disabled = true;
+ maParametricRimFresnelPowerSlider.disabled = true;
+ } else {
+ maMaterialData.parametricRimFresnelPowerIsActive = true;
+ maParametricRimFresnelPowerIsActive.className = "uiMaterialAssistant-active";
+ maParametricRimFresnelPower.disabled = false;
+ maParametricRimFresnelPowerSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maParametricRimFresnelPowerSlider.oninput = function() {
+ maParametricRimFresnelPower.value = maParametricRimFresnelPowerSlider.value/1000;
+ maMaterialData.parametricRimFresnelPower = parseFloat(maParametricRimFresnelPower.value);
+ maGenerateJsonAndSave();
+ };
+
+ maParametricRimLiftIsActive.onclick = function() {
+ if (maMaterialData.parametricRimLiftIsActive) {
+ maMaterialData.parametricRimLiftIsActive = false;
+ maParametricRimLiftIsActive.className = "uiMaterialAssistant-inactive";
+ maParametricRimLift.disabled = true;
+ maParametricRimLiftSlider.disabled = true;
+ } else {
+ maMaterialData.parametricRimLiftIsActive = true;
+ maParametricRimLiftIsActive.className = "uiMaterialAssistant-active";
+ maParametricRimLift.disabled = false;
+ maParametricRimLiftSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maParametricRimLiftSlider.oninput = function() {
+ maParametricRimLift.value = maParametricRimLiftSlider.value/1000;
+ maMaterialData.parametricRimLift = parseFloat(maParametricRimLift.value);
+ maGenerateJsonAndSave();
+ };
+
+ maShadingShiftIsActive.onclick = function() {
+ if (maMaterialData.shadingShiftIsActive) {
+ maMaterialData.shadingShiftIsActive = false;
+ maShadingShiftIsActive.className = "uiMaterialAssistant-inactive";
+ maShadingShift.disabled = true;
+ maShadingShiftSlider.disabled = true;
+ } else {
+ maMaterialData.shadingShiftIsActive = true;
+ maShadingShiftIsActive.className = "uiMaterialAssistant-active";
+ maShadingShift.disabled = false;
+ maShadingShiftSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maShadingShiftMapIsActive.onclick = function() {
+ if (maMaterialData.shadingShiftMapIsActive) {
+ maMaterialData.shadingShiftMapIsActive = false;
+ maShadingShiftMapIsActive.className = "uiMaterialAssistant-inactive";
+ maShadingShiftMap.disabled = true;
+ } else {
+ maMaterialData.shadingShiftMapIsActive = true;
+ maShadingShiftMapIsActive.className = "uiMaterialAssistant-active";
+ maShadingShiftMap.disabled = false;
+ if (maMaterialData.shadingShiftMap === undefined) {
+ maMaterialData.shadingShiftMap = "";
+ }
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maShadingShiftSlider.oninput = function() {
+ maShadingShift.value = maShadingShiftSlider.value/1000;
+ maMaterialData.shadingShift = parseFloat(maShadingShift.value);
+ maGenerateJsonAndSave();
+ };
+
+ maShadingShiftMap.oninput = function() {
+ maMaterialData.shadingShiftMap = maShadingShiftMap.value;
+ maGenerateJsonAndSave();
+ };
+
+ maShadingToonyIsActive.onclick = function() {
+ if (maMaterialData.shadingToonyIsActive) {
+ maMaterialData.shadingToonyIsActive = false;
+ maShadingToonyIsActive.className = "uiMaterialAssistant-inactive";
+ maShadingToony.disabled = true;
+ maShadingToonySlider.disabled = true;
+ } else {
+ maMaterialData.shadingToonyIsActive = true;
+ maShadingToonyIsActive.className = "uiMaterialAssistant-active";
+ maShadingToony.disabled = false;
+ maShadingToonySlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maShadingToonySlider.oninput = function() {
+ maShadingToony.value = maShadingToonySlider.value/1000;
+ maMaterialData.shadingToony = parseFloat(maShadingToony.value);
+ maGenerateJsonAndSave();
+ };
+
+/* ################# Not supported Yet, but the code is ready #########################
+
+ maOutlineWidthModeIsActive.onclick = function() {
+ if (maMaterialData.outlineWidthModeIsActive) {
+ maMaterialData.outlineWidthModeIsActive = false;
+ maOutlineWidthModeIsActive.className = "uiMaterialAssistant-inactive";
+ maOutlineWidthModeNone.disabled = true;
+ maOutlineWidthModeWorld.disabled = true;
+ maOutlineWidthModeScreen.disabled = true;
+ } else {
+ maMaterialData.outlineWidthModeIsActive = true;
+ maOutlineWidthModeIsActive.className = "uiMaterialAssistant-active";
+ maOutlineWidthModeNone.disabled = false;
+ maOutlineWidthModeWorld.disabled = false;
+ maOutlineWidthModeScreen.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maOutlineWidthModeNone.oninput = function() {
+ maMaterialData.outlineWidthMode = maOutlineWidthModeNone.value;
+ maGenerateJsonAndSave();
+ };
+
+ maOutlineWidthModeWorld.oninput = function() {
+ maMaterialData.outlineWidthMode = maOutlineWidthModeWorld.value;
+ maGenerateJsonAndSave();
+ };
+
+ maOutlineWidthModeScreen.oninput = function() {
+ maMaterialData.outlineWidthMode = maOutlineWidthModeScreen.value;
+ maGenerateJsonAndSave();
+ };
+
+ maOutlineWidthIsActive.onclick = function() {
+ if (maMaterialData.outlineWidthIsActive) {
+ maMaterialData.outlineWidthIsActive = false;
+ maOutlineWidthIsActive.className = "uiMaterialAssistant-inactive";
+ maOutlineWidth.disabled = true;
+ maOutlineWidthSlider.disabled = true;
+ } else {
+ maMaterialData.outlineWidthIsActive = true;
+ maOutlineWidthIsActive.className = "uiMaterialAssistant-active";
+ maOutlineWidth.disabled = false;
+ maOutlineWidthSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maOutlineWidthSlider.oninput = function() {
+ maOutlineWidth.value = maOutlineWidthSlider.value/1000;
+ maMaterialData.outlineWidth = parseFloat(maOutlineWidth.value);
+ maGenerateJsonAndSave();
+ };
+
+ maOutlineIsActive.onclick = function() {
+ if (maMaterialData.outlineIsActive) {
+ maMaterialData.outlineIsActive = false;
+ maOutlineIsActive.className = "uiMaterialAssistant-inactive";
+ maOutlineColorPicker.style.pointerEvents = 'none';
+ maOutlineColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.outlineIsActive = true;
+ maOutlineIsActive.className = "uiMaterialAssistant-active";
+ maOutlineColorPicker.style.pointerEvents = 'auto';
+ maOutlineColorPicker.style.backgroundColor = maGetRGB(maMaterialData.outline);
+ }
+ maGenerateJsonAndSave();
+ };
+//################################################################
+*/
+
+ maUvAnimationMaskMapIsActive.onclick = function() {
+ if (maMaterialData.uvAnimationMaskMapIsActive) {
+ maMaterialData.uvAnimationMaskMapIsActive = false;
+ maUvAnimationMaskMapIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationMaskMap.disabled = true;
+ } else {
+ maMaterialData.uvAnimationMaskMapIsActive = true;
+ maUvAnimationMaskMapIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationMaskMap.disabled = false;
+ if (maMaterialData.uvAnimationMaskMap === undefined) {
+ maMaterialData.uvAnimationMaskMap = "";
+ }
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationMaskMap.oninput = function() {
+ maMaterialData.uvAnimationMaskMap = maUvAnimationMaskMap.value;
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationScrollXSpeedIsActive.onclick = function() {
+ if (maMaterialData.uvAnimationScrollXSpeedIsActive) {
+ maMaterialData.uvAnimationScrollXSpeedIsActive = false;
+ maUvAnimationScrollXSpeedIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationScrollXSpeed.disabled = true;
+ maUvAnimationScrollXSpeedSlider.disabled = true;
+ } else {
+ maMaterialData.uvAnimationScrollXSpeedIsActive = true;
+ maUvAnimationScrollXSpeedIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationScrollXSpeed.disabled = false;
+ maUvAnimationScrollXSpeedSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationScrollXSpeedSlider.oninput = function() {
+ maUvAnimationScrollXSpeed.value = maUvAnimationScrollXSpeedSlider.value/1000;
+ maMaterialData.uvAnimationScrollXSpeed = parseFloat(maUvAnimationScrollXSpeed.value);
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationScrollYSpeedIsActive.onclick = function() {
+ if (maMaterialData.uvAnimationScrollYSpeedIsActive) {
+ maMaterialData.uvAnimationScrollYSpeedIsActive = false;
+ maUvAnimationScrollYSpeedIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationScrollYSpeed.disabled = true;
+ maUvAnimationScrollYSpeedSlider.disabled = true;
+ } else {
+ maMaterialData.uvAnimationScrollYSpeedIsActive = true;
+ maUvAnimationScrollYSpeedIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationScrollYSpeed.disabled = false;
+ maUvAnimationScrollYSpeedSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationScrollYSpeedSlider.oninput = function() {
+ maUvAnimationScrollYSpeed.value = maUvAnimationScrollYSpeedSlider.value/1000;
+ maMaterialData.uvAnimationScrollYSpeed = parseFloat(maUvAnimationScrollYSpeed.value);
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationRotationSpeedIsActive.onclick = function() {
+ if (maMaterialData.uvAnimationRotationSpeedIsActive) {
+ maMaterialData.uvAnimationRotationSpeedIsActive = false;
+ maUvAnimationRotationSpeedIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationRotationSpeed.disabled = true;
+ maUvAnimationRotationSpeedSlider.disabled = true;
+ } else {
+ maMaterialData.uvAnimationRotationSpeedIsActive = true;
+ maUvAnimationRotationSpeedIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationRotationSpeed.disabled = false;
+ maUvAnimationRotationSpeedSlider.disabled = false;
+ }
+ maGenerateJsonAndSave();
+ };
+
+ maUvAnimationRotationSpeedSlider.oninput = function() {
+ maUvAnimationRotationSpeed.value = maUvAnimationRotationSpeedSlider.value/1000;
+ maMaterialData.uvAnimationRotationSpeed = parseFloat(maUvAnimationRotationSpeed.value);
+ maGenerateJsonAndSave();
+ };
+
+ maProcedural.oninput = function() {
+ let testJsonData;
+ if (maProcedural.value === "") {
+ maAddProceduralTemplate.disabled = false;
+ } else {
+ try {
+ testJsonData = JSON.parse(maProcedural.value);
+ } catch (e) {
+ maProcedural.style.color = "#ff0000";
+ return;
+ }
+ }
+ maProcedural.style.color = "#000000";
+ maMaterialData.procedural = maProcedural.value;
+ maGenerateJsonAndSave();
+ };
+ maAddProceduralTemplate.onclick = function() {
+ if (maMaterialData.procedural === "") {
+ let template = {
+ "version": 3,
+ "fragmentShaderURL": "
",
+ "uniforms": {},
+ "channels": []
+ };
+ maProcedural.value = JSON.stringify(template, null, 4);
+ maAddProceduralTemplate.disabled = true;
+ maProcedural.oninput();
+ }
+ };
maCullFaceModeBack.oninput = function() {
maMaterialData.cullFaceMode = maCullFaceModeBack.value;
maGenerateJsonAndSave();
@@ -338,6 +949,22 @@ function initiateMaUi() {
maGenerateJsonAndSave();
};
+ maModelHifiPbr.oninput = function() {
+ maMaterialData.model = maModelHifiPbr.value;
+ maFieldContextualDisplayer();
+ maGenerateJsonAndSave();
+ };
+ maModelVrmMtoon.oninput = function() {
+ maMaterialData.model = maModelVrmMtoon.value;
+ maFieldContextualDisplayer();
+ maGenerateJsonAndSave();
+ };
+ maModelHifiShaderSimple.oninput = function() {
+ maMaterialData.model = maModelHifiShaderSimple.value;
+ maFieldContextualDisplayer();
+ maGenerateJsonAndSave();
+ };
+
var maAlbedoColorPickerID = "#ma-albedo-colorPicker";
maAlbedoColorPickerSel = $(maAlbedoColorPickerID).colpick({
colorScheme: 'dark',
@@ -389,27 +1016,157 @@ function initiateMaUi() {
}
}
});
+
+ var maShadeColorPickerID = "#ma-shade-colorPicker";
+ maShadeColorPickerSel = $(maShadeColorPickerID).colpick({
+ colorScheme: 'dark',
+ layout: 'rgbhex',
+ color: '000000',
+ submit: false,
+ onShow: function(colpick) {
+ $(maShadeColorPickerID).colpickSetColor({
+ "r": maMaterialData.shade[0] * 255,
+ "g": maMaterialData.shade[1] * 255,
+ "b": maMaterialData.shade[2] * 255,
+ });
+ $(maShadeColorPickerID).attr('active', 'true');
+ },
+ onHide: function(colpick) {
+ $(maShadeColorPickerID).attr('active', 'false');
+ },
+ onChange: function(hsb, hex, rgb, el) {
+ $(el).css('background-color', '#' + hex);
+ if ($(maShadeColorPickerID).attr('active') === 'true') {
+ maMaterialData.shade = [(rgb.r/255), (rgb.g/255), (rgb.b/255)];
+ maGenerateJsonAndSave();
+ }
+ }
+ });
+
+ var maMatcapColorPickerID = "#ma-matcap-colorPicker";
+ maMatcapColorPickerSel = $(maMatcapColorPickerID).colpick({
+ colorScheme: 'dark',
+ layout: 'rgbhex',
+ color: '000000',
+ submit: false,
+ onShow: function(colpick) {
+ $(maMatcapColorPickerID).colpickSetColor({
+ "r": maMaterialData.matcap[0] * 255,
+ "g": maMaterialData.matcap[1] * 255,
+ "b": maMaterialData.matcap[2] * 255,
+ });
+ $(maMatcapColorPickerID).attr('active', 'true');
+ },
+ onHide: function(colpick) {
+ $(maMatcapColorPickerID).attr('active', 'false');
+ },
+ onChange: function(hsb, hex, rgb, el) {
+ $(el).css('background-color', '#' + hex);
+ if ($(maMatcapColorPickerID).attr('active') === 'true') {
+ maMaterialData.matcap = [(rgb.r/255), (rgb.g/255), (rgb.b/255)];
+ maGenerateJsonAndSave();
+ }
+ }
+ });
+
+ var maParametricRimColorPickerID = "#ma-parametricRim-colorPicker";
+ maParametricRimColorPickerSel = $(maParametricRimColorPickerID).colpick({
+ colorScheme: 'dark',
+ layout: 'rgbhex',
+ color: '000000',
+ submit: false,
+ onShow: function(colpick) {
+ $(maParametricRimColorPickerID).colpickSetColor({
+ "r": maMaterialData.parametricRim[0] * 255,
+ "g": maMaterialData.parametricRim[1] * 255,
+ "b": maMaterialData.parametricRim[2] * 255,
+ });
+ $(maParametricRimColorPickerID).attr('active', 'true');
+ },
+ onHide: function(colpick) {
+ $(maParametricRimColorPickerID).attr('active', 'false');
+ },
+ onChange: function(hsb, hex, rgb, el) {
+ $(el).css('background-color', '#' + hex);
+ if ($(maParametricRimColorPickerID).attr('active') === 'true') {
+ maMaterialData.parametricRim = [(rgb.r/255), (rgb.g/255), (rgb.b/255)];
+ maGenerateJsonAndSave();
+ }
+ }
+ });
+
+/* ############# Not supported yet, but the code is ready #########################
+
+ var maOutlineColorPickerID = "#ma-outline-colorPicker";
+ maOutlineColorPickerSel = $(maOutlineColorPickerID).colpick({
+ colorScheme: 'dark',
+ layout: 'rgbhex',
+ color: '000000',
+ submit: false,
+ onShow: function(colpick) {
+ $(maOutlineColorPickerID).colpickSetColor({
+ "r": maMaterialData.outline[0] * 255,
+ "g": maMaterialData.outline[1] * 255,
+ "b": maMaterialData.outline[2] * 255,
+ });
+ $(maOutlineColorPickerID).attr('active', 'true');
+ },
+ onHide: function(colpick) {
+ $(maOutlineColorPickerID).attr('active', 'false');
+ },
+ onChange: function(hsb, hex, rgb, el) {
+ $(el).css('background-color', '#' + hex);
+ if ($(maOutlineColorPickerID).attr('active') === 'true') {
+ maMaterialData.outline = [(rgb.r/255), (rgb.g/255), (rgb.b/255)];
+ maGenerateJsonAndSave();
+ }
+ }
+ });
+//##############################################################################
+*/
+
}
function loadDataInMaUi(materialDataPropertyValue) {
var entityMaterialData, materialDefinition;
- try {
- entityMaterialData = JSON.parse(materialDataPropertyValue);
- }
- catch(e) {
+ var mapToUse;
+
+ if (materialDataPropertyValue === "" || materialDataPropertyValue === "{}") {
entityMaterialData = {
"materials":{}
};
+ } else {
+ try {
+ entityMaterialData = JSON.parse(materialDataPropertyValue);
+ }
+ catch(e) {
+ entityMaterialData = {
+ "materials":{}
+ };
+ }
}
-
+
if (entityMaterialData.materials.length === undefined) {
materialDefinition = entityMaterialData.materials;
} else {
materialDefinition = entityMaterialData.materials[0];
}
- //MODEL (value other than "hifi_pbr" are not supposed to get the button, so we can assume.)
- maMaterialData.model === "hifi_pbr";
+ //MODEL
+ maMaterialData.model = materialDefinition.model || DEFAULT_MODEL;
+ switch (maMaterialData.model) {
+ case "hifi_pbr":
+ maModelHifiPbr.checked = true;
+ break;
+ case "vrm_mtoon":
+ maModelVrmMtoon.checked = true;
+ break;
+ case "hifi_shader_simple":
+ maModelHifiShaderSimple.checked = true;
+ break;
+ default:
+ alert("ERROR: Unrecognized material model. (model = '" + maMaterialData.model + "')");
+ }
//NAME
if (materialDefinition.name !== undefined) {
@@ -440,7 +1197,9 @@ function loadDataInMaUi(materialDataPropertyValue) {
maAlbedoColorPicker.style.backgroundColor = maGetRGB(maMaterialData.albedo);
//ALBEDO MAP
- if (materialDefinition.defaultFallthrough === true && materialDefinition.albedoMap === undefined) {
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.albedoMap === undefined
+ && (materialDefinition.model === "hifi_pbr" || materialDefinition.model === "vrm_mtoon" )) {
maMaterialData.albedoMapIsActive = false;
maAlbedoMapIsActive.className = "uiMaterialAssistant-inactive";
maAlbedoMap.disabled = true;
@@ -458,20 +1217,44 @@ function loadDataInMaUi(materialDataPropertyValue) {
maAlbedoMap.value = maMaterialData.albedoMap;
//METALLIC
+ if (materialDefinition.metallicMap !== undefined && materialDefinition.specularMap !== undefined) {
+ if (JSON.stringify(materialDefinition).indexOf("metallicMap") > JSON.stringify(materialDefinition).indexOf("specularMap")) {
+ delete materialDefinition.specularMap;
+ mapToUse = materialDefinition.metallicMap;
+ maUseSpecular.checked = false;
+ } else {
+ delete materialDefinition.metallicMap;
+ mapToUse = materialDefinition.specularMap;
+ maUseSpecular.checked = true;
+ }
+ } else if (materialDefinition.metallicMap === undefined && materialDefinition.specularMap === undefined) {
+ mapToUse = materialDefinition.metallicMap;
+ maUseSpecular.checked = false;
+ } else if (materialDefinition.specularMap === undefined) {
+ mapToUse = materialDefinition.metallicMap;
+ maUseSpecular.checked = false;
+ } else {
+ mapToUse = materialDefinition.specularMap;
+ maUseSpecular.checked = true;
+ }
+
if (materialDefinition.defaultFallthrough === true
&& materialDefinition.metallic === undefined
- && materialDefinition.metallicMap === undefined) {
+ && mapToUse === undefined
+ && materialDefinition.model === "hifi_pbr") {
maMaterialData.metallicIsActive = false;
maMetallicIsActive.className = "uiMaterialAssistant-inactive";
maMetallic.disabled = true;
maMetallicSlider.disabled = true;
maMetallicMap.disabled = true;
+ maUseSpecular.disabled = true;
} else {
maMaterialData.metallicIsActive = true;
maMetallicIsActive.className = "uiMaterialAssistant-active";
maMetallic.disabled = false;
maMetallicSlider.disabled = false;
maMetallicMap.disabled = false;
+ maUseSpecular.disabled = false;
}
if (materialDefinition.metallic !== undefined) {
@@ -482,28 +1265,53 @@ function loadDataInMaUi(materialDataPropertyValue) {
maMetallic.value = maMaterialData.metallic;
maMetallicSlider.value = Math.floor(maMaterialData.metallic * 1000);
- if (materialDefinition.metallicMap !== undefined) {
- maMaterialData.metallicMap = materialDefinition.metallicMap;
+ if (mapToUse !== undefined) {
+ maMaterialData.metallicMap = mapToUse;
} else {
maMaterialData.metallicMap = "";
}
maMetallicMap.value = maMaterialData.metallicMap;
+ maMaterialData.useSpecular = maUseSpecular.checked;
//ROUGHNESS
+ if (materialDefinition.roughnessMap !== undefined && materialDefinition.glossMap !== undefined) {
+ if (JSON.stringify(materialDefinition).indexOf("roughnessMap") > JSON.stringify(materialDefinition).indexOf("glossMap")) {
+ delete materialDefinition.glossMap;
+ mapToUse = materialDefinition.roughnessMap;
+ maUseGloss.checked = false;
+ } else {
+ delete materialDefinition.roughnessMap;
+ mapToUse = materialDefinition.glossMap;
+ maUseGloss.checked = true;
+ }
+ } else if (materialDefinition.roughnessMap === undefined && materialDefinition.glossMap === undefined) {
+ mapToUse = materialDefinition.roughnessMap;
+ maUseGloss.checked = false;
+ } else if (materialDefinition.glossMap === undefined) {
+ mapToUse = materialDefinition.roughnessMap;
+ maUseGloss.checked = false;
+ } else {
+ mapToUse = materialDefinition.glossMap;
+ maUseGloss.checked = true;
+ }
+
if (materialDefinition.defaultFallthrough === true
&& materialDefinition.roughness === undefined
- && materialDefinition.roughnessMap === undefined) {
+ && mapToUse === undefined
+ && materialDefinition.model === "hifi_pbr") {
maMaterialData.roughnessIsActive = false;
maRoughnessIsActive.className = "uiMaterialAssistant-inactive";
maRoughness.disabled = true;
maRoughnessSlider.disabled = true;
maRoughnessMap.disabled = true;
+ maUseGloss.disabled = true;
} else {
maMaterialData.roughnessIsActive = true;
maRoughnessIsActive.className = "uiMaterialAssistant-active";
maRoughness.disabled = false;
maRoughnessSlider.disabled = false;
maRoughnessMap.disabled = false;
+ maUseGloss.disabled = false;
}
if (materialDefinition.roughness !== undefined) {
@@ -514,30 +1322,57 @@ function loadDataInMaUi(materialDataPropertyValue) {
maRoughness.value = maMaterialData.roughness;
maRoughnessSlider.value = Math.floor(maMaterialData.roughness * 1000);
- if (materialDefinition.roughnessMap !== undefined) {
- maMaterialData.roughnessMap = materialDefinition.roughnessMap;
+ if (mapToUse !== undefined) {
+ maMaterialData.roughnessMap = mapToUse;
} else {
maMaterialData.roughnessMap = "";
}
maRoughnessMap.value = maMaterialData.roughnessMap;
+ maMaterialData.useGloss = maUseGloss.checked;
//NORMAL MAP
- if (materialDefinition.defaultFallthrough === true && materialDefinition.normalMap === undefined) {
+ if (materialDefinition.normalMap !== undefined && materialDefinition.bumpMap !== undefined) {
+ if (JSON.stringify(materialDefinition).indexOf("normalMap") > JSON.stringify(materialDefinition).indexOf("bumpMap")) {
+ delete materialDefinition.bumpMap;
+ mapToUse = materialDefinition.normalMap;
+ maUseBump.checked = false;
+ } else {
+ delete materialDefinition.normalMap;
+ mapToUse = materialDefinition.bumpMap;
+ maUseBump.checked = true;
+ }
+ } else if (materialDefinition.normalMap === undefined && materialDefinition.bumpMap === undefined) {
+ mapToUse = materialDefinition.normalMap;
+ maUseBump.checked = false;
+ } else if (materialDefinition.bumpMap === undefined) {
+ mapToUse = materialDefinition.normalMap;
+ maUseBump.checked = false;
+ } else {
+ mapToUse = materialDefinition.bumpMap;
+ maUseBump.checked = true;
+ }
+
+ if (materialDefinition.defaultFallthrough === true &&
+ mapToUse === undefined &&
+ (materialDefinition.model === "hifi_pbr" || materialDefinition.model === "vrm_mtoon")) {
maMaterialData.normalMapIsActive = false;
maNormalMapIsActive.className = "uiMaterialAssistant-inactive";
maNormalMap.disabled = true;
+ maUseBump.disabled = true;
} else {
maMaterialData.normalMapIsActive = true;
maNormalMapIsActive.className = "uiMaterialAssistant-active";
maNormalMap.disabled = false;
+ maUseBump.disabled = false;
}
- if (materialDefinition.normalMap !== undefined) {
- maMaterialData.normalMap = materialDefinition.normalMap;
+ if (mapToUse !== undefined) {
+ maMaterialData.normalMap = mapToUse;
} else {
maMaterialData.normalMap = "";
}
maNormalMap.value = maMaterialData.normalMap;
+ maMaterialData.useBump = maUseBump.checked;
//OPACITY
if (materialDefinition.defaultFallthrough === true
@@ -588,7 +1423,7 @@ function loadDataInMaUi(materialDataPropertyValue) {
maOpacityMapModeBlend.checked = true;
break;
default:
- alert("ERROR: opacityMapMode = '" + maMaterialData.opacityMapMode + "'. Something has been broken in the code.");
+ alert("ERROR: Unrecognized material opacityMapMode. (opacityMapMode = '" + maMaterialData.opacityMapMode + "')");
}
if (materialDefinition.opacityCutoff !== undefined) {
@@ -602,7 +1437,8 @@ function loadDataInMaUi(materialDataPropertyValue) {
//EMISSIVE
if (materialDefinition.defaultFallthrough === true
&& materialDefinition.emissive === undefined
- && materialDefinition.emissiveMap === undefined) {
+ && materialDefinition.emissiveMap === undefined
+ && (materialDefinition.model === "hifi_pbr" || materialDefinition.model === "vrm_mtoon")) {
maMaterialData.emissiveIsActive = false;
maEmissiveIsActive.className = "uiMaterialAssistant-inactive";
maBloom.disabled = true;
@@ -649,7 +1485,8 @@ function loadDataInMaUi(materialDataPropertyValue) {
//SCATTERING
if (materialDefinition.defaultFallthrough === true
&& materialDefinition.scattering === undefined
- && materialDefinition.scatteringMap === undefined) {
+ && materialDefinition.scatteringMap === undefined
+ && materialDefinition.model === "hifi_pbr") {
maMaterialData.scatteringIsActive = false;
maScatteringIsActive.className = "uiMaterialAssistant-inactive";
maScattering.disabled = true;
@@ -679,7 +1516,8 @@ function loadDataInMaUi(materialDataPropertyValue) {
maScatteringMap.value = maMaterialData.scatteringMap;
//OCCLUSION MAP
- if (materialDefinition.defaultFallthrough === true && materialDefinition.occlusionMap === undefined) {
+ if (materialDefinition.defaultFallthrough === true && materialDefinition.occlusionMap === undefined
+ && materialDefinition.model === "hifi_pbr") {
maMaterialData.occlusionMapIsActive = false;
maOcclusionMapIsActive.className = "uiMaterialAssistant-inactive";
maOcclusionMap.disabled = true;
@@ -695,6 +1533,468 @@ function loadDataInMaUi(materialDataPropertyValue) {
maMaterialData.occlusionMap = "";
}
maOcclusionMap.value = maMaterialData.occlusionMap;
+
+ //LIGHT MAP
+ if (materialDefinition.defaultFallthrough === true &&
+ materialDefinition.lightMap === undefined &&
+ materialDefinition.model === "hifi_pbr") {
+ maMaterialData.lightMapIsActive = false;
+ maLightMapIsActive.className = "uiMaterialAssistant-inactive";
+ maLightMap.disabled = true;
+ } else {
+ maMaterialData.lightMapIsActive = true;
+ maLightMapIsActive.className = "uiMaterialAssistant-active";
+ maLightMap.disabled = false;
+ }
+
+ if (materialDefinition.lightMap !== undefined) {
+ maMaterialData.lightMap = materialDefinition.lightMap;
+ } else {
+ maMaterialData.lightMap = "";
+ }
+ maLightMap.value = maMaterialData.lightMap;
+
+ //SHADE
+ if (materialDefinition.defaultFallthrough === true && materialDefinition.shade === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.shadeIsActive = false;
+ maShadeIsActive.className = "uiMaterialAssistant-inactive";
+ maShadeColorPicker.style.pointerEvents = 'none';
+ maShadeColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.shadeIsActive = true;
+ maShadeIsActive.className = "uiMaterialAssistant-active";
+ maShadeColorPicker.style.pointerEvents = 'auto';
+ maShadeColorPicker.style.backgroundColor = maGetRGB(maMaterialData.shade);
+ }
+
+ if (materialDefinition.shade !== undefined) {
+ maMaterialData.shade = materialDefinition.shade;
+ } else {
+ maMaterialData.shade = DEFAULT_SHADE;
+ }
+ maShadeColorPicker.style.backgroundColor = maGetRGB(maMaterialData.shade);
+
+ //SHADE MAP
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.shadeMap === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.shadeMapIsActive = false;
+ maShadeMapIsActive.className = "uiMaterialAssistant-inactive";
+ maShadeMap.disabled = true;
+ } else {
+ maMaterialData.shadeMapIsActive = true;
+ maShadeMapIsActive.className = "uiMaterialAssistant-active";
+ maShadeMap.disabled = false;
+ }
+
+ if (materialDefinition.shadeMap !== undefined) {
+ maMaterialData.shadeMap = materialDefinition.shadeMap;
+ } else {
+ maMaterialData.shadeMap = "";
+ }
+ maShadeMap.value = maMaterialData.shadeMap;
+
+ //MATCAP
+ if (materialDefinition.defaultFallthrough === true && materialDefinition.matcap === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.matcapIsActive = false;
+ maMatcapIsActive.className = "uiMaterialAssistant-inactive";
+ maMatcapColorPicker.style.pointerEvents = 'none';
+ maMatcapColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.matcapIsActive = true;
+ maMatcapIsActive.className = "uiMaterialAssistant-active";
+ maMatcapColorPicker.style.pointerEvents = 'auto';
+ maMatcapColorPicker.style.backgroundColor = maGetRGB(maMaterialData.matcap);
+ }
+
+ if (materialDefinition.matcap !== undefined) {
+ maMaterialData.matcap = materialDefinition.matcap;
+ } else {
+ maMaterialData.matcap = DEFAULT_MATCAP;
+ }
+ maMatcapColorPicker.style.backgroundColor = maGetRGB(maMaterialData.matcap);
+
+ //MATCAP MAP
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.matcapMap === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.matcapMapIsActive = false;
+ maMatcapMapIsActive.className = "uiMaterialAssistant-inactive";
+ maMatcapMap.disabled = true;
+ } else {
+ maMaterialData.matcapMapIsActive = true;
+ maMatcapMapIsActive.className = "uiMaterialAssistant-active";
+ maMatcapMap.disabled = false;
+ }
+
+ if (materialDefinition.matcapMap !== undefined) {
+ maMaterialData.matcapMap = materialDefinition.matcapMap;
+ } else {
+ maMaterialData.matcapMap = "";
+ }
+ maMatcapMap.value = maMaterialData.matcapMap;
+
+ //SHADING SHIFT
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.shadingShift === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.shadingShiftIsActive = false;
+ maShadingShiftIsActive.className = "uiMaterialAssistant-inactive";
+ maShadingShift.disabled = true;
+ maShadingShiftSlider.disabled = true;
+ } else {
+ maMaterialData.shadingShiftIsActive = true;
+ maShadingShiftIsActive.className = "uiMaterialAssistant-active";
+ maShadingShift.disabled = false;
+ maShadingShiftSlider.disabled = false;
+ }
+
+ if (materialDefinition.shadingShift !== undefined) {
+ maMaterialData.shadingShift = materialDefinition.shadingShift;
+ } else {
+ maMaterialData.shadingShift = DEFAULT_SHADING_SHIFT;
+ }
+ maShadingShift.value = maMaterialData.shadingShift;
+ maShadingShiftSlider.value = Math.floor(maMaterialData.shadingShift * 1000);
+
+ //SHADING SHIFT MAP
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.shadingShiftMap === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.shadingShiftMapIsActive = false;
+ maShadingShiftMapIsActive.className = "uiMaterialAssistant-inactive";
+ maShadingShiftMap.disabled = true;
+ } else {
+ maMaterialData.shadingShiftMapIsActive = true;
+ maShadingShiftMapIsActive.className = "uiMaterialAssistant-active";
+ maShadingShiftMap.disabled = false;
+ }
+
+ if (materialDefinition.shadingShiftMap !== undefined) {
+ maMaterialData.shadingShiftMap = materialDefinition.shadingShiftMap;
+ } else {
+ maMaterialData.shadingShiftMap = "";
+ }
+ maShadingShiftMap.value = maMaterialData.shadingShiftMap;
+
+ //SHADING TOONY
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.shadingToony === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.shadingToonyIsActive = false;
+ maShadingToonyIsActive.className = "uiMaterialAssistant-inactive";
+ maShadingToony.disabled = true;
+ maShadingToonySlider.disabled = true;
+ } else {
+ maMaterialData.shadingToonyIsActive = true;
+ maShadingToonyIsActive.className = "uiMaterialAssistant-active";
+ maShadingToony.disabled = false;
+ maShadingToonySlider.disabled = false;
+ }
+
+ if (materialDefinition.shadingToony !== undefined) {
+ maMaterialData.shadingToony = materialDefinition.shadingToony;
+ } else {
+ maMaterialData.shadingToony = DEFAULT_SHADING_TOONY;
+ }
+ maShadingToony.value = maMaterialData.shadingToony;
+ maShadingToonySlider.value = Math.floor(maMaterialData.shadingToony * 1000);
+
+ //PARAMETRIC RIM
+ if (materialDefinition.defaultFallthrough === true && materialDefinition.parametricRim === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.parametricRimIsActive = false;
+ maParametricRimIsActive.className = "uiMaterialAssistant-inactive";
+ maParametricRimColorPicker.style.pointerEvents = 'none';
+ maParametricRimColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.parametricRimIsActive = true;
+ maParametricRimIsActive.className = "uiMaterialAssistant-active";
+ maParametricRimColorPicker.style.pointerEvents = 'auto';
+ maParametricRimColorPicker.style.backgroundColor = maGetRGB(maMaterialData.parametricRim);
+ }
+
+ if (materialDefinition.parametricRim !== undefined) {
+ maMaterialData.parametricRim = materialDefinition.parametricRim;
+ } else {
+ maMaterialData.parametricRim = DEFAULT_PARAMETRIC_RIM;
+ }
+ maParametricRimColorPicker.style.backgroundColor = maGetRGB(maMaterialData.parametricRim);
+
+ //RIM MAP
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.rimMap === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.rimMapIsActive = false;
+ maRimMapIsActive.className = "uiMaterialAssistant-inactive";
+ maRimMap.disabled = true;
+ } else {
+ maMaterialData.rimMapIsActive = true;
+ maRimMapIsActive.className = "uiMaterialAssistant-active";
+ maRimMap.disabled = false;
+ }
+
+ if (materialDefinition.rimMap !== undefined) {
+ maMaterialData.rimMap = materialDefinition.rimMap;
+ } else {
+ maMaterialData.rimMap = "";
+ }
+ maRimMap.value = maMaterialData.rimMap;
+
+ //RIM LIGHTING MIX
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.rimLightingMix === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.rimLightingMixIsActive = false;
+ maRimLightingMixIsActive.className = "uiMaterialAssistant-inactive";
+ maRimLightingMix.disabled = true;
+ maRimLightingMixSlider.disabled = true;
+ } else {
+ maMaterialData.rimLightingMixIsActive = true;
+ maRimLightingMixIsActive.className = "uiMaterialAssistant-active";
+ maRimLightingMix.disabled = false;
+ maRimLightingMixSlider.disabled = false;
+ }
+
+ if (materialDefinition.rimLightingMix !== undefined) {
+ maMaterialData.rimLightingMix = materialDefinition.rimLightingMix;
+ } else {
+ maMaterialData.rimLightingMix = DEFAULT_RIM_LIGHTING_MIX;
+ }
+ maRimLightingMix.value = maMaterialData.rimLightingMix;
+ maRimLightingMixSlider.value = Math.floor(maMaterialData.rimLightingMix * 1000);
+
+ //PARAMETRIC RIM FRESNEL POWER
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.parametricRimFresnelPower === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.parametricRimFresnelPowerIsActive = false;
+ maParametricRimFresnelPowerIsActive.className = "uiMaterialAssistant-inactive";
+ maParametricRimFresnelPower.disabled = true;
+ maParametricRimFresnelPowerSlider.disabled = true;
+ } else {
+ maMaterialData.parametricRimFresnelPowerIsActive = true;
+ maParametricRimFresnelPowerIsActive.className = "uiMaterialAssistant-active";
+ maParametricRimFresnelPower.disabled = false;
+ maParametricRimFresnelPowerSlider.disabled = false;
+ }
+
+ if (materialDefinition.parametricRimFresnelPower !== undefined) {
+ maMaterialData.parametricRimFresnelPower = materialDefinition.parametricRimFresnelPower;
+ } else {
+ maMaterialData.parametricRimFresnelPower = DEFAULT_PARAMETRIC_RIM_FRESNEL_POWER;
+ }
+ maParametricRimFresnelPower.value = maMaterialData.parametricRimFresnelPower;
+ maParametricRimFresnelPowerSlider.value = Math.floor(maMaterialData.parametricRimFresnelPower * 1000);
+
+ //PARAMETRIC RIM LIFT
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.parametricRimLift === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.parametricRimLiftIsActive = false;
+ maParametricRimLiftIsActive.className = "uiMaterialAssistant-inactive";
+ maParametricRimLift.disabled = true;
+ maParametricRimLiftSlider.disabled = true;
+ } else {
+ maMaterialData.parametricRimLiftIsActive = true;
+ maParametricRimLiftIsActive.className = "uiMaterialAssistant-active";
+ maParametricRimLift.disabled = false;
+ maParametricRimLiftSlider.disabled = false;
+ }
+
+ if (materialDefinition.parametricRimLift !== undefined) {
+ maMaterialData.parametricRimLift = materialDefinition.parametricRimLift;
+ } else {
+ maMaterialData.parametricRimLift = DEFAULT_PARAMETRIC_RIM_LIFT;
+ }
+ maParametricRimLift.value = maMaterialData.parametricRimLift;
+ maParametricRimLiftSlider.value = Math.floor(maMaterialData.parametricRimLift * 1000);
+
+/* ######## Not supported yet, but the code is ready #########################################
+ //OUTLINE WIDTH MODE
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.outlineWidthMode === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.outlineWidthModeIsActive = false;
+ maOutlineWidthModeIsActive.className = "uiMaterialAssistant-inactive";
+ maOutlineWidthModeNone.disabled = true;
+ maOutlineWidthModeWorld.disabled = true;
+ maOutlineWidthModeScreen.disabled = true;
+ } else {
+ maMaterialData.outlineWidthModeIsActive = true;
+ maOutlineWidthModeIsActive.className = "uiMaterialAssistant-active";
+ maOutlineWidthModeNone.disabled = false;
+ maOutlineWidthModeWorld.disabled = false;
+ maOutlineWidthModeScreen.disabled = false;
+ }
+
+ if (materialDefinition.outlineWidthMode !== undefined) {
+ maMaterialData.outlineWidthMode = materialDefinition.outlineWidthMode;
+ } else {
+ maMaterialData.outlineWidthMode = DEFAULT_OUTLINE_WIDTH_MODE;
+ }
+
+ switch (maMaterialData.outlineWidthMode) {
+ case "none":
+ maOutlineWidthModeNone.checked = true;
+ break;
+ case "worldCoordinates":
+ maOutlineWidthModeWorld.checked = true;
+ break;
+ case "screenCoordinates":
+ maOutlineWidthModeScreen.checked = true;
+ break;
+ default:
+ alert("ERROR: Unrecognized material outlineWidthMode. (outlineWidthMode = '" + maMaterialData.outlineWidthMode + "')");
+ }
+
+ //OUTLINE WIDTH
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.outlineWidth === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.outlineWidthIsActive = false;
+ maOutlineWidthIsActive.className = "uiMaterialAssistant-inactive";
+ maOutlineWidth.disabled = true;
+ maOutlineWidthSlider.disabled = true;
+ } else {
+ maMaterialData.outlineWidthIsActive = true;
+ maOutlineWidthIsActive.className = "uiMaterialAssistant-active";
+ maOutlineWidth.disabled = false;
+ maOutlineWidthSlider.disabled = false;
+ }
+
+ if (materialDefinition.outlineWidth !== undefined) {
+ maMaterialData.outlineWidth = materialDefinition.outlineWidth;
+ } else {
+ maMaterialData.outlineWidth = DEFAULT_OUTLINE_WIDTH;
+ }
+ maOutlineWidth.value = maMaterialData.outlineWidth;
+ maOutlineWidthSlider.value = Math.floor(maMaterialData.outlineWidth * 1000);
+
+ //OUTLINE
+ if (materialDefinition.defaultFallthrough === true && materialDefinition.outline === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.outlineIsActive = false;
+ maOutlineIsActive.className = "uiMaterialAssistant-inactive";
+ maOutlineColorPicker.style.pointerEvents = 'none';
+ maOutlineColorPicker.style.backgroundColor = "#555555";
+ } else {
+ maMaterialData.outlineIsActive = true;
+ maOutlineIsActive.className = "uiMaterialAssistant-active";
+ maOutlineColorPicker.style.pointerEvents = 'auto';
+ maOutlineColorPicker.style.backgroundColor = maGetRGB(maMaterialData.outline);
+ }
+
+ if (materialDefinition.outline !== undefined) {
+ maMaterialData.outline = materialDefinition.outline;
+ } else {
+ maMaterialData.outline = DEFAULT_OUTLINE;
+ }
+ maOutlineColorPicker.style.backgroundColor = maGetRGB(maMaterialData.outline);
+
+//##############################################################
+*/
+
+ //UV ANIMATION MASK MAP
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.uvAnimationMaskMap === undefined
+ && materialDefinition.model === "vrm_mtoon" ) {
+ maMaterialData.uvAnimationMaskMapIsActive = false;
+ maUvAnimationMaskMapIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationMaskMap.disabled = true;
+ } else {
+ maMaterialData.uvAnimationMaskMapIsActive = true;
+ maUvAnimationMaskMapIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationMaskMap.disabled = false;
+ }
+
+ if (materialDefinition.uvAnimationMaskMap !== undefined) {
+ maMaterialData.uvAnimationMaskMap = materialDefinition.uvAnimationMaskMap;
+ } else {
+ maMaterialData.uvAnimationMaskMap = "";
+ }
+ maUvAnimationMaskMap.value = maMaterialData.uvAnimationMaskMap;
+
+ //UV ANIMATION SCROLL X SPEED
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.uvAnimationScrollXSpeed === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.uvAnimationScrollXSpeedIsActive = false;
+ maUvAnimationScrollXSpeedIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationScrollXSpeed.disabled = true;
+ maUvAnimationScrollXSpeedSlider.disabled = true;
+ } else {
+ maMaterialData.uvAnimationScrollXSpeedIsActive = true;
+ maUvAnimationScrollXSpeedIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationScrollXSpeed.disabled = false;
+ maUvAnimationScrollXSpeedSlider.disabled = false;
+ }
+
+ if (materialDefinition.uvAnimationScrollXSpeed !== undefined) {
+ maMaterialData.uvAnimationScrollXSpeed = materialDefinition.uvAnimationScrollXSpeed;
+ } else {
+ maMaterialData.uvAnimationScrollXSpeed = DEFAULT_UV_ANIMATION_SCROLL_X_SPEED;
+ }
+ maUvAnimationScrollXSpeed.value = maMaterialData.uvAnimationScrollXSpeed;
+ maUvAnimationScrollXSpeedSlider.value = Math.floor(maMaterialData.uvAnimationScrollXSpeed * 1000);
+
+ //UV ANIMATION SCROLL Y SPEED
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.uvAnimationScrollYSpeed === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.uvAnimationScrollYSpeedIsActive = false;
+ maUvAnimationScrollYSpeedIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationScrollYSpeed.disabled = true;
+ maUvAnimationScrollYSpeedSlider.disabled = true;
+ } else {
+ maMaterialData.uvAnimationScrollYSpeedIsActive = true;
+ maUvAnimationScrollYSpeedIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationScrollYSpeed.disabled = false;
+ maUvAnimationScrollYSpeedSlider.disabled = false;
+ }
+
+ if (materialDefinition.uvAnimationScrollYSpeed !== undefined) {
+ maMaterialData.uvAnimationScrollYSpeed = materialDefinition.uvAnimationScrollYSpeed;
+ } else {
+ maMaterialData.uvAnimationScrollYSpeed = DEFAULT_UV_ANIMATION_SCROLL_Y_SPEED;
+ }
+ maUvAnimationScrollYSpeed.value = maMaterialData.uvAnimationScrollYSpeed;
+ maUvAnimationScrollYSpeedSlider.value = Math.floor(maMaterialData.uvAnimationScrollYSpeed * 1000);
+
+ //UV ANIMATION ROTATION SPEED
+ if (materialDefinition.defaultFallthrough === true
+ && materialDefinition.uvAnimationRotationSpeed === undefined
+ && materialDefinition.model === "vrm_mtoon") {
+ maMaterialData.uvAnimationRotationSpeedIsActive = false;
+ maUvAnimationRotationSpeedIsActive.className = "uiMaterialAssistant-inactive";
+ maUvAnimationRotationSpeed.disabled = true;
+ maUvAnimationRotationSpeedSlider.disabled = true;
+ } else {
+ maMaterialData.uvAnimationRotationSpeedIsActive = true;
+ maUvAnimationRotationSpeedIsActive.className = "uiMaterialAssistant-active";
+ maUvAnimationRotationSpeed.disabled = false;
+ maUvAnimationRotationSpeedSlider.disabled = false;
+ }
+
+ if (materialDefinition.uvAnimationRotationSpeed !== undefined) {
+ maMaterialData.uvAnimationRotationSpeed = materialDefinition.uvAnimationRotationSpeed;
+ } else {
+ maMaterialData.uvAnimationRotationSpeed = DEFAULT_UV_ANIMATION_ROTATION_SPEED;
+ }
+ maUvAnimationRotationSpeed.value = maMaterialData.uvAnimationRotationSpeed;
+ maUvAnimationRotationSpeedSlider.value = Math.floor(maMaterialData.uvAnimationRotationSpeed * 1000);
+
+ //PROCEDURAL
+ if (materialDefinition.procedural !== undefined) {
+ maMaterialData.procedural = JSON.stringify(materialDefinition.procedural, null, 4);
+ maAddProceduralTemplate.disabled = true;
+ } else {
+ maMaterialData.procedural = "";
+ maAddProceduralTemplate.disabled = false;
+ }
+ maProcedural.value = maMaterialData.procedural;
//CULL FACE MODE
if (materialDefinition.cullFaceMode !== undefined) {
@@ -713,7 +2013,61 @@ function loadDataInMaUi(materialDataPropertyValue) {
maCullFaceModeNone.checked = true;
break;
default:
- alert("ERROR: cullFaceMode = '" + maMaterialData.cullFaceMode + "'. Something has been broken in the code.");
+ alert("ERROR: Unrecognized material cullFaceMode. (cullFaceMode = '" + maMaterialData.cullFaceMode + "')");
+ }
+
+ maFieldContextualDisplayer();
+}
+
+function maFieldContextualDisplayer() {
+ if (maMaterialData.model === "hifi_pbr") {
+ document.getElementById("maContainerAlbedo").style.display = "block";
+ document.getElementById("maContainerAlbedoMap").style.display = "block";
+ document.getElementById("maContainerMetallic").style.display = "block";
+ document.getElementById("maContainerRoughness").style.display = "block";
+ document.getElementById("maContainerNormalMap").style.display = "block";
+ document.getElementById("maContainerOpacity").style.display = "block";
+ document.getElementById("maContainerOpacityMap").style.display = "block";
+ document.getElementById("maContainerEmissive").style.display = "block";
+ document.getElementById("maContainerEmissiveMap").style.display = "block";
+ document.getElementById("maContainerUnlit").style.display = "block";
+ document.getElementById("maContainerScattering").style.display = "block";
+ document.getElementById("maContainerOcclusionMap").style.display = "block";
+ document.getElementById("maContainerLightMap").style.display = "block";
+ document.getElementById("maContainerMtoon").style.display = "none";
+ document.getElementById("maContainerShaderSimple").style.display = "none";
+ } else if (maMaterialData.model === "vrm_mtoon") {
+ document.getElementById("maContainerAlbedo").style.display = "block";
+ document.getElementById("maContainerAlbedoMap").style.display = "block";
+ document.getElementById("maContainerMetallic").style.display = "none";
+ document.getElementById("maContainerRoughness").style.display = "none";
+ document.getElementById("maContainerNormalMap").style.display = "block";
+ document.getElementById("maContainerOpacity").style.display = "block";
+ document.getElementById("maContainerOpacityMap").style.display = "block";
+ document.getElementById("maContainerEmissive").style.display = "block";
+ document.getElementById("maContainerEmissiveMap").style.display = "block";
+ document.getElementById("maContainerUnlit").style.display = "none";
+ document.getElementById("maContainerScattering").style.display = "none";
+ document.getElementById("maContainerOcclusionMap").style.display = "none";
+ document.getElementById("maContainerLightMap").style.display = "none";
+ document.getElementById("maContainerMtoon").style.display = "block";
+ document.getElementById("maContainerShaderSimple").style.display = "none";
+ } else if (maMaterialData.model === "hifi_shader_simple") {
+ document.getElementById("maContainerAlbedo").style.display = "block";
+ document.getElementById("maContainerAlbedoMap").style.display = "none";
+ document.getElementById("maContainerMetallic").style.display = "none";
+ document.getElementById("maContainerRoughness").style.display = "none";
+ document.getElementById("maContainerNormalMap").style.display = "none";
+ document.getElementById("maContainerOpacity").style.display = "block";
+ document.getElementById("maContainerOpacityMap").style.display = "none";
+ document.getElementById("maContainerEmissive").style.display = "none";
+ document.getElementById("maContainerEmissiveMap").style.display = "none";
+ document.getElementById("maContainerUnlit").style.display = "none";
+ document.getElementById("maContainerScattering").style.display = "none";
+ document.getElementById("maContainerOcclusionMap").style.display = "none";
+ document.getElementById("maContainerLightMap").style.display = "none";
+ document.getElementById("maContainerMtoon").style.display = "none";
+ document.getElementById("maContainerShaderSimple").style.display = "block";
}
}
@@ -721,128 +2075,378 @@ function maGenerateJsonAndSave() {
var newMaterial = {};
var defaultFallthrough = false;
+ //MODEL
+ newMaterial.model = maMaterialData.model;
+
//NAME
if (maMaterialData.name != "") {
newMaterial.name = maMaterialData.name;
}
- //ALBEDO & ALBEDOMAP
+ //ALBEDO
if (maMaterialData.albedoIsActive) {
newMaterial.albedo = maMaterialData.albedo;
- if (maMaterialData.albedoMap !== "") {
- newMaterial.albedoMap = maMaterialData.albedoMap;
- }
} else {
defaultFallthrough = true;
}
- //METALLIC & METALLICMAP
- if (maMaterialData.metallicIsActive) {
- if (maMaterialData.metallicMap === "") {
- newMaterial.metallic = maMaterialData.metallic;
+
+ if (maMaterialData.model === "hifi_pbr") {
+
+ //ALBEDOMAP
+ if (maMaterialData.albedoMapIsActive) {
+ newMaterial.albedoMap = maMaterialData.albedoMap || "";
} else {
- newMaterial.metallicMap = maMaterialData.metallicMap;
+ defaultFallthrough = true;
}
- } else {
- defaultFallthrough = true;
- }
-
- //ROUGHNESS & ROUGHNESSMAP
- if (maMaterialData.roughnessIsActive) {
- if (maMaterialData.roughnessMap === "") {
- newMaterial.roughness = maMaterialData.roughness;
+
+ //METALLIC & METALLICMAP
+ if (maMaterialData.metallicIsActive) {
+ if (maMaterialData.metallicMap === "") {
+ newMaterial.metallic = maMaterialData.metallic;
+ } else {
+ if (maMaterialData.useSpecular) {
+ newMaterial.specularMap = maMaterialData.metallicMap;
+ } else {
+ newMaterial.metallicMap = maMaterialData.metallicMap;
+ }
+ }
} else {
- newMaterial.roughnessMap = maMaterialData.roughnessMap;
+ defaultFallthrough = true;
}
- } else {
- defaultFallthrough = true;
- }
-
- //NORMAL MAP
- if (maMaterialData.normalMapIsActive) {
- if (maMaterialData.normalMap !== "") {
- newMaterial.normalMap = maMaterialData.normalMap;
- }
- } else {
- defaultFallthrough = true;
- }
-
- //OPACITY
- if (maMaterialData.opacityIsActive) {
- switch (maMaterialData.opacityMapMode) {
- case "OPACITY_MAP_OPAQUE":
- newMaterial.opacity = maMaterialData.opacity;
- break;
- case "OPACITY_MAP_MASK":
- newMaterial.opacityMapMode = maMaterialData.opacityMapMode;
- newMaterial.opacityMap = maMaterialData.albedoMap;
- newMaterial.opacityCutoff = maMaterialData.opacityCutoff;
- break;
- case "OPACITY_MAP_BLEND":
- newMaterial.opacityMapMode = maMaterialData.opacityMapMode;
- newMaterial.opacityMap = maMaterialData.albedoMap;
- break;
- default:
- alert("ERROR: opacityMapMode = '" + maMaterialData.opacityMapMode + "'. Something has been broken in the code.");
- }
- } else {
- defaultFallthrough = true;
- }
-
- //EMISSIVE
- if (maMaterialData.emissiveIsActive) {
- if (maMaterialData.emissiveMap === "") {
- newMaterial.emissive = scaleEmissiveByBloomFactor(maMaterialData.emissive, maMaterialData.bloom);
+
+ //ROUGHNESS & ROUGHNESSMAP
+ if (maMaterialData.roughnessIsActive) {
+ if (maMaterialData.roughnessMap === "") {
+ newMaterial.roughness = maMaterialData.roughness;
+ } else {
+ if (maMaterialData.useGloss) {
+ newMaterial.glossMap = maMaterialData.roughnessMap;
+ } else {
+ newMaterial.roughnessMap = maMaterialData.roughnessMap;
+ }
+ }
} else {
- newMaterial.emissiveMap = maMaterialData.emissiveMap;
- }
- } else {
- defaultFallthrough = true;
- }
+ defaultFallthrough = true;
+ }
- //UNLIT
- if (maMaterialData.unlit) {
- newMaterial.unlit = maMaterialData.unlit;
- }
-
- //SCATTERING
- if (maMaterialData.scatteringIsActive) {
- if (maMaterialData.scatteringMap === "") {
- newMaterial.scattering = maMaterialData.scattering;
+ //NORMAL MAP
+ if (maMaterialData.normalMapIsActive) {
+ if (maMaterialData.useBump) {
+ newMaterial.bumpMap = maMaterialData.normalMap || "";
+ } else {
+ newMaterial.normalMap = maMaterialData.normalMap || "";
+ }
} else {
- newMaterial.scatteringMap = maMaterialData.scatteringMap;
+ defaultFallthrough = true;
}
- } else {
- defaultFallthrough = true;
- }
-
- //OCCLUSION MAP
- if (maMaterialData.occlusionMapIsActive) {
- if (maMaterialData.occlusionMap !== "") {
- newMaterial.occlusionMap = maMaterialData.occlusionMap;
+
+ //OPACITY
+ if (maMaterialData.opacityIsActive) {
+ switch (maMaterialData.opacityMapMode) {
+ case "OPACITY_MAP_OPAQUE":
+ newMaterial.opacity = maMaterialData.opacity;
+ break;
+ case "OPACITY_MAP_MASK":
+ newMaterial.opacityMapMode = maMaterialData.opacityMapMode;
+ newMaterial.opacityMap = maMaterialData.albedoMap;
+ newMaterial.opacityCutoff = maMaterialData.opacityCutoff;
+ break;
+ case "OPACITY_MAP_BLEND":
+ newMaterial.opacityMapMode = maMaterialData.opacityMapMode;
+ newMaterial.opacityMap = maMaterialData.albedoMap;
+ break;
+ default:
+ alert("ERROR: Unrecognized material opacityMapMode. (opacityMapMode = '" + maMaterialData.opacityMapMode + "')");
+ }
+ } else {
+ defaultFallthrough = true;
}
- } else {
- defaultFallthrough = true;
+
+ //EMISSIVE
+ if (maMaterialData.emissiveIsActive) {
+ if (maMaterialData.emissiveMap === "") {
+ newMaterial.emissive = scaleEmissiveByBloomFactor(maMaterialData.emissive, maMaterialData.bloom);
+ } else {
+ newMaterial.emissiveMap = maMaterialData.emissiveMap;
+ }
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //UNLIT
+ if (maMaterialData.unlit) {
+ newMaterial.unlit = maMaterialData.unlit;
+ }
+
+ //SCATTERING
+ if (maMaterialData.scatteringIsActive) {
+ if (maMaterialData.scatteringMap === "") {
+ newMaterial.scattering = maMaterialData.scattering;
+ } else {
+ newMaterial.scatteringMap = maMaterialData.scatteringMap;
+ }
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //OCCLUSION MAP
+ if (maMaterialData.occlusionMapIsActive) {
+ newMaterial.occlusionMap = maMaterialData.occlusionMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //LIGHT MAP
+ if (maMaterialData.lightMapIsActive) {
+ newMaterial.lightMap = maMaterialData.lightMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ } else if (maMaterialData.model === "vrm_mtoon") {
+ //ALBEDOMAP
+ if (maMaterialData.albedoMapIsActive) {
+ newMaterial.albedoMap = maMaterialData.albedoMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //NORMAL MAP
+ if (maMaterialData.normalMapIsActive) {
+ if (maMaterialData.useBump) {
+ newMaterial.bumpMap = maMaterialData.normalMap || "";
+ } else {
+ newMaterial.normalMap = maMaterialData.normalMap || "";
+ }
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //EMISSIVE
+ if (maMaterialData.emissiveIsActive) {
+ if (maMaterialData.emissiveMap === "") {
+ newMaterial.emissive = scaleEmissiveByBloomFactor(maMaterialData.emissive, maMaterialData.bloom);
+ } else {
+ newMaterial.emissiveMap = maMaterialData.emissiveMap;
+ }
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //OPACITY
+ if (maMaterialData.opacityIsActive) {
+ switch (maMaterialData.opacityMapMode) {
+ case "OPACITY_MAP_OPAQUE":
+ newMaterial.opacity = maMaterialData.opacity;
+ break;
+ case "OPACITY_MAP_MASK":
+ newMaterial.opacityMapMode = maMaterialData.opacityMapMode;
+ newMaterial.opacityMap = maMaterialData.albedoMap;
+ newMaterial.opacityCutoff = maMaterialData.opacityCutoff;
+ break;
+ case "OPACITY_MAP_BLEND":
+ newMaterial.opacityMapMode = maMaterialData.opacityMapMode;
+ newMaterial.opacityMap = maMaterialData.albedoMap;
+ break;
+ default:
+ alert("ERROR: Unrecognized material opacityMapMode. (opacityMapMode = '" + maMaterialData.opacityMapMode + "')");
+ }
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //SHADE
+ if (maMaterialData.shadeIsActive) {
+ newMaterial.shade = maMaterialData.shade;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //SHADEMAP
+ if (maMaterialData.shadeMapIsActive) {
+ newMaterial.shadeMap = maMaterialData.shadeMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //MATCAP
+ if (maMaterialData.matcapIsActive) {
+ newMaterial.matcap = maMaterialData.matcap;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //MATCAPMAP
+ if (maMaterialData.matcapMapIsActive) {
+ newMaterial.matcapMap = maMaterialData.matcapMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+ //SHADING SHIFT
+ if (maMaterialData.shadingShiftIsActive) {
+ newMaterial.shadingShift = maMaterialData.shadingShift;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //SHADING SHIFT MAP
+ if (maMaterialData.shadingShiftMapIsActive) {
+ newMaterial.shadingShiftMap = maMaterialData.shadingShiftMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //SHADING TOONY
+ if (maMaterialData.shadingToonyIsActive) {
+ newMaterial.shadingToony = maMaterialData.shadingToony;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //PARAMETRIC RIM
+ if (maMaterialData.parametricRimIsActive) {
+ newMaterial.parametricRim = maMaterialData.parametricRim;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //RIM MAP
+ if (maMaterialData.rimMapIsActive) {
+ newMaterial.rimMap = maMaterialData.rimMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //RIM LIGHTING MIX
+ if (maMaterialData.rimLightingMixIsActive) {
+ newMaterial.rimLightingMix = maMaterialData.rimLightingMix;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //PARAMETRIC RIM FRESNEL POWER
+ if (maMaterialData.parametricRimFresnelPowerIsActive) {
+ newMaterial.parametricRimFresnelPower = maMaterialData.parametricRimFresnelPower;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //PARAMETRIC RIM LIFT
+ if (maMaterialData.parametricRimLiftIsActive) {
+ newMaterial.parametricRimLift = maMaterialData.parametricRimLift;
+ } else {
+ defaultFallthrough = true;
+ }
+/* ###################### Not yet supported but ready for it... #############################
+
+ //OUTLINE WIDTH MODE
+ if (maMaterialData.outlineWidthModeIsActive) {
+ newMaterial.outlineWidthMode = maMaterialData.outlineWidthMode;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //OUTLINE WIDTH
+ if (maMaterialData.outlineWidthIsActive) {
+ newMaterial.outlineWidth = maMaterialData.outlineWidth;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //OUTLINE
+ if (maMaterialData.outlineIsActive) {
+ newMaterial.outline = maMaterialData.outline;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ if (newMaterial.outlineWidthMode === "none") {
+ delete newMaterial.outlineWidth;
+ delete newMaterial.outline;
+ }
+
+ //#####################################################################################
+*/
+ //UV ANIMATION MASK MAP
+ if (maMaterialData.uvAnimationMaskMapIsActive) {
+ newMaterial.uvAnimationMaskMap = maMaterialData.uvAnimationMaskMap || "";
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //UV ANIMATION SCROLL X SPEED
+ if (maMaterialData.uvAnimationScrollXSpeedIsActive) {
+ newMaterial.uvAnimationScrollXSpeed = maMaterialData.uvAnimationScrollXSpeed;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //UV ANIMATION SCROLL Y SPEED
+ if (maMaterialData.uvAnimationScrollYSpeedIsActive) {
+ newMaterial.uvAnimationScrollYSpeed = maMaterialData.uvAnimationScrollYSpeed;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //UV ANIMATION ROTATION SPEED
+ if (maMaterialData.uvAnimationRotationSpeedIsActive) {
+ newMaterial.uvAnimationRotationSpeed = maMaterialData.uvAnimationRotationSpeed;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ } else if (maMaterialData.model === "hifi_shader_simple") {
+ //OPACITY
+ if (maMaterialData.opacityIsActive) {
+ newMaterial.opacity = maMaterialData.opacity;
+ } else {
+ defaultFallthrough = true;
+ }
+
+ //PROCEDURAL
+
+ if ( maMaterialData.procedural === "") {
+ maAddProceduralTemplate.disabled = false;
+ } else {
+ newMaterial.procedural = JSON.parse(maMaterialData.procedural);
+ maAddProceduralTemplate.disabled = true;
+ }
+
}
//CULL FACE MODE
newMaterial.cullFaceMode = maMaterialData.cullFaceMode;
- //MODEL
- newMaterial.model = maMaterialData.model;
-
//defaultFallthrough
if (defaultFallthrough) {
newMaterial.defaultFallthrough = true;
}
-
+
+ //Remove the empty map when defaultFallthrough is false
+ if (!defaultFallthrough) {
+ if (newMaterial.albedoMap === "") {delete newMaterial.albedoMap; }
+ if (newMaterial.normalMap === "") {delete newMaterial.normalMap; }
+ if (newMaterial.bumpMap === "") {delete newMaterial.bumpMap; }
+ if (newMaterial.occlusionMap === "") {delete newMaterial.occlusionMap; }
+ if (newMaterial.lightMap === "") {delete newMaterial.lightMap; }
+ if (newMaterial.shadeMap === "") {delete newMaterial.shadeMap; }
+ if (newMaterial.matcapMap === "") {delete newMaterial.matcapMap; }
+ if (newMaterial.shadingShiftMap === "") {delete newMaterial.shadingShiftMap; }
+ if (newMaterial.rimMap === "") {delete newMaterial.rimMap; }
+ if (newMaterial.uvAnimationMaskMap === "") {delete newMaterial.uvAnimationMaskMap; }
+/* ############## Not yet supported, but the code is ready (commented) ###################
+ if (newMaterial.outlineWidthMode === "none") {delete newMaterial.outlineWidthMode; }
+//############################################################################################ */
+ }
+
//insert newMaterial to materialData
var materialDataForUpdate = {
"materialVersion": 1,
"materials": []
};
materialDataForUpdate.materials.push(newMaterial);
-
+
//save to property
EventBridge.emitWebEvent(
JSON.stringify({
@@ -912,10 +2516,13 @@ function maGetMaterialDataAssistantAvailability(materialData) {
materialDataJSON = materialData;
materialDataString = JSON.stringify(materialData);
}
- if (getPropertyInputElement("materialURL").value === "materialData" && materialDataString.indexOf("hifi_shader_simple") === -1 &&
- materialDataString.indexOf("glossMap") === -1 && materialDataString.indexOf("specularMap") === -1 &&
- materialDataString.indexOf("bumpMap") === -1 && materialDataString.indexOf("lightMap") === -1 &&
- materialDataString.indexOf("texCoordTransform0") === -1 && materialDataString.indexOf("texCoordTransform1") === -1 &&
+
+ if (getPropertyInputElement("materialURL").value === "materialData" &&
+ materialDataString.indexOf("outlineWidthMode") === -1 && //<=== ##### REMOVE THIS LINE WHEN YOU REACTIVATE OUTINE BLOCK (commented in the code) #####
+ materialDataString.indexOf("outlineWidth") === -1 && //<=== ##### REMOVE THIS LINE WHEN YOU REACTIVATE OUTINE BLOCK (commented in the code) #####
+ materialDataString.indexOf("outline") === -1 && //<=== ##### REMOVE THIS LINE WHEN YOU REACTIVATE OUTINE BLOCK (commented in the code) #####
+ materialDataString.indexOf("texCoordTransform0") === -1 &&
+ materialDataString.indexOf("texCoordTransform1") === -1 &&
(materialDataJSON.materials === undefined || materialDataJSON.materials.length <= 1 || typeof materialDataJSON.materials === "object")) {
showMaterialAssistantButton();
} else {
diff --git a/scripts/system/html/css/materialAssistant.css b/scripts/system/html/css/materialAssistant.css
index 9944baf73f..6403bd018c 100644
--- a/scripts/system/html/css/materialAssistant.css
+++ b/scripts/system/html/css/materialAssistant.css
@@ -3,7 +3,7 @@
//
// Created by Alezia Kurdis on May 17th, 2022.
// Copyright 2022 Vircadia contributors.
-// Copyright 2022 Overte e.V.
+// Copyright 2022-2024 Overte e.V.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
@@ -22,7 +22,12 @@
background-color: #404040;
z-index: 2;
border-collapse: collapse;
+}
+
+#uiMaterialAssistant-scrollable {
+ border-collapse: collapse;
overflow-y: scroll;
+ height: 100%;
}
#uiMaterialAssistant-headerContainer {
@@ -80,12 +85,21 @@ font.uiMaterialAssistant-label{
color: #D2D2D2;
}
+label.uiMaterialAssistant-label{
+ background-color: #2E2E2E;
+ font-family: Raleway-SemiBold;
+ text-decoration: none;
+ font-size: 12px;
+ color: #D2D2D2;
+}
+
font.uiMaterialAssistant-title{
background-color: #404040;
font-family: Raleway-Bold;
font-size: 18px;
text-decoration: none;
color: #F2F2F2;
+ white-space: normal;
}
input[type=range].uiMaterialAssistant-slider {
@@ -151,6 +165,18 @@ input[type=text].uiMaterialAssistant-input {
color: #000000;
}
+textarea.uiMaterialAssistant-textarea {
+ background-color: #ffffff;
+ border: 1px solid #000000;
+ font-family: FiraSans-SemiBold;
+ font-size: 12px;
+ width: 100%;
+ height: 200px;
+ padding: 3px;
+ margin: 3px 0px 3px 0px;
+ color: #000000;
+}
+
input[type=text].uiMaterialAssistant-input:disabled {
background-color: #555555;
color: #888888;
@@ -171,8 +197,8 @@ input[type=checkbox].uiMaterialAssistant-checkbox {
height: 16px;
margin: 2px;
padding: 3px;
- display: block;
text-align: left;
+ display: block;
}
input[type=checkbox].uiMaterialAssistant-checkbox:focus {
@@ -221,3 +247,30 @@ div.uiMaterialAssistant-color-picker {
width: 120px;
height: 30px;
}
+
+button.uiMaterialAssistant-smallButton {
+ font-family: Raleway-Regular;
+ font-size: 12px;
+ border-radius: 5px;
+ border: none;
+ color: #cccccc;
+ background-color: #000000;
+ background: linear-gradient(#575757 20%, #000000 100%);
+ cursor: pointer;
+ padding: 3px 10px 3px 10px;
+}
+
+button.uiMaterialAssistant-smallButton:hover {
+ background: linear-gradient(#383838, #000000);
+ color: #eeeeee;
+ border: none;
+}
+
+button.uiMaterialAssistant-smallButton:disabled {
+ color: #555555;
+}
+
+button.uiMaterialAssistant-smallButton:focus {
+ outline: none;
+}
+