Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor #7

Open
wants to merge 9 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 20 additions & 0 deletions .editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org

root = true

[*]

# Change these settings to your own preference
indent_style = space
indent_size = 2

# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false
3 changes: 1 addition & 2 deletions .jshintrc
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,10 @@
"noarg" : true,
"noempty" : true,
"nonew" : true,
"quotmark" : "double",
"regexp" : true,
"smarttabs": true,
"strict" : true,
"trailing" : true,
"undef" : true,
"unused" : "vars"
}
}
70 changes: 70 additions & 0 deletions Gruntfile.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
'use_strict';

module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
bump: {
options: {
files: ['package.json', 'bower.json'],
commit: false,
push: false,
commitMessage: 'Release v%VERSION%',
commitFiles: ['package.json', 'bower.json']
}
},
cssmin: {
style: {
files: {
'dist/ez-checkbox.min.css': ['dist/ez-checkbox.css']
}
}
},
jshint: {
options: {
jshintrc: '.jshintrc'
},
src: {
files: {
src: ['src/**/*.js', 'test/**/*.js']
},
}
},
less: {
dist: {
files: {
'dist/ez-checkbox.css': 'src/*.less'
}
}
},
uglify: {
options: {
mangle: true,
compile: true,
compress: true
},
dist: {
files: {
'dist/ez-checkbox.min.js': ['src/**/*.js']
}
}
},
watch: {
all: {
files: ['Gruntfile.js', 'src/*.js'],
tasks: ['default'],
options: {
livereload: 1676,
}
}
}
});

grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-bump');

grunt.registerTask('default', ['jshint', 'less', 'uglify', 'cssmin']);
};
4 changes: 2 additions & 2 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
The MIT License (MIT)

Copyright (c) 2014 Sebastian Hammerl, Getslash GmbH
Copyright (c) 2014 Sebastian Hammerl, Getslash GmbH, Joris de Wit

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand All @@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
SOFTWARE.
95 changes: 27 additions & 68 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,79 +1,38 @@
angular-bootstrap-checkbox
==========================
ez-checkbox
===========

A checkbox for AngularJS styled to fit the Twitter Bootstrap standard design
A better checkbox for AngularJS.

Screenshot:

![Screenshot](/checkbox.png?raw=true "Screenshot")

### Description:

The standard checkboxes which use the input HTML element just don't look good in combination with Bootstrap.

Surprisingly, I could not find any nice looking, simple checkbox, so I built one. It is based on a button and Glyphicons which behaves like a normal checkbox.

The angular-bootstrap-checkbox is compatible to the use of the original AngularJS input[checkbox], with one minor change: while the original implementation allows an "uninitialized" or other then defined state of the model this one forces "false" or "ng-false-value" (not checked) when not set to "true" or "ng-true-value".

### Installation via Bower:

```
$ bower install angular-bootstrap-checkbox --save
```

### Usage:

Add "ui.checkbox" to your modules list. Then you can use it like AngularJS input[checkbox]:

```
<checkbox
ng-model="checkboxModel"
name="custom-name" (Optional)
ng-true-value="The Truth" (Optional)
ng-false-value="The Untruth" (Optional)
ng-change="onChange()" (Optional)
></checkbox>
```

Additionally you can set the size:
##Features
- Inverse selection (show check on falsy value)
- Non boolean true/false values
- Easily transclude a clickable label

##Installation
- run `bower install ez-checkbox`
- add `ez.checkbox` to your applications list of modules
- add sources to your html
```html
<link href="bower_components/ez-checkbox/dist/ez-checkbox.min.css" rel="stylesheet"/>
<script src="bower_components/ez-checkbox/dist/ez-checkbox.min.js"></script>
```
<checkbox ...></checkbox> (Normal size, corresponds to 'btn-xs')
<checkbox large ...></checkbox> (Large, corresponds to 'btn-sm')
<checkbox larger ...></checkbox> (Larger, corresponds to Button default size)
<checkbox largest ...></checkbox> (Largest, corresponds to 'btn-lg')
```

![Screenshot](/sizes.png?raw=true "Screenshot Sizes")

And also style the checkboxes like Bootstrap buttons:

```
<checkbox class="btn-primary"></checkbox> (Looks like primary button)
<checkbox class="btn-success"></checkbox> (Looks like success button)
<checkbox class="btn-info"></checkbox> (Looks like info button)
<checkbox class="btn-warning"></checkbox> (Looks like warning button)
<checkbox class="btn-danger"></checkbox> (Looks like danger button)
```
##Requirements
Font Awesome.

![Screenshot](/styles.png?raw=true "Screenshot Styles")
##Demo
See <a href="https://rawgit.com/jdewit/ez-checkbox/master/index.html">Live Demo</a>

See index.html and app.js for examples and how it works.

### Testing:

Start web server e.g. via Python:
```
$ python -m SimpleHTTPServer 8000
```

Start Karma E2E tests (has to be installed globally before):
```
$ karma start
##Usage
```html
<ez-checkbox ng-model="form.isCool">This is cool</ez-checkbox>
```

### License
##Options
Add the following attributes to customize behaviour

Copyright (c) 2014 Sebastian Hammerl, Getslash GmbH
- `invert="true"` - Show check on false value instead of true
- `true-value="this-is-cool"` - Will display check in checkbox if ng-model value === 'this-is-cool'

Licensed under the MIT License
##Acknowledgements
Thanks to <a href="https://github.com/sebastianha/angular-bootstrap-checkbox">angular-bootstrap-checkbox</a>.
76 changes: 0 additions & 76 deletions angular-bootstrap-checkbox.js

This file was deleted.

14 changes: 0 additions & 14 deletions app.js

This file was deleted.

18 changes: 4 additions & 14 deletions bower.json
Original file line number Diff line number Diff line change
@@ -1,19 +1,12 @@
{
"name": "angular-bootstrap-checkbox",
"version": "0.3.1",
"authors": [
"Sebastian Hammerl, Getslash GmbH"
],
"description": "A checkbox for AngularJS styled to fit the Twitter Bootstrap standard design",
"main": "angular-bootstrap-checkbox.js",
"name": "ez-checkbox",
"version": "0.0.0",
"description": "A checkbox for AngularJS",
"keywords": [
"angular",
"angularjs",
"directive",
"ui",
"bootstrap",
"form",
"input",
"checkbox"
],
"license": "MIT",
Expand All @@ -24,9 +17,6 @@
],
"dependencies": {
"angular": ">= 1.2.0",
"bootstrap": ">= 3.0.0"
},
"devDependencies": {
"angular-scenario": ">= 1.2.0"
"font-awesome": ">= 4.0.0"
}
}
Binary file removed checkbox.png
Binary file not shown.
12 changes: 12 additions & 0 deletions dist/ez-checkbox.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
.ez-checkbox {
position: relative;
margin-right: 5px;
color: #333;
cursor: pointer;
}
.ez-checkbox:hover {
text-decoration: none;
}
.ez-checkbox i {
cursor: pointer;
}
1 change: 1 addition & 0 deletions dist/ez-checkbox.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions dist/ez-checkbox.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading