Skip to content

Commit

Permalink
Updates for PF and opacity control
Browse files Browse the repository at this point in the history
* Now it works with renderTokenConfig in PF1
* Added a global setting to allow setting opacity of token image preview
* Improved localization for english and spanish
  • Loading branch information
javieros105 committed Oct 21, 2020
1 parent 5241601 commit e0a7a64
Show file tree
Hide file tree
Showing 7 changed files with 130 additions and 113 deletions.
Binary file modified token-hud-wildcard.zip
Binary file not shown.
7 changes: 6 additions & 1 deletion token-hud-wildcard/css/token-hud-wildcard.css
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,10 @@
margin: 0 !important;
}

#token-hud .thwildcard-button-select:hover .thwildcard-button-image{
opacity: 1!important;
}

#token-hud .thwildcard-button-select.list {
max-width: 440px;
width: 100% !important;
Expand All @@ -41,10 +45,11 @@
}

#token-hud .thwildcard-button-disabled span , #token-hud .thwildcard-button-disabled img {
opacity: 1 !important;
filter: grayscale(100%);
}
#token-hud .thwildcard-button-disabled span, #token-hud .thwildcard-button-disabled:hover img {
opacity: 0.7 !important;
/* opacity: 0.7 !important; */
color: #CCC;
}

Expand Down
6 changes: 5 additions & 1 deletion token-hud-wildcard/lang/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,9 @@
"THWildcard.Fieldset": "Wildcard drop default",
"THWildcard.DefaultDescription": "When dropping a token in canvas with wildcard selected, if this field is filled this image will be selected instead of randomizing it.",
"THWildcard.DefaultLabel": "Default Image:",
"THWildcard.ButtonTitle": "Browse File"
"THWildcard.ButtonTitle": "Browse File",
"THWildcard.DisplaySettingName": "Display as Image?",
"THWildcard.DisplaySettingHint": "Disable to display wildcard options as a list of their filenames in the HUD.",
"THWildcard.OpacitySettingName": "Opacity of token preview",
"THWildcard.OpacitySettingHint": "Configure the opacity of the token previews in the HUD before hovering on them."
}
8 changes: 6 additions & 2 deletions token-hud-wildcard/lang/es.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
{
"THWildcard.Title": "Haz click aquí para mostrar opciones de imagen",
"THWildcard.Fieldset": "Wildcard token por defecto",
"THWildcard.DefaultDescription": "Cuando un token es soltado en el canvas con wildcard seleccionado, si el campo ha sido llenado esta imagen se seleccionara en vez de una al azar.",
"THWildcard.DefaultDescription": "Cuando un token es soltado en el canvas con comodín seleccionado, si el campo ha sido llenado esta imagen se seleccionara en vez de una al azar.",
"THWildcard.DefaultLabel": "Imagen por Defecto:",
"THWildcard.ButtonTitle": "Buscar Archivo"
"THWildcard.ButtonTitle": "Buscar Archivo",
"THWildcard.DisplaySettingName": "¿Mostrar como imagen?",
"THWildcard.DisplaySettingHint": "Deshabilitar para mostrar opciones de comodín como una lista de nombres de archivos en vez de previsualizar la image en el HUD.",
"THWildcard.OpacitySettingName": "Opacidad de las imagenes previsualizadas",
"THWildcard.OpacitySettingHint": "Configura la opacidad de las imagenes en el HUD cuando no pasas el puntero por encima de ellas."
}
216 changes: 110 additions & 106 deletions token-hud-wildcard/main.js
Original file line number Diff line number Diff line change
@@ -1,123 +1,127 @@
const tokenHUDWildcard = {
registerSettings: () => {
game.settings.register('token-hud-wildcard', 'imageDisplay', {
name : 'Display as Image?',
hint : 'Disable to display wildcard options as a list of their filenames',
scope : 'world',
config : true,
type : Boolean,
default : true
})
}
registerSettings: () => {
game.settings.register('token-hud-wildcard', 'imageDisplay', {
name: game.i18n.format('THWildcard.DisplaySettingName'),
hint: game.i18n.format('THWildcard.DisplaySettingHint'),
scope: 'world',
config: true,
type: Boolean,
default: true
})
game.settings.register("token-hud-wildcard", "imageOpacity", {
name: game.i18n.format('THWildcard.OpacitySettingName'),
hint: game.i18n.format('THWildcard.OpacitySettingHint'),
scope: "world",
config: true,
range: { min: 0, max: 100, step: 1 },
type: Number,
default: 50
})
}
}

