Fossil SCM
Removed the unused/incomplete split-view widget. The current UI doesn't seem to need that level of manual size tuning.
Commit
ba1be566ae221a93d17a52e8c19c49165c1b99c967c1b82303059a771ecbad4c
Parent
ed51ec4ef681071…
1 file changed
-57
| --- src/fossil.page.pikchrshowasm.js | ||
| +++ src/fossil.page.pikchrshowasm.js | ||
| @@ -213,67 +213,10 @@ | ||
| 213 | 213 | PS.e.btnRender.addEventListener('click',function(ev){ |
| 214 | 214 | ev.preventDefault(); |
| 215 | 215 | renderCurrentText(); |
| 216 | 216 | },false); |
| 217 | 217 | |
| 218 | - 0 && (function(){ | |
| 219 | - /* Set up split-view controls... This _almost_ works correctly, | |
| 220 | - just needs some tweaking to account for switching between | |
| 221 | - side-by-side and top-bottom views. */ | |
| 222 | - // adapted from https://htmldom.dev/create-resizable-split-views/ | |
| 223 | - const Split = { | |
| 224 | - e:{ | |
| 225 | - left: E('.zone-wrapper.input'), | |
| 226 | - right: E('.zone-wrapper.output'), | |
| 227 | - handle: E('.splitter-handle'), | |
| 228 | - parent: E('#main-wrapper') | |
| 229 | - }, | |
| 230 | - x: 0, y: 0, | |
| 231 | - widthLeft: 0, | |
| 232 | - heightLeft: 0 | |
| 233 | - }; | |
| 234 | - Split.mouseDownHandler = function(e){ | |
| 235 | - this.x = e.clientX; | |
| 236 | - this.y = e.clientY; | |
| 237 | - const r = this.e.left.getBoundingClientRect(); | |
| 238 | - this.widthLeft = r.width; | |
| 239 | - this.heightLeft = r.height; | |
| 240 | - document.addEventListener('mousemove', this.mouseMoveHandler); | |
| 241 | - document.addEventListener('mouseup', this.mouseUpHandler); | |
| 242 | - }.bind(Split); | |
| 243 | - Split.mouseMoveHandler = function(e){ | |
| 244 | - const isHorizontal = this.e.parent.classList.contains('side-by-side'); | |
| 245 | - const dx = e.clientX - this.x; | |
| 246 | - const dy = e.clientY - this.y; | |
| 247 | - if(isHorizontal){ | |
| 248 | - const w = ((this.widthLeft + dx) * 100) | |
| 249 | - / this.e.parent.getBoundingClientRect().width; | |
| 250 | - this.e.left.style.width = w+'%'; | |
| 251 | - }else{ | |
| 252 | - const h = ((this.heightLeft + dy) * 100) | |
| 253 | - / this.e.parent.getBoundingClientRect().height; | |
| 254 | - this.e.left.style.height = h+'%'; | |
| 255 | - } | |
| 256 | - document.body.style.cursor = isHorizontal ? 'col-resize' : 'row-resize'; | |
| 257 | - this.e.left.style.userSelect = 'none'; | |
| 258 | - this.e.left.style.pointerEvents = 'none'; | |
| 259 | - this.e.right.style.userSelect = 'none'; | |
| 260 | - this.e.right.style.pointerEvents = 'none'; | |
| 261 | - }.bind(Split); | |
| 262 | - Split.mouseUpHandler = function(e){ | |
| 263 | - this.e.handle.style.removeProperty('cursor'); | |
| 264 | - document.body.style.removeProperty('cursor'); | |
| 265 | - this.e.left.style.removeProperty('user-select'); | |
| 266 | - this.e.left.style.removeProperty('pointer-events'); | |
| 267 | - this.e.right.style.removeProperty('user-select'); | |
| 268 | - this.e.right.style.removeProperty('pointer-events'); | |
| 269 | - document.removeEventListener('mousemove', this.mouseMoveHandler); | |
| 270 | - document.removeEventListener('mouseup', this.mouseUpHandler); | |
| 271 | - }.bind(Split); | |
| 272 | - Split.e.handle.addEventListener('mousedown', Split.mouseDownHandler); | |
| 273 | - })(); | |
| 274 | - | |
| 275 | 218 | /** To be called immediately before work is sent to the |
| 276 | 219 | worker. Updates some UI elements. The 'working'/'end' |
| 277 | 220 | event will apply the inverse, undoing the bits this |
| 278 | 221 | function does. This impl is not in the 'working'/'start' |
| 279 | 222 | event handler because that event is given to us |
| 280 | 223 |
| --- src/fossil.page.pikchrshowasm.js | |
| +++ src/fossil.page.pikchrshowasm.js | |
| @@ -213,67 +213,10 @@ | |
| 213 | PS.e.btnRender.addEventListener('click',function(ev){ |
| 214 | ev.preventDefault(); |
| 215 | renderCurrentText(); |
| 216 | },false); |
| 217 | |
| 218 | 0 && (function(){ |
| 219 | /* Set up split-view controls... This _almost_ works correctly, |
| 220 | just needs some tweaking to account for switching between |
| 221 | side-by-side and top-bottom views. */ |
| 222 | // adapted from https://htmldom.dev/create-resizable-split-views/ |
| 223 | const Split = { |
| 224 | e:{ |
| 225 | left: E('.zone-wrapper.input'), |
| 226 | right: E('.zone-wrapper.output'), |
| 227 | handle: E('.splitter-handle'), |
| 228 | parent: E('#main-wrapper') |
| 229 | }, |
| 230 | x: 0, y: 0, |
| 231 | widthLeft: 0, |
| 232 | heightLeft: 0 |
| 233 | }; |
| 234 | Split.mouseDownHandler = function(e){ |
| 235 | this.x = e.clientX; |
| 236 | this.y = e.clientY; |
| 237 | const r = this.e.left.getBoundingClientRect(); |
| 238 | this.widthLeft = r.width; |
| 239 | this.heightLeft = r.height; |
| 240 | document.addEventListener('mousemove', this.mouseMoveHandler); |
| 241 | document.addEventListener('mouseup', this.mouseUpHandler); |
| 242 | }.bind(Split); |
| 243 | Split.mouseMoveHandler = function(e){ |
| 244 | const isHorizontal = this.e.parent.classList.contains('side-by-side'); |
| 245 | const dx = e.clientX - this.x; |
| 246 | const dy = e.clientY - this.y; |
| 247 | if(isHorizontal){ |
| 248 | const w = ((this.widthLeft + dx) * 100) |
| 249 | / this.e.parent.getBoundingClientRect().width; |
| 250 | this.e.left.style.width = w+'%'; |
| 251 | }else{ |
| 252 | const h = ((this.heightLeft + dy) * 100) |
| 253 | / this.e.parent.getBoundingClientRect().height; |
| 254 | this.e.left.style.height = h+'%'; |
| 255 | } |
| 256 | document.body.style.cursor = isHorizontal ? 'col-resize' : 'row-resize'; |
| 257 | this.e.left.style.userSelect = 'none'; |
| 258 | this.e.left.style.pointerEvents = 'none'; |
| 259 | this.e.right.style.userSelect = 'none'; |
| 260 | this.e.right.style.pointerEvents = 'none'; |
| 261 | }.bind(Split); |
| 262 | Split.mouseUpHandler = function(e){ |
| 263 | this.e.handle.style.removeProperty('cursor'); |
| 264 | document.body.style.removeProperty('cursor'); |
| 265 | this.e.left.style.removeProperty('user-select'); |
| 266 | this.e.left.style.removeProperty('pointer-events'); |
| 267 | this.e.right.style.removeProperty('user-select'); |
| 268 | this.e.right.style.removeProperty('pointer-events'); |
| 269 | document.removeEventListener('mousemove', this.mouseMoveHandler); |
| 270 | document.removeEventListener('mouseup', this.mouseUpHandler); |
| 271 | }.bind(Split); |
| 272 | Split.e.handle.addEventListener('mousedown', Split.mouseDownHandler); |
| 273 | })(); |
| 274 | |
| 275 | /** To be called immediately before work is sent to the |
| 276 | worker. Updates some UI elements. The 'working'/'end' |
| 277 | event will apply the inverse, undoing the bits this |
| 278 | function does. This impl is not in the 'working'/'start' |
| 279 | event handler because that event is given to us |
| 280 |
| --- src/fossil.page.pikchrshowasm.js | |
| +++ src/fossil.page.pikchrshowasm.js | |
| @@ -213,67 +213,10 @@ | |
| 213 | PS.e.btnRender.addEventListener('click',function(ev){ |
| 214 | ev.preventDefault(); |
| 215 | renderCurrentText(); |
| 216 | },false); |
| 217 | |
| 218 | /** To be called immediately before work is sent to the |
| 219 | worker. Updates some UI elements. The 'working'/'end' |
| 220 | event will apply the inverse, undoing the bits this |
| 221 | function does. This impl is not in the 'working'/'start' |
| 222 | event handler because that event is given to us |
| 223 |