1
0
mirror of https://github.com/e107inc/e107.git synced 2025-08-06 14:46:56 +02:00

Comments Template reworked with bootstrap styling. (shouldn't affect v1.x comments in e107_themes/templates)

This commit is contained in:
Cameron
2013-02-24 01:08:40 -08:00
parent dfe15b5e9a
commit 27810e7864
4 changed files with 78 additions and 53 deletions

View File

@@ -91,7 +91,7 @@ class comment_shortcodes extends e_shortcode
{ {
if ($thisaction == "comment" && $pref['nested_comments']) if ($thisaction == "comment" && $pref['nested_comments'])
{ {
$REPLY = "<a id='e-comment-reply-".$this->var['comment_id']."' class='e-comment-reply btn' data-type='".$this->var['comment_type']."' data-target='".e_BASE."comment.php' href='".SITEURL."comment.php?reply.".$thistable.".".$this->var['comment_id'].".".$thisid."'>".COMLAN_326."</a>"; $REPLY = "<a id='e-comment-reply-".$this->var['comment_id']."' class='e-comment-reply btn btn-mini' data-type='".$this->var['comment_type']."' data-target='".e_BASE."comment.php' href='".SITEURL."comment.php?reply.".$thistable.".".$this->var['comment_id'].".".$thisid."'>".COMLAN_326."</a>";
} }
} }
return $REPLY; return $REPLY;
@@ -179,14 +179,14 @@ class comment_shortcodes extends e_shortcode
} }
// TODO put into a <ul> drop-down format. // TODO put into a <ul> drop-down format.
$text = "<a href='#' data-target='".e_BASE."comment.php' id='e-comment-delete-".$this->var['comment_id']."' class='e-comment-delete btn'>Delete</a> "; $text = "<a href='#' data-target='".e_BASE."comment.php' id='e-comment-delete-".$this->var['comment_id']."' class='e-comment-delete btn btn-mini'>Delete</a> ";
if($this->var['comment_blocked'] == 2) // pending approval. if($this->var['comment_blocked'] == 2) // pending approval.
{ {
$text .= "<a href='#' data-target='".e_BASE."comment.php' id='e-comment-approve-".$this->var['comment_id']."' class='e-comment-approve'>Approve</a> "; $text .= "<a href='#' data-target='".e_BASE."comment.php' id='e-comment-approve-".$this->var['comment_id']."' class='e-comment-approve btn btn-mini'>Approve</a> ";
} }
return $text; return $text;
/*
$url = e_PAGE."?".e_QUERY; $url = e_PAGE."?".e_QUERY;
$unblock = "[<a href='".e_ADMIN_ABS."comment.php?unblock-".$comrow['comment_id']."-$url-".$comrow['comment_item_id']."'>".COMLAN_1."</a>] "; $unblock = "[<a href='".e_ADMIN_ABS."comment.php?unblock-".$comrow['comment_id']."-$url-".$comrow['comment_item_id']."'>".COMLAN_1."</a>] ";
@@ -195,6 +195,7 @@ class comment_shortcodes extends e_shortcode
$userinfo = "[<a href='".e_ADMIN_ABS."userinfo.php?".e107::getIPHandler()->ipDecode($comrow['comment_ip'])."'>".COMLAN_4."</a>]"; $userinfo = "[<a href='".e_ADMIN_ABS."userinfo.php?".e107::getIPHandler()->ipDecode($comrow['comment_ip'])."'>".COMLAN_4."</a>]";
return $unblock.$block.$delete.$userinfo; return $unblock.$block.$delete.$userinfo;
* */
} }
@@ -260,7 +261,7 @@ class comment_shortcodes extends e_shortcode
} }
else else
{ {
return e107::getForm()->textarea('comment',$this->var['comval'], 3, 50,$options); return e107::getForm()->textarea('comment',$this->var['comval'], 3, 80,$options);
} }
} }

View File

