Created
October 31, 2014 11:24
-
-
Save ayushghosh/16e2ca508435d24b28ba to your computer and use it in GitHub Desktop.
rfs2
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="se-well" ng-class="thread.isApproved === 'yes' ? 'yesThread' : thread.isApproved === 'no' ? 'noThread' : 'naThread' "> | |
<!-- ng-click="" --> | |
<div ng-click="getThreadDeatils(thread.threadId)" class="threads" ng-class=""> | |
<span class="se-well__thread__isApproved"> | |
<span ng-show="thread.threadType === 'approval'"> | |
<span ng-switch on="thread.isApproved"> | |
<span ng-switch-when="yes"> | |
<i class="mdi-navigation-check"></i> | |
</span> | |
<span ng-switch-when="no"> | |
<i class="mdi-action-close"></i> | |
</span> | |
<span ng-switch-default> | |
<i class="mdi-navigation-more-horiz"></i> | |
</span> | |
</span> | |
</span> | |
</span> | |
<span class="se-well__thread__topic_count"> | |
<span class="se-well__thread__topic">{{ thread.threadTopic }}</span> | |
<span class="se-well__thread__count">({{ thread.commentCount }})</span> | |
</span> | |
<span class="se-well__thread__approval" ng-hide="thread.UI_Thread_Toggle === false || thread.threadType === 'info'" > | |
<button ng-disabled="thread.isApproved != 'N/A'" ng-click="threadApproval(thread, 'yes')" class="btn btn-success">Approve</button> | |
<button ng-disabled="thread.isApproved != 'N/A'" ng-click="threadApproval(thread,'no')" class="btn btn-danger">Reject</button> | |
</span> | |
<span class="se-well__thread__stage text-primary" ng-hide="thread.UI_Thread_Toggle === true"><small>{{ thread.stage }}</small></span> | |
</div> | |
<!-- <span class="se-well__thread__descr">{{ thread.threadDescription | limitTo : 80 }}</span> | |
--> | |
<!-- stage x | |
<div class="panel-thread-holder"><span class="panel-thread-label">{{ thread.stage }}</span></div> | |
-> | |
<!-- /stage --> | |
<div ng-hide="thread.UI_Thread_Toggle === false" class="se-well__thread__comments"> | |
<div class="panel-body"> | |
<span class="thread__comments_header"> | |
<small class="thread__comments_header_desc">{{ thread.threadDescription}}</small> | |
<span class="pull-right" style="display:inline-block;"> | |
<button ng-disabled="thread.isApproved != 'N/A'" ng-click="parentCommentFormShow = !parentCommentFormShow" class="btn btn-default btn-xs"><i class="mdi mdi-content-add"></i>New Comment</button> | |
</span> | |
<div ng-include="'newComment.html'"></div> | |
</span> | |
<!-- Parent comment starts --> | |
<div ng-repeat="parentComment in thread.comments"> | |
<div class="comment"> | |
<span class="comment__user_image"> | |
<img gravatar-src="'{{ parentComment.userEmail }}'" gravatar-size="40"> | |
</span> | |
<span class="comment__user_name_time_reply"> | |
<h4 class="comment__user_name">{{ parentComment.userName }} </h4> | |
<br> | |
<span class="comment__time"> | |
<span am-time-ago="parentComment.created_at"></span> | |
<a ng-disabled="thread.isApproved != 'N/A'" ng-click="parentChildCommentFormShow = !parentChildCommentFormShow" href="javascript:void(0)" class="comment__reply">Reply</a> | |
</span> | |
</span> | |
<span class="comment__text"> | |
{{ parentComment.comment }} | |
<!-- Add Child Comments Form --> | |
<div class="row"> | |
<div class="col-md-12"> | |
<br> | |
<form style="background-color:#f1f1f1;padding:15px;" ng-hide="parentChildCommentFormShow"> | |
<div class="form-group"> | |
<label for="childComment" class="control-label">Add Reply</label> | |
<div class="form-control-wrapper"> | |
<textarea id="childComment" autofocus ng-model="childCommentObject.comment" placeholder="Add a new comment." class="form-control" rows="2"></textarea> | |
<span class="material-input"></span> | |
</div> | |
<span class="help-block"></span> | |
<button ng-click="postChildComment(parentComment.commentId,thread.threadId,childCommentObject)" class="btn btn-success btn-xs">Post Comment</button> | |
</div> | |
</form> | |
</div> | |
</div> | |
<!-- / Add Child Comments Form --> | |
<div ng-repeat="childcomment in parentComment.children[0]"> | |
<div class="comment child_comment"> | |
<span class="comment__user_image"> | |
<img gravatar-src="'{{ childcomment.userEmail }}'" gravatar-size="40"> | |
</span> | |
<span class="comment__user_name_time_reply"> | |
<h4 class="comment__user_name">{{ childcomment.userName }} </h4> | |
<br> | |
<span class="comment__time"> | |
<span am-time-ago="childcomment.created_at"></span> | |
<!-- <a ng-click="parentChildCommentFormShow = !parentChildCommentFormShow" href="javascript:void(0)" class="comment__reply">Reply</a> --> | |
</span> | |
</span> | |
<span class="comment__text"> | |
{{ childcomment.comment }} | |
</span> | |
</div> | |
<div> | |
</span> | |
</div> | |
</div> <!-- Parent Comment End --> | |
</div> | |
</div> | |
</div> | |
<style type="text/css"> | |
.panel-thread-holder{ | |
display: block; | |
position: relative; | |
margin-right: 3px; | |
margin-top: 2px; | |
} | |
.panel-thread-label{ | |
position: absolute; | |
top: 0; | |
right: 0; | |
z-index: 10; | |
display: block; | |
padding: 3px 5px; | |
font-size: 10px; | |
color: #777; | |
background-color: #E6E8E3; | |
border: 1px solid #D7DACF; | |
border-radius: 0 4px 0 4px; | |
-webkit-user-select: none; /* Chrome/Safari */ | |
-moz-user-select: none; /* Firefox */ | |
-ms-user-select: none; /* IE10+ */ | |
/* Rules below not implemented in browsers yet */ | |
-o-user-select: none; | |
user-select: none; | |
} | |
.se-well{ | |
min-height: 20px; | |
/*padding: 15px 30px;*/ | |
padding: 0px; | |
margin-bottom: 0px; | |
background-color: #fff; | |
border-bottom: 1px solid #ddd; | |
border-radius: 0; | |
color: #222; | |
font-size: 1.1em; | |
letter-spacing: 1.5px; | |
cursor: pointer; | |
} | |
.yesThread | |
{ | |
background: #F5FFFA; | |
} | |
.noThread | |
{ | |
background: #FFE8E1; | |
} | |
.naThread | |
{ | |
background: #fff; | |
} | |
.threads | |
{ | |
padding: 15px 30px; | |
} | |
.se-well__thread__isApproved | |
{ | |
/*float: left; | |
font-size: 2em; | |
margin-top: -4px; | |
margin-left: -25px; | |
margin-right: 10px; | |
*/} | |
.se-well__thread__topic_count | |
{ | |
min-width: 400px; | |
display: inline-block; | |
} | |
.se-well__thread__topic{ | |
font-weight: 400; | |
display: inline-block; | |
} | |
.se-well__thread__count{ | |
color: #aaa; | |
margin-left: 5px; | |
width: 50px; | |
display: inline-block; | |
} | |
.se-well__thread__approval | |
{ | |
float: right; | |
} | |
.se-well__thread__stage | |
{ | |
float: right; | |
font-size: 0.9em; | |
margin: -15px -25px; | |
} | |
/*.se-well__thread__comments | |
{ | |
display: block; | |
}*/ | |
.thread__comments_header | |
{ | |
margin:0px 50px 20px 50px; | |
display: block; | |
} | |
.thread__comments_header_desc | |
{ | |
display: inline-block; | |
} | |
.comment{ | |
/*margin-left: 15px;*/ | |
padding: 15px 10px 5px 0px; | |
border-left: 4px solid #64D2ED; | |
margin-bottom: 20px; | |
/*border-top: 1px solid #eee;*/ | |
/*border-bottom: 1px dotted #ccc;*/ | |
background: #fefefe; | |
/*border-top: 1px dashed #ccc;*/ | |
/*border-bottom: 1px dashed #ccc;*/ | |
/*box-shadow: -5px -0px 0 0 #64D2ED;*/ | |
-webkit-border-top-right-radius: 4px; | |
-webkit-border-bottom-right-radius: 4px; | |
-moz-border-radius-topright: 4px; | |
-moz-border-radius-bottomright: 4px; | |
border-top-right-radius: 4px; | |
border-bottom-right-radius: 4px; | |
-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; | |
-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; | |
box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; | |
} | |
.child_comment | |
{ | |
background: #fff; | |
border-left: 4px solid #5BC254; | |
box-shadow: inner 0 0 5px #888; | |
} | |
.comment__user_image{ | |
display: inline-block; | |
margin-left: 10px; | |
margin-right: 20px; | |
} | |
.comment__user_image img | |
{ | |
border-radius: 40px; | |
height: 40px; | |
width: 40px; | |
vertical-align: super; | |
} | |
.comment__user_name_time_reply | |
{ | |
display: inline-block; | |
font-size: 0.8em; | |
vertical-align: top; | |
} | |
.comment__user_name | |
{ | |
display: inline-block; | |
margin-top: 0px; | |
margin-bottom: 0px; | |
} | |
.comment__reply | |
{ | |
display: inline-block; | |
font-weight: bold; | |
} | |
.comment__text | |
{ | |
display: block; | |
margin-left: 75px; | |
/*margin-top: 20px;*/ | |
margin-bottom: 20px; | |
} | |
</style> | |
<!-- Add New Comments Form --> | |
<script type="text/ng-template" id="newComment.html"> | |
<div class="row"> | |
<div class="col-md-12"> | |
<form class="" ng-hide="parentCommentFormShow"> | |
<div class="form-group"> | |
<label for="newComment" class="control-label">Add Comment</label> | |
<div class="form-control-wrapper"> | |
<textarea id="newComment" autofocus ng-model="parentCommentObject.comment" placeholder="Add a new comment." class="form-control" rows="2"></textarea> | |
<span class="material-input"></span> | |
</div> | |
<span class="help-block"></span> | |
<button ng-click="postComment($index,parentCommentObject,thread.threadId,thread.threadTopic)" class="btn btn-info btn-xs">Post Comment</button> | |
</div> | |
</form> | |
</div> | |
</div> | |
</script> | |
<!-- / Add New Comments Form --> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment