Loading..

2016-01-25 @ 10:35

Make Vim Command Line Act As Bash Or ZSH

I use Vim for 5 years now and there was a one thing which was kind of driving me crazy: the command line of the Vim. Vim has a very strange mapping when it comes to it's command line e.g. <C-b> will move the cursor to the beginning of the line. I mean if you use linux shell as much as I am, then you will find yourself hitting <C-a> quite frequently, but it is not going to make the right job for you. If you wish the Vim command line to work in a same way as Bash, Zsh or ehm Emacs use the following mappings:

cnoremap <C-a> <Home>
cnoremap <C-b> <Left>
cnoremap <C-f> <Right>
cnoremap <C-d> <Delete>
cnoremap <M-b> <S-Left>
cnoremap <M-f> <S-Right>
cnoremap <M-d> <S-right><Delete>
cnoremap <Esc>b <S-Left>
cnoremap <Esc>f <S-Right>
cnoremap <Esc>d <S-right><Delete>
cnoremap <C-g> <C-c>
show more »

2015-08-14 @ 10:48

Build a Simple Channel-Based Publish/Subscribe Helper for Backbone

Backbone provides a handy Events module which can be mixed in to any object, giving the object the ability to bind and trigger custom named events. It is very useful if you wish to attach a callback function when for example a model attached to a view was changed:

var GreeterView = Backbone.View.extend({
  template: _.template('Hello <%= model.name %>!'),

  initialize: function () {
    this.model.on('change', this.render, this);
  },

  render: function () {
    this.$el.html(this.template({ model: this.model.attributes }));
    return this;
  }
});

var User = Backbone.Model.extend({});

var user = new User({ name: 'John Smith' });

var greeterView = new GreeterView({
  model: user
});

greeterView.render()

console.log(greeterView.$el.html()); //=> 'Hello John Smith!'

user.set('name', 'Johnny Smith');

console.log(greeterView.$el.html()); //=> 'Hello Johnny Smith!'

If you need two views to communicate without coupling them together, then it might get a bit trickier. I prefer channel-based publish subscribe communication for object which shouldn't necessary have to know each other. Let's imagine we have 2 views: ContentView and NavView and we would like to replace the content of the ContentView with some text when user clicks on link inside of a NavView template. ContentView does not know anything about NavView and it doesn't have a reference to it's instance to get the advantage of using events. We might create a parent view, which would work as a mediator between those two views, but things would get bit messy later on when application grows and many other views need to communicate with each other too. My preferred solution is (as I mentioned earlier) channel-based/topic-based publish subscribe pattern. You might want to use an external library like: Backbone.Radio, or Backbone.Wreqr, but both of them are in my opinion unnecessarily large and complex. Let me show you how you could implement your own channel-based publish subscribe "library" on few lines of code. suspect. Let's call it simply Vent.

// utils/vent.js

'use strict';

var Backbone = require('backbone');
var _ = require('backbone/node_modules/underscore');

var Channel = require('utils/channel');

var Vent = function () {
    this._channels = [];
};

_.extend(Vent.prototype, Backbone.Events, {
    channel: function (channelName) {
        var channel = _.find(this._channels, { name: channelName });

        return channel || (_.bind(function () {
            this._channels.push(new Channel(channelName));
            return this.channel(channelName);
        }, this)());
    }
});

module.exports = new Vent();
// utils/channel.js

'use strict';

var Backbone = require('backbone');
var _ = require('backbone/node_modules/underscore');

var Channel = function (name) {
    this.name = name;
};

_.extend(Channel.prototype, Backbone.Events);

module.exports = Channel;

So your views can communicate simply like this:

var Backbone = require('backbone');
var vent = require('utils/vent');

var ContentView = Backbone.View.extend({
  initialize: function () {
    vent.channel('root').on('show:content', this.showContent, this);
  },

  showContent: function (content) {
    // show the content ...
  }
});

var NavView = Backbone.View.extend({
  events: {
    'click a': 'notifyContent'
  },

  notifyContent: function () {
    vent.channel('root').trigger('show:content', 'The new awesome content');
  }
});

Conclusion

If you build a Backbone application w/o using of Marionette or some other extending libraries and you need a simple way object can globally communicate with each other, you might implement you own channel-based publish subscribe thingy, before sticking to some "over-complicated" vendor library.

show more »

2015-07-14 @ 20:13

Bavarian Ipsum

Two days ago, I had seen the http://bavaria-ipsum.de/ website and it has somehow motivated me to create my own Bavarian Ipsum. So I wrote a very simple JavaScript library which basically generates random Bavarian text. You can find the source here. It was also nice possibility for me to try Browserify for the first time and I can only say one: "I absolutely love it!".

bavaria-ipsum works simply as that:

var ipsum = new BavariaIpsum();
ipsum.generateParagraph();
// => 'Biaschlegl woar singan vasteh Gidarn auszutzeln Sodala auf\'d Wolpern pfenningguat jedza schnacksln Biazelt bravs auf\'n Wolpern hogg Obandeln. Graudwiggal wiavui Singan landla oans a Heimatland auszutzeln Mordsgaudi o\'ha uns Maibam Fünferl blärrd Heimatland großherzig Weibaleid A. Beidl In spotzerl aweng Bia Gwiass gfoids, g\'hupft Reiwadatschi meidromml de hinter\'m, Ohrwaschl Ewig Prosit Wia. Schoo um huift gibt\'s Mordsgaudi. Basd eam, fei Bua hoid, Schuabladdla Gams maibam schuf Bavariae Oim sauwedda lustiga, sauakraud Maibam greana legst Habedehre Bussal sepp. Schorsch Marterl In Weibaleid. Obandeln Auffisteign Wiesn etza heid wolln Diandldrahn nia greana. Anbandeln auffi. Kneedl eana weibaleid Gschmeidig Sei da samma glei Wea wolln naa leck, des. Bloß sauwedda Hetschapfah Watschnbaam wiavui, hoggd Sauwedda. Schmankal zua Maß nachad, enzian, In, Lem. Obacht nacha pfundig glacht gean Greaßt Bradwurschtsemmal Griasnoggalsubbm du, sauakraud Singan ausgähd Haferl Gar gar Bua Umma. Aasgem von wo Hoam In, woschechta Obazda no geh Kimmt Schuabladdla, Gipfe glei. Fias Sauakraud anbandeln. Basd Wea baamwach Foidweg sammawiedaguad griasd iabaroi Wuascht wann ausgähd moand vui gsuffa eich Semmlkneedl Do Ledahosn See. Blosmusi muas Damischa nei. Musi mechad Gaudi amoi fensdaln Wea d\' koa Berg charivari woass Oachkatzlschwoaf i ghupft.'

Bavaria

show more »

About

Jiri Chara
My name is Jiří Chára and I am an addicted JavaScript and Ruby developer. I was born in Plzeň the home of the Pilsner Beer. I currently live in Munich, Germany together with my wife, my daughter and my son. I currently work as a senior front-end engineer at AppDirect.

see more »


Copyright © 2016 Jiří Chára. All Rights Reserved.