Merge pull request twbs#3 from tardyp/master

translate in coffee/jade for maintainability

.gitignore

@@ -0,0 +1,3 @@
+.temp
+node_modules
+*.map

Gruntfile.coffee

@@ -0,0 +1,102 @@
+path = require 'path'
+
+# Build configurations.
+module.exports = (grunt) ->
+    grunt.initConfig
+        # Deletes built file and temp directories.
+        clean:
+            working:
+                src: [
+                    'ng-table.*'
+                    './.temp/views'
+                    './.temp/'
+                ]
+        copy:
+            styles:
+                files: [
+                    src: './src/styles/ng-table.css'
+                    dest: './ng-table.css'
+                ]
+
+        # Compile CoffeeScript (.coffee) files to JavaScript (.js).
+        coffee:
+            scripts:
+                files: [
+                    cwd: './src/'
+                    src: 'scripts/**/*.coffee'
+                    dest: './.temp/'
+                    expand: true
+                    ext: '.js'
+                ]
+                options:
+                    # Don't include a surrounding Immediately-Invoked Function Expression (IIFE) in the compiled output.
+                    # For more information on IIFEs, please visit http://benalman.com/news/2010/11/immediately-invoked-function-expression/
+                    bare: true
+                    sourceMap: true
+                    sourceRoot : '/src'
+        uglify:
+            # concat js files before minification
+            js:
+                src: ['.temp/scripts/directive.js','.temp/scripts/*.js']
+                dest: 'ng-table.js'
+                options:
+                  sourceMap: (fileName) ->
+                    fileName.replace /\.js$/, '.map'
+        concat:
+            # concat js files before minification
+            js:
+                src: ['.temp/scripts/directive.js','.temp/scripts/*.js']
+                dest: 'ng-table.js'
+
+        # Compile jade files (.jade) to HTML (.html).
+        #
+        jade:
+            views:
+                files:[
+                    src:'**/*.jade'
+                    dest: './.temp/ng-table/'
+                    cwd: './src/views'
+                    ext: ".html"
+                    expand: true
+                ]
+
+        ngTemplateCache:
+            views:
+                files:
+                    './.temp/scripts/views.js': './.temp/ng-table/**/*.html'
+                options:
+                    trim: './.temp/'
+                    module: 'ngTable'
+
+    # 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-copy'
+    grunt.loadNpmTasks 'grunt-contrib-jade'
+    grunt.loadNpmTasks 'grunt-contrib-uglify'
+    grunt.loadNpmTasks 'grunt-contrib-concat'
+
+
+    # Register grunt tasks supplied by grunt-hustler.
+    # Referenced in package.json.
+    # https://github.com/CaryLandholt/grunt-hustler
+    grunt.loadNpmTasks 'grunt-hustler'
+
+    grunt.registerTask 'default', [
+        'clean'
+        'coffee'
+        'jade'
+        'ngTemplateCache'
+        'uglify'
+        'copy'
+    ]
+    grunt.registerTask 'dev', [
+        'clean'
+        'coffee'
+        'jade'
+        'ngTemplateCache'
+        'concat'
+        'copy'
+    ]

component.json → bower.json

@@ -3,10 +3,9 @@
   "version": "0.0.1",
   "main": "ng-table.js",
   "ignore": [
-    "examples"
+    "examples", "src"
   ],
   "dependencies": {
-    "jquery": "~1.9.1",
     "angular": "~1.0.6"
   }
-}
+}

package.json

@@ -0,0 +1,17 @@
+{
+    "dependencies": {
+        "coffee-script": "~1.6.2",
+        "grunt-regarde": "~0.1.1",
+        "grunt-contrib-jade": "~0.5.0",
+        "grunt-hustler": "0.11.2",
+        "grunt-contrib-copy": "~0.4.1",
+        "grunt-contrib-coffee": "~0.7.0",
+        "grunt-contrib-clean": "~0.4.0",
+        "grunt-contrib-concat": "~0.3.0",
+        "grunt-contrib-requirejs": "~0.4.0",
+        "grunt-contrib-uglify": "~0.2.1",
+        "grunt": "~0.4.1"
+    },
+    "name": "ng-table",
+    "version": "0.0.1"
+}

src/scripts/directive.coffee

