diff options
| -rw-r--r-- | js/util.js | 21 | ||||
| -rw-r--r-- | lib/util.php | 4 | ||||
| -rw-r--r-- | theme/default/display.css | 15 |
3 files changed, 38 insertions, 2 deletions
diff --git a/js/util.js b/js/util.js new file mode 100644 index 000000000..59a489170 --- /dev/null +++ b/js/util.js @@ -0,0 +1,21 @@ +$(document).ready(function(){ + // count character on keyup + function counter(){ + var maxLength = 140; + var currentLength = $("#status_textarea").val().length; + var remaining = 140 - currentLength; + $("#counter").text(remaining); + + if(remaining <= 0) { + $("#counter").attr("class", "toomuch"); + } else { + $("#counter").attr("class", ""); + } + } + + if ($("#status_textarea").length) { + $("#status_textarea").bind("keyup", counter); + } + +}); + diff --git a/lib/util.php b/lib/util.php index f9abb6d90..0762d3a8f 100644 --- a/lib/util.php +++ b/lib/util.php @@ -170,6 +170,9 @@ function common_show_header($pagetitle, $callable=NULL, $data=NULL, $headercall= common_element('script', array('type' => 'text/javascript', 'src' => common_path('js/jquery.min.js')), ' '); + common_element('script', array('type' => 'text/javascript', + 'src' => common_path('js/util.js')), + ' '); if ($callable) { if ($data) { @@ -834,6 +837,7 @@ function common_notice_form($action=NULL, $content=NULL) { common_element('label', array('for' => 'status_update', 'id' => 'status_label'), _t('What\'s up, ').$user->nickname.'?'); + common_element('span', array('id' => 'counter', 'class' => 'counter'), '140'); common_element('textarea', array('id' => 'status_textarea', 'name' => 'status_textarea'), ($content) ? $content : ' '); diff --git a/theme/default/display.css b/theme/default/display.css index b2e703a03..98dad5d02 100644 --- a/theme/default/display.css +++ b/theme/default/display.css @@ -476,7 +476,7 @@ textarea { padding: 0; } #status_label { - display: block; + display: inline; clear: both; margin: 0; padding: 0 0 3px 0; @@ -510,10 +510,21 @@ textarea { color: #fff6d5; cursor: pointer; border: 0; - } + } #status_submit:hover { background-color: #d1451a; } +#counter { + position: relative; + color: black; + font-weight: bold; + font-size: 18px; + left: 255px; +} + +#counter.toomuch { + color: red; +} /* ----- Subscribe Form ----- */ #subscribe .button, #unsubscribe .button, #remotesubscribe .button { |