directives.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. /*jshint globalstrict:true */
  2. /*global angular:true */
  3. 'use strict';
  4. angular.module('kibana-dash.directives', [])
  5. .directive('panel', function($compile) {
  6. return {
  7. restrict: 'A',
  8. compile: function(element, attrs) {
  9. return function(scope, element, attrs) {
  10. scope.$watch(function () {
  11. return (attrs.panel && scope.index) ? true : false;
  12. }, function (ready) {
  13. if (ready) {
  14. $compile("<div "+attrs.panel+" params={{panel}} style='height:{{row.height}}'></div>")(scope).appendTo(element);
  15. }
  16. });
  17. }
  18. }
  19. }
  20. })
  21. .directive('upload', function(){
  22. return {
  23. restrict: 'A',
  24. link: function(scope, elem, attrs) {
  25. console.log(elem);
  26. function file_selected(evt) {
  27. var files = evt.target.files; // FileList object
  28. // files is a FileList of File objects. List some properties.
  29. var output = [];
  30. for (var i = 0, f; f = files[i]; i++) {
  31. var reader = new FileReader();
  32. reader.onload = (function(theFile) {
  33. return function(e) {
  34. // Render thumbnail.
  35. scope.dashboards = JSON.parse(e.target.result)
  36. scope.$apply();
  37. };
  38. })(f);
  39. reader.readAsText(f);
  40. }
  41. }
  42. // Check for the various File API support.
  43. if (window.File && window.FileReader && window.FileList && window.Blob) {
  44. // Something
  45. document.getElementById('upload').addEventListener('change', file_selected, false);
  46. } else {
  47. alert('Sorry, the HTML5 File APIs are not fully supported in this browser.');
  48. }
  49. }
  50. }
  51. })
  52. .directive('datepicker', function(){
  53. return {
  54. restrict: 'A',
  55. require: 'ngModel',
  56. link: function(scope, elem, attrs) {
  57. elem.datepicker({
  58. noDefault: false, // set this to true if you don't want the current date inserted if the value-attribute is empty
  59. format: 'mm/dd/yyyy hh:ii:ss'
  60. });
  61. }
  62. };
  63. })
  64. .directive('date', function(dateFilter) {
  65. return {
  66. require: 'ngModel',
  67. link: function(scope, elm, attrs, ctrl) {
  68. var dateFormat = attrs['date'] || 'yyyy-MM-dd HH:mm:ss';
  69. var minDate = Date.parse(attrs['min']) || 0;
  70. var maxDate = Date.parse(attrs['max']) || 9007199254740992;
  71. ctrl.$parsers.unshift(function(viewValue) {
  72. var parsedDateMilissec = Date.parse(viewValue);
  73. if (parsedDateMilissec > 0) {
  74. if (parsedDateMilissec >= minDate && parsedDateMilissec <= maxDate) {
  75. ctrl.$setValidity('date', true);
  76. return new Date(parsedDateMilissec);
  77. }
  78. }
  79. // in all other cases it is invalid, return undefined (no model update)
  80. ctrl.$setValidity('date', false);
  81. return undefined;
  82. });
  83. ctrl.$formatters.unshift(function(modelValue) {
  84. return dateFilter(modelValue, dateFormat);
  85. });
  86. }
  87. };
  88. });