{"version":3,"sources":["https://lively-kernel.org/lively4/swt21-debugging/src/components/tools/trace-visualization.js"],"names":["babelDefault","loadPlugin","sourcemap","debounce","Trace","Morph","babel","TraceVisualization","initialize","windowTitle","registerButtons","lively","html","registerKeys","currentURL","textManuallyChanged","trace","curAST","nextAST","entries","debounced","_","selection","editor","currentEditor","listSelections","position","filename","startLine","anchor","line","endLine","head","startColumn","ch","endColumn","markInRange","cm","awaitEditor","on","cancel","for","source","pluginData","selector","openComponentInWindow","visualize","updateList","setCurrentAST","oldAST","traceList","get","currentAST","transformedAst","editorDoc","onShowAst","comparison","updateView","setEditorURL","newURL","setURL","loadFile","clearList","innerHTML","markAndScrollTo","scrollIntoView","lastMark","markText","css","setSubEntryEventListener","subEntry","elm","path","addEventListener","e","stopPropagation","clear","updateASTs","resolve","openInInspector","createSectionElement","section","className","hasChanges","header","name","body","entry","data","traverse","fn","child","children","isTriggered","innerText","me","visit","visitEvent","event","type","appendChild","visitErrorEvent","errorEvent","setText","visitTraceSection","traceSection","select","addListItem","push","sections","isInRange","given","toTest","item","classList","add","ast","value","transformFromAst","code","setTransformedAST","showASTs","walkPath","part","apply","JSON","parse","stringify","index","indexOf","i","livelyPrepareSave","setAttribute","livelyPreMigrate","livelyMigrate","other","livelyInspect","contentNode","inspector","livelyExample","plugins","url"],"mappings":"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","file":"trace-visualization.js","sourcesContent":["import babelDefault from 'systemjs-babel-build';\nconst babel = babelDefault.babel;\nimport loadPlugin from 'demos/tom/plugin-load-promise.js';\nimport sourcemap from 'src/external/source-map.min.js';\nimport { debounce } from 'utils';\nimport Trace from 'demos/tom/trace.js';\n\nimport Morph from 'src/components/widgets/lively-morph.js';\n\nexport default class TraceVisualization extends Morph {\n    async initialize() {\n        this.windowTitle = \"TraceVisualization\";\n        this.registerButtons()\n\n        lively.html.registerKeys(this); // automatically installs handler for some methods\n\n\n        this.currentURL = null;\n        this.textManuallyChanged = false;\n\n        // declare variables used later on for documentation\n        this.trace;\n        this.curAST;\n        this.nextAST;\n\n        this.entries = [];\n\n        let debounced = _.debounce(() => {\n            const selection = this.editor.currentEditor().listSelections()[0];\n            const position = {\n                filename: this.currentURL,\n                startLine: selection.anchor.line,\n                endLine: selection.head.line,\n                startColumn: selection.anchor.ch,\n                endColumn: selection.head.ch\n            };\n            this.markInRange(position);\n        }, 500);\n\n        const cm = await this.editor.awaitEditor();\n        \n        cm.on(\"beforeSelectionChange\", () => {\n            debounced.cancel();\n            debounced();\n        });\n    }\n\n\n    static async for (source, pluginData) {\n        const trace = await Trace.on(source, pluginData);\n        const selector = await lively.openComponentInWindow('trace-visualization');\n        selector.visualize(trace);\n    }\n\n    visualize(trace) {\n        this.trace = trace;\n        this.updateList();\n        this.setCurrentAST(trace.oldAST);\n    }\n\n    /*MD ## UI access MD*/\n\n    get traceList() {\n        return this.get('#traceList');\n    }\n\n    get editor() {\n        return this.get('#editor');\n    }\n\n    get currentAST() {\n        return this.get('#currentAst');\n    }\n\n    get transformedAst() {\n        return this.get('#transformedAst');\n    }\n\n    get editorDoc() {\n        return this.editor.currentEditor();\n    }\n\n    async onShowAst() {\n        if (!this.comparison) {\n            this.comparison = await lively.openComponentInWindow('lively-ast-comparison');\n        }\n        this.comparison.updateView(this.curAST, this.nextAST);\n    }\n\n    async setEditorURL(newURL) {\n        if (this.currentURL !== newURL || this.textManuallyChanged) {\n            this.editor.setURL(newURL);\n            this.currentURL = newURL;\n            await this.editor.loadFile();\n            this.textManuallyChanged = false;\n        }\n    }\n    /*MD ## Update list MD*/\n\n    clearList() {\n        this.traceList.innerHTML = '';\n    }\n\n    markAndScrollTo(position) {\n        this.editorDoc.scrollIntoView({\n            line: position.startLine - 1,\n            ch: position.startColumn\n        }, 200);\n\n        this.lastMark = this.editorDoc.markText({\n            line: position.startLine - 1,\n            ch: position.startColumn\n        }, {\n            line: position.endLine - 1,\n            ch: position.endColumn\n        }, {\n            css: 'background: #eee'\n        });\n    }\n\n    setSubEntryEventListener(subEntry, elm, path) {\n        subEntry.addEventListener('mouseover', async e => {\n            // prevent outer mouseover listener to overwrite this action\n            e.stopPropagation();\n\n            if (this.lastMark) {\n                this.lastMark.clear();\n            }\n\n            this.updateASTs(path, elm);\n\n            const position = this.trace.resolve(elm.position);\n\n            if (position) {\n                await this.setEditorURL(position.filename);\n                this.markAndScrollTo(position);\n            }\n        });\n\n        subEntry.addEventListener('dblclick', e => {\n            elm.openInInspector()\n        })\n    }\n\n    createSectionElement(section, path = []) {\n        const className = `entry ${section.hasChanges ? 'changing' : ''}`\n        const header = < div class = { className } > +{ section.name } < /div>;\n        const body = < div > < /div>;\n        const entry = < div > { header } { body } < /div>;\n                  \n        entry.data = {};\n        entry.data.traverse = function(fn){\n            fn(header, section);\n            for (const child of body.children) {\n                child.data.traverse(fn);\n            }\n        }\n\n\n        let isTriggered = false;\n\n        header.addEventListener('click', e => {\n            header.innerText = `${isTriggered ? '+' : '-'} ${section.name}`;\n            const me = this;\n            if (!isTriggered) {\n                for (const elm of section.entries) {\n                    elm.visit({\n                        visitEvent(event) {\n                            const className = `entry sub ${elm.hasChanges ? 'changing' : ''}`;\n                            const subEntry = < div class = { className } > { event.type } < /div>;\n                               \n                            subEntry.data = {};\n                            subEntry.data.traverse = function(fn) {\n                                fn(subEntry, elm);\n                            }\n\n                            body.appendChild(subEntry);\n                            me.setSubEntryEventListener(subEntry, elm, [...path, section]);\n                        },\n                        visitErrorEvent(errorEvent) {\n                            const className = `entry sub ${elm.hasChanges ? 'changing' : ''}`;\n                            const subEntry = < div class = { className } style =\n                                \"background: red; color: #eee\" > { errorEvent.type } < /div>;\n                                      \n                            subEntry.data = {};\n                            subEntry.data.traverse = function(fn) {}\n\n                            body.appendChild(subEntry);\n                            subEntry.addEventListener('mouseover', e => {\n                                me.editor.setText(errorEvent.data[0]);\n                                me.textManuallyChanged = true;\n                            });\n                        },\n                        visitTraceSection(traceSection) {\n                            const subEntry = me.createSectionElement(traceSection, [...path, section]);\n                            subEntry.className += ' sub';\n\n                            body.appendChild(subEntry);\n                        }\n                    });\n                }\n            } else {\n                body.innerHTML = '';\n            }\n            isTriggered = !isTriggered;\n\n        });\n                                      \n        this.setSubEntryEventListener(header, section, path);\n\n        entry.select = function() {\n            section.position\n        }\n                                      \n        return entry;\n    }\n\n    addListItem(section) {\n        const entry = this.createSectionElement(section);\n\n        this.entries.push(entry);\n        this.traceList.appendChild(entry);\n    }\n\n    updateList() {\n        this.entries = [];\n        this.clearList();\n        for (const section of this.trace.sections) {\n            this.addListItem(section);\n        }\n    }\n                          \n    /*MD ## Highlighting MD*/\n    isInRange(given, toTest) {                  \n        if(given.filename !== toTest.filename) {\n            return false;\n        }\n                                          \n        if(given.startLine >= toTest.startLine && given.endLine <= toTest.endLine) {\n            if(given.startLine === toTest.startLine && given.startColumn < toTest.startColumn) {\n                return false;\n            }\n            \n            if(given.endLine === toTest.endLine && given.endColumn > toTest.endColumn) {\n                return false;\n            }\n            \n            return true;\n        }\n        \n        return false;                              \n    }\n                                      \n    markInRange(position) {\n        for (const entry of this.entries) {\n            entry.data.traverse((elm, item) => {\n                if(!item.position) {\n                    return;\n                }\n                if (this.isInRange(position, this.trace.resolve(item.position))){\n                    debugger\n                    elm.classList.add('marked');\n                }\n            })\n        }\n    }\n\n    /*MD ## Update AST MD*/\n\n    setCurrentAST(ast) {\n        this.currentAST.value = babel.transformFromAst(ast).code;\n    }\n\n    setTransformedAST(ast) {\n        this.transformedAst.value = babel.transformFromAst(ast).code;\n    }\n\n    showASTs() {\n        this.setCurrentAST(this.curAST);\n        this.setTransformedAST(this.nextAST);\n\n        if (this.comparison) {\n            this.comparison.updateView(this.curAST, this.nextAST);\n        }\n    }\n\n    walkPath(path, ast) {\n        let entries = this.trace.sections;\n\n        for (const part of path) {\n            for (const entry of entries) {\n                if (entry === part) {\n                    break;\n                }\n                entry.apply(ast);\n            }\n            entries = part.entries;\n        }\n\n        return entries;\n    }\n\n    updateASTs(path, entry) {\n        this.curAST = JSON.parse(JSON.stringify(this.trace.oldAST));\n\n        const entries = this.walkPath(path, this.curAST);\n        const index = entries.indexOf(entry);\n\n        for (let i = 0; i < index; i++) {\n            entries[i].apply(this.curAST);\n        }\n\n        this.nextAST = JSON.parse(JSON.stringify(this.curAST));\n        entries[index].apply(this.nextAST);\n        this.showASTs();\n    }\n\n\n    /*MD ## Lively-specific API MD*/\n\n    // store something that would be lost\n    livelyPrepareSave() {\n        this.setAttribute(\"data-mydata\", this.get(\"#textField\").value)\n    }\n\n    livelyPreMigrate() {\n        // is called on the old object before the migration\n    }\n\n    livelyMigrate(other) {\n        // whenever a component is replaced with a newer version during development\n        // this method is called on the new object during migration, but before initialization\n        this.visualize(other.trace);\n    }\n\n    livelyInspect(contentNode, inspector) {\n        // do nothing\n    }\n\n    async livelyExample() {\n        const source = `\"enable aexpr\";\n        import * as u from \"utils\";\n\n        //debugger;\n        var a = 0;\n        aexpr(() => a).onChange(v => lively.notify(v))\n        a = 2;\n        lively.notify(\"123\");`\n\n        const plugins = [{url: \"https://lively-kernel.org/lively4/lively4-tom/src/client/reactive/babel-plugin-active-expression-rewriting/index.js\"}];\n\n        TraceVisualization.for(source, plugins)\n    }\n\n\n}\n"]}