https://www.myarena.ru/includes/tool/tip/tip_balloon.js

1/*
2tip_balloon.js  v. 1.2
3
4The latest version is available at
5http://www.walterzorn.com
6or http://www.devira.com
7or http://www.walterzorn.de
8
9Initial author: Walter Zorn
10Last modified: 13.7.2007
11
12Extension for the tooltip library wz_tooltip.js.
13Implements balloon tooltips.
14*/
15
16// Here we define new global configuration variable(s) (as members of the
17// predefined "config." class).
18// From each of these config variables, wz_tooltip.js will automatically derive
19// a command which can be passed to Tip() or TagToTip() in order to customize
20// tooltips individually. These command names are just the config variable
21// name(s) translated to uppercase,
22// e.g. from config. Balloon a command BALLOON will automatically be
23// created.
24
25//===================  GLOBAL TOOPTIP CONFIGURATION  =========================//
26config. Balloon = false				// true or false - set to true if you want this to be the default behaviour
27
28//config. BalloonImgPath = "tool/tip/balloon" // Path to images (border, corners, stem), in quotes. Path must be relative to your HTML file.
29config. BalloonImgPath = "/includes/tool/tip/ballon/" // Path to images (border, corners, stem), in quotes. Path must be relative to your HTML file.
30
31// Sizes of balloon images
32config. BalloonEdgeSize = 5			// Integer - sidelength of quadratic corner images
33config. BalloonStemWidth = 15		// Integer
34config. BalloonStemHeight = 19		// Integer
35//=======  END OF TOOLTIP CONFIG, DO NOT CHANGE ANYTHING BELOW  ==============//
36
37
38// Create a new tt_Extension object (make sure that the name of that object,
39// here balloon, is unique amongst the extensions available for wz_tooltips.js):
40var balloon = new tt_Extension();
41
42// Implement extension eventhandlers on which our extension should react
43
44balloon.OnLoadConfig = function()
45{
46	if(tt_aV[BALLOON])
47	{
48		// Turn off native style properties which are not appropriate
49		balloon.padding = Math.max(tt_aV[PADDING] - tt_aV[BALLOONEDGESIZE], 0);
50		balloon.width = tt_aV[WIDTH];
51		//if(tt_bBoxOld)
52		//	balloon.width += (balloon.padding << 1);
53		tt_aV[BORDERWIDTH] = 0;
54		tt_aV[WIDTH] = 0;
55		tt_aV[PADDING] = 0;
56		tt_aV[BGCOLOR] = "";
57		tt_aV[BGIMG] = "";
58		tt_aV[SHADOW] = false;
59		// Append slash to img path if missing
60		if(tt_aV[BALLOONIMGPATH].charAt(tt_aV[BALLOONIMGPATH].length - 1) != '/')
61			tt_aV[BALLOONIMGPATH] += "/";
62		return true;
63	}
64	return false;
65};
66balloon.OnCreateContentString = function()
67{
68	if(!tt_aV[BALLOON])
69		return false;
70		
71	var aImg, sImgZ, sCssCrn, sCssImg;
72
73	// Cache balloon images in advance:
74	// Either use the pre-cached default images...
75	if(tt_aV[BALLOONIMGPATH] == config.BalloonImgPath)
76		aImg = balloon.aDefImg;
77	// ...or load images from different directory
78	else
79		aImg = Balloon_CacheImgs(tt_aV[BALLOONIMGPATH]);
80	sCssCrn = ' style="position:relative;width:' + tt_aV[BALLOONEDGESIZE] + 'px;padding:0px;margin:0px;overflow:hidden;line-height:0px;"';
81	sCssImg = 'padding:0px;margin:0px;border:0px;';
82	sImgZ = '" style="' + sCssImg + '" />';
83	
84	tt_sContent = '<table border="0" cellpadding="0" cellspacing="0" style="width:auto;padding:0px;margin:0px;left:0px;top:0px;"><tr>'
85				// Left-top corner
86				+ '<td' + sCssCrn + ' valign="bottom">'
87				+ '<img src="' + aImg[1].src + '" width="' + tt_aV[BALLOONEDGESIZE] + '" height="' + tt_aV[BALLOONEDGESIZE] + sImgZ
88				+ '</td>'
89				// Top border
90				+ '<td valign="bottom" style="position:relative;padding:0px;margin:0px;overflow:hidden;">'
91				+ '<img id="bALlOOnT" style="position:relative;top:1px;z-index:1;display:none;' + sCssImg + '" src="' + aImg[9].src + '" width="' + tt_aV[BALLOONSTEMWIDTH] + '" height="' + tt_aV[BALLOONSTEMHEIGHT] + '" />'

92				+ '<div style="position:relative;z-index:0;padding:0px;margin:0px;overflow:hidden;width:auto;height:' + tt_aV[BALLOONEDGESIZE] + 'px;background-image:url(' + aImg[2].src + ');">'
93				+ '</div>'
94				+ '</td>'
95				// Right-top corner
96				+ '<td' + sCssCrn + ' valign="bottom">'
97				+ '<img src="' + aImg[3].src + '" width="' + tt_aV[BALLOONEDGESIZE] + '" height="' + tt_aV[BALLOONEDGESIZE] + sImgZ
98				+ '</td>'
99				+ '</tr><tr>'
100				// Left border
101				+ '<td style="position:relative;padding:0px;margin:0px;width:' + tt_aV[BALLOONEDGESIZE] + 'px;overflow:hidden;background-image:url(' + aImg[8].src + ');">'
102				// Redundant image for bugous old Geckos that won't auto-expand TD height to 100%
103				+ '<img width="' + tt_aV[BALLOONEDGESIZE] + '" height="100%" src="' + aImg[8].src + sImgZ
104				+ '</td>'
105				// Content
106				+ '<td style="position:relative;line-height:normal;'
107				+ ';background-image:url(' + aImg[0].src + ')'
108				+ ';color:' + tt_aV[FONTCOLOR]
109				+ ';font-family:' + tt_aV[FONTFACE]
110				+ ';font-size:' + tt_aV[FONTSIZE]
111				+ ';font-weight:' + tt_aV[FONTWEIGHT]
112				+ ';text-align:' + tt_aV[TEXTALIGN]
113				+ ';padding:' + balloon.padding
114				+ ';width:' + (balloon.width ? (balloon.width + 'px') : 'auto')
115				+ ';">' + tt_sContent + '</td>'
116				// Right border
117				+ '<td style="position:relative;padding:0px;margin:0px;width:' + tt_aV[BALLOONEDGESIZE] + 'px;overflow:hidden;background-image:url(' + aImg[4].src + ');">'
118				// Image redundancy for bugous old Geckos that won't auto-expand TD height to 100%
119				+ '<img width="' + tt_aV[BALLOONEDGESIZE] + '" height="100%" src="' + aImg[4].src + sImgZ
120				+ '</td>'
121				+ '</tr><tr>'
122				// Left-bottom corner
123				+ '<td valign="top"' + sCssCrn + '>'
124				+ '<img src="' + aImg[7].src + '" width="' + tt_aV[BALLOONEDGESIZE] + '" height="' + tt_aV[BALLOONEDGESIZE] + sImgZ
125				+ '</td>'
126				// Bottom border
127				+ '<td valign="top" style="position:relative;padding:0px;margin:0px;overflow:hidden;">'
128				+ '<div style="position:relative;left:0px;top:0px;padding:0px;margin:0px;overflow:hidden;width:auto;height:' + tt_aV[BALLOONEDGESIZE] + 'px;background-image:url(' + aImg[6].src + ');"></div>'
129				+ '<img id="bALlOOnB" style="position:relative;top:-1px;left:2px;z-index:1;display:none;' + sCssImg + '" src="' + aImg[10].src + '" width="' + tt_aV[BALLOONSTEMWIDTH] + '" height="' + tt_aV[BALLOONSTEMHEIGHT] + '" />'

130				+ '</td>'
131				// Right-bottom corner
132				+ '<td valign="top"' + sCssCrn + '>'
133				+ '<img src="' + aImg[5].src + '" width="' + tt_aV[BALLOONEDGESIZE] + '" height="' + tt_aV[BALLOONEDGESIZE] + sImgZ
134				+ '</td>'
135				+ '</tr></table>';
136	return true;
137};
138balloon.OnSubDivsCreated = function()
139{
140	if(tt_aV[BALLOON])
141	{
142		balloon.iStem = tt_aV[ABOVE] * 1;
143		balloon.stem = [tt_GetElt("bALlOOnT"), tt_GetElt("bALlOOnB")];
144		balloon.stem[balloon.iStem].style.display = "inline";
145		return true;
146	}
147	return false;
148};
149// Display the stem appropriately
150balloon.OnMoveAfter = function()
151{
152	if(tt_aV[BALLOON])
153	{
154		var iStem = (tt_aV[ABOVE] != tt_bJmpVert) * 1;
155
156		// Tooltip position vertically flipped?
157		if(iStem != balloon.iStem)
158		{
159			// Display opposite stem
160			balloon.stem[balloon.iStem].style.display = "none";
161			balloon.stem[iStem].style.display = "inline";
162			balloon.iStem = iStem;
163		}
164		
165		balloon.stem[iStem].style.left = Balloon_CalcStemX() + "px";
166		return true;
167	}
168	return false;
169};
170function Balloon_CalcStemX()
171{
172	var x = tt_musX - tt_x;
173	return Math.max(Math.min(x, tt_w - tt_aV[BALLOONSTEMWIDTH] - (tt_aV[BALLOONEDGESIZE] << 1) - 2), 2);
174}
175function Balloon_CacheImgs(sPath)
176{
177	var asImg = ["background", "lt", "t", "rt", "r", "rb", "b", "lb", "l", "stemt", "stemb"],
178	n = asImg.length,
179	aImg = new Array(n),
180	img;
181
182	while(n)
183	{--n;
184		img = aImg[n] = new Image();
185		img.src = sPath + asImg[n] + ".gif";
186	}
187	return aImg;
188}
189// This mechanism pre-caches the default images specified by
190// congif.BalloonImgPath, so, whenever a balloon tip using these default images
191// is created, no further server connection is necessary.
192function Balloon_PreCacheDefImgs()
193{
194	// Append slash to img path if missing
195	if(config.BalloonImgPath.charAt(config.BalloonImgPath.length - 1) != '/')
196		config.BalloonImgPath += "/";
197	// Preload default images into array
198	balloon.aDefImg = Balloon_CacheImgs(config.BalloonImgPath);
199}
200Balloon_PreCacheDefImgs();