first

modules/comment/themes/_mobile/rc-default/LICENSE

@@ -0,0 +1,21 @@
+The RBL License
+
+Copyright (c) 2011-2018 Redblock, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

modules/comment/themes/_mobile/rc-default/README.md

@@ -0,0 +1,17 @@
+
+# 알씨 모바일 댓글 기본형 테마
+
+안녕하세요. 감사합니다.
+
+## 주요기능
+- Automated website building technology
+- Powerful content managing system
+- Multiple virtual site system
+- Unlimited extension
+- Multi Screen implementations
+
+## 서버 요구사항
+- PHP version 5.2.x
+- MYSQL version 3.23.x or greater (recommend MYSQL >= 5.x)
+- GD Library
+- ICONV

modules/comment/themes/_mobile/rc-default/component.js

@@ -0,0 +1,296 @@
+// 댓글
+
+var popup_comment_mypost = $('#popup-comment-mypost');
+var sheet_comment_online = $('#sheet-comment-online'); //답글(oneline)보기
+var sheet_comment_write = $('#sheet-comment-write');
+
+
+//댓글쓰기 컴포넌트가 호출
+$(document).on('click','[data-role="comment_box"] [data-toggle="commentWrite"]',function(){
+  if (memberid) {
+    var type = $(this).attr('data-type');
+    var parent = $(this).attr('data-parent');
+    var uid = $(this).attr('data-uid');
+    var act = $(this).attr('data-act');
+    sheet_comment_write.find('[data-kcact="regis"]').attr('data-type',type).attr('data-parent',parent).attr('data-act',act);
+    setTimeout(function(){sheet_comment_write.sheet();}, 10);
+  } else {
+    $('#modal-login').modal();
+  }
+  return false;
+});
+
+$(document).on('click','[data-role="comment_box"] [data-role="toggle-oneline-input"]',function(){
+  if (memberid) {
+    var type = $(this).attr('data-type');
+    var parent = $(this).attr('data-parent');
+    var uid = $(this).attr('data-uid');
+    var act = $(this).attr('data-act');
+    sheet_comment_write.find('[data-kcact="regis"]').attr('data-type',type).attr('data-parent',parent).attr('data-act',act);
+    setTimeout(function(){sheet_comment_write.sheet();}, 10);
+  } else {
+    $('#modal-login').modal();
+  }
+  return false;
+});
+
+$(document).on('click','.sheet [data-role="toggle-oneline-input"]',function(){
+  if (memberid) {
+    $(document).find('[data-role="comment_box"] [data-role="toggle-oneline-input"]').click();
+  } else {
+    $('#modal-login').modal();
+  }
+  return false;
+});
+
+
+$(document).on('click','#popup-comment-mypost .table-view-cell a',function(event){
+  event.preventDefault();
+  event.stopPropagation();
+  var button = $(this);
+  var uid = button.attr('data-uid');
+  var type = button.attr('data-type');
+  var parent = button.attr('data-parent');
+  var toggle = button.attr('data-toggle');
+  var kcact = button.attr('data-kcact');
+  var act = button.attr('data-act');
+  var hidden =  button.attr('data-hidden');
+
+  history.back() // popup 닫기
+
+  // console.log(toggle)
+  setTimeout(function() {
+    if (toggle) {
+      if (act=='edit') {
+        console.log('댓글 수정모드');
+        var content = $('[data-role="comment_box"]').find('[data-role="'+type+'-origin-content-'+uid+'"]').html();
+        $('[data-role="comment_box"]').find('[data-toggle="edit"][data-type="'+type+'"][data-uid="'+uid+'"]').click();
+        sheet_comment_write.sheet();
+        setTimeout(function(){
+          sheet_comment_write.attr('data-uid',uid).attr('data-type',type);
+          InserHTMLtoEditor(editor_sheet,content);
+          sheet_comment_write.find('[data-kcact="regis"]').attr('data-type',type).attr('data-uid',uid).attr('data-act',act).attr('data-hidden',hidden);;
+          if(hidden=='true') {
+            sheet_comment_write.find('[data-role="comment-hidden"]').addClass('active');
+          }
+        }, 10);
+
+      } else {
+        $(document).find('[data-role="comment_box"] [data-role="'+type+'-item"][data-uid="'+uid+'"] [data-toggle="'+toggle+'"]').click()
+      }
+
+    } else {
+      $(document).find('[data-role="comment_box"] [data-role="menu-container-'+type+'"] [data-uid="'+uid+'"][data-kcact="'+kcact+'"]').click()
+    }
+  }, 100);
+});
+
+
+//댓글 저장버튼 클릭
+sheet_comment_write.find('[data-kcact="regis"]').click(function(event) {
+
+  if (!$(this).hasClass("active")) {
+    $.notify({message: '내용을 입력해주세요.'},{type: 'default'});
+    editor_sheet.editing.view.focus();
+    return false
+  }
+
+  sheet_comment_write.find('fieldset').prop('disabled', true);
+  $(this).addClass('fa-spin');
+
+  var type = $(this).attr('data-type');
+  var parent = $(this).attr('data-parent');
+  var uid = $(this).attr('data-uid');
+  var act = $(this).attr('data-act');
+  var hidden = $(this).attr('data-hidden');
+  var content = editor_sheet.getData();
+
+  setTimeout(function(){
+
+    if (type=='comment' && act=='regis') {
+      const commentRegisEditor = document.querySelector( '[data-role="comment_box"] .ck-editor__editable' );
+      const commentRegisEditorInstance = commentRegisEditor.ckeditorInstance;
+      commentRegisEditorInstance.setData(content);
+      $('[data-role="comment_box"] [data-role="comment-input-wrapper"]').find('[data-kcact="regis"]').attr('data-hidden',hidden).click();
+    }
+
+    if (type=='oneline' && act=='regis') {
+      const onelineRegisEditor = document.querySelector( '[data-role="oneline-input-wrapper-'+parent+'"] .ck-editor__editable' );
+      const onelineRegisEditorInstance = onelineRegisEditor.ckeditorInstance;
+      onelineRegisEditorInstance.setData(content);
+      $('[data-role="oneline-input-wrapper-'+parent+'"]').find('[data-kcact="regis"]').attr('data-hidden',hidden).click();
+    }
+
+    if (type=='comment' && act=='edit') {
+
+      console.log('comment 수정 실행')
+      const commentRegisEditor = document.querySelector( '[data-role="comment_box"] [data-role="comment-item"] .ck-editor__editable' );
+      const commentRegisEditorInstance = commentRegisEditor.ckeditorInstance;
+      commentRegisEditorInstance.setData(content);
+      $('[data-role="comment_box"]').find('[data-kcact="edit"][data-uid="'+uid+'"]').attr('data-hidden',hidden).click();
+    }
+
+    if (type=='oneline' && act=='edit') {
+
+      console.log('oneline 수정 실행')
+      const commentRegisEditor = document.querySelector( '[data-role="comment_box"] [data-role="oneline-item"][data-uid="'+uid+'"] .ck-editor__editable' );
+      const commentRegisEditorInstance = commentRegisEditor.ckeditorInstance;
+      commentRegisEditorInstance.setData(content);
+      $('[data-role="comment_box"]').find('[data-kcact="edit"][data-type="oneline"][data-uid="'+uid+'"]').attr('data-hidden',hidden).click();
+    }
+  }, 600);
+
+});
+
+//댓글쓰기 컴포넌트가 호출될때
+sheet_comment_write.on('shown.rc.sheet', function (e) {
+  setTimeout(function(){
+    DecoupledEditor
+    .create( document.querySelector('#sheet-comment-write [data-role="comment-input"]'),{
+      placeholder: '공개 댓글 추가...',
+      toolbar: [ 'bold','italic','bulletedList','numberedList','blockQuote','imageUpload','|','undo','redo'],
+      language: 'ko',
+      extraPlugins: [rbUploadAdapterPlugin],
+      mediaEmbed: {
+          extraProviders: [
+              {
+                  name: 'other',
+                  url: /^([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)/
+              },
+              {
+                  name: 'another',
+                  url: /^([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)/
+              }
+          ]
+      },
+      typing: {
+          transformations: {
+              include: [
+                  // Use only the 'quotes' and 'typography' groups.
+                  'quotes',
+                  'typography',
+
+                  // Plus, some custom transformation.
+                  { from: '->', to: '→' },
+                  { from: ':)', to: '🙂' },
+                  { from: ':+1:', to: '👍' },
+                  { from: ':tada:', to: '🎉' },
+              ],
+          }
+      },
+      removePlugins: [ 'WordCount' ],
+      image: {}
+    } )
+    .then( newEditor => {
+      editor_sheet = newEditor;
+      console.log('editor_sheet init');
+      editor_sheet.editing.view.focus();
+      sheet_comment_write.find('.toolbar-container').html(editor_sheet.ui.view.toolbar.element)
+      $('[data-role="commentWrite-container"]').removeClass('active');
+      sheet_comment_write.find('[data-placeholder]').addClass('ck-placeholder');
+
+      editor_sheet.editing.view.document.on( 'change:isFocused', ( evt, name, value ) => {
+        if (value) {
+          console.log('editor_comment focus');
+          $('[data-role="commentWrite-container"]').addClass('active');
+        } else {
+          console.log('editor_comment blur');
+        }
+      } );
+
+      editor_sheet.model.document.on( 'change:data', () => {
+        var content = editor_sheet.getData();
+        if (content) {
+          sheet_comment_write.find('[data-kcact="regis"]').addClass('active');
+          $('[data-role="commentWrite-container"]').addClass('active');
+          sheet_comment_write.find('[data-placeholder]').removeClass('ck-placeholder');
+        } else {
+          sheet_comment_write.find('[data-kcact="regis"]').removeClass('active');
+          sheet_comment_write.find('[data-placeholder]').addClass('ck-placeholder');
+        }
+      } );
+
+    })
+    .catch( error => {
+        console.error( error );
+    } );
+
+    $('[data-role="comment-box"] [data-role="commentWrite-container"]').css('opacity','.2');
+
+    sheet_comment_write.find('[data-role="comment-hidden"]').off('changed.rc.switch').on('changed.rc.switch', function () {
+      if ($(this).hasClass("active")) {
+        console.log('비밀글 ON')
+        sheet_comment_write.find('[data-kcact="regis"]').attr('data-hidden','true');
+      } else {
+        console.log('비밀글 OFF')
+        sheet_comment_write.find('[data-kcact="regis"]').attr('data-hidden','false');
+      }
+    })
+  }, 200);
+})
+
+sheet_comment_write.on('hidden.rc.sheet', function (e) {
+
+  editor_sheet.setData('');
+  console.log('editor_sheet empty')
+  editor_sheet.destroy();
+  console.log('editor_sheet destroy')
+  sheet_comment_write.find('[data-kcact="regis"]').removeClass('active');
+  sheet_comment_write.find('fieldset').prop('disabled', false);
+  sheet_comment_write.find('[data-kcact="regis"]').removeClass('fa-spin').attr('data-type','').attr('data-parent','').attr('data-act','').attr('data-hidden','');
+  $('[data-role="comment-box"] [data-role="commentWrite-container"]').css('opacity','1')
+  $('#sheet-comment-write-toolbar').collapse('hide');
+
+  // 비밀글 옵션 초기화
+  sheet_comment_write.find('[data-role="comment-hidden"]').removeClass('active');
+  sheet_comment_write.find('[data-role="comment-hidden"] .switch-handle').removeAttr('style');
+
+  var uid = sheet_comment_write.attr('data-uid');
+  var type = sheet_comment_write.attr('data-type');
+
+  sheet_comment_write.removeAttr('data-uid').removeAttr('data-type')
+
+  if (uid && type) {
+    $('body').removeClass('comment-editmod');
+    console.log(type+' 수정모드 해제')
+  }
+
+  const onelineRegisEditor = document.querySelector( '[data-role="comment-item"] .ck-editor__editable' );
+  if (onelineRegisEditor) {
+    const onelineRegisEditorInstance = onelineRegisEditor.ckeditorInstance;
+    onelineRegisEditorInstance.destroy();
+  }
+})
+
+popup_comment_mypost.on('show.rc.popup', function (e) {
+  var button = $(e.relatedTarget);
+  var uid = button.attr('data-uid');
+  var type = button.attr('data-type');
+  var parent = button.attr('data-parent');
+  var notice = button.closest('[data-role="'+type+'-item"]').attr('data-notice');
+  var hidden = button.closest('[data-role="'+type+'-item"]').attr('data-hidden');
+  var popup = $(this);
+
+  popup.find('[data-role="comment_box"]').removeClass('d-none');
+  if (type=='oneline') popup.find('[data-role="comment_box"]').addClass('d-none');
+
+  if (notice=="true") popup.find('[data-kcact="notice"] span').text('해제')
+  else popup.find('[data-kcact="notice"] span').text('')
+
+  if (hidden=="true") popup.find('[data-act="edit"]').attr('data-hidden','true');
+  else popup.find('[data-act="edit"]').attr('data-hidden','false');
+
+  popup.find('.table-view-cell a').attr('data-uid',uid);
+  popup.find('.table-view-cell a').attr('data-type',type)
+})
+
+// 답글(oneline)보기
+sheet_comment_online.on('show.rc.sheet', function(event) {
+  var sheet = $(this);
+  var button = $(event.relatedTarget);
+  var top = button.closest('.content').css('padding-top');
+  var comment_item = button.closest('[data-role="comment-item"]').clone().wrapAll("<div/>").parent().html();
+  sheet.css('top',top);
+  sheet.find('[data-role="list"]').loader({ position: 'inside' });
+  setTimeout(function(){ sheet.find('[data-role="list"]').html(comment_item); }, 300);
+})

modules/comment/themes/_mobile/rc-default/component.php

@@ -0,0 +1,82 @@
+<!-- Sheet : 답글(oneline)보기 -->
+<div id="sheet-comment-online" class="sheet">
+  <header class="bar bar-nav bar-light bg-white" data-history="back" >
+    <a class="icon icon-close pull-right px-2" role="button"></a>
+    <h1 class="title title-left px-3">답글</h1>
+  </header>
+  <main class="pb-0" data-role="comment">
+    <ul class="media-list mt-3 mb-0" data-role="list"></ul>
+  </main>
+</div>
+
+<!-- Sheet : 신규 댓글작성 -->
+<div id="sheet-comment-write" class="sheet">
+  <fieldset data-role="commentWrite-container">
+    <div data-role="comment-input-wrapper">
+      <ul class="table-view mb-0 collapse" id="sheet-comment-write-toolbar">
+        <li class="table-view-cell text-muted bg-faded">
+          비밀글
+          <small class="ml-1">운영자에게만 공개</small>
+          <div data-toggle="switch" data-role="comment-hidden" class="switch">
+            <div class="switch-handle"></div>
+          </div>
+        </li>
+        <li class="table-view-cell py-0 px-2 bg-faded">
+          <div class="toolbar-container align-self-end"></div>
+        </li>
+      </ul>
+      <div class="d-flex border-0 rounded-0 align-items-center" data-role="form">
+        <img class="img-circle bg-faded ml-3" data-role="avatar" src="<?php echo getAvatarSrc($my['uid'],'100') ?>" style="width:2.25rem;height:2.25rem">
+        <section class="w-100">
+          <div data-role="editor">
+        		<div data-role="comment-input" id="meta-description-content" class="border-0"></div>
+        	</div>
+        </section>
+        <button class="btn btn-link align-self-end" type="submit" data-kcact="regis">
+          <span class="not-loading">
+            <i class="material-icons">send</i>
+          </span>
+          <span class="is-loading">
+            <div class="spinner-border spinner-border-sm" role="status">
+              <span class="sr-only">Loading...</span>
+            </div>
+          </span>
+        </button>
+        <button class="btn btn-link align-self-end" type="button" data-toggle="collapse" data-target="#sheet-comment-write-toolbar">
+          <i class="material-icons">more_vert</i>
+        </button>
+      </div>
+    </div>
+  </fieldset>
+</div>
+
+<!-- Popup : 댓글관리 -->
+<div id="popup-comment-mypost" class="popup zoom">
+  <div class="popup-content">
+    <div class="content" style="min-height: 5rem;">
+      <ul class="table-view table-view-full mt-0 text-xs-center">
+        <li class="table-view-cell">
+          <a data-toggle="commentWrite" data-act="edit">수정하기</a>
+        </li>
+        <li class="table-view-cell">
+          <a data-kcact="delete">삭제하기</a>
+        </li>
+
+        <li class="table-view-cell" data-role="comment">
+          <a data-kcact="notice">상단고정 <span></span></a>
+        </li>
+
+        <li class="table-view-cell d-none">
+          <a data-kcact="report">신고하기</a>
+        </li>
+        <li class="table-view-cell" data-role="comment">
+          <a data-toggle="commentWrite">댓글 답글쓰기</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+</div>
+
+
+<script src="/modules/comment/lib/Rb.comment.js"></script>
+<script src="/modules/comment/themes/<?php echo $d['comment']['skin_mobile'] ?>/component.js<?php echo $g['wcache']?>" ></script>

modules/comment/themes/_mobile/rc-default/css/style.css

@@ -0,0 +1,384 @@
+
+.hidden {
+    display: none !important;
+}
+
+.comment-editmod .bar-nav {
+  display: none
+}
+
+.rb-commentting header h1 {
+  line-height: 30px
+}
+
+[data-role="comment-notice-container"] > li,
+[data-role="comment-container"] > li {
+  margin-top: -1px;
+  padding: 1rem 0.625rem;
+  border-top: 1px solid #eee;
+  border-bottom: 1px solid #eee;
+}
+
+[data-role="comment-container"] [data-role="comment-item"]:focus,
+[data-role="comment-container"] [data-role="oneline-item"]:focus {
+  background-color: #F5FFFE !important;
+}
+
+[data-role="comment-container"] .media-body {
+  word-break: break-all;
+}
+
+[data-role="comment-container"] > .media:first-child {
+  border-bottom: 0
+}
+
+[data-role="commentWrite-container"] .ck-editor__editable  {
+  max-height: 13.7rem;
+  overflow: auto
+}
+
+[data-role="comment-item"] [data-role="comment-hidden"],
+[data-role="oneline-item"] [data-role="oneline-hidden"] {
+  display: none
+}
+[data-role="comment-item"][data-hidden="true"] [data-role="comment-hidden"] {
+  display: inline-block;
+}
+[data-role="oneline-item"][data-hidden="true"] [data-role="oneline-hidden"] {
+  display: inline-block;
+}
+
+.sheet [data-role="commentWrite-container"] [data-role="form"] .btn{
+  padding-top: .8rem;
+  padding-bottom: .8rem;
+  padding-left: .5rem;
+  padding-right: .5rem;
+  font-size: 1.3rem;
+  color: #999
+}
+.sheet [data-role="commentWrite-container"] .ck.ck-icon {
+  font-size: .85rem;
+  margin-bottom: .36rem;
+  color: #999;
+}
+
+.sheet [data-role="commentWrite-container"] [data-kcact="regis"].active {
+  color: #0275d8;
+}
+
+.sheet [data-role="commentWrite-container"] .toolbar-container,
+.sheet [data-role="commentWrite-container"] [data-kcact="regis"],
+.sheet [data-role="commentWrite-container"] [data-toggle="collapse"] {
+  visibility: hidden
+}
+.sheet [data-role="commentWrite-container"].active .toolbar-container,
+.sheet [data-role="commentWrite-container"].active [data-kcact="regis"],
+.sheet [data-role="commentWrite-container"].active [data-toggle="collapse"] {
+  visibility: visible;
+}
+
+.sheet .fa-paper-plane:before {
+  content: "\f1d8";
+}
+
+.sheet fieldset:disabled .fa-paper-plane:before {
+  content: "\f110";
+}
+.sheet fieldset:disabled .ck-content p {
+  color: #999;
+}
+
+.media-list > .media .media {
+  margin-top: .5rem;
+}
+.media-list .media-list {
+  margin: 10px 0 0 -20px;
+  padding: 2px 20px;
+  display: none
+}
+.media-list hr {
+  display: none
+}
+
+.media-list .media-list:empty {
+  margin: 0
+}
+.media-list .ico-replay {
+  margin-top: -2px;
+  margin-right: 3px
+}
+.media-list .ico-replay::before {
+  display: inline-block;
+  width: 13px;
+  height: 10px;
+  margin: 4px 4px 0 1px;
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAABkCAMAAACvvNBNAAAAclBMVEVMaXEtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUAAAAtlvXBtxldAAAAJHRSTlMAlgoDD071ePxpN7FZvfDjLRxb/gEGpEL5hxUkyNvqeXyAwuvQ8jQMAAAAqElEQVR42u2R1w7CMAxFu/feu4ze//9FWlRaWlwkBC9IPi+2cpzYSYTPUZwjk7rQaZNk8ENalfAC2pgoctqoRhzRxtKWERxlY+oO4pz2cKUnU7Ww5TkP/Sl/IDVo1srAW04QZBttRfcV0dW7aWHeEx2a9XJHQx1DFI9hz2kqz4tp88rS5Op4KDdr62hAlpDPI13gpkf/elYEhmGYXzAMrL5XO94phvlnbrKzELi3OthbAAAAAElFTkSuQmCC) 0 -30px no-repeat;
+  background-size: 13px 50px;
+  vertical-align: top;
+  content: '';
+}
+.rb-commentting .btn-secondary.active {
+  color: red
+}
+
+/* notify */
+#commentting-container, [data-role=comment-container], [data-role=moreBtn-container] {
+  position: relative;
+}
+
+#comment-notify {
+    visibility: hidden;
+    width: 100%;
+    position: absolute;
+    z-index: 1;
+    bottom: 30px;
+    top: auto
+}
+
+#comment-notify .comment-notify-msg {
+    width: 80%;
+    margin: 0 auto;
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    border-radius: 5px;
+    padding:12px 6px;
+    font-size: 14px;
+}
+
+#comment-notify.active {
+    visibility: visible;
+    -webkit-animation: fadein 0.5s, fadeout 0.5s 1.1s;
+    animation: fadein 0.5s, fadeout 0.5s 1.1s;
+}
+
+@-webkit-keyframes fadein {
+    from {bottom: 0; opacity: 0;}
+    to {bottom: 30px; opacity: 1;}
+}
+
+@keyframes fadein {
+    from {bottom: 0; opacity: 0;}
+    to {bottom: 30px; opacity: 1;}
+}
+
+@-webkit-keyframes fadeout {
+    from {bottom: 30px; opacity: 1;}
+    to {bottom: 0; opacity: 0;}
+}
+
+@keyframes fadeout {
+    from {bottom: 30px; opacity: 1;}
+    to {bottom: 0; opacity: 0;}
+}
+
+/* notify */
+
+/* attach trigger */
+#commentting-container .comment-attach {
+    position: relative;
+    display: block;
+    height: 100%;
+    width: 100%;
+    padding: 8px 0;
+    cursor: pointer;
+}
+
+#commentting-container span.comment-attach input[type='file'] {
+    cursor: pointer;
+    position: absolute;
+    display: block;
+    top: 0;
+    right: -9px;
+    margin: 0;
+    padding: 0;
+    opacity: 0;
+    font-size: 0;
+    width: 180%;
+    height: 100%;
+}
+
+/* emoticon */
+#commentting-container .emoticon-wrapper {
+    display: none;
+    overflow: hidden;
+    padding: 15px 5px;
+}
+#commentting-container .emoticon-wrapper ul {
+    padding: 0;
+    margin: 0;
+    width: 100%;
+}
+#commentting-container .emoticon-wrapper li {
+    display: inline-block;
+    float: left;
+    text-align: center;
+    width: 12.5%;
+    cursor: pointer;
+}
+#commentting-container .emoticon-wrapper li img {
+    width: 25px;
+    height: 25px;
+    border-radius: 100%;
+}
+
+[data-role|=oneline-input-wrapper], [data-role|=comment-modify-btn-wrapper], [data-role|=oneline-modify-btn-wrapper], [data-role|=menu-container]  {
+    display: none;
+}
+
+
+/* Comment Intro */
+
+/* Comment Input */
+
+
+.rb-comments-write .card {
+  display: none;
+}
+.rb-comments-write .active .card {
+  display: block;
+}
+.rb-comments-write .active .comment-input-tmp {
+  display: none
+}
+
+.rb-comments-write .card-header {
+  font-size: 1rem
+}
+.rb-comments-write .card-footer {
+  height: inherit;
+  padding: .35rem .35rem .25rem .5rem;
+  line-height: 2rem
+}
+.rb-comments-write .card textarea {
+  border: none
+}
+
+/* loader */
+#comment-spinner-wrap {
+    position: absolute;
+    left: 50%;
+}
+.comment-top5p {
+    top: 5%;
+}
+.comment-bottom5p {
+    bottom: 5%;
+}
+
+
+.bar-footer.rb-comments-write {
+  min-height: 44px;
+  height: auto;
+  padding: 0;
+  border-top: 1px solid #ccc
+}
+
+.rb-comments-write .input-group {
+  position: relative;
+  margin-bottom: 0;
+  padding: 3px 40px 0 10px;
+}
+.rb-comments-write .input-group textarea {
+  width: 100%;
+  background-color: transparent;
+  border-bottom: none;
+  margin-bottom: 0;
+  border: none;
+  resize: none;
+  border: none;
+  -webkit-resize: none;
+  max-height: 120px !important;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  outline: none;
+}
+.rb-comments-write .rb-submit {
+
+}
+.rb-comments-write .btn-link {
+  padding: .5rem 1rem .7rem .4rem;
+  color: #666;
+  line-height: 1rem;
+}
+.rb-comments-write .rb-submit .fa {
+  display: inline-block;
+  margin-top: -3px;
+  font-size: 25px;
+  color: #0084FF;
+}
+.rb-comments-write .ck.ck-editor__editable_inline>:first-child {
+  margin-top: 0;
+  margin-bottom: 0
+}
+.rb-comments-write .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
+  outline: none;
+  border: none;
+  box-shadow: none;
+}
+
+[data-role="commentWrite-container"] .ck.ck-toolbar,
+[data-role="comment-item"] .ck.ck-toolbar {
+  border: 0;
+  background-color: transparent
+}
+
+[data-role="comment-item"] .ck.ck-icon {
+  font-size: .7rem;
+}
+
+
+[data-role="comment-box"].edit_mod .content {
+  top: 0;
+  padding-top: 0
+}
+
+.anchor-link::before,
+[data-role="anchor-link"]::before {
+  position: relative;
+  display: block;
+  content: " ";
+  margin-top: -50px;
+  height: 50px;
+  visibility: hidden;
+}
+.sheet .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
+  outline: none;
+  border: none;
+  box-shadow: none;
+}
+.sheet .ck.ck-editor__editable_inline>:first-child {
+  margin-top: .5rem;
+}
+.sheet .ck.ck-editor__editable_inline>:last-child {
+  margin-bottom: .5rem;
+}
+.sheet .ck.ck-editor__editable_inline> p {
+  margin-bottom: 0;
+  line-height: 1.3
+}
+
+
+.ck.ck-placeholder:before,
+.ck .ck-placeholder:before {
+  content: attr(data-placeholder);
+  pointer-events: none;
+  cursor: text;
+  color: var(--ck-color-engine-placeholder-text);
+}
+
+/* sheet */
+.sheet .media-list .media-list {
+  display: block;
+}
+.sheet [data-toggle="sheet"] {
+  display: none
+}
+.sheet .media-list .media-list {
+  margin: 10px 0 0 -65px;
+  padding-left: 25px
+}
+.sheet .media-list hr {
+  display: block;
+  margin: 20px -10px 20px -65px;
+}

