At.js with froala issue

At.js is a Javascript library for having Github like mentions in an app. The library is here. It’s a very good library and simple to use however when I tried it, it didn’t work out of the box for froala editor. The problem is At.js surrounds the range with spans and since WebKit browsers insert spans, the editor accepts spans only if

data-fr-verified=”true”

is set to true. So to counter this, when initiating the function, a small tweak is required.

$(‘.froala-view’).atwho({
at: “@”,
editableAtwhoQueryAttrs: {“data-fr-verified”: true},

data:[‘Peter’, ‘Tom’, ‘Anne’]
})

This should get it working as it did for me.

 

Reference: Github issue

 

Hope  it helps

Screen shot in Chrome Extension

Hi,
There are many chrome extensions to take a screenshot. But recently, I was working on a project where we had to build an extension and also were taking a screenshot. So apparently, chrome provides an API called ‘capturevisibletab’ (doc) and it works. While coding, I referred to this git repo which works perfectly.
But then, as we tested, we found the image was cropped when using a macbook retina display machine.
It took us a while to understand that this is because the devicepixelratio (window.devicePixelRatio) is 2 in a macbook(with retina) display and 1 in others and hence the issue.
Thus, we had to adjust for scale which we did not account for earlier and we referred to this code for adjusting it.

Will soon post our whole code for completeness but the logic is pretty clear from the above code.

Hope it helps !

Rails 4 authenticy token issue

Hi,

Recently I was working on a simple rails application (Rails 4) and I create a simple remote form for a model.

Things were fine but when I submit the form using javascript, it gave me an authenticity token error:

 ActionController::InvalidAuthenticityToken

I read up(googled) a bit and figured that one has to set crsf_meta_tags in layout and not doing this creates the issue. I thought I had missed it somehow but to my dismay it was there but still I had the issue !

The problem was that in normal forms(remote => false) , rails automatically sets the authenticity token but not so in remote forms. Now there can be many work arounds like suggested here.

But the most rails way ! of doing it is adding the following in application.rb:

config.action_view.embed_authenticity_token_in_remote_forms = true

Once you restart your server, voila ! it will work.

A good reading can be found here

Hope it helps !

Postgres Error On Heroku

Recently, I ran into an error while deploying an application(redmine to be specific) on heroku.
I followed all steps listed on the wiki page, remove the required files from gitignore etc but when I did git push, I kept on getting the error:

Please configure your config/database.yml first
remote: rake aborted!
remote: URI::InvalidURIError: bad URI(is not URI?): ://user:pass@127.0.0.1/dbname

Since Heroku generates database.yml file itself, I had no clue what to do.
So in the gemfile, I deleted the following block:
# database_file = File.join(File.dirname(__FILE__), "config/database.yml")
# if File.exist?(database_file)
# database_config = YAML::load(ERB.new(IO.read(database_file)).result)
# adapters = database_config.values.map {|c| c['adapter']}.compact.uniq
# if adapters.any?
# adapters.each do |adapter|
# case adapter
# when 'mysql2'
# gem "mysql2", "~> 0.3.11", :platforms => [:mri, :mingw, :x64_mingw]
# gem "activerecord-jdbcmysql-adapter", :platforms => :jruby
# when 'mysql'
# gem "activerecord-jdbcmysql-adapter", :platforms => :jruby
# when /postgresql/
# gem "pg", "~> 0.17.1", :platforms => [:mri, :mingw, :x64_mingw]
# gem "activerecord-jdbcpostgresql-adapter", :platforms => :jruby
# when /sqlite3/
# gem "sqlite3", :platforms => [:mri, :mingw, :x64_mingw]
# gem "jdbc-sqlite3", "< 3.8", :platforms => :jruby
# gem "activerecord-jdbcsqlite3-adapter", :platforms => :jruby
# when /sqlserver/
# gem "tiny_tds", "~> 0.6.2", :platforms => [:mri, :mingw, :x64_mingw]
# gem "activerecord-sqlserver-adapter", :platforms => [:mri, :mingw, :x64_mingw]
# else
# warn("Unknown database adapter `#{adapter}` found in config/database.yml, use Gemfile.local to load your own database gems")
# end
# end
# else
# warn("No adapter found in config/database.yml, please configure it first")
# end
# else
# warn("Please configure your config/database.yml first")
# end

and added

group :production do
# gems specifically for Heroku go here
gem "pg", ">= 0.11.0"
end

Also in config/environments/production.rb,I added the following line:

config.assets.initialize_on_precompile = false

Once I pushed, the above error went away but I got the following error:


Running: rake assets:precompile
remote: rake aborted!
remote: PG::ConnectionBad: could not connect to server: Connection refused
remote: Is the server running on host "127.0.0.1" and accepting

The problem here was I didn’t pre-provision my database before pushing to heroku.

So solve this, one can run the command:

heroku addons:create heroku-postgresql

So know about the issue, one can always use:

heroku config

Before running the command, heroku config, returned DATABASE_URL as blank and that was the issue.

Hope it helps !!

Modifying the “PATH” variable in MAC

This is probably the most important thing one can do in a UNIX based system- Modify the PATH variable.

I recently installed Libreoffice on my mac for using its command line tools. It was working fine in the applications folder and showing up on spotlight as well as dock but the command line tool was not working

After some time , I figured that in Linux, I used “libreoffice ….” but in Mac I had to use “soffice…”. soffice command was not directly available to me on terminal and I had to specify the whole path to use it:

/Applications/LibreOffice.app/Contents/MacOS/soffice –help

To use soffice without the whole path, I modified my PATH variable :

nano ~/.bash_profile

(create this file using touch ~/.bash_profile if your system doesn’t have one!!)

Include the lines:

export PATH=”/Applications/LibreOffice.app/Contents/MacOS:$PATH”

Save it and enter the command:

source ~/.bash_profile

And wallah ! The Path variable is modified and we can now use soffice directly in command line.

soffice –help

This way, we can include any application in command line.

Hope it helps.

Keypress vs keydown in jquery

In todays web world, forms and input bars are very important. We all use searching and filtering in our applications. The easiest and obvious way to do this while using JS(jquery) is binding key events to the search bar.

The event I usually bound was ‘keypress’. This is fine and works good. But the actual meaning of keypress , in its original form in IE world (!!!!!) is the event which actually adds some value in the input field. Some keys like backspace, delete, clt etc do not add any value and hence are not detected by keypress event.

These are important keys as often in filtering when the input field is empty, we might want to show all results. The user might type some query and delete it and hence detection of such keys is important.

To avoid such confusion, one should always use keydown or keyup events. These events detect events where any key is pressed and one can use e.which to determine what key is pressed and perform action.

 

I personally like keyup becuase keydown event is called just after pressing the key and hence value of input field lags one character behind the actual input.

 

Hope it helps !