@@ -20,14 +20,14 @@ if (!defined("USER_WIDTH")){ define("USER_WIDTH", "width:100%"); }
global $sc_style; global $sc_style;
global $pref, $comrow, $row2, $tp, $NEWIMAGE, $USERNAME, $RATING; global $pref, $comrow, $row2, $tp, $NEWIMAGE, $USERNAME, $RATING;
$sc_style['SUBJECT']['pre'] = "<b>"; $sc_style['SUBJECT']['pre'] = "";
$sc_style['SUBJECT']['post'] = "</b>"; $sc_style['SUBJECT']['post'] = "";
$sc_style['USERNAME']['pre'] = "<b>"; $sc_style['USERNAME']['pre'] = "";
$sc_style['USERNAME']['post'] = "</b>"; $sc_style['USERNAME']['post'] = "";
$sc_style['TIMEDATE']['pre'] = ""; $sc_style['TIMEDATE']['pre'] = "<small>";
$sc_style['TIMEDATE']['post'] = ""; $sc_style['TIMEDATE']['post'] = "</small>";
$sc_style['AVATAR']['pre'] = ""; $sc_style['AVATAR']['pre'] = "";
$sc_style['AVATAR']['post'] = ""; $sc_style['AVATAR']['post'] = "";
@@ -89,11 +89,11 @@ $sc_style['COMMENT_RATE']['post'] = '</div>';
//$sc_style['USER_AVATAR']['pre'] = '<div class="comment-avatar center">'; //$sc_style['USER_AVATAR']['pre'] = '<div class="comment-avatar center">';
//$sc_style['USER_AVATAR']['post'] = '</div>'; //$sc_style['USER_AVATAR']['post'] = '</div>';
$sc_style['COMMENT_MODERATE']['pre'] = '<span class="comment-moderate span2">'; $sc_style['COMMENT_MODERATE']['pre'] = '<div class="comment-moderate btn-group span2">';
$sc_style['COMMENT_MODERATE']['post'] = '</span>'; $sc_style['COMMENT_MODERATE']['post'] = '</div>';
$sc_style['MODERATE']['pre'] = '<span class="span2">'; $sc_style['MODERATE']['pre'] = '<div class="span12" style="padding:10px">';
$sc_style['MODERATE']['post'] = '</span>'; $sc_style['MODERATE']['post'] = '</div>';
$COMMENT_TEMPLATE['FORM'] = " $COMMENT_TEMPLATE['FORM'] = "
@@ -115,36 +115,41 @@ $COMMENT_TEMPLATE['FORM'] = "
<div class='clear_b'><!-- --></div>"; <div class='clear_b'><!-- --></div>";
$COMMENT_TEMPLATE['ITEM_START'] = "<ul class='comments'>";
$COMMENT_TEMPLATE['ITEM_END'] = "</ul>";
$COMMENT_TEMPLATE['ITEM'] = ' $COMMENT_TEMPLATE['ITEM'] = '
<div class="comment-box-left pull-left span1"> <div class="comment-box-left pull-left span1">
{COMMENT_AVATAR} {COMMENT_AVATAR}
</div> </div>
<div class="comment-box-right pull-left span11">
<div class="row-fluid">
<div class="comment-box-right pull-left span10"> <div class="comment-box-username span1">{USERNAME}</div>
<div class="comment-box-date span2">{TIMEDATE}</div>
<div class="comment-status span3">{COMMENT_STATUS}</div>
<div class="comment-moderate span6">{COMMENT_RATE} {REPLY} {COMMENTEDIT} {COMMENT_MODERATE}</div>
</div>
<span class="comment-box-username span1">{USERNAME}</span> <div class="row-fluid">
<span class="comment-box-date span2">{TIMEDATE}</span> <div class="span12" id="{COMMENT_ITEMID}-edit" contentEditable="false" >
<span class="comment-status span2">{COMMENT_STATUS}</span>
<span class="comment-user-badge-bar span6">
{COMMENT_RATE} {REPLY} {COMMENTEDIT} {COMMENT_MODERATE}
</span>
<div class="clear_b H5"><!-- --></div>
<div id="{COMMENT_ITEMID}-edit" contentEditable="false" class="span12">
<p> <p>
{COMMENT} {COMMENT}
</p> </p>
</div> </div>
</div>
</div>
</div>'; ';
$COMMENT_TEMPLATE['LAYOUT'] = '{COMMENTFORM}{COMMENTS}{MODERATE}'; $COMMENT_TEMPLATE['LAYOUT'] = '{COMMENTFORM}{COMMENTS} <div style="padding:10px 0px">{MODERATE}</div>';
?> ?>

View File