@@ -0,0 +1,145 @@
+"use strict"
+
+###
+ngTable: Table + Angular JS
+
+@author Vitalii Savchuk <esvit666@gmail.com>
+@copyright 2013 Vitalii Savchuk <esvit666@gmail.com>
+@version 0.2.0
+@url https://github.com/esvit/ng-table/
+@license New BSD License <http://creativecommons.org/licenses/BSD/>
+###
+
+angular.module("ngTable", []).directive("ngTable", ["$compile", "$parse", "$http", "ngTableParams", ($compile, $parse, $http, ngTableParams) ->
+  restrict: "A"
+  priority: 1001
+  scope: true
+  controller: [ "$scope", "$timeout", ($scope, $timeout) ->
+    $scope.params = $scope.params or
+      page: 1
+      count: 10
+
+    updateParams = (newParams) ->
+      newParams = angular.extend($scope.params, newParams)
+
+      # assign params in both scopes
+      $scope.paramsModel.assign $scope.$parent, new ngTableParams(newParams)
+      $scope.params = angular.copy(newParams)
+
+    # goto page
+    $scope.goToPage = (page) ->
+      updateParams page: page  if page > 0 and $scope.params.page isnt page and $scope.pages.length + 1 >= page
+
+    # change items per page
+    $scope.changeCount = (count) ->
+      updateParams
+        page: 1
+        count: count
+
+
+    $scope.doFilter = ->
+      updateParams page: 1
+
+    $scope.sortBy = (column) ->
+      return  unless column.sortable
+      sorting = $scope.params.sorting and $scope.params.sorting[column.sortable] and ($scope.params.sorting[column.sortable] is "desc")
+      sortingParams = {}
+      sortingParams[column.sortable] = (if sorting then "asc" else "desc")
+      updateParams sorting: sortingParams
+  ]
+  compile: (element, attrs) ->
+    i = 0
+    columns = []
+    angular.forEach element.find("td"), (item) ->
+      el = $(item)
+      columns.push
+        id: i++
+        title: el.attr("title") or el.text()
+        sortable: (if el.attr("sortable") then el.attr("sortable") else false)
+        filter: (if el.attr("filter") then $parse(el.attr("filter"))() else false)
+        filterData: (if el.attr("filter-data") then el.attr("filter-data") else null)
+
+
+    (scope, element, attrs) ->
+      scope.columns = columns
+      # generate array of pages
+      generatePages = (currentPage, totalItems, pageSize) ->
+        maxBlocks = 11
+        pages = []
+        numPages = Math.ceil(totalItems / pageSize)
+        if numPages > 1
+          pages.push
+            type: "prev"
+            number: Math.max(1, currentPage - 1)
+            active: currentPage > 1
+
+          pages.push
+            type: "first"
+            number: 1
+            active: currentPage > 1
+
+          maxPivotPages = Math.round((maxBlocks - 5) / 2)
+          minPage = Math.max(2, currentPage - maxPivotPages)
+          maxPage = Math.min(numPages - 1, currentPage + maxPivotPages * 2 - (currentPage - minPage))
+          minPage = Math.max(2, minPage - (maxPivotPages * 2 - (maxPage - minPage)))
+          i = minPage
+
+          while i <= maxPage
+            if (i is minPage and i isnt 2) or (i is maxPage and i isnt numPages - 1)
+              pages.push type: "more"
+            else
+              pages.push
+                type: "page"
+                number: i
+                active: currentPage isnt i
+
+            i++
+          pages.push
+            type: "last"
+            number: numPages
+            active: currentPage isnt numPages
+
+          pages.push
+            type: "next"
+            number: Math.min(numPages, currentPage + 1)
+            active: currentPage < numPages
+
+        pages
+
+      # update pagination where parameters changes
+      scope.$parent.$watch attrs.ngTable, ((params) ->
+        return  if angular.isUndefined(params)
+        scope.paramsModel = $parse(attrs.ngTable)
+        scope.pages = generatePages(params.page, params.total, params.count)
+        scope.params = angular.copy(params)
+      ), true
+
+      # show/hide filter row
+      if attrs.showFilter
+        scope.$parent.$watch attrs.showFilter, (value) ->
+          scope.show_filter = value
+
+      # get data from columns
+      angular.forEach columns, (column) ->
+        return  unless column.filterData
+        promise = scope[column.filterData]
+        throw new Error("Function " + column.filterData + " not found in scope")  unless promise
+        delete column["filterData"]
+
+        promise(column).then (data) ->
+          data = []  unless angular.isArray(data)
+          data.unshift title: "-"
+          column.data = data
+
+      # create table
+      unless element.hasClass("ng-table")
+        scope.templates =
+          header: "ng-table/header.html"
+          pagination: (if attrs.templatePagination then attrs.templatePagination else "ng-table/pager.html")
+
+        headerTemplate = $compile("<thead ng-include=\"templates.header\"></thead>")(scope)
+        paginationTemplate = $compile("<div ng-include=\"templates.pagination\"></div>")(scope)
+        element.filter("thead").remove()
+        element.prepend(headerTemplate).addClass "ng-table"
+        element.after paginationTemplate
+])

