OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	09/23/2024 04:31:31 AM	rwxr-xr-x
📄 .browserslistrc	208 bytes	09/23/2024 04:31:33 AM	rw-r--r--
📄 .gitignore	42 bytes	09/23/2024 04:31:33 AM	rw-r--r--
📄 .htaccess	803 bytes	09/23/2024 04:31:33 AM	rw-r--r--
📄 .htaccess.swp	12 KB	09/23/2024 04:31:33 AM	rw-r--r--
📄 .travis.yml	199 bytes	09/23/2024 04:31:34 AM	rw-r--r--
📁 .well-known	-	09/23/2024 04:31:45 AM	rwxr-xr-x
📁 API	-	09/23/2024 04:31:47 AM	rwxr-xr-x
📄 about.html	3.05 KB	09/23/2024 04:31:34 AM	rw-r--r--
📄 activate.php	2.56 KB	09/23/2024 04:31:34 AM	rw-r--r--
📄 article.php	17.24 KB	09/23/2024 04:31:35 AM	rw-r--r--
📁 arvindfacebook	-	09/23/2024 04:31:50 AM	rwxr-xr-x
📁 audio	-	09/23/2024 04:39:55 AM	rwxr-xr-x
📄 back-dashboard.php	8.33 KB	09/23/2024 04:31:35 AM	rw-r--r--
📄 barticle.php	16.58 KB	09/23/2024 04:31:35 AM	rw-r--r--
📄 bin_article.php	6.62 KB	09/23/2024 04:31:36 AM	rw-r--r--
📄 bnewsletter.php	1.33 KB	09/23/2024 04:31:36 AM	rw-r--r--
📄 bview.php	14.07 KB	09/23/2024 04:31:36 AM	rw-r--r--
📄 contact.html	2.79 KB	09/23/2024 04:31:37 AM	rw-r--r--
📄 dashboard.php	12.06 KB	09/23/2024 04:31:37 AM	rw-r--r--
📄 down.html	1.23 KB	09/23/2024 04:31:37 AM	rw-r--r--
📄 fb_access.php	855 bytes	09/23/2024 04:31:38 AM	rw-r--r--
📄 gen2_1.php	45.17 KB	09/23/2024 04:31:38 AM	rw-r--r--
📄 geo_location.php	3.69 KB	09/23/2024 04:31:39 AM	rw-r--r--
📄 index.html	14 KB	09/23/2024 04:31:39 AM	rw-r--r--
📄 info.php	14 bytes	09/23/2024 04:31:39 AM	rw-r--r--
📄 more.php	7.36 KB	09/23/2024 04:31:40 AM	rw-r--r--
📄 newsletter.php	1.33 KB	09/23/2024 04:31:40 AM	rw-r--r--
📄 old1dashboard.php	8.4 KB	09/23/2024 04:31:40 AM	rw-r--r--
📄 olddashboard.php	11.58 KB	09/23/2024 04:31:40 AM	rw-r--r--
📄 privacy.html	9.99 KB	09/23/2024 04:31:41 AM	rw-r--r--
📄 refund.html	7.34 KB	09/23/2024 04:31:41 AM	rw-r--r--
📄 reset.html	3.01 KB	09/23/2024 04:31:41 AM	rw-r--r--
📄 showcase.php	7.93 KB	09/23/2024 04:31:41 AM	rw-r--r--
📄 signup.html	8.08 KB	09/23/2024 04:31:42 AM	rw-r--r--
📄 splash.html	1.11 KB	09/23/2024 04:31:42 AM	rw-r--r--
📄 test.email.php	2.5 KB	09/23/2024 04:31:42 AM	rw-r--r--
📄 test.php	969 bytes	09/23/2024 04:31:42 AM	rw-r--r--
📄 usage.html	30.88 KB	09/23/2024 04:31:43 AM	rw-r--r--
📄 view.php	12.99 KB	09/23/2024 04:31:43 AM	rw-r--r--
📄 zview.php	16.09 KB	09/23/2024 04:31:43 AM	rw-r--r--