modules/comment/themes/_mobile/rc-default/html/btn_editMod.html

@@ -0,0 +1,7 @@
+<div class="d-none">
+  <div data-role="{$entry_type}-modify-btn-wrapper-{$uid}">
+      <button class="btn btn-secondary btn-lg" data-toggle="cancel-edit" data-type="{$entry_type}" data-uid="{$uid}">수정취소</button>
+      <button class="btn btn-primary btn-lg" data-kcact="edit" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$parent}">수정완료</button>
+  </div>
+  <div class="toolbar-container" data-role="{$entry_type}-modify-btn-wrapper-{$uid}"></div>
+</div>

modules/comment/themes/_mobile/rc-default/html/comment_box.html

@@ -0,0 +1,37 @@
+<div class="pt-2 bg-white">
+
+  <!-- 공통 사항 data-* ="*" 과 {$*} 는 수정 금지 -->
+  <section data-role="comment-box">
+
+    <main data-role="comment-main">
+
+      <header data-role="header-container" class="content-padded">
+         {$comment_header} <!-- 댓글 header : comment_header.html  -->
+      </header>
+
+      <div class="rb-comments-write content-padded" data-role="commentWrite-container"> <!-- 댓글 입렵부 : comment_write.html -->
+        {$comment_write}
+      </div>
+
+      <ul class="media-list my-0" data-role="comment-notice-container"> <!-- 공지(고정)댓글 출력부 : comment_row.html -->
+        {$comment_rows_notice}
+      </ul>
+
+      <ul class="media-list mb-0" data-role="comment-container"> <!-- 댓글 출력부 : comment_row.html -->
+          {$comment_rows}
+      </ul>
+      <div data-role="btnMore-container" class="content-padded"> <!-- 더보기 버튼 -->
+        <a class="btn btn-secondary btn-block" data-role="trigger-getMoreComment">더보기</a>
+      </div>
+
+    </main>
+  </section>
+</div>
+
+
+<script>
+$('[data-toggle="buttons"] .nav-link').tap(function(){
+  $('[data-toggle="buttons"] .nav-link').removeClass('active')
+  $(this).addClass('active')
+});
+</script>

