게시판 글, 댓글 작성 초안

hwe/js/board.js

@@ -0,0 +1,156 @@
+
+
+function submitArticle(){
+    var $article = $('#newArticle');
+    var $title = $article.find('input.titleInput');
+    var $text = $article.find('input.contentInput');
+    var title = $.trim($title.val());
+    var text = $.trim($text.val());
+
+
+    if(!text && !title){
+        return false;
+    }
+
+    $title.val('');
+    $text.val('');
+
+    $.post({
+        url:'j_add_board_article.php',
+        dataType:'json',
+        data:{
+            title:title,
+            text:text
+        }
+    }).then(function(data){
+        if(!data){
+            $title.val(title);
+            $text.val(text);
+            alert()
+            return quickReject('글을 올리는데 실패했습니다.');
+        }
+        if(!data.result){
+            $title.val(title);
+            $text.val(text);
+            return quickReject('글을 올리는데 실패했습니다. : '+data.reason);
+        }
+
+        return loadArticles().done(drawArticles);
+
+    }, errUnknown)
+    .fail(function(reason){
+        alert(reason);
+    });
+
+    return false;
+}
+
+function submitComment(){
+    var $this = $(this);
+    var $article = $this.parents('.article').eq(0);
+    var articleNo = $article.data('no');
+    var $text = $article.find('input.commentText');
+    var text = $.trim($text.val());
+
+    if(!text){
+        return false;
+    }
+
+    $text.val('');
+
+    $.post({
+        url:'j_add_board_comment.php',
+        dataType:'json',
+        data:{
+            articleNo:articleNo,
+            text:text
+        }
+    }).then(function(data){
+        if(!data){
+            $text.val(text);
+            alert()
+            return quickReject('댓글을 다는데 실패했습니다.');
+        }
+        if(!data.result){
+            $text.val(text);
+            return quickReject('댓글을 다는데 실패했습니다. : '+data.reason);
+        }
+
+        return loadArticles().done(drawArticles);
+
+    }, errUnknown)
+    .fail(function(reason){
+        alert(reason);
+    });
+
+    return false;
+}
+
+function drawArticle(articleObj){
+    var $articleFrame = $('#articleTemplate > .articleFrame');
+    var $commentFrame = $('#commentTemplate > .comment');
+
+    var $article = $articleFrame.clone();
+    $article.addClass('articleObj')
+        .data('no', articleObj.no)
+        .data('author', articleObj.general_no);
+
+    $article.find('.author').text(articleObj.author);
+    $article.find('.title').text(articleObj.title);
+    $article.find('.date').text(articleObj.date);
+    //$article.find('.text').text(articleObj.text);
+    $article.find('.text').html(nl2br(escapeHtml(articleObj.text)));
+    //TODO: 바꿀 것
+
+    var $articleComment = $article.find('ul.commentList');
+    
+    $.each(articleObj.comment, function(commentObj){
+        var $comment = $commentFrame.clone();
+        $comment.find('.author').text(commentObj.author);
+        //$comment.find('.text').text(commentObj.text);
+        $comment.find('.text').html(nl2br(escapeHtml(commentObj.text)));
+        $comment.find('.date').text(commentObj.date);
+        $articleComment.append($comment);
+    });
+
+    $('#board').append($article);
+}
+
+function drawArticles(articlesObj){
+    var deferred = $.Deferred();
+    if(!articlesObj){
+        return quickReject('받아오는데 실패했습니다.');
+    }
+    if(!articlesObj.result){
+        return quickReject('에러가 발생했습니다. : '+articlesObj.reason);
+    }
+
+    $('.articleObj').detach();//첫 버전이니까 일괄 삭제 일괄 로드
+    $.each(articlesObj.articles,  drawArticle);
+    return true;
+}
+
+
+
+function loadArticles(){
+    return $.post({
+        url:'j_get_board_articles.php',
+        dataType:'json',
+        data:{
+            isSecretBoard:isSecretBoard, //첫 버전이니까 전체 다 불러오자
+        }
+    });
+}
+
+$(function(){
+
+$('#submitArticle').click(submitArticle);
+$('.submitComment').click(submitComment);
+
+loadArticles()
+.then(drawArticles, errUnknown)
+.fail(function(reason){
+    alert(reason);
+});
+
+});

