Awesome

vue-titlecase

A Vue.js plugin provides a filter and a function to titlecase a string.

Requirements

• Vue.js ^1.0.24

Algorithm

The algorithm is based on the gamma rule described as follows:

Glossary of Grammatical and Rhetorical Terms: title case (capitalization)

Instllation

npm

$ npm install vue-titlecase

bower

$ bower install vue-titlecase

Usage

var Vue = require('vue')
var Titlecase = require('vue-titlecase')

// set plugin
Vue.use(Titlecase)

// create instance
new Vue({
  el: '#test-titlecase',
  data: {
    msg: "hello world! my id is starfish. I LOVE WATCHing tv.",
  }
})

Template the following:

<div id="test-titlecase" class="message">
  <p>{{ msg | titlecase }}</p>
  <p>{{ msg.toTitleCase() }}</p>
</div>

Output the following:

<div id="test-titlecase" class="message">
  <p>Hello World! My ID is Starfish. I Love Watching TV.</p>
  <p>Hello World! My ID is Starfish. I Love Watching TV.</p>
</div>

API

String.prototype.toTitleCase()

Converts a string instance to the titlecase form. Returns a new string.

titlecase

This is a customized Vue filter used to converts the string representation of an object to the titlecase form.

Contributing

• Fork it !
• Create your top branch from dev: git branch my-new-topic origin/dev
• Commit your changes: git commit -am 'Add some topic'
• Push to the branch: git push origin my-new-topic
• Submit a pull request to dev branch of Haixing-Hu/vue-titlecase repository !

Building and Testing

First you should install all depended NPM packages. The NPM packages are used for building and testing this package.

$ npm install

Then install all depended bower packages. The bower packages are depended by this packages.

$ bower install

Now you can build the project.

$ gulp build

The following command will test the project.

$ gulp test

The following command will perform the test and generate a coverage report.

$ gulp test:coverage

The following command will perform the test, generate a coverage report, and upload the coverage report to coveralls.io.

$ gulp test:coveralls

You can also run bower install and gulp build together with the following command:

npm run build

Or run bower install and gulp test:coveralls together with the following command:

npm run test

License

The MIT License