More heal/price ratios for food items

[Arctomachine]

Brief feature description
Show healing/price ratio in tooltip for food items everywhere. Similar to this feature, but in tooltip. Primarily for buying in general goods and player market (use asked market price instead of original).
For market specifically put price somewhere near item as well. On left border, for example

Add a image as an example (advanced + optional)

[Arctomachine]

I have looked into possibilities of making what I suggested, and made this code snippet for market items.
It kind of works on its own, so can be integrated into code if one issue with it is resolved. Query selector by tooltip is not working unless I use html inspector on any one item for the first time on current page. Then it starts working for this page.

document.querySelectorAll('[data-tooltip*="Using: Heals"]').forEach(function(node) {
  const tr = node.parentNode.parentNode
  const priceNode = tr.querySelectorAll(['td'])[2]

  if (!priceNode) {
    return
  }

  const price = Number(priceNode.innerText.replace('.', ''))
  const heal = Number(node.getAttribute('data-tooltip').match(/Heals (\d+) of life/)[1])

  const ratioElement = document.createElement('span')
  ratioElement.innerText = (heal / price).toFixed(2)

  if (heal/price > 2) {
    ratioElement.style.color = 'cyan'
  } else if (heal/price > 1.5) {
    ratioElement.style.color = 'lime'
  } else if (heal/price > 1.25) {
    ratioElement.style.color = 'yellow'
  } else if (heal/price > 1) {
    ratioElement.style.color = 'orange'
  } else {
    ratioElement.style.color = 'red'
  }

  ratioElement.style.position = 'absolute'
  ratioElement.style.right = '-8px'
  ratioElement.style.bottom = '0'
  ratioElement.style.background = 'rgba(0, 0, 0, 0.85)'
  node.appendChild(ratioElement)
})

[Arctomachine]

Additional clarification: it works in normal mode, but the issue I mentioned only appears in chat mode.

[Arctomachine]

Updated this script, now it works in both modes. Also improved positioning of ratio plate so it no longer overlaps food icon, but stands right next to it, in second cell. For 4 cell foods it stands below seller name.
This script now seems to be fully working on its own. How can I integrate it into plugin now? Is there instruction available?

function addMarketHealToPriceRatios(){
	const iframe = document.getElementById('mainFrame') // if chat mode is enabled, get frame in which the game content is
	const innerDoc = iframe.contentDocument || iframe.contentWindow.document || document // select container for all operations: frame or document
	
	innerDoc.querySelectorAll('[data-tooltip*="Using: Heals"]').forEach(function(node) {
		const tr = node.parentNode.parentNode
		const priceNode = tr.querySelectorAll(['td'])[2]

		if (!priceNode) {
		return
		}

		const price = Number(priceNode.innerText.replace('.', ''))
		const heal = Number(node.getAttribute('data-tooltip').match(/Heals (\d+) of life/)[1])

		const ratioElement = document.createElement('span')
		ratioElement.innerText = (heal / price).toFixed(2)

		if (heal/price > 2) {
			ratioElement.style.color = 'cyan'
		} else if (heal/price > 1.5) {
			ratioElement.style.color = 'lime'
		} else if (heal/price > 1.25) {
			ratioElement.style.color = 'yellow'
		} else if (heal/price > 1) {
			ratioElement.style.color = 'orange'
		} else {
			ratioElement.style.color = 'red'
		}

		ratioElement.style.position = 'absolute'
		ratioElement.style.right = '0'
		ratioElement.style.bottom = '0'
		ratioElement.style.transform = 'translateX(100%)'
		ratioElement.style.padding = '2px 4px'
		ratioElement.style.borderRadius = '2px'
		ratioElement.style.background = 'rgba(0, 0, 0, 0.95)'
		node.appendChild(ratioElement)
	})
}

[GreatApo]

We have some general instructions under: https://github.com/DinoDevs/GladiatusCrazyAddon/blob/master/documentation/developers/for-developers.md

I think we had a similar feature for the market in the past (don't remember if it is in the current version). I think it would be best if this is fitted within the market table (additional column).

[Arctomachine]

It looks like I am doing something wrong, but not sure what. Trying to follow that instruction, changed 3 files:

• markets.js
  
• gca.data.js
  
• locale/en.js
  

Then I run dist/build.sh, disable normal version and load temporary (firefox) version from /dist. After all that I update page and go into markets in settings, but my feature is not there. And it is not working in market, so I assume it is just missing in build.

Also there might be issues with other languages because my implementation specifically targets english tooltip text, which will be different in other languages.