bbcode toolbar attached to the comment text field

minor css-fixes

10 files changed, 96 insertions, 6 deletions

diff --git a/view/theme/diabook/comment_item.tpl b/view/theme/diabook/comment_item.tpl
new file mode 100644
index 000000000..4668b9ce3
--- /dev/null
+++ b/view/theme/diabook/comment_item.tpl
@@ -0,0 +1,39 @@
+		<div class="comment-wwedit-wrapper" id="comment-edit-wrapper-$id" style="display: block;">
+			<form class="comment-edit-form" id="comment-edit-form-$id" action="item" method="post" onsubmit="post_comment($id); return false;">
+				<input type="hidden" name="type" value="$type" />
+				<input type="hidden" name="profile_uid" value="$profile_uid" />
+				<input type="hidden" name="parent" value="$parent" />
+				<input type="hidden" name="return" value="$return_path" />
+				<input type="hidden" name="jsreload" value="$jsreload" />
+				<input type="hidden" name="preview" id="comment-preview-inp-$id" value="0" />
+
+				<div class="comment-edit-photo" id="comment-edit-photo-$id" >
+					<a class="comment-edit-photo-link" href="$mylink" title="$mytitle"><img class="my-comment-photo" src="$myphoto" alt="$mytitle" title="$mytitle" /></a>
+				</div>
+				<div class="comment-edit-photo-end"></div>
+				<textarea id="comment-edit-text-$id" class="comment-edit-text-empty" name="body" onFocus="commentOpen(this,$id);" onBlur="commentClose(this,$id);" >$comment</textarea>
+				<a class="icon bb-video" onclick="insertFormatting('video',$id);">video</a>													
+				<a class="icon bb-image" onclick="insertFormatting('img',$id);">img</a>										
+				<a class="icon italic" onclick="insertFormatting('i',$id);">i</a>
+				<a class="icon underline" onclick="insertFormatting('u',$id);">u</a>
+				<a class="icon bold" onclick="insertFormatting('b',$id);">b</a>
+				{{ if $qcomment }}
+					<select id="qcomment-select-$id" name="qcomment-$id" class="qcomment" onchange="qCommentInsert(this,$id);" >
+					<option value=""></option>
+				{{ for $qcomment as $qc }}
+					<option value="$qc">$qc</option>				
+				{{ endfor }}
+					</select>
+				{{ endif }}
+
+				<div class="comment-edit-text-end"></div>
+				<div class="comment-edit-submit-wrapper" id="comment-edit-submit-wrapper-$id" style="display: none;" >
+					<input type="submit" onclick="post_comment($id); return false;" id="comment-edit-submit-$id" class="comment-edit-submit" name="submit" value="$submit" />
+					<span onclick="preview_comment($id);" id="comment-edit-preview-link-$id" class="fakelink">$preview</span>
+					<div id="comment-edit-preview-$id" class="comment-edit-preview" style="display:none;"></div>
+				</div>
+
+				<div class="comment-edit-end"></div>
+			</form>
+
+		</div>
diff --git a/view/theme/diabook/icons/bb-image.png b/view/theme/diabook/icons/bb-image.png
new file mode 100644
index 000000000..9a1b32113
--- /dev/null
+++ b/view/theme/diabook/icons/bb-image.png
diff --git a/view/theme/diabook/icons/bb-video.png b/view/theme/diabook/icons/bb-video.png
new file mode 100644
index 000000000..bd323531e
--- /dev/null
+++ b/view/theme/diabook/icons/bb-video.png
diff --git a/view/theme/diabook/icons/bold.png b/view/theme/diabook/icons/bold.png
new file mode 100644
index 000000000..8fab2a10f
--- /dev/null
+++ b/view/theme/diabook/icons/bold.png
diff --git a/view/theme/diabook/icons/italic.png b/view/theme/diabook/icons/italic.png
new file mode 100644
index 000000000..bf4b2b81d
--- /dev/null
+++ b/view/theme/diabook/icons/italic.png
diff --git a/view/theme/diabook/icons/underline.png b/view/theme/diabook/icons/underline.png
new file mode 100644
index 000000000..b1b4d3574
--- /dev/null
+++ b/view/theme/diabook/icons/underline.png
diff --git a/view/theme/diabook/style-network.css b/view/theme/diabook/style-network.css
index 9e57c17d2..ed7c76cbe 100644
--- a/view/theme/diabook/style-network.css
+++ b/view/theme/diabook/style-network.css
@@ -1241,6 +1241,7 @@ transition: all 0.2s ease-in-out;
   padding: 5px;
   margin-bottom: 0px;
   width: 575px;