@@ -95,9 +95,9 @@ class comment
</table> </table>
<br />"; <br />";
*/ */
$COMMENT_TEMPLATE['ITEM_START'] = "";
$COMMENT_TEMPLATE['ITEM'] = $COMMENTSTYLE; $COMMENT_TEMPLATE['ITEM'] = $COMMENTSTYLE;
$COMMENT_TEMPLATE['ITEM_END'] = "";
$COMMENT_TEMPLATE['LAYOUT'] = "{COMMENTS}{COMMENTFORM}{MODERATE}{COMMENTNAV}"; $COMMENT_TEMPLATE['LAYOUT'] = "{COMMENTS}{COMMENTFORM}{MODERATE}{COMMENTNAV}";
$COMMENT_TEMPLATE['FORM'] = "<table style='width:100%'> $COMMENT_TEMPLATE['FORM'] = "<table style='width:100%'>
{SUBJECT_INPUT} {SUBJECT_INPUT}
@@ -399,8 +399,12 @@ class comment
$COMMENT_TEMPLATE = $this->template; $COMMENT_TEMPLATE = $this->template;
$COMMENT_TEMPLATE['ITEM_START'] = "\n\n<div id='{COMMENT_ITEMID}' class='comment-box clearfix'>\n"; // $COMMENT_TEMPLATE['ITEM_START'] = "\n\n<div id='{COMMENT_ITEMID}' class='comment-box clearfix'>\n";
$COMMENT_TEMPLATE['ITEM_END'] = "\n</div><div class='clear_b'><!-- --></div>\n"; // $COMMENT_TEMPLATE['ITEM_END'] = "\n</div><div class='clear_b'><!-- --></div>\n";
//XXX Do NOT add to template - too important to allow for modification.
$COMMENT_TEMPLATE['ITEM_START'] = "\n\n<li id='{COMMENT_ITEMID}' class='comment-box clearfix'>\n";
$COMMENT_TEMPLATE['ITEM_END'] = "\n</li>\n";
if (vartrue($pref['nested_comments'])) if (vartrue($pref['nested_comments']))
{ {
@@ -945,15 +949,18 @@ class comment
if($text) if($text)
{ {
$modcomment = "<div class='comment-options'>";
if($this->totalComments && getperms("B")) if($this->totalComments && getperms("B"))
{ {
$modcomment = "<div class='comment-moderate'>";
// $modcomment .= "<a href='".e_ADMIN_ABS."modcomment.php?$table.$id'>".COMLAN_314."</a>"; // $modcomment .= "<a href='".e_ADMIN_ABS."modcomment.php?$table.$id'>".COMLAN_314."</a>";
$modcomment .= "<a class='btn' href='".e_ADMIN_ABS."comment.php?searchquery={$id}&filter_options=comment_type__".$this->getCommentType($table)."'>".COMLAN_314."</a>"; $modcomment .= "<a class='btn btn-mini' href='".e_ADMIN_ABS."comment.php?searchquery={$id}&filter_options=comment_type__".$this->getCommentType($table)."'>".COMLAN_314."</a>";
$modcomment .= "</div>";
} }
$modcomment .= $this->nextprev($table,$id,$from); $modcomment .= $this->nextprev($table,$id,$from);
$modcomment .= "</div>";
} }
// --------------------------- // ---------------------------
@@ -968,7 +975,8 @@ class comment
if($text) if($text)
{ {
$text = "<div id='comments-container'>\n".$text."\n</div>"; //XXX Do NOT add to template - too important to allow for modification.
$text = "<ul id='comments-container'>\n".$text."\n</ul>";
} }
$search = array("{MODERATE}","{COMMENTS}","{COMMENTFORM}","{COMMENTNAV}"); $search = array("{MODERATE}","{COMMENTS}","{COMMENTFORM}","{COMMENTNAV}");
$replace = array($modcomment,$text,$comment,$pagination); $replace = array($modcomment,$text,$comment,$pagination);
@@ -1050,6 +1058,8 @@ class comment
if ($sql->db_Select_gen($query)) if ($sql->db_Select_gen($query))
{ {
// $text .= "<ul class='comments'>";
$width = 0; $width = 0;
$rows = $sql->db_getList(); //Shortcodes could use $sql, so just grab all results $rows = $sql->db_getList(); //Shortcodes could use $sql, so just grab all results
@@ -1073,6 +1083,8 @@ class comment
} }
} // end loop } // end loop
// $text .= "</ul>";
} // end if } // end if
return array('comments'=> $text,'lock'=> $lock); return array('comments'=> $text,'lock'=> $lock);
@@ -1088,9 +1100,9 @@ class comment
// from calculations are done by eNav() js. // from calculations are done by eNav() js.
return " return "
<a class='e-ajax btn' href='#' data-nav-total='{$this->totalComments}' data-nav-dir='down' data-nav-inc='{$this->commentsPerPage}' data-target='comments-container' data-src='".e_BASE."comment.php?mode=list&amp;type=".$table."&amp;id=".$id."&amp;from=0'>Previous</a> <a class='e-ajax btn btn-mini' href='#' data-nav-total='{$this->totalComments}' data-nav-dir='down' data-nav-inc='{$this->commentsPerPage}' data-target='comments-container' data-src='".e_BASE."comment.php?mode=list&amp;type=".$table."&amp;id=".$id."&amp;from=0'>Previous</a>
<a class='e-ajax btn' href='#' data-nav-total='{$this->totalComments}' data-nav-dir='up' data-nav-inc='{$this->commentsPerPage}' data-target='comments-container' data-src='".e_BASE."comment.php?mode=list&amp;type=".$table."&amp;id=".$id."&amp;from=0'>Next</a> <a class='e-ajax btn btn-mini' href='#' data-nav-total='{$this->totalComments}' data-nav-dir='up' data-nav-inc='{$this->commentsPerPage}' data-target='comments-container' data-src='".e_BASE."comment.php?mode=list&amp;type=".$table."&amp;id=".$id."&amp;from=0'>Next</a>
"; ";

