butcherman /
Tech_Bench
| @@ 9322-9396 (lines=75) @@ | ||
| 9319 | reset: function () { |
|
| 9320 | this.value(this._initValue).repaint(); |
|
| 9321 | }, |
|
| 9322 | postRender: function () { |
|
| 9323 | var self = this; |
|
| 9324 | var minValue, maxValue, screenCordName, stylePosName, sizeName, shortSizeName; |
|
| 9325 | function toFraction(min, max, val) { |
|
| 9326 | return (val + min) / (max - min); |
|
| 9327 | } |
|
| 9328 | function fromFraction(min, max, val) { |
|
| 9329 | return val * (max - min) - min; |
|
| 9330 | } |
|
| 9331 | function handleKeyboard(minValue, maxValue) { |
|
| 9332 | function alter(delta) { |
|
| 9333 | var value; |
|
| 9334 | value = self.value(); |
|
| 9335 | value = fromFraction(minValue, maxValue, toFraction(minValue, maxValue, value) + delta * 0.05); |
|
| 9336 | value = constrain(value, minValue, maxValue); |
|
| 9337 | self.value(value); |
|
| 9338 | self.fire('dragstart', { value: value }); |
|
| 9339 | self.fire('drag', { value: value }); |
|
| 9340 | self.fire('dragend', { value: value }); |
|
| 9341 | } |
|
| 9342 | self.on('keydown', function (e) { |
|
| 9343 | switch (e.keyCode) { |
|
| 9344 | case 37: |
|
| 9345 | case 38: |
|
| 9346 | alter(-1); |
|
| 9347 | break; |
|
| 9348 | case 39: |
|
| 9349 | case 40: |
|
| 9350 | alter(1); |
|
| 9351 | break; |
|
| 9352 | } |
|
| 9353 | }); |
|
| 9354 | } |
|
| 9355 | function handleDrag(minValue, maxValue, handleEl) { |
|
| 9356 | var startPos, startHandlePos, maxHandlePos, handlePos, value; |
|
| 9357 | self._dragHelper = new DragHelper(self._id, { |
|
| 9358 | handle: self._id + '-handle', |
|
| 9359 | start: function (e) { |
|
| 9360 | startPos = e[screenCordName]; |
|
| 9361 | startHandlePos = parseInt(self.getEl('handle').style[stylePosName], 10); |
|
| 9362 | maxHandlePos = (self.layoutRect()[shortSizeName] || 100) - funcs.getSize(handleEl)[sizeName]; |
|
| 9363 | self.fire('dragstart', { value: value }); |
|
| 9364 | }, |
|
| 9365 | drag: function (e) { |
|
| 9366 | var delta = e[screenCordName] - startPos; |
|
| 9367 | handlePos = constrain(startHandlePos + delta, 0, maxHandlePos); |
|
| 9368 | handleEl.style[stylePosName] = handlePos + 'px'; |
|
| 9369 | value = minValue + handlePos / maxHandlePos * (maxValue - minValue); |
|
| 9370 | self.value(value); |
|
| 9371 | self.tooltip().text('' + self.settings.previewFilter(value)).show().moveRel(handleEl, 'bc tc'); |
|
| 9372 | self.fire('drag', { value: value }); |
|
| 9373 | }, |
|
| 9374 | stop: function () { |
|
| 9375 | self.tooltip().hide(); |
|
| 9376 | self.fire('dragend', { value: value }); |
|
| 9377 | } |
|
| 9378 | }); |
|
| 9379 | } |
|
| 9380 | minValue = self._minValue; |
|
| 9381 | maxValue = self._maxValue; |
|
| 9382 | if (self.settings.orientation === 'v') { |
|
| 9383 | screenCordName = 'screenY'; |
|
| 9384 | stylePosName = 'top'; |
|
| 9385 | sizeName = 'height'; |
|
| 9386 | shortSizeName = 'h'; |
|
| 9387 | } else { |
|
| 9388 | screenCordName = 'screenX'; |
|
| 9389 | stylePosName = 'left'; |
|
| 9390 | sizeName = 'width'; |
|
| 9391 | shortSizeName = 'w'; |
|
| 9392 | } |
|
| 9393 | self._super(); |
|
| 9394 | handleKeyboard(minValue, maxValue); |
|
| 9395 | handleDrag(minValue, maxValue, self.getEl('handle')); |
|
| 9396 | }, |
|
| 9397 | repaint: function () { |
|
| 9398 | this._super(); |
|
| 9399 | updateSliderHandle(this, this.value()); |
|
| @@ 9130-9204 (lines=75) @@ | ||
| 9127 | reset: function () { |
|
| 9128 | this.value(this._initValue).repaint(); |
|
| 9129 | }, |
|
| 9130 | postRender: function () { |
|
| 9131 | var self = this; |
|
| 9132 | var minValue, maxValue, screenCordName, stylePosName, sizeName, shortSizeName; |
|
| 9133 | function toFraction(min, max, val) { |
|
| 9134 | return (val + min) / (max - min); |
|
| 9135 | } |
|
| 9136 | function fromFraction(min, max, val) { |
|
| 9137 | return val * (max - min) - min; |
|
| 9138 | } |
|
| 9139 | function handleKeyboard(minValue, maxValue) { |
|
| 9140 | function alter(delta) { |
|
| 9141 | var value; |
|
| 9142 | value = self.value(); |
|
| 9143 | value = fromFraction(minValue, maxValue, toFraction(minValue, maxValue, value) + delta * 0.05); |
|
| 9144 | value = constrain(value, minValue, maxValue); |
|
| 9145 | self.value(value); |
|
| 9146 | self.fire('dragstart', { value: value }); |
|
| 9147 | self.fire('drag', { value: value }); |
|
| 9148 | self.fire('dragend', { value: value }); |
|
| 9149 | } |
|
| 9150 | self.on('keydown', function (e) { |
|
| 9151 | switch (e.keyCode) { |
|
| 9152 | case 37: |
|
| 9153 | case 38: |
|
| 9154 | alter(-1); |
|
| 9155 | break; |
|
| 9156 | case 39: |
|
| 9157 | case 40: |
|
| 9158 | alter(1); |
|
| 9159 | break; |
|
| 9160 | } |
|
| 9161 | }); |
|
| 9162 | } |
|
| 9163 | function handleDrag(minValue, maxValue, handleEl) { |
|
| 9164 | var startPos, startHandlePos, maxHandlePos, handlePos, value; |
|
| 9165 | self._dragHelper = new DragHelper(self._id, { |
|
| 9166 | handle: self._id + '-handle', |
|
| 9167 | start: function (e) { |
|
| 9168 | startPos = e[screenCordName]; |
|
| 9169 | startHandlePos = parseInt(self.getEl('handle').style[stylePosName], 10); |
|
| 9170 | maxHandlePos = (self.layoutRect()[shortSizeName] || 100) - funcs.getSize(handleEl)[sizeName]; |
|
| 9171 | self.fire('dragstart', { value: value }); |
|
| 9172 | }, |
|
| 9173 | drag: function (e) { |
|
| 9174 | var delta = e[screenCordName] - startPos; |
|
| 9175 | handlePos = constrain(startHandlePos + delta, 0, maxHandlePos); |
|
| 9176 | handleEl.style[stylePosName] = handlePos + 'px'; |
|
| 9177 | value = minValue + handlePos / maxHandlePos * (maxValue - minValue); |
|
| 9178 | self.value(value); |
|
| 9179 | self.tooltip().text('' + self.settings.previewFilter(value)).show().moveRel(handleEl, 'bc tc'); |
|
| 9180 | self.fire('drag', { value: value }); |
|
| 9181 | }, |
|
| 9182 | stop: function () { |
|
| 9183 | self.tooltip().hide(); |
|
| 9184 | self.fire('dragend', { value: value }); |
|
| 9185 | } |
|
| 9186 | }); |
|
| 9187 | } |
|
| 9188 | minValue = self._minValue; |
|
| 9189 | maxValue = self._maxValue; |
|
| 9190 | if (self.settings.orientation === 'v') { |
|
| 9191 | screenCordName = 'screenY'; |
|
| 9192 | stylePosName = 'top'; |
|
| 9193 | sizeName = 'height'; |
|
| 9194 | shortSizeName = 'h'; |
|
| 9195 | } else { |
|
| 9196 | screenCordName = 'screenX'; |
|
| 9197 | stylePosName = 'left'; |
|
| 9198 | sizeName = 'width'; |
|
| 9199 | shortSizeName = 'w'; |
|
| 9200 | } |
|
| 9201 | self._super(); |
|
| 9202 | handleKeyboard(minValue, maxValue); |
|
| 9203 | handleDrag(minValue, maxValue, self.getEl('handle')); |
|
| 9204 | }, |
|
| 9205 | repaint: function () { |
|
| 9206 | this._super(); |
|
| 9207 | updateSliderHandle(this, this.value()); |
|
