gunghogeoduck/osem-fcy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implementing Countable.js to count words.

Browse source 
Changed the words_count method to work with countable.js

Added the gem for countable.js
This commit is contained in:
gotens1211 2017-02-05 16:00:45 +05:30
parent 8b5d6603af
commit c1b81755c9
5 changed files with 17 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

3
Gemfile
View file

@ -178,6 +178,9 @@ gem 'cloudinary'
# for setting app configuration in the environment # for setting app configuration in the environment
gem 'dotenv-rails' gem 'dotenv-rails'
# For countable.js
gem "countable-rails", "~> 0.0.1"
# Both are not in a group as we use it also for rake data:demo # Both are not in a group as we use it also for rake data:demo
# for fake data # for fake data
gem 'faker' gem 'faker'

5
Gemfile.lock
View file

@ -125,6 +125,8 @@ GEM
execjs execjs
coffee-script-source (1.10.0) coffee-script-source (1.10.0)
columnize (0.8.9) columnize (0.8.9)
countable-rails (0.0.1)
railties (>= 3.1)
countries (1.2.5) countries (1.2.5)
currencies (~> 0.4.2) currencies (~> 0.4.2)
i18n_data (~> 0.7.0) i18n_data (~> 0.7.0)
@ -555,6 +557,7 @@ DEPENDENCIES
chart-js-rails chart-js-rails
cloudinary cloudinary
cocoon cocoon
countable-rails (~> 0.0.1)
country_select country_select
coveralls coveralls
daemons daemons
@ -634,4 +637,4 @@ DEPENDENCIES
whenever whenever
BUNDLED WITH BUNDLED WITH
1.12.5 1.14.3

1
app/assets/javascripts/application.js
View file

@ -45,6 +45,7 @@
//= require osem-commercials //= require osem-commercials
//= require unobtrusive_flash //= require unobtrusive_flash
//= require unobtrusive_flash_bootstrap //= require unobtrusive_flash_bootstrap
//= require countable
$(document).ready(function() { $(document).ready(function() {
$('a[disabled=disabled]').click(function(event){ $('a[disabled=disabled]').click(function(event){

20
app/assets/javascripts/osem.js
View file

@ -148,19 +148,15 @@ function get_color() {
} }
function word_count(text, divId, maxcount) { function word_count(text, divId, maxcount) {
var r = 0; var area = document.getElementById(text.id)
var input = text.value.replace(/\s/g,' ');
var word_array = input.split(' ');
for (var i=0; i < word_array.length; i++) {
if (word_array[i].length > 0) r++;
}
$('#' + divId).text(r); Countable.live(area, function(counter) {
if (r > maxcount) { $('#' + divId).text(counter.words);
$('#' + divId).css('color', 'red'); if (counter.words > maxcount)
} else { $('#' + divId).css('color', 'red');
$('#' + divId).css('color', '#333'); else
} $('#' + divId).css('color', 'black');
});
}; };
/* Wait for the DOM to be ready before attaching events to the elements */ /* Wait for the DOM to be ready before attaching events to the elements */

2
app/views/users/edit.html.haml
View file

@ -14,7 +14,7 @@
= link_to 'Change your avatar here', 'https://gravatar.com' = link_to 'Change your avatar here', 'https://gravatar.com'
= f.input :affiliation, as: :string, = f.input :affiliation, as: :string,
hint: 'This could be a company, a user group, or nothing at all.' hint: 'This could be a company, a user group, or nothing at all.'
= f.input :biography, input_html: { rows: 5, data: { provide: 'markdown-editable' }, 'onkeyup' => "word_count(this, 'biography-count', 150)" }, = f.input :biography, input_html: { rows: 5, data: { provide: 'markdown-editable' } },
hint: markdown_hint hint: markdown_hint
You have used You have used
%span#bio_length %span#bio_length