View File

@@ -127,11 +127,14 @@ h1.bbcode, h2.bbcode, h3.bbcode, h4.bbcode, h5.bbcode, h6.bbcode { }/* override
div.bbcode { margin: 15px 0px; clear: both; } /* layout control via bbcodes */ div.bbcode { margin: 15px 0px; clear: both; } /* layout control via bbcodes */
#comments-container { list-style: none outside none; margin:0px }
#comments-container > li { padding: 5px 0px }
/* default comments layout */ /* default comments layout */
/*
XXX Get Comments looking reasonable on bootstrap AND old themes.
.comment-box { padding-bottom:10px; margin-bottom:10px; border-top:1px solid #C0C0C0; } .comment-box { padding-bottom:10px; margin-bottom:10px; border-top:1px solid #C0C0C0; }
.comment-box-left { float:left; text-align:center; width:15%; min-width:100px; max-width:150px } .comment-box-left { float:left; text-align:center; width:15%; min-width:100px; max-width:150px }
@@ -161,6 +164,9 @@ img.user-avatar { max-width:128px; -webkit-box-shadow:#CCCCCC 0px 0px 1
resize: none; resize: none;
width: auto !important; width: auto !important;
} }
.comment-status { float:right; font-style: italic } .comment-status { float:right; font-style: italic }
a.comment-edit { } a.comment-edit { }
@@ -174,7 +180,7 @@ a.comment-edit { }
.comment-moderate { text-align:center } .comment-moderate { text-align:center }
.comment-rate { text-align:right; float:right; width:100px } .comment-rate { text-align:right; float:right; width:100px }
*/
div.e-comment-edit-save { margin-top:8px; padding: 5px } div.e-comment-edit-save { margin-top:8px; padding: 5px }
.e-comment-edit-active { -webkit-box-shadow:#CCCCCC 0px 0px 10px; -moz-box-shadow:#CCCCCC 0px 0px 10px; box-shadow:#CCCCCC 0px 0px 10px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;} .e-comment-edit-active { -webkit-box-shadow:#CCCCCC 0px 0px 10px; -moz-box-shadow:#CCCCCC 0px 0px 10px; box-shadow:#CCCCCC 0px 0px 10px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
.e-comment-edit-success { padding:5px; text-align:center; background-color:#DFFFDF; border: 1px solid #009900; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; } .e-comment-edit-success { padding:5px; text-align:center; background-color:#DFFFDF; border: 1px solid #009900; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
@@ -183,10 +189,11 @@ div.e-comment-edit-save { margin-top:8px; padding: 5px }
.e-rate-up img { opacity: 0.4 } .e-rate-up img { opacity: 0.4 }
.e-rate-down img { opacity: 0.4 } .e-rate-down img { opacity: 0.4 }
/*
#comments-container .comment-box:nth-child(even) { #comments-container .comment-box:nth-child(even) {
background: red; background: red;
} }
*/
.divider { border-bottom: 1px solid silver; font-size: 18px; margin-bottom: 30px; position: relative; text-align: center; } .divider { border-bottom: 1px solid silver; font-size: 18px; margin-bottom: 30px; position: relative; text-align: center; }
.divider span { padding: 0 15px; position: relative; top: 10px; } .divider span { padding: 0 15px; position: relative; top: 10px; }