Skip to content

Commit

Permalink
stop using coffee; switch to gulp
Browse files Browse the repository at this point in the history
  • Loading branch information
jseppi committed Aug 27, 2014
1 parent 05cfea3 commit 166ab0a
Show file tree
Hide file tree
Showing 22 changed files with 686 additions and 17,631 deletions.
9 changes: 9 additions & 0 deletions .editorconfig
@@ -0,0 +1,9 @@
# EditorConfig is awesome: http://EditorConfig.org

# top-most EditorConfig file
root = true

# 2 space indentation
[*.js]
indent_style = space
indent_size = 2
24 changes: 24 additions & 0 deletions .jshintrc
@@ -0,0 +1,24 @@
{
"node": true,
"browser": true,
"bitwise": true,
"camelcase": true,
"curly": true,
"eqeqeq": true,
"immed": true,
"indent": 2,
"latedef": true,
"newcap": true,
"noarg": true,
"quotmark": false,
"regexp": true,
"undef": true,
"unused": true,
"strict": true,
"trailing": false,
"smarttabs": true,
"white": false,
"globals": {
"angular": false
}
}
24 changes: 1 addition & 23 deletions Gruntfile.coffee
Expand Up @@ -2,16 +2,7 @@ path = require 'path'

# Build configurations.
module.exports = (grunt) ->
grunt.initConfig
# Deletes Compiled script directory
# These directories should be deleted before subsequent builds.
# These directories are not committed to source control.
clean:
working:
scripts: [
'./scripts/*'
]

grunt.initConfig
# Compile CoffeeScript (.coffee) files to JavaScript (.js).
coffee:
src:
Expand Down Expand Up @@ -71,8 +62,6 @@ module.exports = (grunt) ->
# Register grunt tasks supplied by grunt-contrib-*.
# Referenced in package.json.
# https://github.com/gruntjs/grunt-contrib
grunt.loadNpmTasks 'grunt-contrib-clean'
grunt.loadNpmTasks 'grunt-contrib-coffee'
grunt.loadNpmTasks 'grunt-contrib-watch'
grunt.loadNpmTasks 'grunt-contrib-copy'
grunt.loadNpmTasks 'grunt-contrib-uglify'
Expand All @@ -86,7 +75,6 @@ module.exports = (grunt) ->
# Enter the following command at the command line to execute this build task:
# grunt test
grunt.registerTask 'test', [
'clean:working'
'default'
'karma'
]
Expand All @@ -95,16 +83,6 @@ module.exports = (grunt) ->
# Enter the following command at the command line to execute this build task:
# grunt
grunt.registerTask 'default', [
'coffee:src'
'copy:dist'
'uglify:dist'
]


# Compiles the app with non-optimized build settings and watches changes.
# Enter the following command at the command line to execute this build task:
# grunt dev
grunt.registerTask 'dev', [
'coffee:src'
'watch'
]
20 changes: 8 additions & 12 deletions README.md
@@ -1,14 +1,12 @@
angular-dropdowns
=================
# angular-dropdowns

Dropdown directives for AngularJS (1.1.5, 1.2.x).
Dropdown directives for AngularJS (1.1.5+, 1.2.x).

Includes both a select-style dropdown and a menu-style dropdown. The menu-style dropdown attaches to an existing element (button, link, div, etc), whereas the select-style dropdown replaces the element it is attached to.

See examples: http://jsfiddle.net/jseppi/cTzun/3/embedded/result/

Usage
-----
## Usage

Include `ngDropdowns` in your module dependencies:

