javascript 新的CTA调整大小修复

Posted 2021-05-03

/////// CALL IT LIKE THIS
		_updateCta({
			target: T.cta,
			minWidth: arg.cta.width,
			height: arg.cta.height
		})
		
////// THE METHOD
let _resizeCount = 0
	function _updateCta(arg) {
		let _target = arg.target
		let _copyEl = _target.getElementsByClassName('copy')[0]
		let _spanEl = _copyEl.querySelector('span')

		if (_resizeCount) {
			// resize the cta to fit a little close to what the span size actually is
			_target.resize(arg.minWidth, arg.height)
		} else {
			// resize the cta to fit based on various conditions
			_target.resize(Math.round((_spanEl.innerHTML.length + 1) * Math.floor(Styles.getCss(_spanEl, 'font-size'))), arg.height)
		}

		Styles.setCss(_spanEl, {
			top: 'unset',
			bottom: 'unset',
			left: 'unset',
			right: 'unset'
		})

		let _offsetY = 0
		switch (adData.locale) {
			// case 'he-IL':
			// case 'he':
			// case 'IL':
			// 	break
			case 'ar-SA':
			case 'ar':
			case 'SA':
				_offsetY = -1
				break
		}

		Styles.setCss(_spanEl, {
			// backgroundColor: 'pink'
			top: Math.floor((_copyEl.offsetHeight - _spanEl.offsetHeight) / 2) + _offsetY,
			left: Math.floor((_copyEl.offsetWidth - _spanEl.offsetWidth) / 2)
		})

		if (!_resizeCount++) {
			let _arrowEl = _target.getElementsByClassName('arrow')[0].querySelector('svg')
			const _spanWidth = Styles.getCss(_spanEl, 'width') || _spanEl.getBoundingClientRect().width
			const _arrowWidth = Styles.getCss(_arrowEl, 'width') || _arrowEl.getBoundingClientRect().width
			arg.minWidth = Math.max(arg.minWidth || 40, Math.round(_spanWidth + _arrowWidth * 5))
			_updateCta(arg)
		}
	}