wok: 4a2b41b98e39 sane-backends/stuff/tazpanel/crop.js

wok view sane-backends/stuff/tazpanel/crop.js @ rev 21490

trickle: fix build

author	Pascal Bellard <pascal.bellard@slitaz.org>
date	Wed May 01 18:05:32 2019 +0200 (2019-05-01)
parents	140c18f428f0
children

line source

1 var cropOrgWidth, cropOrgHeight, cropX, cropY, cropWidth, cropHeight;

2 var cropBaseX, cropBaseY, cropDot2value, cropMinSize, cropDragOfs;

4 var cropEventX, cropEventY;

5 var cropResizeId, cropEventTop, cropEventLeft, cropEventWidth, cropEventHeight;

6 var cropResizeCounter = -1, cropMoveCounter = -1;

8 var cropDivW, cropDivN, cropDivE, cropDivS, cropDivFrame;

9 var cropNW, cropN, cropNE, cropW, cropE, cropSW, cropS, cropSE;

11 function cropOpacity(div,degree)

13 div.style.backgroundColor = '#FFF';

14 if (div.style.opacity) div.style.opacity = degree / 100;

15 if (div.style.MozOpacity) div.style.MozOpacity = degree / 101;

16 if (div.style.KhtmlOpacity) div.style.KhtmlOpacity = degree / 100;

19 function cropCreateDiv(e)

21 var div = document.createElement('DIV');

22 div.style.position = 'absolute';

23 div.style.visibility = 'visible';

24 cropOpacity(div,60);

25 div.style.left= div.style.top= div.style.height= div.style.width= '0px';

26 div.innerHTML = '<span></span>';

27 e.appendChild(div);

28 return div;

31 function cropCreateDragImg(id)

33 var div = document.createElement('IMG');

34 div.src = 'styles/default/images/drag.gif';

35 div.width = 12;

36 div.style.position = 'absolute';

37 div.style.cursor = div.id = id;

38 div.onmousedown = cropInitResize;

39 cropDivFrame.appendChild(div);

40 return div;

43 function cropSetFrame()

45 var top = cropDivFrame.style.top.replace('px','');

46 var left = cropDivFrame.style.left.replace('px','');

47 var width = cropDivFrame.style.width.replace('px','');

48 var height = cropDivFrame.style.height.replace('px','');

49 var totalTop = top/1 + height/1;

50 var totalWidth = left/1 + width/1;

52 cropN.style.left =

53 cropS.style.left = (Math.floor(width/2) - cropDragOfs) + 'px';

54 cropE.style.left =

55 cropNE.style.left =

56 cropSE.style.left = (width - cropDragOfs) + 'px';

57 cropW.style.top =

58 cropE.style.top = (Math.floor(height/2) - cropDragOfs) + 'px';

59 cropS.style.top =

60 cropSE.style.top =

61 cropSW.style.top = (height - cropDragOfs) + 'px';

63 cropDivS.style.height = Math.max(0,cropOrgHeight - totalTop) + 'px';

64 cropDivN.style.height = cropDivFrame.style.top;

65 cropDivS.style.width =

66 cropDivN.style.width = width + 'px' ;

67 cropDivE.style.width = Math.max(0,cropOrgWidth - totalWidth) + 'px';

68 cropDivW.style.width =

69 cropDivS.style.left =

70 cropDivN.style.left = cropDivFrame.style.left;

71 cropDivE.style.left = totalWidth + 'px';

72 cropDivS.style.top = totalTop + 'px';

75 function cropSaveEvent(e)

77 cropEventX = e.clientX;

78 cropEventY = e.clientY;

79 cropEventTop = cropDivFrame.style.top.replace('px','');

80 cropEventLeft = cropDivFrame.style.left.replace('px','');

81 cropEventWidth = cropDivFrame.style.width.replace('px','');

82 cropEventHeight = cropDivFrame.style.height.replace('px','');

85 function cropTimerMove()

87 if (cropMoveCounter >= 0 && cropMoveCounter < 10) {

88 cropMoveCounter++;

89 setTimeout('cropTimerMove()',1);

90 }

93 function cropTimerResize()