modules/comment/themes/_mobile/rc-default/html/comment_header.html

@@ -0,0 +1,21 @@
+<h1 class="d-flex justify-content-between align-items-center px-2">
+
+  <div class="h6 mb-0">
+    댓글 <span class="ml-1 text-muted" data-role="total_comment">{$comment_total}</span>
+    <span class="d-none" data-role="show-totalRow">{$comment_total}</span>
+  </div>
+
+  <div data-role="comment-filter">
+    <div class="d-flex">
+      <nav class="nav nav-control text-muted" data-toggle="buttons" style="width:9.375rem">
+        <a class="nav-link active" role="button" data-kcact="changeSort" data-sort="uid" data-orderby="asc">최신순</a>
+        <a class="nav-link" role="button" data-kcact="changeSort" data-sort="likes" data-orderby="desc">추천순</a>
+        <a class="nav-link" role="button" data-kcact="changeSort" data-sort="uid" data-orderby="desc">과거순</a>
+      </nav>
+      <button type="button" class="btn btn-secondary btn-sm ml-2 text-muted" role="button" data-kcact="reload" title="새로고침">
+        <i class="fa fa-refresh fa-lg" aria-hidden="true"></i>
+      </button>
+    </div>
+  </div>
+
+</h1>

modules/comment/themes/_mobile/rc-default/html/comment_row.html