+  padding-top: 10px;
 }
 .wall-item-decor {
   position: absolute;
@@ -1385,7 +1386,7 @@ transition: all 0.2s ease-in-out;
   padding-left: 12px;
 }
 .wall-item-comment-wrapper {
-  margin: 1px 5px 1px 80px;
+  margin: 1px 5px 17px 80px;
 }
 .wall-item-comment-wrapper .comment-edit-photo {
   display: none;
diff --git a/view/theme/diabook/style-profile.css b/view/theme/diabook/style-profile.css
index 95e9061ba..51eb61253 100644
--- a/view/theme/diabook/style-profile.css
+++ b/view/theme/diabook/style-profile.css
@@ -1235,6 +1235,7 @@ transition: all 0.2s ease-in-out;
   padding: 5px;
   margin-bottom: 0px;
   width: 575px;
+  padding-top: 10px;
 }
 .wall-item-decor {
   position: absolute;
@@ -1379,7 +1380,7 @@ transition: all 0.2s ease-in-out;
   padding-left: 12px;
 }
 .wall-item-comment-wrapper {
-  margin: 1px 5px 1px 80px;
+  margin: 1px 5px 17px 80px;
 }
 .wall-item-comment-wrapper .comment-edit-photo {
   display: none;
diff --git a/view/theme/diabook/style.css b/view/theme/diabook/style.css
index d11e3191a..229076484 100644
--- a/view/theme/diabook/style.css
+++ b/view/theme/diabook/style.css
@@ -83,6 +83,27 @@
 #adminpage .selectall { text-align: right; }
 /* icons */
 
+.icon.bold{
+  background-image: url("../../../view/theme/diabook/icons/bold.png");
+  float: right;
+  margin-top: 2px;}
+.icon.underline{
+  background-image: url("../../../view/theme/diabook/icons/underline.png");
+  float: right;
+  margin-top: 2px;}
+.icon.italic{
+  background-image: url("../../../view/theme/diabook/icons/italic.png");
+  float: right;
+  margin-top: 2px;}
+.icon.bb-image{
+  background-image: url("../../../view/theme/diabook/icons/bb-image.png");
+  float: right;
+  margin-top: 2px;}
+.icon.bb-video{
+  background-image: url("../../../view/theme/diabook/icons/bb-video.png");
+  float: right;
+  margin-top: 2px;}
+  
 .icon.contacts {
   background-image: url("../../../view/theme/diabook/icons/contacts.png");}
 .icon.notifications {
@@ -1269,6 +1290,7 @@ body .pageheader{
   padding: 5px;
   margin-bottom: 0px;
   width: 775px;
+  padding-top: 10px;
 }
 
 .wall-item-decor {
@@ -1516,7 +1538,7 @@ body .pageheader{
   padding-left: 12px;
 }
 .wall-item-comment-wrapper {
-  margin: 1px 5px 1px 80px;
+  margin: 1px 5px 17px 80px;
 }
 .wall-item-comment-wrapper .comment-edit-photo {
   display: none;
diff --git a/view/theme/diabook/theme.php b/view/theme/diabook/theme.php
index 924639625..bf31c08eb 100755
--- a/view/theme/diabook/theme.php
+++ b/view/theme/diabook/theme.php
@@ -3,13 +3,13 @@
 /*
  * Name: Diabook
  * Description: Diabook: report bugs and request here: http://pad.toktan.org/p/diabook or contact me : thomas_bierey@friendica.eu
- * Version: (Version: 1.015)
+ * Version: (Version: 1.016)
  * Author: 
  */
 
 
 //print diabook-version for debugging
-$diabook_version = "Diabook (Version: 1.015)";
+$diabook_version = "Diabook (Version: 1.016)";
 $a->page['htmlhead'] .= sprintf('<script "%s" ></script>', $diabook_version);
 
 //change css on network and profilepages
@@ -519,4 +519,31 @@ function restore_boxes(){
 	$.cookie("close_lastlikes","2", { expires: 365, path: "/" });
 	alert("Right-hand column was restored. Please refresh your browser");
   }
-</script>';}
\ No newline at end of file
+</script>';}
+
+$a->page['htmlhead'] .= ' 
+
+<script type="text/javascript">
+function insertFormatting(BBcode,id) {
+	
+		var tmpStr = $("#comment-edit-text-" + id).val();
+		if(tmpStr == "Kommentar") {
+			tmpStr = "";
+			$("#comment-edit-text-" + id).addClass("comment-edit-text-full");
+			$("#comment-edit-text-" + id).removeClass("comment-edit-text-empty");
+			openMenu("comment-edit-submit-wrapper-" + id);
+											}
+
+	textarea = document.getElementById("comment-edit-text-" +id);
+	if (document.selection) {
+		textarea.focus();
+		selected = document.selection.createRange();
+		selected.text = "["+BBcode+"]" + selected.text + "[/"+BBcode+"]";
+	} else if (textarea.selectionStart || textarea.selectionStart == "0") {
+		var start = textarea.selectionStart;
+		var end = textarea.selectionEnd;
+		textarea.value = textarea.value.substring(0, start) + "["+BBcode+"]" + textarea.value.substring(start, end) + "[/"+BBcode+"]" + textarea.value.substring(end, textarea.value.length);
+	}
+	return true;
+}
+</script> ';
\ No newline at end of file