how to use showModal to completely block content outside as promised?

Question

I\'m trying to modify a page behaviour with a javascript: bookmark, as I can\'t make plugins (or almost anything else) in my current environment.

almost eve

Answer 1

finally! this worked.

first I figured "let's just try to override the onkeypress", but while it was working in this singular instance, it wasn't in my environment. then eventually I figured "oh, maybe it's on the keydown". and so it was. :)

so, in the end, the statement isn't entirely false. it's just not preventing other events from propagating, probably per design, as there are resources to do it if you need to. (namely, in this case, stopPropagation).

(function(){
    window.overrideEnter = overrideEnter
    function overrideEnter (event) {
        if (event.keyCode == 13) {
            event.stopPropagation()
        }
    }
    window.dialog = dialog
    function dialog (title, callback, value) {
        let alertDialog = document.getElementById('alertDialog')
        if (alertDialog) alertDialog.remove()
        let htmlDiv = document.createElement('div')
        let html = `
dummy
        

          

            

              

                ${title}
                

                
              
            
            
              ok
               
              cancel
            
          
        
        `
        htmlDiv.innerHTML = html.replace(/^\s* <', '><') // ...after jscompress minifies this and we paste into bookmark, it adds those spaces which would yield to append child error
        alertDialog = htmlDiv.childNodes[1]
        document.querySelector('body').appendChild(alertDialog)
        let cancelButton = alertDialog.querySelector('#cancel')
        cancelButton.addEventListener('click', function(){ alertDialog.close(); callback(false) })
        let input = alertDialog.querySelector('input')
        //console.log(input)
        if (typeof callback === 'function') {
            alertDialog.onsubmit = function(){ callback(input ? input.value : true) }
            alertDialog.oncancel = function(){ callback(false) }
            alertDialog.onclose = function(){}
        }

        document.onkeydown = function(event) {
            event = event || window.event
            if (event.keyCode == 13) {
                event.stopPropagation()
            }
        }
        if (value !== undefined) {
            alertDialog.showModal() // prompt
        } else {
            input.remove()
            input = undefined
            if (title.substr(-1) === '?') {
                alertDialog.showModal() // confirm
            } else {
                cancelButton.remove()
                alertDialog.showModal() // alert
            }
        }
        return null
    }
}())

    
    modal