<commit_before><!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Conversation Starter</title>
        <!--<link rel="stylesheet" href="style.css">-->
        <style>
            #root-node {
                width: 100px;
                height: 100px;
                padding: 15px;
                background-color: #729fcf;
                border-style: solid;
                border-width: 5px;
            }
            .output-instance {
                clear: left;
                padding 16px;
                border-style: solid;
                border-width: 5px;
            }
            .dialog-node {
                width: 200px;
                padding: 15px;
                background-color: green;
                position: absolute;
                border-style: solid;
                border-width: 5px;
            }
            .line-input {
                width: 100%;
                height: 10em;
            }
            .resp-input {
                width: 100%;
                height: 3em;
            }
        </style>
        <script src="dom.jsPlumb-1.6.2-min.js"></script>
    </head>
    <body>

        <div id="output"></div>

        <div id="toolbox">
            <input type="button" value="Add dialog line" onclick="newNode()"></input>
            <input type="button" value="Save tree" onclick="saveTree()"></input>
            <a href="https://github.com/mollikka/ConversationStarter/blob/gh-pages/README.md" target="_blank"><input type="button" value="Readme"></input></a>
        </div>


        <div id="dialog-tree">

            <div id="root-node">
                Dialog begins
            </div>

            <div class="dialog-node">
                Actor <input type="text" class="actor-input"></input>
                says <textarea class="line-input"></textarea>
                Player responds
                <input class="add-response-button" type="button" value="Add response"></input>
                <div class="responses"></div>
            </div>
        </div>


        <script>
                var nodetemplate=document.getElementsByClassName("dialog-node")[0].cloneNode(true);

                var targetOption = {anchor:"Left",
                                                    maxConnections:-1, 
                                                    isSource:false, 
                                                    isTarget:true, 
                                                    endpoint:["Dot", {radius:10}], 
                                                    paintStyle:{fillStyle:"#0000FF"},
                                                        setDragAllowedWhenFull:true}

                var sourceOption = {anchor:"Right",
                                                        maxConnections:1, 
                                                    isSource:true, 
                                                    isTarget:false,
                                                    endpoint:["Dot", {radius:10}], 
                                                    connector:[ "Flowchart", { stub:[20, 20], gap:10, cornerRadius:5, alwaysRespectStubs:false }, ],
                                                    paintStyle:{fillStyle:"#FF0000"},
                                                        setDragAllowedWhenFull:true}




                var augmentDialogNode = function(node) {
                    jsPlumb.draggable(node);
                    
                    document.getElementById("dialog-tree").appendChild(node);
                    jsPlumb.addEndpoint(node, targetOption);
                    var autoresponse = jsPlumb.addEndpoint(node, sourceOption);
                    
                    var addRespBtn = node.getElementsByClassName('add-response-button')[0];
                    var resps = node.getElementsByClassName('responses')[0];
                    addRespBtn.addEventListener('click', function(event) {
                        var newResponse = document.createElement("textarea");
                        newResponse.setAttribute("class", "resp-input");
                        resps.appendChild(newResponse);
                        jsPlumb.deleteEndpoint(autoresponse);
                        jsPlumb.addEndpoint(newResponse,sourceOption);
                        jsPlumb.repaint(node);<commit_msg>user can delete a dialog-node<commit_after><!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Conversation Starter</title>
        <!--<link rel="stylesheet" href="style.css">-->
        <style>
            #root-node {
                width: 100px;
                height: 100px;
                padding: 15px;
                background-color: #729fcf;
                border-style: solid;
                border-width: 5px;
            }
            .output-instance {
                clear: left;
                padding 16px;
                border-style: solid;
                border-width: 5px;
            }
            .dialog-node {
                width: 200px;
                padding: 15px;
                background-color: green;
                position: absolute;
                border-style: solid;
                border-width: 5px;
            }
            .delete-button {
                float: right;
            }
            .line-input {
                width: 100%;
                height: 10em;
            }
            .resp-input {
                width: 100%;
                height: 2em;
            }
        </style>
        <script src="dom.jsPlumb-1.6.2-min.js"></script>
    </head>
    <body>

        <div id="output"></div>

        <div id="toolbox">
            <input type="button" value="Add dialog line" onclick="newNode()"></input>
            <input type="button" value="Save tree" onclick="saveTree()"></input>
            <a href="https://github.com/mollikka/ConversationStarter/blob/gh-pages/README.md" target="_blank"><input type="button" value="Readme"></input></a>
        </div>


        <div id="dialog-tree">

            <div id="root-node">
                Dialog begins
            </div>

            <div class="dialog-node">
                <input class="delete-button" type="button" value="Del"></input>
                Actor <input type="text" class="actor-input"></input>
                says <textarea class="line-input"></textarea>
                Player responds
                <input class="add-response-button" type="button" value="Add response"></input>
                <div class="responses"></div>
            </div>
        </div>


        <script>
                var nodetemplate=document.getElementsByClassName("dialog-node")[0].cloneNode(true);

                var targetOption = {anchor:"Left",
                                                    maxConnections:-1, 
                                                    isSource:false, 
                                                    isTarget:true, 
                                                    endpoint:["Dot", {radius:10}], 
                                                    paintStyle:{fillStyle:"#0000FF"},
                                                        setDragAllowedWhenFull:true}

                var sourceOption = {anchor:"Right",
                                                        maxConnections:1, 
                                                    isSource:true, 
                                                    isTarget:false,
                                                    endpoint:["Dot", {radius:10}], 
                                                    connector:[ "Flowchart", { stub:[20, 20], gap:10, cornerRadius:5, alwaysRespectStubs:false }, ],
                                                    paintStyle:{fillStyle:"#FF0000"},
                                                        setDragAllowedWhenFull:true}




                var augmentDialogNode = function(node) {
                    jsPlumb.draggable(node);
                    
                    document.getElementById("dialog-tree").appendChild(node);
                    var targetanchor = jsPlumb.addEndpoint(node, targetOption);
                    var autoresponseanchor = jsPlumb.addEndpoint(node, sourceOption);
                    var playerresponseanchors = []
                    
                    var addRespBtn = node.getElementsByClassName('add-response-button')[0];
                    var resps = node.getElementsByClassName('responses')[0];
                    addRespBtn.addEventListener('click', function(event) {
                        var newResponse = document.createElement("textarea");
                        newResponse.setAttribute("class", "resp-input");
                        resps.appendChild(newResponse);
                        jsPlumb.deleteEndpoint(autoresponseanchor);
                        var newAnchor = jsPlumb.addEndpoint(newResponse,sourceOption);
                        playerresponseanchors.push(newAnchor);
                        jsPlumb.repaint(node);
                    });
                    
                    var deleteBtn = node.getElementsByClassName("delete-button")[0];
                    deleteBtn.addEventListener("click", function(event) {
                        jsPlumb.deleteEndpoint(targetanchor);
                        jsPlumb.deleteEndpoint(autoresponseanchor);
                        for(i=0;i<playerresponseanchors.length;i++)
                        jsPlumb.deleteEndpoint(playerresponseanchors[i]);
                        
                        document.getElementById("dialog-tree").removeChild(node);
                    

{'fraction_non_alphanumeric': 0.10735278952253274, 'fraction_numerical': 0.012168711972775085, 'mean_word_length': 1.1055145462440295, 'pattern_counts': {'":': 0, '<': 88, '<?xml version=': 0, '>': 87, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 52, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '555174', 'n_tokens_mistral': 2317, 'n_tokens_neox': 2064, 'n_words': 365}