Editing: barticle.php

<!DOCTYPE html>
<?
include 'inc/validate.logged.php';
include 'inc/config.php';

include 'conversations/functions.php';

// db_connect.php

// $servername1 = "localhost";
// $username1 = "root";
// $password1 = "";
// $dbname1 = "cream";

// $conn1 = new mysqli($servername1, $username1, $password1, $dbname1);

// // Check connection
// if ($conn1->connect_error) {
//     die("Connection failed: " . $conn1->connect_error);
// }

$user_id = $_SESSION['userId'];
$chat = [];
$user_name = $_SESSION['userName'];

// Fetch article content from the database based on the article ID passed through GET parameter
$articleId = isset($_GET['article_id']) ? $_GET['article_id'] : null;

if ($articleId) {
    $sql = "SELECT * FROM user_collection WHERE id = $articleId";
    $result = mysqli_query($db, $sql);
    if ($result && mysqli_num_rows($result) > 0) {
        $article = mysqli_fetch_assoc($result);
    } else {
        // Handle article not found
    }
} else {
    // Handle missing article ID
}

$chat = fetch_messages($db, $articleId);
?>

<head>
    <title>Knobly Cream: Create &bull; Reach &bull; Measure</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css" />
    <link rel="stylesheet" href="inc/fontawesome/css/all.min.css" />
    <link rel="stylesheet" href="inc/magnific-popup.css" />
    <link rel="stylesheet" href="inc/style.css" />
    <link rel="icon" type="image/x-icon" href="/img/logo.ico">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js" crossorigin="anonymous"></script>
    <script src="https://cdn.tiny.cloud/1/u5oz235qw5jiqww4udm90ocp9zg2rncblqo2ch0ym3twjgyt/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
    <script src="https://js.zohostatic.com/books/zfwidgets/assets/js/zf-widget.js"></script>
    <script src="inc/jquery.magnific-popup.min.js"></script>
    <script src="inc/common.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

/* Hide scrollbar for WebKit (Safari, Chrome, etc.) */
        .conversations::-webkit-scrollbar {
            display: none;
        }

.comment-section {
            margin-top: 40px;
        }

.comment-form {
            margin-bottom: 20px;
        }

.comment-form textarea {
            width: 100%;
            height: 100px;
            margin-bottom: 10px;
        }

/* .comment {
            width: fit-content;
            margin-bottom: 20px;
            padding: 10px 20px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
            border-radius: 5px;
        } */
        .comment {
            max-width: 88%;
            width: fit-content;
            margin: 10px;
            /* padding: 10px; */
            background-color: #f0f0f0;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            font-family: Arial, sans-serif;
            color: #333;
            align-self: flex-start;
            padding: 14px 14px;
            margin-block: 12px;
            border-radius: 5px;
        }

.comment .text {
            font-size: 14px;
            font-weight: 300;
            color: #333;
            word-wrap: break-word;
        }

.sendername {
            font-weight: bold;
            font-size: 12px;
            color: #555;
        }

.datewithtime {
            font-size: 11px;
            color: #777;
            margin-top: 1px;
        }

.comment .author {
            font-weight: bold;
            font-size: 12px;
            color: #555;
        }

.conversation-form {
            display: flex;
            position: fixed;
            bottom: 5px;
            width: 100%;
            column-gap: 15px;
            background-color: white;
            justify-content: left;
            margin: 10px 0px;
            padding-bottom: 30px;
        }

.comment-text {
            border-radius: 6px;
            padding: 5px 10px;
            width: 80%;
            height: 40px;
        }

.conversation-btn {
            border-radius: 5px;
            height: fit-content;
            padding: 5px 10px;
        }

.author span {
            padding-left: 10px;
        }

#footer {
            position: fixed;
            bottom: 0;
            width: 100%;
        }