src/scripts/params.coffee

@@ -0,0 +1,55 @@
+angular.module("ngTable").factory "ngTableParams", ->
+  isNumber = (n) ->
+    not isNaN(parseFloat(n)) and isFinite(n)
+  ngTableParams = (data) ->
+    ignoreFields = ["total"]
+    @page = 1
+    @count = 1
+    @filter = {}
+
+    # parse url params
+    for key, value of data
+      if key.indexOf("[") >= 0
+        params = key.split(/\[(.*)\]/)
+        lastKey = ""
+        for name in parms.reverse()
+          unless name is ""
+            v = value
+            value = {}
+            value[lastKey = name] = (if isNumber(v) then parseFloat(v) else v)
+
+        this[lastKey] = angular.extend(this[lastKey] or {}, value[lastKey])
+      else
+        this[key] = (if isNumber(data[key]) then parseFloat(data[key]) else data[key])
+
+    @orderBy = ->
+      sorting = []
+      for direction, column in @sorting
+        sorting.push ((if direction is "asc" then "+" else "-")) + column
+
+      return sorting
+
+    @url = (asString) ->
+      asString = asString or false
+      pairs = (if asString then [] else {})
+      for key of this
+        if @hasOwnProperty(key)
+          continue  if ignoreFields.indexOf(key) >= 0
+          item = this[key]
+          name = encodeURIComponent(key)
+          if typeof item is "object"
+            for subkey of item
+              if not angular.isUndefined(item[subkey]) and item[subkey] isnt ""
+                pname = name + "[" + encodeURIComponent(subkey) + "]"
+                if asString
+                  pairs.push pname + "=" + encodeURIComponent(item[subkey])
+                else
+                  pairs[pname] = encodeURIComponent(item[subkey])
+          else if not angular.isFunction(item) and not angular.isUndefined(item) and item isnt ""
+            if asString
+              pairs.push name + "=" + encodeURIComponent(item)
+            else
+              pairs[name] = encodeURIComponent(item)
+      return pairs
+    return this
+  return ngTableParams

src/styles/ng-table.css

@@ -0,0 +1,41 @@
+.table th {
+    text-align: center;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+.table th.filter .input-filter {
+    margin: 0;
+    display: block;
+    width: 100%;
+    min-height: 30px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+
+.table th.sortable {
+    cursor:pointer;
+}
+.table th.sortable div {
+    padding-right: 18px;
+    position: relative;
+}
+.table th.sortable div:after {
+    content:""; border-width:0 4px 4px;border-style:solid;border-color:#000 transparent;visibility:hidden;
+    right: 8px;
+    top: 50%;
+    position: absolute;
+    margin-top: -2px;
+}
+
+.table + .pagination {
+    margin-top: 0;
+}
+.table .sortable.sort-desc, .table .sortable.sort-asc {background-color:rgba(141, 192, 219, 0.25);text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);}
+.table .sortable div:hover:after{visibility:visible;}
+.table .sortable.sort-asc div:after,.table .sortable.sort-asc div:hover:after{visibility:visible;filter:alpha(opacity=60);-khtml-opacity:0.6;-moz-opacity:0.6;opacity:0.6;}
+.table .sortable.sort-desc div:after{border-bottom:none;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #000;visibility:visible;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;filter:alpha(opacity=60);-khtml-opacity:0.6;-moz-opacity:0.6;opacity:0.6;}

src/views/header.jade

@@ -0,0 +1,13 @@
+tr
+  th.header(ng-class='{sortable: column.sortable,\'sort-asc\': params.sorting[column.sortable]==\'asc\', \'sort-desc\': params.sorting[column.sortable]==\'desc\'}', ng-click='sortBy(column)', ng-repeat='column in columns')
+    div {[column.title]}
+tr(ng-show='show_filter')
+  th.filter(ng-repeat='column in columns')
+    form(ng-submit='doFilter()')
+      // Hidden submit for ENTER key work
+      input(type='submit', style='position: absolute; left: -9999px; width: 1px; height: 1px;')
+      div(ng-repeat='(name, filter) in column.filter')
+        input.input-filter(type='text', ng-model='params.filter[name]', ng-show='filter == \'text\'')
+        select.filter.filter-select(ng-options='data.id as data.title for data in column.data', ng-model='params.filter[name]', ng-show='filter == \'select\'')
+        input(type='text', date-range='date-range', ng-model='params.filter[name]', ng-show='filter == \'date\'')
+        button.btn.btn-primary.btn-block(ng-click='doFilter()', ng-show='filter == \'button\'') Filter