From 7e1e15020d8c97b81aac91a7dbe5ad0a46778503 Mon Sep 17 00:00:00 2001 From: averry Date: Wed, 21 Aug 2024 11:48:22 +0200 Subject: [PATCH 1/7] add new params --- README.md | 23 +++++++++++++++++++++++ index.js | 13 ++++++++++++- types/index.d.ts | 4 +++- 3 files changed, 38 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 0da9e54..4e6bb5a 100644 --- a/README.md +++ b/README.md @@ -439,6 +439,29 @@ const character2 = { window.model2 = await generateModels(1.5, `#model_3d2`, character2, "classic"); ``` +### Disable zoom effect. +To disable zoom effect on mouse wheel, set "disableZoom" parameter to true when calling generateModels(...) function. Once this feature disabled, it can't be enable because it will destroy wowhead zoom event handler. + +```js +// will disable zoom +window.model = await generateModels(1, `#model_3d`, character, "classic", true); +// will not disable zoo +window.model = await generateModels(1, `#model_3d`, character, "classic", false); +window.model = await generateModels(1, `#model_3d`, character, "classic"); +``` + +### Disable fullscreen mode. +To disable fullscreen mode on double click, set "disableFullScreen" parameter to true when calling generateModels(...) function. Once this feature disabled, it can't be enable because it will destroy wowhead zoom event handler. + +```js +// will disable fullscreen +window.model = await generateModels(1, `#model_3d`, character, "classic", undefined, true); +// will not disable fullscreen +window.model = await generateModels(1, `#model_3d`, character, "classic", undefined, false); +window.model = await generateModels(1, `#model_3d`, character, "classic", undefined); +``` + + # Updates As this library is based on a minified version of the Wowhead model viewer, regular upgrades of this library may require you to clear your cached data. If you are using a Docker `bypass-cors-policies` container, you can follow these steps to clean up the cache: diff --git a/index.js b/index.js index de1409e..ec23a9b 100644 --- a/index.js +++ b/index.js @@ -15,9 +15,11 @@ import "./setup.js" * @param containerSelector {string}: jQuery selector on the container * @param model {{}|{id: number, type: number}}: A json representation of a character * @param env {('classic'|'live')}: select game enve + * @param disableZoom {boolean}: true = disable zoom on mouse wheel (false by default) + * @param disableFullScreen {boolean}: true = disable zoom on double click (false by default) * @returns {Promise} */ -async function generateModels(aspect, containerSelector, model, env=`live`) { +async function generateModels(aspect, containerSelector, model, env=`live`, disableZoom = false, disableFullScreen = false) { let modelOptions let fullOptions if (model.id && model.type) { @@ -60,6 +62,15 @@ async function generateModels(aspect, containerSelector, model, env=`live`) { // eslint-disable-next-line no-undef const wowModelViewer = await new WowModelViewer(models) + + // override wowhead events listeners + if ( disableFullScreen === true ){ + jQuery(containerSelector + ' canvas').off('dblclick'); // disable full screen + } + if ( disableZoom === true ){ + jQuery(containerSelector + ' canvas').off('DOMMouseScroll mousewheel'); // disable zoom + } + if(fullOptions) { wowModelViewer.currentCharacterOptions = fullOptions wowModelViewer.characterGender = model.gender diff --git a/types/index.d.ts b/types/index.d.ts index eb17bc7..84cd892 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -5,12 +5,14 @@ import { findRaceGenderOptions } from "./character_modeling.js"; * @param containerSelector {string}: jQuery selector on the container * @param model {{}|{id: number, type: number}}: A json representation of a character * @param env {('classic'|'live')}: select game enve + * @param disableZoom {boolean}: true = disable zoom on mouse wheel (false by default) + * @param disableFullScreen {boolean}: true = disable zoom on double click (false by default) * @returns {Promise} */ export function generateModels(aspect: number, containerSelector: string, model: {} | { id: number; type: number; -}, env?: ('classic' | 'live')): Promise; +}, env?: ('classic' | 'live'), disableZoom?: boolean, disableFullScreen?: boolean): Promise; import { getDisplaySlot } from "./character_modeling.js"; import { findItemsInEquipments } from "./character_modeling.js"; import { modelingType } from "./character_modeling.js"; From e87a5da0d27794616c36cf0362161c197238d85a Mon Sep 17 00:00:00 2001 From: averry Date: Wed, 21 Aug 2024 11:51:09 +0200 Subject: [PATCH 2/7] post prepublish --- types/character_modeling.d.ts | 18 ++++++++++++++---- types/index.d.ts | 2 +- types/wow_model_viewer.d.ts | 6 +++--- 3 files changed, 18 insertions(+), 8 deletions(-) diff --git a/types/character_modeling.d.ts b/types/character_modeling.d.ts index cad1336..4a30774 100644 --- a/types/character_modeling.d.ts +++ b/types/character_modeling.d.ts @@ -15,8 +15,8 @@ export function optionsFromModel(model: any, fullOptions: {}): { items: (any | any[]); } | { models: { - id; - type; + id: any; + type: any; }; }; /** @@ -33,7 +33,17 @@ export function findRaceGenderOptions(race: number, gender: number): Promise} */ -export function findItemsInEquipments(equipments: any, env?: ('classic' | 'live')): Promise; +export function findItemsInEquipments(equipments: any[{ + item: { + entry: number; + displayid: number; + }; + transmog: { + entry: number; + displayid: number; + }; + slot: number; +}], env?: ("classic" | "live")): Promise; /** * * @param item{number}: Item id @@ -42,7 +52,7 @@ export function findItemsInEquipments(equipments: any, env?: ('classic' | 'live' * @param env {('classic'|'live')}: select game env * @return {Promise} */ -export function getDisplaySlot(item: number, slot: number, displayId: number, env?: ('classic' | 'live')): Promise; +export function getDisplaySlot(item: number, slot: number, displayId: number, env?: ("classic" | "live")): Promise; /** * * @param {Object} character - The character object. diff --git a/types/index.d.ts b/types/index.d.ts index 84cd892..e2d5204 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -12,7 +12,7 @@ import { findRaceGenderOptions } from "./character_modeling.js"; export function generateModels(aspect: number, containerSelector: string, model: {} | { id: number; type: number; -}, env?: ('classic' | 'live'), disableZoom?: boolean, disableFullScreen?: boolean): Promise; +}, env?: ("classic" | "live"), disableZoom?: boolean, disableFullScreen?: boolean): Promise; import { getDisplaySlot } from "./character_modeling.js"; import { findItemsInEquipments } from "./character_modeling.js"; import { modelingType } from "./character_modeling.js"; diff --git a/types/wow_model_viewer.d.ts b/types/wow_model_viewer.d.ts index 952f226..418eee1 100644 --- a/types/wow_model_viewer.d.ts +++ b/types/wow_model_viewer.d.ts @@ -51,10 +51,10 @@ export class WowModelViewer { _currentCharacterOptions: number; _characterGender: any; _characterRace: any; - set currentCharacterOptions(arg: any); + set currentCharacterOptions(value: any); get currentCharacterOptions(): any; - set characterGender(arg: any); + set characterGender(value: any); get characterGender(): any; - set characterRace(arg: any); + set characterRace(value: any); get characterRace(): any; } From 0f968ceac9b4dfbf0134abe086f40e08f59d1949 Mon Sep 17 00:00:00 2001 From: averry Date: Wed, 21 Aug 2024 14:43:42 +0200 Subject: [PATCH 3/7] can enable/disable zoom and fullscreen feature --- index.js | 12 ++++++------ setup.js | 45 +++++++++++++++++++++++++++++++++++++++++++++ wow_model_viewer.js | 28 ++++++++++++++++++++++++++++ 3 files changed, 79 insertions(+), 6 deletions(-) diff --git a/index.js b/index.js index ec23a9b..a45398c 100644 --- a/index.js +++ b/index.js @@ -64,12 +64,12 @@ async function generateModels(aspect, containerSelector, model, env=`live`, disa const wowModelViewer = await new WowModelViewer(models) // override wowhead events listeners - if ( disableFullScreen === true ){ - jQuery(containerSelector + ' canvas').off('dblclick'); // disable full screen - } - if ( disableZoom === true ){ - jQuery(containerSelector + ' canvas').off('DOMMouseScroll mousewheel'); // disable zoom - } + $(containerSelector + ' canvas').firstOn('dblclick', (event) => { + if ( window.fullScreenDisabled === true) event.stopImmediatePropagation(); + }) + $(containerSelector + ' canvas').firstOn('DOMMouseScroll mousewheel', (event) => { + if ( window.zoomDisabled === true) event.stopImmediatePropagation(); + }) if(fullOptions) { wowModelViewer.currentCharacterOptions = fullOptions diff --git a/setup.js b/setup.js index fcecf93..58f2dda 100644 --- a/setup.js +++ b/setup.js @@ -4,6 +4,12 @@ if(!window.CONTENT_PATH){ if(!window.WOTLK_TO_RETAIL_DISPLAY_ID_API){ window.WOTLK_TO_RETAIL_DISPLAY_ID_API=`https://wotlk.murlocvillage.com/api/items` } +if(!window.fullScreenDisabled){ + window.fullScreenDisabled = false +} +if(!window.zoomDisabled){ + window.zoomDisabled = false +} class WebP { getImageExtension() { @@ -59,3 +65,42 @@ const WH = window.WH export { WH, } + +function firstOnApply (opts) { + var elements = opts.elements + var events = opts.events + var isDelegated = opts.isDelegated || false + elements.each(function (i, element) { + var eventsListeners = $._data(element, 'events') + $.each(events, function (i, event) { + var curEventListeners = eventsListeners[event] + var delegatedListeners = curEventListeners.slice(0, curEventListeners.delegateCount) + var vanillaListeners = curEventListeners.slice(curEventListeners.delegateCount) + + if (isDelegated) { + delegatedListeners.unshift(delegatedListeners.pop()) + Array.prototype.splice.apply( + curEventListeners, + [0, curEventListeners.delegateCount].concat(delegatedListeners) + ) + } else { + vanillaListeners.unshift(vanillaListeners.pop()) + Array.prototype.splice.apply( + curEventListeners, + [curEventListeners.delegateCount, vanillaListeners.length].concat(vanillaListeners) + ) + } + }) + }) +} + +$.fn.firstOn = function () { + var args = $.makeArray(arguments) + $.fn.on.apply(this, args) + var eventsString = args[0] + firstOnApply({ + elements: this, + events: eventsString.split(' ') + }) + return this +} diff --git a/wow_model_viewer.js b/wow_model_viewer.js index 6cf4220..aa07ed0 100644 --- a/wow_model_viewer.js +++ b/wow_model_viewer.js @@ -12,6 +12,34 @@ class WowModelViewer extends ZamModelViewer { return [...new Set(this.renderer.models[0].am.map(e => e.l))] } + /** + * Enable zoom feature + */ + enableZoom() { + window.zoomDisabled = false; + } + + /** + * Enable zoom feature + */ + disableZoom() { + window.zoomDisabled = true; + } + + /** + * Enable zoom feature + */ + enableFullScreen() { + window.fullScreenDisabled = false; + } + + /** + * Enable zoom feature + */ + disableFullScreen() { + window.fullScreenDisabled = true; + } + /** * Change character distance * @param {number} val From a23a9e8507528fdb89f296ed75cfc86491e3f52f Mon Sep 17 00:00:00 2001 From: averry Date: Wed, 21 Aug 2024 14:50:33 +0200 Subject: [PATCH 4/7] update doc --- README.md | 43 ++++++++++++++++++++++++++++++------------- index.js | 4 +--- 2 files changed, 31 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index 4e6bb5a..9795c9b 100644 --- a/README.md +++ b/README.md @@ -321,12 +321,36 @@ Change character distance model.setDistance(2) ``` +Enable Zoom feature + +```js +model.enableZoom() +``` + +Disable Zoom feature + +```js +model.disableZoom() +``` + Fullscreen ```js model.setFullscreen(false) ``` +Enable Fullscreen feature + +```js +model.enableFullScreen() +``` + +Disable Fullscreen feature + +```js +model.disableFullScreen() +``` + Change Animation ```js model.setAnimation("Run") @@ -440,27 +464,20 @@ window.model2 = await generateModels(1.5, `#model_3d2`, character2, "classic"); ``` ### Disable zoom effect. -To disable zoom effect on mouse wheel, set "disableZoom" parameter to true when calling generateModels(...) function. Once this feature disabled, it can't be enable because it will destroy wowhead zoom event handler. +To disable zoom effect on mouse wheel, change following vars to: ```js -// will disable zoom -window.model = await generateModels(1, `#model_3d`, character, "classic", true); -// will not disable zoo -window.model = await generateModels(1, `#model_3d`, character, "classic", false); -window.model = await generateModels(1, `#model_3d`, character, "classic"); + window.zoomDisabled = true ``` + This value can be changed by enableZoom and disableZoom function. ### Disable fullscreen mode. -To disable fullscreen mode on double click, set "disableFullScreen" parameter to true when calling generateModels(...) function. Once this feature disabled, it can't be enable because it will destroy wowhead zoom event handler. +To disable zoom effect on mouse wheel, change following vars to: ```js -// will disable fullscreen -window.model = await generateModels(1, `#model_3d`, character, "classic", undefined, true); -// will not disable fullscreen -window.model = await generateModels(1, `#model_3d`, character, "classic", undefined, false); -window.model = await generateModels(1, `#model_3d`, character, "classic", undefined); + window.fullScreenDisabled = true ``` - +This value can be changed by enableZoom and disableZoom function. # Updates As this library is based on a minified version of the Wowhead model viewer, regular upgrades of this library may require you to clear your cached data. diff --git a/index.js b/index.js index a45398c..b84ce14 100644 --- a/index.js +++ b/index.js @@ -15,11 +15,9 @@ import "./setup.js" * @param containerSelector {string}: jQuery selector on the container * @param model {{}|{id: number, type: number}}: A json representation of a character * @param env {('classic'|'live')}: select game enve - * @param disableZoom {boolean}: true = disable zoom on mouse wheel (false by default) - * @param disableFullScreen {boolean}: true = disable zoom on double click (false by default) * @returns {Promise} */ -async function generateModels(aspect, containerSelector, model, env=`live`, disableZoom = false, disableFullScreen = false) { +async function generateModels(aspect, containerSelector, model, env=`live`) { let modelOptions let fullOptions if (model.id && model.type) { From 7209fd32b5e5448783b939ccda4f86826fcf213d Mon Sep 17 00:00:00 2001 From: averry Date: Wed, 21 Aug 2024 14:50:53 +0200 Subject: [PATCH 5/7] prepublish update --- types/index.d.ts | 4 +--- types/wow_model_viewer.d.ts | 16 ++++++++++++++++ 2 files changed, 17 insertions(+), 3 deletions(-) diff --git a/types/index.d.ts b/types/index.d.ts index e2d5204..61c2321 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -5,14 +5,12 @@ import { findRaceGenderOptions } from "./character_modeling.js"; * @param containerSelector {string}: jQuery selector on the container * @param model {{}|{id: number, type: number}}: A json representation of a character * @param env {('classic'|'live')}: select game enve - * @param disableZoom {boolean}: true = disable zoom on mouse wheel (false by default) - * @param disableFullScreen {boolean}: true = disable zoom on double click (false by default) * @returns {Promise} */ export function generateModels(aspect: number, containerSelector: string, model: {} | { id: number; type: number; -}, env?: ("classic" | "live"), disableZoom?: boolean, disableFullScreen?: boolean): Promise; +}, env?: ("classic" | "live")): Promise; import { getDisplaySlot } from "./character_modeling.js"; import { findItemsInEquipments } from "./character_modeling.js"; import { modelingType } from "./character_modeling.js"; diff --git a/types/wow_model_viewer.d.ts b/types/wow_model_viewer.d.ts index 418eee1..1e9582f 100644 --- a/types/wow_model_viewer.d.ts +++ b/types/wow_model_viewer.d.ts @@ -4,6 +4,22 @@ export class WowModelViewer { * @returns {Array.} */ getListAnimations(): Array; + /** + * Enable zoom feature + */ + enableZoom(): void; + /** + * Enable zoom feature + */ + disableZoom(): void; + /** + * Enable zoom feature + */ + enableFullScreen(): void; + /** + * Enable zoom feature + */ + disableFullScreen(): void; /** * Change character distance * @param {number} val From eb83149fa49ab3d3eed1fd298f7b26e5f831e2f1 Mon Sep 17 00:00:00 2001 From: averry Date: Wed, 21 Aug 2024 16:38:02 +0200 Subject: [PATCH 6/7] var to const --- setup.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/setup.js b/setup.js index 58f2dda..702c029 100644 --- a/setup.js +++ b/setup.js @@ -67,15 +67,15 @@ export { } function firstOnApply (opts) { - var elements = opts.elements - var events = opts.events - var isDelegated = opts.isDelegated || false + const elements = opts.elements + const events = opts.events + const isDelegated = opts.isDelegated || false elements.each(function (i, element) { - var eventsListeners = $._data(element, 'events') + const eventsListeners = $._data(element, 'events') $.each(events, function (i, event) { - var curEventListeners = eventsListeners[event] - var delegatedListeners = curEventListeners.slice(0, curEventListeners.delegateCount) - var vanillaListeners = curEventListeners.slice(curEventListeners.delegateCount) + const curEventListeners = eventsListeners[event] + const delegatedListeners = curEventListeners.slice(0, curEventListeners.delegateCount) + const vanillaListeners = curEventListeners.slice(curEventListeners.delegateCount) if (isDelegated) { delegatedListeners.unshift(delegatedListeners.pop()) @@ -95,9 +95,9 @@ function firstOnApply (opts) { } $.fn.firstOn = function () { - var args = $.makeArray(arguments) + const args = $.makeArray(arguments) $.fn.on.apply(this, args) - var eventsString = args[0] + const eventsString = args[0] firstOnApply({ elements: this, events: eventsString.split(' ') From edbdb2ec3364e0c4f181e548497ddaddb29d860f Mon Sep 17 00:00:00 2001 From: averry Date: Fri, 23 Aug 2024 13:58:43 +0200 Subject: [PATCH 7/7] need tests --- index.js | 36 ++++++++++++++---------------------- wow_model_viewer.js | 17 +++++++++++++++++ 2 files changed, 31 insertions(+), 22 deletions(-) diff --git a/index.js b/index.js index b84ce14..252539a 100644 --- a/index.js +++ b/index.js @@ -17,35 +17,35 @@ import "./setup.js" * @param env {('classic'|'live')}: select game enve * @returns {Promise} */ -async function generateModels(aspect, containerSelector, model, env=`live`) { - let modelOptions - let fullOptions +async function generateModels(aspect, containerSelector, model, env=`live`, options) { + let zamingModelOptions + let zamingFullOptions if (model.id && model.type) { const {id, type} = model - modelOptions = {models: {id, type}} + zamingModelOptions = {models: {id, type}} } else { const {race, gender} = model // CHARACTER OPTIONS // This is how we describe a character properties - fullOptions = await findRaceGenderOptions( + zamingFullOptions = await findRaceGenderOptions( race, gender ) - modelOptions = optionsFromModel(model, fullOptions) + zamingModelOptions = optionsFromModel(model, zamingFullOptions) } if(env === `classic`) { - modelOptions = { + zamingModelOptions = { dataEnv: `classic`, env: `classic`, gameDataEnv: `classic`, hd: false, - ...modelOptions + ...zamingModelOptions } } else { - modelOptions = { + zamingModelOptions = { hd: true, - ...modelOptions + ...zamingModelOptions } } const models = { @@ -54,23 +54,15 @@ async function generateModels(aspect, containerSelector, model, env=`live`) { // eslint-disable-next-line no-undef container: jQuery(containerSelector), aspect: aspect, - ...modelOptions + ...zamingModelOptions } console.log(`Creating viewer with options`, models) // eslint-disable-next-line no-undef - const wowModelViewer = await new WowModelViewer(models) + const wowModelViewer = await new WowModelViewer(containerSelector, options, models) - // override wowhead events listeners - $(containerSelector + ' canvas').firstOn('dblclick', (event) => { - if ( window.fullScreenDisabled === true) event.stopImmediatePropagation(); - }) - $(containerSelector + ' canvas').firstOn('DOMMouseScroll mousewheel', (event) => { - if ( window.zoomDisabled === true) event.stopImmediatePropagation(); - }) - - if(fullOptions) { - wowModelViewer.currentCharacterOptions = fullOptions + if(zamingFullOptions) { + wowModelViewer.currentCharacterOptions = zamingFullOptions wowModelViewer.characterGender = model.gender wowModelViewer.characterRace = model.race diff --git a/wow_model_viewer.js b/wow_model_viewer.js index aa07ed0..0677437 100644 --- a/wow_model_viewer.js +++ b/wow_model_viewer.js @@ -3,6 +3,23 @@ import {getCharacterOptions} from "./character_modeling.js" // eslint-disable-next-line no-undef class WowModelViewer extends ZamModelViewer { + + zoomDisabled; + fullScreenDisabled; + constructor(containerSelector, options, zamconfig) { + super(zamconfig); + this.zoomDisabled = options.zoomDisabled ?? false; + this.fullScreenDisabled = options.fullScreenDisabled ?? false; + + // override wowhead events listeners + $(containerSelector + ' canvas').firstOn('dblclick', (event) => { + if ( this.fullScreenDisabled === true) event.stopImmediatePropagation(); + }) + $(containerSelector + ' canvas').firstOn('DOMMouseScroll mousewheel', (event) => { + if ( this.zoomDisabled === true) event.stopImmediatePropagation(); + }) + } + /** * Returns the list of animation names * @returns {Array.}