#comments-section {
            padding: 0 15px;
            min-height: fit-content;
            position: relative;
            bottom: 31px;
            margin-bottom: 20px;
        }

/* Default styles */
        .comments-section {
            max-width: 100%;
            /* Ensures the comments section is fluid */
            margin: 0 auto;
            padding: 0 15px;
            /* Adjust as needed */
        }

/* Responsive adjustments */
        @media screen and (max-width: 576px) {

.whole-content {
                padding: 20px 20px;
            }

/* Small devices (phones, 576px and up) */
            .comments-section .col-md-6 {
                flex: 0 0 50%;
                /* Two columns per row */
                max-width: 100%;
            }

#comments-section {
                padding: 0 0px;
                min-height: fit-content;
                position: relative;
                bottom: 40px !important;
                margin-bottom: 20px;
            }

.comment .author {
                font-weight: lighter;
                font-size: 12px;
            }

.conversation-form {
                min-width: 100px;
                width: 84%;
                margin: 10px 34px;
            }
        }

@media screen and (min-width: 768px) {

.whole-content,
            .conversation-form {
                padding: 13px 30px;
                bottom: 20px;
            }

/* Medium devices (tablets, 768px and up) */
            .comments-section .col-md-6 {
                flex: 0 0 50%;
                /* Two columns per row */
                max-width: 100%;
                margin: 0px !important;
            }

#comments-section {
                /* padding: 0 15px; */
                min-height: fit-content;
                position: relative;
                bottom: 45px;
                margin-bottom: 20px;
            }

/*            .conversation-form {
                min-width: 100px;
                width: 318px;
                margin: 10px 34px;
            }*/

.conversation-form {
                min-width: 100px;
                width: 100%;
                /* margin: 10px 34px; */
            }
        }

@media screen and (min-width: 992px) {

.whole-content,
            .conversation-form {
                padding: 13px 40px;
            }

/* Large devices (desktops, 992px and up) */
            .comments-section .col-md-6 {
                flex: 0 0 33.333%;
                max-width: 33.333%;
            }

.comment .author {
                font-weight: lighter;
                font-size: 12px;
            }

#comments-section {

min-height: fit-content;
                position: relative;
                bottom: 45px;
                margin-bottom: 20px;
            }
        }

@media screen and (min-width: 1200px) {

.whole-content,
            .conversation-form {
                padding: 13px 250px;
            }

/* Extra large devices (large desktops, 1200px and up) */
            .comments-section .col-md-6 {
                flex: 0 0 25%;
                /* Four columns per row */
                max-width: 25%;
            }

#comments-section {
                min-height: fit-content;
                position: relative;
                bottom: 45px;
                margin-bottom: 20px;
            }
        }

@media screen and (min-width: 2060px) {

.whole-content,
            .conversation-form {
                padding: 30px 270px;
            }

/* Screens up to 2560px width */
            .comments-section .col-md-6 {
                flex: 0 0 20%;
                /* Five columns per row */
                max-width: 20%;
            }

#comments-section {
                min-height: fit-content;
                position: relative;
                bottom: 45px;
                margin-bottom: 20px;
            }
        }

.news-content iframe {
            width: 100%; /* Set the width to 100% of its container */
            height: 40%; /* Initial height set to 0 (will be determined by padding-bottom) */
            position: relative; /* Set positioning context */
        }

.news-content iframe[src*="youtube.com"] {
            height: auto; /* Override height to auto to ensure responsiveness */
        }
        @media screen and (min-width:720px) {
            .news-content iframe[src*="youtube.com"] {
                height: 400px; /* Override height to auto to ensure responsiveness */
            }
    
        }

</style>

</head>