@@ -0,0 +1,96 @@
+<li data-role="comment-item"
+  data-uid="{$comment_uid}"
+  data-page="{$comment_page}"
+  data-totalPage="{$total_page}"
+  data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
+  <span id="CMT-{$comment_uid}" data-role="anchor-link"></span>
+  <div class="media my-0 mx-1">
+
+    <a class="mr-3"
+      data-toggle="sheet"
+      href="#sheet-member-profile"
+      data-nic="{$comment_user_nic}"
+      data-url="{$comment_user_url}"
+      data-avatar="{$comment_user_pic}"
+      data-mbruid="{$comment_user_uid}">
+      <img class="border rounded-circle" src="{$comment_user_pic}" alt="아바타" style="width:2.5rem;height:2.5rem">
+    </a>
+
+    <div class="media-body">
+
+        <h4 class="media-heading h6 d-flex align-items-center">
+          <span data-role="comment-hidden" class="badge badge-default badge-inverted"><i class="fa fa-lock" aria-hidden="true"></i></span>
+          <small class="text-muted">{$comment_user_name}</small>
+
+          <time class="ml-2 small text-muted" data-role="comment-time-wrapper-{$comment_uid}" datetime="{$comment_regis_ago}" data-plugin="timeago">
+            {$comment_regis_time}
+          </time>
+          <small class="ml-2 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
+
+          <div class="ml-auto">
+            <span class="badge badge-primary badge-inverted {$comment_getIsNoitce}"><i class="fa fa-thumb-tack fa-fw" aria-hidden="true"></i> 고정</span>
+          </div>
+        </h4>
+
+        <article class="mb-2" data-role="comment-origin-content-{$comment_uid}">{$comment_content}</article>
+        <article class="mb-2 border" style="display:none" data-role="comment-content-editable-{$comment_uid}">{$comment_content}</article>
+
+        <div class="d-flex justify-content-between align-items-center">{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html --></div>
+
+        <div class="d-flex align-items-center">
+          <div class="">
+            <button class="btn btn-link btn-sm muted-link {$comment_getIsLiked}" style="margin-left:-0.5rem"
+              data-kcact="like"
+              data-type="comment"
+              data-entry="{$comment_uid}"
+              data-effect="animated bounceIn delay-1"
+              data-role="comment-isLiked-{$comment_uid}">
+              <i class="material-icons f16 align-middle">thumb_up</i>
+              <span class="ml-1" data-role="comment-likeTotal-{$comment_uid}">{$comment_like_total}</span>
+            </button>
+            <button class="btn btn-link btn-sm muted-link {$comment_getIsDisLiked}"
+              data-kcact="dislike"
+              data-type="comment"
+              data-entry="{$comment_uid}"
+              data-effect="animated bounceIn delay-1"
+              data-role="comment-isDisLiked-{$comment_uid}">
+              <i class="material-icons f16 align-middle">thumb_down</i>
+              <span class="ml-1" data-role="comment-dislikeTotal-{$comment_uid}">{$comment_dislike_total}</span>
+            </button>
+
+            <button type="button" class="btn btn-link muted-link btn-sm add-comment"
+              data-role="toggle-oneline-input"
+              data-type="oneline"
+              data-act="regis" data-parent="{$comment_uid}">
+              <i class="material-icons f16 align-middle">comment</i>
+              <span class="ml-1" data-role="comment-onelineNum-{$comment_uid}">{$comment_oneline_num}</span>
+            </button>
+
+          </div>
+
+          <div class="ml-auto">
+            {$my_menu} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html : 수정권한이 있는 경우에만 노출됨 -->
+          </div>
+
+        </div>
+
+        <div class="d-none" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
+          <form class="input-group">
+            <input type="text" class="form-control" data-role="oneline-input-{$comment_uid}"> <!-- 주의 : comment_uid 가 들어가야 함 -->
+            <span class="input-group-btn">
+              <button type="submit" class="btn btn-secondary btn-sm" data-kcact="regis" data-type="oneline" data-parent="{$comment_uid}" data-grant="{$grant_uid}">
+                답글쓰기
+              </button>
+            </span>
+          </form>
+        </div>
+
+        {$oneline_button} <!-- 한줄의견 보기 버튼 -->
+        <hr>
+        <div class="media-list flex-column pr-0 mb-3" data-role="oneline-container-{$comment_uid}">
+           <!-- 한줄의견 리스트 -->
+           {$oneline_rows}
+        </div>
+    </div><!-- /.media-body -->
+  </div><!-- /.media -->
+</li>

modules/comment/themes/_mobile/rc-default/html/comment_row_hidden.html

@@ -0,0 +1,57 @@
+<li data-role="comment-item" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
+  <span id="CMT-{$comment_uid}" data-role="anchor-link"></span>
+  <div class="media">
+    <img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" style="width:2.25rem;height:2.25rem">
+    <div class="media-body">
+
+        <h4 class="media-heading h6 d-flex align-items-center">
+          <span class="badge badge-default badge-inverted">{$comment_user_name}</span>
+          <time class="pl-1 badge badge-default badge-inverted" data-role="comment-time-wrapper-{$comment_uid}" datetime="{$comment_regis_ago}" data-plugin="timeago">
+            {$comment_regis_time}
+          </time>
+          <small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
+          <span class="badge badge-primary badge-inverted ml-auto {$comment_getIsNoitce}"><i class="fa fa-thumb-tack fa-fw" aria-hidden="true"></i> 고정</span>
+        </h4>
+
+        <article data-role="comment-content-editable-{$comment_uid}">
+          <div class="text-xs-center text-muted bg-faded p-4 my-2 mr-2 small"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
+        </article>
+
+        <div class="d-flex align-items-center">
+          <div class="">
+            <button type="button" class="btn btn-secondary btn-sm add-comment" data-role="toggle-oneline-input" data-toggle="commentWrite" data-type="oneline" data-act="regis" data-parent="{$comment_uid}">답글</button>
+            <button class="btn btn-secondary btn-sm {$comment_getIsLiked}"
+              data-kcact="like"
+              data-type="comment"
+              data-entry="{$comment_uid}"
+              data-effect="animated bounceIn delay-1"
+              data-role="comment-isLiked-{$comment_uid}">
+              <i class="fa fa-thumbs-o-up" aria-hidden="true"></i>
+              <span class="badge badge-inverted" data-role="comment-likeTotal-{$comment_uid}">{$comment_like_total}</span>
+            </button>
+          </div>
+
+          <div class="ml-auto">
+            {$my_menu} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html : 수정권한이 있는 경우에만 노출됨 -->
+          </div>
+
+        </div>
+
+        <div class="d-none" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
+          <form class="input-group">
+            <input type="text" data-role="oneline-input-{$comment_uid}"> <!-- 주의 : comment_uid 가 들어가야 함 -->
+            <span class="input-group-btn">
+              <button type="submit" class="btn btn-secondary btn-sm" data-kcact="regis" data-type="oneline" data-parent="{$comment_uid}" data-grant="{$grant_uid}" data-effect="animated fadeInUp">
+                답글쓰기
+              </button>
+            </span>
+          </form>
+        </div>
+
+        <div class="media-list flex-column pr-0 mt-3" data-role="oneline-container-{$comment_uid}">
+           <!-- 한줄의견 리스트 -->
+           {$oneline_rows}
+        </div>
+    </div><!-- /.media-body -->
+  </div><!-- /.media -->
+</li>

modules/comment/themes/_mobile/rc-default/html/comment_write.html

@@ -0,0 +1,19 @@
+<!-- 참조사항
+   1. 등록폼에 등록자 아바타가 필요한 경우 : <img src="{$login_user_pic}">
+   2. data-*="*" 필수
+-->
+<button type="button" class="btn btn-secondary btn-block text-xs-left border-0 px-2 my-0" data-toggle="commentWrite" data-type="comment" data-act="regis" data-parent="{$comment_parent}" data-uid="{$uid}">
+  <div class="media w-100 align-items-center">
+    <img class="media-object pull-left img-circle mr-3" src="{$login_user_pic}" alt="{$login_user_nic}" style="width:2.25rem;height:2.25rem">
+    <div class="media-body text-muted">
+      공개 댓글 추가...
+    </div>
+  </div>
+</button>
+
+<div data-role="comment-input-wrapper" class="d-none">
+  <div data-role="comment-input"></div>
+  <button type="submit"  data-kcact="regis" data-type="comment" data-parent="{$comment_parent}" data-effect="animated fadeIn">
+    등록
+  </button>
+</div>

modules/comment/themes/_mobile/rc-default/html/my_menu.html

@@ -0,0 +1,13 @@
+<a type="button" role="button" class="btn btn-link muted-link"
+  data-toggle="popup" href="#popup-comment-mypost"
+  data-type="{$entry_type}"
+  data-uid="{$uid}"
+  data-notice="{$uid}"
+  data-parent="{$entry_parent}" tabindex="-1">
+  <i class="material-icons f16">more_vert</i>
+</a>
+<div class="d-none" data-role="menu-container-{$entry_type}">
+  <a href="#" data-toggle="edit" data-type="{$entry_type}" data-uid="{$uid}">수정</a>
+  <a href="#"  data-kcact="delete" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">삭제</a>
+	<a href="#"  data-kcact="notice" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">고정</a>
+</div>

modules/comment/themes/_mobile/rc-default/html/oneline_button.html

@@ -0,0 +1,5 @@
+<a href="#sheet-comment-online" class="btn btn-link mt-3" style="margin-left: -0.6rem"
+  data-toggle="sheet"
+  data-uid="{$comment_uid}">
+  답글 <span data-role="oneline_num">{$oneline_num}<span>개 보기
+</a>

modules/comment/themes/_mobile/rc-default/html/oneline_row.html

@@ -0,0 +1,31 @@
+<div class="media mb-2" data-role="oneline-item" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
+    <img class="mr-3 border rounded-circle" src="{$oneline_user_pic}" alt="아바타" style="width:1.5rem;height:1.5rem">
+    <div class="media-body">
+      <div id="OLN-{$oneline_uid}"></div>
+      <!-- <a data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요(<span data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span>)</a> -->
+
+      <div class="media-heading h6 d-flex align-items-center">
+        <span data-role="oneline-hidden" class="badge badge-default badge-inverted"><i class="fa fa-lock" aria-hidden="true"></i></span>
+        <span class="badge badge-default badge-inverted">{$oneline_user_name}</span>
+        <time class="pl-1 badge badge-default badge-inverted" data-role="oneline-time-wrapper-{$oneline_uid}" datetime="{$oneline_regis_ago}" data-plugin="timeago">
+          {$oneline_regis_time}
+        </time>
+        <small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
+      </div>
+
+      <div class="d-flex justify-content-between">
+
+        <article data-role="oneline-origin-content-{$oneline_uid}">{$oneline_content}</article>
+        <article style="display:none" data-role="oneline-content-editable-{$oneline_uid}">{$oneline_content}</article>
+
+        <div class="ml-auto">
+          {$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
+          {$my_menu} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html : 수정권한이 있는 경우에만 노출됨 -->
+        </div>
+      </div>
+
+      <footer class="">
+        {$btn_editMod}
+      </footer>
+    </div>
+</div>

modules/comment/themes/_mobile/rc-default/html/oneline_row_hidden.html

@@ -0,0 +1,21 @@
+<div class="media mb-2" data-role="oneline-item" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
+    <img class="mr-3 border rounded-circle" src="{$oneline_user_pic}" alt="아바타" style="width:1.5rem;height:1.5rem">
+    <div class="media-body">
+      <div id="OLN-{$oneline_uid}"></div>
+      <!-- <a data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요(<span data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span>)</a> -->
+
+      <div class="media-heading h6 d-flex align-items-center">
+        <span class="badge badge-default badge-inverted">{$oneline_user_name}</span>
+        <time class="pl-1 badge badge-default badge-inverted" data-role="oneline-time-wrapper-{$oneline_uid}" datetime="{$oneline_regis_ago}" data-plugin="timeago">
+          {$oneline_regis_time}
+        </time>
+        <small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
+      </div>
+
+      <div class="mr-1">
+        <article data-role="oneline-content-editable-{$oneline_uid}">
+          <div class="text-xs-center text-muted bg-faded p-3 my-2 mr-2 small"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
+        </article>
+      </div>
+    </div>
+</div>

modules/comment/themes/_mobile/rc-default/name.txt

@@ -0,0 +1 @@
+알씨 기본형 댓글