Hooks.on('init', ()=> {
Hooks.on('init', () => {
tokenHUDWildcard.registerSettings()
})

Hooks.on('ready', () => {
const renderTokenConfig = `renderTokenConfig${game.system.id === 'pf1' ? 'PF' : ''}`
Hooks.on(renderTokenConfig, WildcardDefault.render)
WildcardDefault._hookPreTokenCreate()
const renderTokenConfig = 'renderTokenConfig'
Hooks.on(renderTokenConfig, WildcardDefault.render)
WildcardDefault._hookPreTokenCreate()
})

const WildcardDefault = {
getDefaultImg: async (token) => {
const flag = token.getFlag('token-hud-wildcard', 'default') || ''
return flag
},
_hookPreTokenCreate() {
getDefaultImg: async (token) => {
const flag = token.getFlag('token-hud-wildcard', 'default') || ''
return flag
},
_hookPreTokenCreate () {
Hooks.on('preCreateToken', (scene, data, options, userId) => {
const actor = game.actors.get(data.actorId);
console.log(actor)
const defaultValue = data.flags['token-hud-wildcard'] ? data.flags['token-hud-wildcard'].default : ''
if (defaultValue !== '' && actor.data.token.randomImg) {
setProperty(data, 'img', defaultValue);
}
const actor = game.actors.get(data.actorId)

const defaultValue = data.flags['token-hud-wildcard'] ? data.flags['token-hud-wildcard'].default : ''
if (defaultValue !== '' && actor.data.token.randomImg) {
setProperty(data, 'img', defaultValue)
}
})
},
render: async (config, html) => {
const defaultImg = await WildcardDefault.getDefaultImg(config.token)
if (config.token.data._id) {
return
}
const imageDataTab = html.find('.tab[data-tab="image"]')
const checkBoxWildcard = imageDataTab.find('input[name="randomImg"]')
let configField = await renderTemplate('/modules/token-hud-wildcard/templates/configField.html', { defaultImg, available: checkBoxWildcard[0].checked })

imageDataTab.append(configField)
const defaultConfig = imageDataTab.find('.thwildcard-default')

defaultConfig.find('button').click(event => {
event.preventDefault()
const input = defaultConfig.find('input')[0]
console.log(input)
const fp = new FilePicker({ current: input.value, field: input })
fp.browse(defaultImg)
})

checkBoxWildcard.click(event => {
// console.log(event.target.checked)
if (event.target.checked) {
defaultConfig[0].classList.add('active')
} else {
defaultConfig[0].classList.remove('active')
}

})
}
render: async (config, html) => {
const defaultImg = await WildcardDefault.getDefaultImg(config.token)
if (config.token.data._id) {
return
}
const imageDataTab = html.find('.tab[data-tab="image"]')
const checkBoxWildcard = imageDataTab.find('input[name="randomImg"]')
const configField = await renderTemplate('/modules/token-hud-wildcard/templates/configField.html', { defaultImg, available: checkBoxWildcard[0].checked })

imageDataTab.append(configField)
const defaultConfig = imageDataTab.find('.thwildcard-default')

defaultConfig.find('button').click(event => {
event.preventDefault()
const input = defaultConfig.find('input')[0]

const fp = new FilePicker({ current: input.value, field: input })
fp.browse(defaultImg)
})

checkBoxWildcard.click(event => {
if (event.target.checked) {
defaultConfig[0].classList.add('active')
} else {
defaultConfig[0].classList.remove('active')
}
})
}
}

Hooks.on('renderTokenHUD', async (hud, html, token) => {
let actor = game.actors.get(token.actorId)
let images = await actor.getTokenImages()

if (images.length < 2) {
return
}

let imageDisplay = game.settings.get('token-hud-wildcard', 'imageDisplay')
let imagesParsed = images.map(im => {
const split = im.split('/')
return { route: im, name: split[split.length - 1], used: im === token.img }
})

console.log(imagesParsed)

let wildcardDisplay = await renderTemplate('/modules/token-hud-wildcard/templates/hud.html', { imagesParsed, imageDisplay })

html.find('div.right')
.append(wildcardDisplay)
.click((event) => {
const buttonFind = html.find('.control-icon.thwildcard-selector')
const cList = event.target.parentElement.classList
const correctButton = cList.contains('thwildcard-selector')
const active = cList.contains('active')

if (correctButton && !active) {
buttonFind[0].classList.add('active')
html.find('.thwildcard-selector-wrap')[0].classList.add('active')

html.find('.control-icon.effects')[0].classList.remove('active')
html.find('.status-effects')[0].classList.remove('active')
} else {
buttonFind[0].classList.remove('active')
html.find('.thwildcard-selector-wrap')[0].classList.remove('active')
}
})

const buttons = html.find('.thwildcard-button-select')

buttons.map((button) => {
buttons[button].addEventListener('click', function (event) {
event.preventDefault()
event.stopPropagation()
console.log('Click Button', event)
console.log('Token', token)
const controlled = canvas.tokens.controlled
const index = controlled.findIndex(x => x.data._id === token._id)
const tokenToChange = controlled[index]
tokenToChange.update({ img: event.target.dataset.name })
})
})
const actor = game.actors.get(token.actorId)
const images = await actor.getTokenImages()

if (images.length < 2) {
return
}

const imageDisplay = game.settings.get('token-hud-wildcard', 'imageDisplay')
const imageOpacity = game.settings.get('token-hud-wildcard', 'imageOpacity')/100
const imagesParsed = images.map(im => {
const split = im.split('/')
return { route: im, name: split[split.length - 1], used: im === token.img }
})

const wildcardDisplay = await renderTemplate('/modules/token-hud-wildcard/templates/hud.html', { imagesParsed, imageDisplay, imageOpacity })

html.find('div.right')
.append(wildcardDisplay)
.click((event) => {
const buttonFind = html.find('.control-icon.thwildcard-selector')
const cList = event.target.parentElement.classList
const correctButton = cList.contains('thwildcard-selector')
const active = cList.contains('active')

if (correctButton && !active) {
buttonFind[0].classList.add('active')
html.find('.thwildcard-selector-wrap')[0].classList.add('active')

html.find('.control-icon.effects')[0].classList.remove('active')
html.find('.status-effects')[0].classList.remove('active')
} else {
buttonFind[0].classList.remove('active')
html.find('.thwildcard-selector-wrap')[0].classList.remove('active')
}
})

const buttons = html.find('.thwildcard-button-select')

buttons.map((button) => {
buttons[button].addEventListener('click', function (event) {
event.preventDefault()
event.stopPropagation()
const controlled = canvas.tokens.controlled
const index = controlled.findIndex(x => x.data._id === token._id)
const tokenToChange = controlled[index]
tokenToChange.update({ img: event.target.dataset.name })
})
})
})
4 changes: 2 additions & 2 deletions token-hud-wildcard/module.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
"name": "token-hud-wildcard",
"title": "Token HUD Wildcard",
"description": "This module adds a button to the Token HUD if the token has wildcard set and detects more than 1 image to choose from. Pressing the button displays a panel on the right side of the HUD with buttons for each image, pressing one of these allows to change the token image.",
"version": "1.0.0",
"version": "1.1.0",
"minimumCoreVersion": "0.6.0",
"compatibleCoreVersion": "0.6.5",
"compatibleCoreVersion": "0.6.6",
"author": "Javieros",
"scripts": ["main.js"],
"styles": ["./css/token-hud-wildcard.css"],
Expand Down
2 changes: 1 addition & 1 deletion token-hud-wildcard/templates/hud.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
{{#each imagesParsed as |image|}}
<button class="thwildcard-button-select control-icon {{#unless ../imageDisplay}}list{{/unless}} {{#if image.used}}thwildcard-button-disabled active{{/if}}" >
{{#if ../imageDisplay}}
<img class="thwildcard-button-image" src="{{image.route}}" alt="{{image.name}}" data-name="{{image.route}}"/>
<img class="thwildcard-button-image" src="{{image.route}}" alt="{{image.name}}" data-name="{{image.route}}" style="opacity:{{../imageOpacity}};"/>
{{else}}
<span data-name="{{image.route}}">{{image.name}}</span>
{{/if}}
Expand Down

0 comments on commit e0a7a64

Please sign in to comment.