Using intalg (https://www.npmjs.com/package/intalg).

index.html

<h1>intalg</h1>
<script src="node_modules/intalg/dist/intalg.min.js"></script>
<script>
    const intervals = [
        {
            begin: 19,
            end: 31,
            type: 'rent'
        }
    ]

    const ruler = [
        {
            begin: 1,
            end: 15,
            type: 'free'
        }, {
            begin: 20,
            end: 30,
            type: 'block'
        }, {
            begin: 30,
            end: 40,
            type: 'free'
        }, {
            begin: 40,
            end: 45,
            type: 'free'
        }
    ]

    const result = intalg({intervals, ruler, preserve: ['block']})

    const {ruler: updatedRuler} = result

    let {conflicts} = result

    document.open()

    document.write(`
<pre>new ruler = ${JSON.stringify(updatedRuler, null, ' ')}</pre><br>
<pre>ruler = ${JSON.stringify(ruler, null, ' ')}</pre>
<pre>intervals = ${JSON.stringify(intervals, null, ' ')}</pre>
`)

    document.close()

    // const intervals = [   { begin: 4, end: 30, type: 0 },   { begin: 38, end: 43, type: 'fun' },   { begin: 56, end: 78, type: false } ]
    //
    // const ruler = [   { begin: 1, end: 9, type: 0 },   { begin: 9, end: 14, type: 0 },   { begin: 14, end: 23, type: 0 },   { begin: 29, end: 39, type: 0 },   { begin: 39, end: 41, type: 0 },   { begin: 45, end: 49, type: 0 },   { begin: 49, end: 60,
    // type: 0 },   { begin: 60, end: 92, type: 0 },   { begin: 92, end: 100, type: 0 } ]
</script>