95 if (cropResizeCounter >= 0 && cropResizeCounter < 10) {

96 cropResizeCounter++;

97 setTimeout('cropTimerResize()',1);

101 function cropCancelEvent(e)

103 if (document.all) e = event;

104 if (e.target) source = e.target;

105 else if (e.srcElement) source = e.srcElement;

106 if (source.tagName && source.tagName.toLowerCase() == 'input')

107 return true;

108 return false;

111 function cropInitMove(e)

113 if (document.all) e = event;

114 if (e.target) source = e.target;

115 else if (e.srcElement) source = e.srcElement;

116 if (source.id && source.id.indexOf('resize') >= 0) return;

117 cropSaveEvent(e);

118 cropMoveCounter = 0;

119 cropTimerMove();

120 return false;

123 var cropDiv0style;

124 function cropInitResize(e)

126 if (document.all) e = event;

127 cropDivFrame.style.cursor = 'default';

128 if (document.all) cropDiv0style.display = 'none';

129 cropResizeId = this.id;

130 cropResizeCounter = 0;

131 cropSaveEvent(e);

132 cropTimerResize();

133 return false;

136 var cropMouseMoveEventInProgress = false;

137 function cropMouseMove(e)

139 if (cropMouseMoveEventInProgress) return;

140 if (cropMoveCounter < 10 && cropResizeCounter < 10) return;

141 if (document.all) cropMouseMoveEventInProgress = true;

142 if (document.all) e = event;

143 var deltaX = e.clientX - cropEventX;

144 var deltaY = e.clientY - cropEventY;

145 if (cropResizeCounter == 10) {

146 var top = cropEventTop;

147 var left = cropEventLeft;

148 var width = cropEventWidth;

149 var height = cropEventHeight;

150 if (cropResizeId == 'e-resize'

151 || cropResizeId == 'ne-resize'

152 || cropResizeId == 'se-resize') {

153 width = Math.max(cropMinSize,

154 cropEventWidth/1 + deltaX/1);

156 if (cropResizeId == 's-resize'

157 || cropResizeId == 'sw-resize'

158 || cropResizeId == 'se-resize') {

159 height = Math.max(cropMinSize,

160 cropEventHeight/1 + deltaY/1);

162 if (cropResizeId == 'w-resize'

163 || cropResizeId == 'sw-resize'

164 || cropResizeId == 'nw-resize') {

165 var total = left/1 + width/1;

166 left = Math.min(left/1 + deltaX/1, total - cropMinSize);

167 width = total - left;

170 if (cropResizeId == 'n-resize'

171 || cropResizeId == 'nw-resize'

172 || cropResizeId == 'ne-resize') {

173 var total = top/1 + height/1;

174 top = Math.min(top/1 + deltaY/1, total - cropMinSize);

175 height = total - top;

178 if (top > cropOrgHeight) height = cropOrgHeight - top;

179 if (left > cropOrgWidth) width = cropOrgWidth - left;

181 cropDivFrame.style.top = top + 'px';

182 cropDivFrame.style.left = left + 'px';

183 cropDivFrame.style.width = width + 'px';

184 cropDivFrame.style.height = height + 'px';

187 if (cropMoveCounter == 10) {

188 var left = cropEventLeft/1 + deltaX/1;

189 var leftMax = cropOrgWidth - cropEventWidth;

190 if (left < 0) left = 0;

191 if (left > leftMax) left = leftMax;

192 cropDivFrame.style.left = left + 'px';

193 var top = cropEventTop/1 + deltaY/1;

194 var topMax = cropOrgHeight - cropEventHeight;

195 if (top < 0) top = 0;

196 if (top > topMax) top = topMax;

197 cropDivFrame.style.top = top + 'px';

199 cropSetFrame();

200 cropMouseMoveEventInProgress = false;

203 function cropUpdateFromValues()

205 cropX.value = Math.round(10 * cropDot2value

206 * cropDivFrame.style.left.replace('px','')) /10

207 + cropBaseX/1;

208 cropY.value = Math.round(10 * cropDot2value

209 * cropDivFrame.style.top.replace('px','')) /10

210 + cropBaseY/1;

211 cropWidth.value = Math.round(10 * cropDot2value

212 * cropDivFrame.style.width.replace('px','')) /10;

213 cropHeight.value = Math.round(10 * cropDot2value

214 * cropDivFrame.style.height.replace('px','')) /10;

217 function cropStopResizeMove()

219 cropMoveCounter = cropResizeCounter = -1;

220 cropDivFrame.style.cursor = 'move';

221 cropUpdateFromValues();

222 if (document.all) cropDiv0style.display = 'block';

225 function cropGetInput(obj,origin,ofs,min,max)

227 var t = origin;

228 if (obj.value.length)

229 t = (obj.value.replace(/[^0-9\.]/gi,'') - ofs) / cropDot2value;

230 if (t < min) t = min;

231 if (t > max) t = max;

232 obj.value = Math.round(t * cropDot2value * 10) /10;

233 return Math.round(t);

236 function cropSetFrameByInput()

238 var x, y;

239 x = cropGetInput(cropX, 0, cropBaseX, 0, cropOrgWidth - cropMinSize);

240 y = cropGetInput(cropY, 0, cropBaseY, 0, cropOrgHeight - cropMinSize);

241 cropDivFrame.style.top = y + 'px';

242 cropDivFrame.style.left = x + 'px';

243 cropDivFrame.style.width = cropGetInput(cropWidth, cropOrgWidth, 0,

244 cropMinSize, cropOrgWidth - x) + 'px';

245 cropDivFrame.style.height = cropGetInput(cropHeight, cropOrgHeight, 0,

246 cropMinSize, cropOrgHeight - y) + 'px';

247 cropSetFrame();

250 function cropInit(e,x,y,width,height)

252 var div = e.parentNode;

254 cropOrgWidth = e.width;

255 cropOrgHeight = e.height;

257 cropX = document.getElementById(x);

258 cropY = document.getElementById(y);

259 cropWidth = document.getElementById(width);

260 cropHeight = document.getElementById(height);

262 cropBaseX = cropX.value.replace(/[^0-9\.]/gi,'');

263 cropBaseY = cropY.value.replace(/[^0-9\.]/gi,'');

265 cropDot2value = cropWidth.value / e.width;

267 div.style.position = 'relative';

268 div.style.top = div.style.left = '0px';

269 div.style.width = div.style.height = '100%';

270 cropOpacity(div,0);

272 cropDivW = cropCreateDiv(div);

273 cropDivN = cropCreateDiv(div);

274 cropDivE = cropCreateDiv(div);

275 cropDivS = cropCreateDiv(div);

276 cropDivN.style.width = cropDivE.style.left =

277 cropDivS.style.width = cropOrgWidth + 'px';

278 cropDivW.style.height = cropDivE.style.height =

279 cropDivS.style.top = cropOrgHeight + 'px';

281 cropDivFrame = document.createElement('DIV');

282 cropDivFrame.style.border = '1px #000000 dashed';

283 cropDivFrame.style.zIndex = 1000;

284 cropDivFrame.style.position = 'absolute';

285 cropDivFrame.style.left = cropDivFrame.style.top = '0px';

286 cropDivFrame.style.width = cropOrgWidth + 'px';

287 cropDivFrame.style.height = cropOrgHeight + 'px';

288 cropDivFrame.innerHTML = '<div></div>';

289 cropDivFrame.style.cursor = 'move';

291 cropDiv0style = cropDivFrame.getElementsByTagName('DIV')[0].style;

292 if (navigator.userAgent.indexOf('Opera') >=0 ) {

293 cropDiv0style.backgroundColor =

294 cropDivS.style.backgroundColor =

295 cropDivE.style.backgroundColor =

296 cropDivN.style.backgroundColor =

297 cropDivW.style.backgroundColor = 'transparent';

300 cropNW = cropCreateDragImg('nw-resize');

301 cropNE = cropCreateDragImg('ne-resize');

302 cropSW = cropCreateDragImg('sw-resize');

303 cropSE = cropCreateDragImg('se-resize');

304 cropN = cropCreateDragImg('n-resize');

305 cropS = cropCreateDragImg('s-resize');

306 cropW = cropCreateDragImg('w-resize');

307 cropE = cropCreateDragImg('e-resize');

308 cropMinSize = cropE.width*2;

309 cropDragOfs = Math.floor(cropE.width/2)

311 cropN.style.left = cropS.style.left =

312 (Math.floor(cropOrgWidth/2) - cropDragOfs) + 'px';

313 cropSW.style.top = cropSE.style.top =

314 cropS.style.top = (cropOrgHeight - cropDragOfs) + 'px';

316 cropNW.style.top = cropNW.style.left =

317 cropNE.style.top = cropSW.style.left =

318 cropN.style.top = cropW.style.left = (-cropDragOfs) + 'px';

320 cropNE.style.left = cropSE.style.left =

321 cropE.style.left = (cropOrgWidth - cropDragOfs) + 'px';

322 cropW.style.top = cropE.style.top =

323 (Math.floor(cropOrgHeight/2) - cropDragOfs) + 'px';

325 div.appendChild(cropDivFrame);

327 div.onselectstart = div.ondragstart = cropCancelEvent;

328 div.onmousemove = cropMouseMove;

329 div.onmouseup = cropStopResizeMove;

330 cropDivFrame.onmousedown = cropInitMove;

331 cropX.onchange = cropY.onchange = cropWidth.onchange =

332 cropHeight.onchange = cropSetFrameByInput;