Browse Source

character counter

pull/1/head
Mike Macgirvin 10 years ago
parent
commit
edff5b5289
4 changed files with 78 additions and 4 deletions
  1. +25
    -1
      view/jot-header.tpl
  2. +5
    -3
      view/jot.tpl
  3. +22
    -0
      view/photo_item.tpl
  4. +26
    -0
      view/style.css

+ 25
- 1
view/jot-header.tpl View File

@ -18,7 +18,31 @@ tinyMCE.init({
add_unload_trigger : false,
remove_linebreaks : false,
convert_urls: false,
content_css: "$baseurl/view/custom_tinymce.css"
content_css: "$baseurl/view/custom_tinymce.css",
//Character count
theme_advanced_path : false,
setup : function(ed) {
ed.onKeyUp.add(function(ed, e) {
var txt = tinyMCE.activeEditor.getContent();
var text = txt.length;
if(txt.length <= 140) {
$('#character-counter').removeClass('red');
$('#character-counter').removeClass('orange');
$('#character-counter').addClass('grey');
}
if((txt.length > 140) && (txt .length <= 420)) {
$('#character-counter').removeClass('grey');
$('#character-counter').removeClass('red');
$('#character-counter').addClass('orange');
}
if(txt.length > 420) {
$('#character-counter').removeClass('grey');
$('#character-counter').removeClass('orange');
$('#character-counter').addClass('red');
}
$('#character-counter').text(text);
});
}
});
</script>


+ 5
- 3
view/jot.tpl View File

@ -1,8 +1,10 @@
<div id="profile-jot-wrapper" >
<p id="profile-jot-desc" >
What's on your mind?
</p>
<div id="profile-jot-banner-wrapper">
<div id="profile-jot-desc" >What's on your mind?</div>
<div id="character-counter" class="grey"></div>
</div>
<div id="profile-jot-banner-end"></div>
<form id="profile-jot-form" action="item" method="post" >
<input type="hidden" name="type" value="wall" />
<input type="hidden" name="profile_uid" value="$profile_uid" />


+ 22
- 0
view/photo_item.tpl View File

@ -0,0 +1,22 @@
<div class="wall-item-outside-wrapper$indent" id="wall-item-outside-wrapper-$id" >
<div class="wall-item-photo-wrapper" id="wall-item-photo-wrapper-$id" >
<a href="$profile_url" title="View $name's profile" class="wall-item-photo-link" id="wall-item-photo-link-$id">
<img src="$thumb" class="wall-item-photo" id="wall-item-photo-$id" height="80" width="80" alt="$name" /></a>
</div>
<div class="wall-item-wrapper" id="wall-item-wrapper-$id" >
<a href="$profile_url" title="View $name's profile" class="wall-item-name-link"><span class="wall-item-name" id="wall-item-name-$id" >$name</span></a>
<div class="wall-item-ago" id="wall-item-ago-$id">$ago</div>
</div>
<div class="wall-item-content" id="wall-item-content-$id" >
<div class="wall-item-title" id="wall-item-title-$id">$title</div>
<div class="wall-item-body" id="wall-item-body-$id" >$body</div>
</div>
$drop
<div class="wall-item-wrapper-end"></div>
<div class="wall-item-comment-separator"></div>
$comment
</div>
<div class="wall-item-outside-wrapper-end$indent" ></div>

+ 26
- 0
view/style.css View File

@ -1282,4 +1282,30 @@ input#dfrn-url {
#photos-upload-no-java-message {
margin-bottom: 15px;
}
#profile-jot-desc {
float: left;
width: 480px;
margin-top: 10px;
margin-bottom: 10px;
}
#character-counter {
float: left;
font-size: 120%;
}
#character-counter.grey {
color: #888888;
}
#character-counter.orange {
color: orange;
}
#character-counter.red {
color: red;
}
#profile-jot-banner-end {
clear: both;
}

Loading…
Cancel
Save