<commit_before>{% extends 'layout.html' %}

{% block title %}LaunchLab Projects{% endblock %}

{% block head %}
  {% parent %}
  <script src="/lib/scrypt.js"></script>
{% endblock %}

{% block content %}
{{ foo }}


<div class="header">
    <div class="home-menu pure-menu pure-menu-open pure-menu-horizontal pure-menu-fixed">
        <a class="pure-menu-heading" href=""><img class="mainlogo" src="/images/logo.png"></a>

        <ul>
            <li><a href="/">Account</a></li>
            <li class="pure-menu-selected"><a href="/projects">Projects</a></li>
            <li><a href="/logout">logout</a></li>
        </ul>
    </div>
</div>

<div class="content-wrapper-top">


    


    <div class="content">
        <div class="pure-g">


            <div class="l-box-lrg pure-u-1 pure-u-md-1-1">

                <script>
                /*
                <h4>{{ created }}</h4>
                <p>
                    _id: {{ project._id }}<br>
                    id: {{ project.id }}<br>
                    created: {{ project.created }}<br>
                    step: {{ project.step }}<br>
                    brieftype: {{ project.brieftype }}<br>
                    <b>backgroundinfo</b><br>
                    companyname: {{ project.backgroundinfo.companyname }}<br>
                    overview: {{ project.backgroundinfo.overview }}<br>
                    objectives: {{ project.backgroundinfo.objectives }}<br>
                    timeframe: {{ project.backgroundinfo.timeframe }}<br>
                    budget: {{ project.backgroundinfo.budget }}<br>
                    audience: {{ project.backgroundinfo.audience }}<br>
                    competitors: {{ project.backgroundinfo.competitors }}<br>
                    purpose: {{ project.backgroundinfo.purpose }}<br>
                    tone: {{ project.backgroundinfo.tone }}<br>
                </p>
                */
                </script>

                <div id="talkstream">

                </div><!-- END TALKSTREAM -->

                <!-- START INPUT -->



                <div class="pure-g-r inputbox">
                    <div class="pure-u-1-3">

                    </div>



                    <div class="pure-u-1-3">
                        <!-- message <div class="arrow-left"></div> -->     
                            <form>              
                                <input id="chatmessage" placeholder="type your message here."><button id="chatsend" class="pure-button">Send</button>
                            </form>
                        <!-- end message -->
                    </div>

                    <div class="pure-u-1-3"></div>
                </div>

                <!-- END INPUT -->


            </div>

           
        </div>

    </div>



</div>


<script>
var user = {}
user.username = '{{ username }}';
user.password = '{{ password }}'; 
user.email = '{{ email }}';
user.roomname = "{{ project.id }}";

var messages = {{ messagearray|raw }}

var rendermessage = function(data) {
    var htmlperson = 
    '<div class="person">'
        +'<img src="'+data.message.avatar+'" class="avatarimg">'
        
        +'<div class="persondata">'
            +'<div class="personname">'+data.message.username+'</div>'
            +'<div class="persontitle">title <span class="persontask">task</span> </div>'
            +'<div class="persononline">online</div>'
        +'</div>'
    +'</div>';

    var left = '';
    var right = '';
    var side = '';
    if (data.message.username == user.username) {
        //We sent this so left align
        left = htmlperson;
        side = 'message_l';
    } else {
        //Someone sent this to us, so right align.
        right = htmlperson;
        side = 'message_r';
    }
    

    var htmlmessage = 
     '<div class="pure-g-r">'
        +'<div class="pure-u-1-3">'+left+'</div>'
        
        +'<div class="pure-u-1-3">'
            +'<div class="message '+side+'">'
                +'<div class="messagetext">'+data.message.text+'</div>'
                +'<div class="timeago"><abbr class="timeago" title="'+data.message.timestamp+'">'+data.message.timeformatted+'</abbr></div>'
            +'</div>'
        +'</div>'

        +'<div class="pure-u-1-3">'+right+'</div>'
    +'</div>'
    
    //APPENDS INTO THE DOM
    $("#talkstream").append(htmlmessage)
    $("abbr.timeago").timeago();
}

var rendermessages = function () {
   for (var msgnum in messages ) {
        var curdata = messages[msgnum];
        rendermessage(curdata);        
    }
}

socket.on('connect', function() {
   // Connected, let's authenticate over sockets.
   console.log("AUTH")
   socket.emit('authenticate', {username: user.username, email: user.email, password: <PASSWORD> });

});

socket.on('authed', function (data) {
    if (data.auth == true) {
        socket.emit('room', {room: "{{ project.id }}" });     
    }
});

socket.on('message', function (data) {
    //BUILDS THE HTML WHEN A MESSAGE IS CREATED/RECIEVED. THIS CAN BE FROM OTHERS, OR WHAT WE SENT OURSELVES.
    //console.log(data)
    messages.push(data)
    rendermessage(data);
    /*

    var htmlperson = 
    '<div class="person">'
        +'<img src="/images/avatar_1.png" class="avatarimg">'
        
        +'<div class="persondata">'
            +'<div class="personname">'+data.message.username+'</div>'
            +'<div class="persontitle">title <span class="persontask">task</span> </div>'
            +'<div class="persononline">online</div>'
        +'</div>'
    +'</div>';

    var left = '';
    var right = '';
    var side = '';
    if (data.message.username == user.username) {
        //We sent this so left align
        left = htmlperson;
        side = 'message_l';
    } else {
        //Someone sent this to us, so right align.
        right = htmlperson;
        side = 'message_r';
    }
    

    var htmlmessage = 
     '<div class="pure-g-r">'
        +'<div class="pure-u-1-3">'+left+'</div>'
        
        +'<div class="pure-u-1-3">'
            +'<div class="message '+side+'">'
                +'<div class="messagetext">'+data.message.text+'</div>'
                +'<div class="timeago"><abbr class="timeago" title="'+data.message.timestamp+'">'+data.message.timeformatted+'</abbr></div>'
            +'</div>'
        +'</div>'

        +'<div class="pure-u-1-3">'+right+'</div>'
    +'</div>'
    
    //APPENDS INTO THE DOM
    $("#talkstream").append(htmlmessage)
    $("abbr.timeago").timeago();

    */
});

$("#roomconnect").click( function() {
    user.roomname = $("#roomname").val();
    console.log("Connecting to room " + user.roomname )
    socket.emit('room', {room: "{{ id }}" });
});

$("#chatsend").click( function(data) {
    data.preventDefault();
    console.log("Sending "+ $("#chatmessage").val() +" to "+ $("#roomname").val() )
    var messagetextinput = $("#chatmessage").val();
    socket.emit('message', {messagetext: messagetextinput} );
})
    
    //do first render
    rendermessages();

    $("img").error(function () { 
        //$(this).hide();
        $(this).css({visibility:"hidden"}); 
    });

</script>



{% endblock %}<commit_msg>hide on new message no avatar<commit_after>{% extends 'layout.html' %}

{% block title %}LaunchLab Projects{% endblock %}

{% block head %}
  {% parent %}
  <script src="/lib/scrypt.js"></script>
{% endblock %}

{% block content %}
{{ foo }}


<div class="header">
    <div class="home-menu pure-menu pure-menu-open pure-menu-horizontal pure-menu-fixed">
        <a class="pure-menu-heading" href=""><img class="mainlogo" src="/images/logo.png"></a>

        <ul>
            <li><a href="/">Account</a></li>
            <li class="pure-menu-selected"><a href="/projects">Projects</a></li>
            <li><a href="/logout">logout</a></li>
        </ul>
    </div>
</div>

<div class="content-wrapper-top">


    


    <div class="content">
        <div class="pure-g">


            <div class="l-box-lrg pure-u-1 pure-u-md-1-1">

                <script>
                /*
                <h4>{{ created }}</h4>
                <p>
                    _id: {{ project._id }}<br>
                    id: {{ project.id }}<br>
                    created: {{ project.created }}<br>
                    step: {{ project.step }}<br>
                    brieftype: {{ project.brieftype }}<br>
                    <b>backgroundinfo</b><br>
                    companyname: {{ project.backgroundinfo.companyname }}<br>
                    overview: {{ project.backgroundinfo.overview }}<br>
                    objectives: {{ project.backgroundinfo.objectives }}<br>
                    timeframe: {{ project.backgroundinfo.timeframe }}<br>
                    budget: {{ project.backgroundinfo.budget }}<br>
                    audience: {{ project.backgroundinfo.audience }}<br>
                    competitors: {{ project.backgroundinfo.competitors }}<br>
                    purpose: {{ project.backgroundinfo.purpose }}<br>
                    tone: {{ project.backgroundinfo.tone }}<br>
                </p>
                */
                </script>

                <div id="talkstream">

                </div><!-- END TALKSTREAM -->

                <!-- START INPUT -->



                <div class="pure-g-r inputbox">
                    <div class="pure-u-1-3">

                    </div>



                    <div class="pure-u-1-3">
                        <!-- message <div class="arrow-left"></div> -->     
                            <form>              
                                <input id="chatmessage" placeholder="type your message here."><button id="chatsend" class="pure-button">Send</button>
                            </form>
                        <!-- end message -->
                    </div>

                    <div class="pure-u-1-3"></div>
                </div>

                <!-- END INPUT -->


            </div>

           
        </div>

    </div>



</div>


<script>
var user = {}
user.username = '{{ username }}';
user.password = '{{ password }}'; 
user.email = '{{ email }}';
user.roomname = "{{ project.id }}";