hwe/js/common.js

@@ -270,3 +270,26 @@ jQuery(function($){
 
     
 });
+
+
+function errUnknown(){
+    alert('작업을 실패했습니다.');
+}
+
+function quickReject(errMsg){
+    if(errMsg === undefined){
+        errMsg = '작업을 실패했습니다.';
+    }
+    var deferred = $.Deferred();
+    deferred.reject(errMsg);
+    return deferred.promise();
+}
+
+function nl2br(text){
+    return text.replace(/\n/g,"<br>");
+}
+/*
+function br2nl (text) {   
+    return text.replace(/<\s*\/?br\s*[\/]?>/gi, '\n');
+}
+*/

hwe/js/jsconfig.json

@@ -0,0 +1,8 @@
+{
+    "typeAcquisition": {
+        "include": [
+            "jquery"
+        ]
+    }
+
+}

hwe/t_board.php

@@ -44,19 +44,19 @@ $boardName = $isSecretBoard?'회의실':'기밀실';
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=1024" />
 <?=WebUtil::printCSS('../e_lib/bootstrap.min.css')?>
-<?=WebUtil::printCSS('../e_lib/tui.editor/tui-editor.min.css')?>
+<!--<?=WebUtil::printCSS('../e_lib/tui.editor/tui-editor.min.css')?>-->
-<?=WebUtil::printCSS('../e_lib/tui.editor/tui-editor-contents.min.css')?>
+<!--<?=WebUtil::printCSS('../e_lib/tui.editor/tui-editor-contents.min.css')?>-->
 <?=WebUtil::printCSS('../d_shared/common.css')?>
 <?=WebUtil::printCSS('../css/config.css')?>
 <?=WebUtil::printCSS('css/common.css')?>
-<?=WebUtil::printCSS('css/select_npc.css')?>
+<?=WebUtil::printCSS('css/board.css')?>
 <script>
 var isSecretBoard = <?=($isSecretBoard?'true':'false')?>; //
 </script>
 <?=WebUtil::printJS('../d_shared/common_path.js')?>
 <?=WebUtil::printJS('../e_lib/jquery-3.3.1.min.js')?>
 <?=WebUtil::printJS('../e_lib/bootstrap.bundle.min.js')?>
-<?=WebUtil::printJS('../e_lib/tui.editor/tui-editor-Editor-all.min.js')?>
+<!--<?=WebUtil::printJS('../e_lib/tui.editor/tui-editor-Editor-all.min.js')?>-->
 <?=WebUtil::printJS('js/common.js')?>
 <?=WebUtil::printJS('js/board.js')?>
 
@@ -64,11 +64,14 @@ var isSecretBoard = <?=($isSecretBoard?'true':'false')?>; //
 <body>
 
 <div id='newArticle'>
-<div><span class='articleTitle'>제목</span><input class='commentText' type='text' maxlength='250'></input></div>
+<div><span class='articleTitle'>제목</span><input class='titleInput' type='text' maxlength='250'></input></div>
 <div class='boardArticle'>
-
+<textarea class="contentInput" rows="10" cols="50"></textarea>
 </div>
-<button type='button' class='submitArticle'>등록</button>
+<button type='button' id='submitArticle'>등록</button>
+</div>
+
+<div id="board">
 </div>
 
 <template id='articleTemplate'>
@@ -84,7 +87,7 @@ var isSecretBoard = <?=($isSecretBoard?'true':'false')?>; //
 
     </ul>
     <div>
-        <input class='commentText' type='textarea' maxlength='250'></input>
+        <input class='commentText' type='text' maxlength='250'></input>
         <button type='button' class='submitComment'>등록</button>
     </div>
 </div>

js/common.js

@@ -181,4 +181,17 @@ function getIconPath(imgsvr,  picture){
     else{
         return pathConfig.root+'/d_pic/'+picture;
     }
+}
+
+function errUnknown(){
+    alert('작업을 실패했습니다.');
+}
+
+function quickReject(errMsg){
+    if(errMsg === undefined){
+        errMsg = '작업을 실패했습니다.';
+    }
+    var deferred = $.Deferred();
+    deferred.reject(errMsg);
+    return deferred.promise();
 }