Expand Down Expand Up @@ -96,19 +94,17 @@ You can specify a function to call upon dropdown value change by specifying the
</div>
```

Contributors
---------
## Contributors

* [@jseppi](http://github.com/jseppi)
* [@alexisbg](http://github.com/alexisbg)
* [@elishacook](http://github.com/elishacook)
* [@dinodsaurus](https://github.com/dinodsaurus)

License
---------
## License

[MIT](http://jseppi.mit-license.org/license.html)

## Credits

Credits
-------------
Styling based on http://tympanus.net/codrops/2012/10/04/custom-drop-down-list-styling/

File renamed without changes.
214 changes: 214 additions & 0 deletions angular-dropdowns.js
@@ -0,0 +1,214 @@
/**
* @license MIT http://jseppi.mit-license.org/license.html
*/
'use strict';
var dd = angular.module('ngDropdowns', []);

dd.directive('dropdownSelect', ['DropdownService', '$window',
function (DropdownService, $window) {
return {
restrict: 'A',
replace: true,
scope: {
dropdownSelect: '=',
dropdownModel: '=',
dropdownOnchange: '&'
},

controller: ['$scope', '$element', '$attrs', function ($scope, $element, $attrs) {
$scope.labelField = $attrs.dropdownItemLabel || 'text';

DropdownService.register($element);

this.select = function (selected) {
if (selected !== $scope.dropdownModel) {
angular.copy(selected, $scope.dropdownModel);
}
$scope.dropdownOnchange({
selected: selected
});
};

var $clickEvent = ('ontouchstart' in $window ? 'touchend' : 'click');
$element.bind($clickEvent, function (event) {
event.stopPropagation();
DropdownService.toggleActive($element);
});

$scope.$on('$destroy', function () {
DropdownService.unregister($element);
});
}],

template: "<div class='wrap-dd-select'>" +
" <span class='selected'>{{dropdownModel[labelField]}}</span>" +
" <ul class='dropdown'>" +
" <li ng-repeat='item in dropdownSelect'" +
" class='dropdown-item'" +
" dropdown-select-item='item'" +
" dropdown-item-label='labelField'>" +
" </li>" +
" </ul>" +
"</div>"
};
}
]);

dd.directive('dropdownSelectItem', [
function () {
return {
require: '^dropdownSelect',
replace: true,
scope: {
dropdownItemLabel: '=',
dropdownSelectItem: '='
},

link: function (scope, element, attrs, dropdownSelectCtrl) {
scope.selectItem = function () {
if (scope.dropdownSelectItem.href) {
return;
}
dropdownSelectCtrl.select(scope.dropdownSelectItem);
};
},

template: "<li ng-class='{divider: dropdownSelectItem.divider}'>" +
" <a href='' class='dropdown-item'" +
" ng-if='!dropdownSelectItem.divider'" +
" ng-href='{{dropdownSelectItem.href}}'" +
" ng-click='selectItem()'>" +
" {{dropdownSelectItem[dropdownItemLabel]}}" +
" </a>" +
"</li>"
};
}
]);

dd.directive('dropdownMenu', ['$parse', '$compile', 'DropdownService', '$window',
function ($parse, $compile, DropdownService, $window) {

var template = "<ul class='dropdown'>" +
" <li ng-repeat='item in dropdownMenu'" +
" class='dropdown-item'" +
" dropdown-item-label='labelField'" +
" dropdown-menu-item='item'>" +
" </li>" +
"</ul>";

return {
restrict: 'A',
replace: false,
scope: {
dropdownMenu: '=',
dropdownModel: '=',
dropdownOnchange: '&'
},

controller: ['$scope', '$element', '$attrs', function ($scope, $element, $attrs) {
$scope.labelField = $attrs.dropdownItemLabel || 'text';

var $clickEvent = ('ontouchstart' in $window ? 'touchend' : 'click');
var $template = angular.element(template);
// Attach this controller to the element's data
$template.data('$dropdownMenuController', this);

var tpl = $compile($template)($scope);
var $wrap = angular.element("<div class='wrap-dd-menu'></div>");

$element.replaceWith($wrap);
$wrap.append($element);
$wrap.append(tpl);

DropdownService.register(tpl);

this.select = function (selected) {
if (selected !== $scope.dropdownModel) {
angular.copy(selected, $scope.dropdownModel);
}
$scope.dropdownOnchange({
selected: selected
});
};

$element.bind($clickEvent, function (event) {
event.stopPropagation();
DropdownService.toggleActive(tpl);
});

$scope.$on('$destroy', function () {
DropdownService.unregister(tpl);
});
}]
};
}
]);

dd.directive('dropdownMenuItem', [
function () {
return {
require: '^dropdownMenu',
replace: true,
scope: {
dropdownMenuItem: '=',
dropdownItemLabel: '='
},

link: function (scope, element, attrs, dropdownMenuCtrl) {
scope.selectItem = function () {
if (scope.dropdownMenuItem.href) {
return;
}
dropdownMenuCtrl.select(scope.dropdownMenuItem);
};
},

template: "<li ng-class='{divider: dropdownMenuItem.divider}'>" +
" <a href='' class='dropdown-item'" +
" ng-if='!dropdownMenuItem.divider'" +
" ng-href='{{dropdownMenuItem.href}}'" +
" ng-click='selectItem()'>" +
" {{dropdownMenuItem[dropdownItemLabel]}}" +
" </a>" +
"</li>"
};
}
]);

dd.factory('DropdownService', ['$document',
function ($document) {
var body = $document.find('body'),
service = {},
_dropdowns = [];

body.bind('click', function () {
return angular.forEach(_dropdowns, function (el) {
el.removeClass('active');
});
});

service.register = function (ddEl) {
_dropdowns.push(ddEl);
};

service.unregister = function (ddEl) {
var index;
index = _dropdowns.indexOf(ddEl);
if (index > -1) {
_dropdowns.splice(index, 1);
}
};

service.toggleActive = function (ddEl) {
angular.forEach(_dropdowns, function (el) {
if (el !== ddEl) {
el.removeClass('active');
}
});

ddEl.toggleClass('active');
};

return service;
}
]);
4 changes: 2 additions & 2 deletions bower.json
@@ -1,14 +1,14 @@
{
"name": "angular-dropdowns",
"version": "0.2.1",
"version": "0.3.0",
"homepage": "https://github.com/jseppi/angular-dropdowns",
"authors": [
"James Seppi"
],
"description": "AngularJS Dropdown Directives",
"main": [
"dist/angular-dropdowns.js",
"css/dropdowns.css"
"dist/angular-dropdowns.css"
],
"keywords": [
"angular",
Expand Down

0 comments on commit 166ab0a

Please sign in to comment.