var messages = {{ messagearray|raw }}

var rendermessage = function(data) {
    var htmlperson = 
    '<div class="person">'
        +'<img src="'+data.message.avatar+'" class="avatarimg">'
        
        +'<div class="persondata">'
            +'<div class="personname">'+data.message.username+'</div>'
            +'<div class="persontitle">title <span class="persontask">task</span> </div>'
            +'<div class="persononline">online</div>'
        +'</div>'
    +'</div>';

    var left = '';
    var right = '';
    var side = '';
    if (data.message.username == user.username) {
        //We sent this so left align
        left = htmlperson;
        side = 'message_l';
    } else {
        //Someone sent this to us, so right align.
        right = htmlperson;
        side = 'message_r';
    }
    

    var htmlmessage = 
     '<div class="pure-g-r">'
        +'<div class="pure-u-1-3">'+left+'</div>'
        
        +'<div class="pure-u-1-3">'
            +'<div class="message '+side+'">'
                +'<div class="messagetext">'+data.message.text+'</div>'
                +'<div class="timeago"><abbr class="timeago" title="'+data.message.timestamp+'">'+data.message.timeformatted+'</abbr></div>'
            +'</div>'
        +'</div>'

        +'<div class="pure-u-1-3">'+right+'</div>'
    +'</div>'
    
    //APPENDS INTO THE DOM
    $("#talkstream").append(htmlmessage)
    $("abbr.timeago").timeago();
    
    $("img").error(function () { 
        //$(this).hide();
        $(this).css({visibility:"hidden"}); 
    });
}

var rendermessages = function () {
   for (var msgnum in messages ) {
        var curdata = messages[msgnum];
        rendermessage(curdata);        
    }
}

socket.on('connect', function() {
   // Connected, let's authenticate over sockets.
   console.log("AUTH")
   socket.emit('authenticate', {username: user.username, email: user.email, password: <PASSWORD> });

});

socket.on('authed', function (data) {
    if (data.auth == true) {
        socket.emit('room', {room: "{{ project.id }}" });     
    }
});

socket.on('message', function (data) {
    //BUILDS THE HTML WHEN A MESSAGE IS CREATED/RECIEVED. THIS CAN BE FROM OTHERS, OR WHAT WE SENT OURSELVES.
    //console.log(data)
    messages.push(data)
    rendermessage(data);
    /*

    var htmlperson = 
    '<div class="person">'
        +'<img src="/images/avatar_1.png" class="avatarimg">'
        
        +'<div class="persondata">'
            +'<div class="personname">'+data.message.username+'</div>'
            +'<div class="persontitle">title <span class="persontask">task</span> </div>'
            +'<div class="persononline">online</div>'
        +'</div>'
    +'</div>';

    var left = '';
    var right = '';
    var side = '';
    if (data.message.username == user.username) {
        //We sent this so left align
        left = htmlperson;
        side = 'message_l';
    } else {
        //Someone sent this to us, so right align.
        right = htmlperson;
        side = 'message_r';
    }
    

    var htmlmessage = 
     '<div class="pure-g-r">'
        +'<div class="pure-u-1-3">'+left+'</div>'
        
        +'<div class="pure-u-1-3">'
            +'<div class="message '+side+'">'
                +'<div class="messagetext">'+data.message.text+'</div>'
                +'<div class="timeago"><abbr class="timeago" title="'+data.message.timestamp+'">'+data.message.timeformatted+'</abbr></div>'
            +'</div>'
        +'</div>'

        +'<div class="pure-u-1-3">'+right+'</div>'
    +'</div>'
    
    //APPENDS INTO THE DOM
    $("#talkstream").append(htmlmessage)
    $("abbr.timeago").timeago();

    */
});

$("#roomconnect").click( function() {
    user.roomname = $("#roomname").val();
    console.log("Connecting to room " + user.roomname )
    socket.emit('room', {room: "{{ id }}" });
});

$("#chatsend").click( function(data) {
    data.preventDefault();
    console.log("Sending "+ $("#chatmessage").val() +" to "+ $("#roomname").val() )
    var messagetextinput = $("#chatmessage").val();
    socket.emit('message', {messagetext: messagetextinput} );
})
    
    //do first render
    rendermessages();

    $("img").error(function () { 
        //$(this).hide();
        $(this).css({visibility:"hidden"}); 
    });

</script>



{% endblock %}
{'fraction_non_alphanumeric': 0.19382528035442337, 'fraction_numerical': 0.003322719091790115, 'mean_word_length': 1.8641950832672483, 'pattern_counts': {'":': 0, '<': 277, '<?xml version=': 0, '>': 277, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2085729', 'n_tokens_mistral': 4634, 'n_tokens_neox': 4382, 'n_words': 830}