<nav class="sb-topnav navbar navbar-expand navbar-dark bg-dark">
        <a class="navbar-brand" href="dashboard.php"><img src="grfx/logo.png" width="120"></a>
        <div class="navbar-nav ml-auto">
            <div class="navbar-nav text-light" style="margin-top:6px;margin-right:20px"><?= $gUserName; ?></div>
            <div class="navbar-nav text-light" style="margin-top:6px;margin-right:20px"><? if ($gUserPlan == 1) { ?>Pro<? } else { ?>Free<? } ?></div>
            
            <ul class="navbar-nav ml-md-0">
                
            </ul>
        </div>
    </nav>

<div id="layoutSidenav" style="display: block;">
        <div class="whole-content" style=" padding-bottom: 0px; padding-top: 66px;">
            <main>
                <div id="panelContent" class="container-fluid" style="padding:20px 20px">
                    
                    <?php if (isset($article)) : ?>
                        <h1><?= htmlentities($article['title']) ?></h1>                        
                        <p>
                            <div class="news-content">
                                <?= htmlspecialchars_decode($article['description']) ?>
                            </div>
                        </p>
                        
                    <?php else : ?>
                        <p>Article not found</p>
                    <?php endif; ?>
                </div>
            </main>

<div id="comments-section" class="comments-section container py-3 px-0">
                <h3>Comments<span style="font-size: 12px; font-style: italic; color: grey; margin-left: 10px;"><?= noOfComments($db, $articleId) ?> Comments</span></h3>
                <div class="conversations">
                    <div id="comments" class=" mx-0">
                        <?php
                        display_comments($chat);
                        ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="conversation-form">
        <textarea class="comment-text" id="comment-text" placeholder="Start your conversation..."></textarea>
        
        
        <button class="conversation-btn btn-primary" onclick="sendMessageAndRefresh('<?php echo $articleId; ?>', '<?php echo $user_id; ?>');">Post</button>

</div>

<footer id="footer" class="py-2 bg-light" style="margin-bottom: 0px;">
        <div class="container-fluid">
            <div class="text-muted text-right small">© 2024, Knobly Consulting</div>
        </div>
    </footer>

</body>

// function sendMessageAndRefresh(articleId, user_id) {
    //     // Place your sendMessage functionality here
    //     sendMessage(articleId, user_id);

//     var currentPosition = window.pageYOffset || document.documentElement.scrollTop;

//     // Refresh the page
    //     location.reload();

//     // $('.conversations').scrollBottom($('.conversations')[0].scrollHeight);
    //     $('.conversations').animate({
    //         scrollTop: $('.conversations').offset().top
    //     }, 'fast');

//     window.onload = function() {
    //         window.scrollTo(0, currentPosition);
    //     };
    // }

function sendMessageAndRefresh(articleId, user_id) {
        // Place your sendMessage functionality here
        sendMessage(articleId, user_id);

var currentPosition = window.pageYOffset || document.documentElement.scrollTop;

// Refresh the page
        location.reload();

$(window).scrollTop(currentPosition);
    }

function sendMessage(article_id, user_id) {

var messageText = $('#comment-text').val().trim();
        var now = new Date(); // Get current date and time in user's local time zone

console.log(messageText);

var posted_on = now.getFullYear() + '-' +
            ('0' + (now.getMonth() + 1)).slice(-2) + '-' +
            ('0' + now.getDate()).slice(-2) + ' ' +
            ('0' + now.getHours()).slice(-2) + ':' +
            ('0' + now.getMinutes()).slice(-2) + ':' +
            ('0' + now.getSeconds()).slice(-2); // Format as 'YYYY-MM-DD HH:MM:SS'

if (messageText === '') {
            return;
        }

$.ajax({
            url: 'conversations/save_conversations.php',
            method: 'POST',
            data: {
                article_id: article_id,
                user_id: user_id,
                message: messageText,
                posted_on: posted_on
            },
            success: function(response) {
                // Handle the response
                // alert('Message sent successfully!');
                console.log(response); // Log response to console
                // location.reload(); // Reload the page after successful message post
            },
            error: function(xhr, status, error) {
                // Handle errors
                console.error(xhr.responseText);
            }
        });
    }
</script>

</html>