Project

General

Profile

0001-misc-don-t-add-a-js-datepicker-on-top-of-HTML5-date-.patch

Frédéric Péters, 11 Sep 2019 11:36 AM

Download (7.35 KB)

View differences:

Subject: [PATCH] misc: don't add a js datepicker on top of HTML5 date inputs
 (#35997)

 bijoe/static/js/addclear.js         | 175 ----------------------------
 bijoe/static/js/bijoe.js            |  13 ---
 bijoe/templates/bijoe/cube.html     |   1 -
 bijoe/templates/bijoe/cube_raw.html |   1 -
 4 files changed, 190 deletions(-)
 delete mode 100644 bijoe/static/js/addclear.js
bijoe/static/js/addclear.js
1
/*!
2
 Author: Stephen Korecky
3
 Website: http://stephenkorecky.com
4
 Plugin Website: http://github.com/skorecky/Add-Clear
5
 Version: 2.0.6
6

  
7
 The MIT License (MIT)
8

  
9
 Copyright (c) 2015 Stephen Korecky
10

  
11
 Permission is hereby granted, free of charge, to any person obtaining a copy
12
 of this software and associated documentation files (the "Software"), to deal
13
 in the Software without restriction, including without limitation the rights
14
 to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
15
 copies of the Software, and to permit persons to whom the Software is
16
 furnished to do so, subject to the following conditions:
17

  
18
 The above copyright notice and this permission notice shall be included in all
19
 copies or substantial portions of the Software.
20

  
21
 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
22
 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
23
 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
24
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
25
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
26
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
27
 SOFTWARE.
28
*/
29

  
30
;(function($, window, document, undefined) {
31

  
32
	// Create the defaults once
33
	var pluginName = "addClear",
34
		defaults = {
35
			closeSymbol: "✖",
36
			color: "#CCC",
37
			top: 1,
38
			right: 4,
39
			returnFocus: false,
40
			showOnLoad: false,
41
			onClear: null,
42
			hideOnBlur: false,
43
			tabbable: true,
44
			paddingRight: '20px'
45
		};
46

  
47
	// The actual plugin constructor
48
	function Plugin(element, options) {
49
		this.element = element;
50

  
51
		this.options = $.extend({}, defaults, options);
52

  
53
		this._defaults = defaults;
54
		this._name = pluginName;
55

  
56
		this.init();
57
	}
58

  
59
	Plugin.prototype = {
60

  
61
		init: function() {
62
			var $this = $(this.element),
63
					$clearButton,
64
					me = this,
65
					options = this.options;
66

  
67
			$this.wrap("<span style='position:relative;' class='add-clear-span'></span>");
68
			var tabIndex = options.tabbable ? "" : " tabindex='-1'";
69
			$clearButton = $("<a href='#clear' style='display: none;'" + tabIndex + ">" + options.closeSymbol + "</a>");
70
			$this.after($clearButton);
71
			$this.next().css({
72
				color: options.color,
73
				'text-decoration': 'none',
74
				display: 'none',
75
				'line-height': 1,
76
				overflow: 'hidden',
77
				position: 'absolute',
78
				right: options.right,
79
				top: options.top
80
			}, this);
81

  
82
			if (options.paddingRight) {
83
				$this.css({
84
					'padding-right': options.paddingRight
85
				});
86
			}
87

  
88
			if ($this.val().length >= 1 && options.showOnLoad === true) {
89
				$clearButton.css({display: 'block'});
90
			}
91

  
92
			$this.focus(function() {
93
				if ($(this).val().length >= 1) {
94
					$clearButton.css({display: 'block'});
95
				}
96
			});
97
			$this.change(function() {
98
				if ($(this).val().length >= 1) {
99
					$clearButton.css({display: 'block'});
100
				}
101
			});
102

  
103
			$this.blur(function(e) {
104
				if (options.hideOnBlur) {
105
					setTimeout(function() {
106
						var relatedTarget = e.relatedTarget || e.explicitOriginalTarget || document.activeElement;
107
						if (relatedTarget !== $clearButton[0]) {
108
							$clearButton.css({display: 'none'});
109
						}
110
					}, 0);
111
				}
112
			});
113

  
114
			var handleUserInput = function() {
115
				if ($(this).val().length >= 1) {
116
					$clearButton.css({display: 'block'});
117
				} else {
118
					$clearButton.css({display: 'none'});
119
				}
120
			};
121

  
122
			var handleInput = function () {
123
			    $this.off('keyup', handleUserInput);
124
				$this.off('cut', handleUserInput);
125
				handleInput = handleUserInput;
126
				handleUserInput.call(this);
127
			};
128

  
129
			$this.on('keyup', handleUserInput);
130

  
131
			$this.on('cut', function () {
132
				var self = this;
133
				setTimeout(function () {
134
					handleUserInput.call(self);
135
				}, 0);
136
			});
137

  
138
			$this.on('input', function () {
139
				handleInput.call(this);
140
			});
141

  
142
			if (options.hideOnBlur) {
143
				$clearButton.blur(function () {
144
					$clearButton.css({display: 'none'});
145
				});
146
			}
147

  
148
			$clearButton.click(function(e) {
149
				var $input = $(me.element);
150
				$input.val("");
151
				$(this).css({display: 'none'});
152
				if (options.returnFocus === true) {
153
					$input.focus();
154
				} else {
155
                                        $input.trigger('change');
156
                                }
157
				if (options.onClear) {
158
					options.onClear($input);
159
				}
160
				e.preventDefault();
161
			});
162
		}
163

  
164
	};
165

  
166
	$.fn[pluginName] = function(options) {
167
		return this.each(function() {
168
			if (!$.data(this, "plugin_" + pluginName)) {
169
				$.data(this, "plugin_" + pluginName,
170
					new Plugin(this, options));
171
			}
172
		});
173
	};
174

  
175
})(jQuery, window, document);
bijoe/static/js/bijoe.js
367 367

  
368 368
/* jQuery event handlers and widget setup */
369 369
$(function () {
370
  /* Setup datepicker on input fields */
371
  if ($.datepicker) {
372
    $('input[type=date]').datepicker({
373
      dateFormat: 'yy-mm-dd',
374
      changeMonth: true,
375
      changeYear: true,
376
    },
377
    $.datepicker.regional['fr']);
378
  }
379

  
380 370
  /* Submit after 300ms on any change to form input */
381 371
  $('input, select').on('change', function () {
382 372
    setTimeout(function () {
......
389 379
    }, 300);
390 380
    return true;
391 381
  });
392

  
393
  /* Add clear button to date fields */
394
  $('input[type=date]').addClear();
395 382
})
bijoe/templates/bijoe/cube.html
5 5
  {% import_django_select2_js_css %}
6 6
  {{ block.super }}
7 7
  <script src="{% static "js/jquery.form.js" %}"></script>
8
  <script src="{% static "js/addclear.js" %}"></script>
9 8
  <script src="{% static "xstatic/ChartNew.js" %}"></script>
10 9
  <script src="{% static "js/bijoe.js" %}"></script>
11 10
  {{ form.media.css }}
bijoe/templates/bijoe/cube_raw.html
5 5
    <link href="{% static "css/bijoe.css" %}" rel="stylesheet">
6 6
    <script src="{% xstatic 'jquery' 'jquery.min.js' %}"></script>
7 7
    <script src="{% static "js/jquery.form.js" %}"></script>
8
    <script src="{% static "js/addclear.js" %}"></script>
9 8
    <script src="{% static "xstatic/ChartNew.js" %}"></script>
10 9
    <script src="{% static "js/bijoe.js" %}"></script>
11 10
    {{ form.media.css }}
12
-