~jpgleeson/caint

79f663feed87c6ba2a97df55fa045eff84f6d33b — Jack Gleeson 1 year, 1 month ago 5b6dee8
ADD: Placeholder comments

Submitted comments are added to the thread immediately upon submitting even if comments not set to be approved. They are marked as placeholder so the user knows they aren't approved. Just a UI quality of life thing.
1 files changed, 30 insertions(+), 0 deletions(-)

M wwwroot/js/caint.js
M wwwroot/js/caint.js => wwwroot/js/caint.js +30 -0
@@ 67,6 67,9 @@ async function addItem() {
    })
      .then(response => response.json())
      .then(() => {
        addPlaceholderUnapproved();
      })
      .then(() => {
        getThread(commentThreadId);

        var unapprovedMarker = document.createElement('div');


@@ 111,6 114,33 @@ function _displayCount(itemCount) {
  document.getElementById('counter').innerText = `${itemCount} ${name}`;
}

function addPlaceholderUnapproved(){
    var threadBody = document.getElementById('commentThread');
    var commenterNameTextbox = document.getElementById('commenterName');
    var commentBodyTextbox = document.getElementById('commentBody');
    var commentDiv = document.createElement('div');
    var commentName = document.createElement('h3');
    var commentBody = document.createElement('p');
    var unapprovedMarker = document.createElement('div');

    commentDiv.setAttribute('class', 'comment unapproved');

    commentName.setAttribute('class', 'commenterName');
    commentBody.setAttribute('class', 'commentBody');
    unapprovedMarker.setAttribute('class', 'marker');

    commentName.innerHTML = commenterNameTextbox.value;
    commentBody.innerHTML = commentBodyTextbox.value;

    unapprovedMarker.innerHTML = "unapproved";

    commentDiv.appendChild(unapprovedMarker);
    commentDiv.appendChild(commentName);
    commentDiv.appendChild(commentBody);

    threadBody.appendChild(commentDiv);
}

function _displayThread(data) {
  const threadBody = document.getElementById('commentThread');
  threadBody.setAttribute('class', 'commentThread');