root / drupal7 / misc / machine-name.js @ 7c856df4
1 | 85ad3d82 | Assos Assos | (function ($) { |
---|---|---|---|
2 | |||
3 | /**
|
||
4 | * Attach the machine-readable name form element behavior.
|
||
5 | */
|
||
6 | Drupal.behaviors.machineName = { |
||
7 | /**
|
||
8 | * Attaches the behavior.
|
||
9 | *
|
||
10 | * @param settings.machineName
|
||
11 | * A list of elements to process, keyed by the HTML ID of the form element
|
||
12 | * containing the human-readable value. Each element is an object defining
|
||
13 | * the following properties:
|
||
14 | * - target: The HTML ID of the machine name form element.
|
||
15 | * - suffix: The HTML ID of a container to show the machine name preview in
|
||
16 | * (usually a field suffix after the human-readable name form element).
|
||
17 | * - label: The label to show for the machine name preview.
|
||
18 | * - replace_pattern: A regular expression (without modifiers) matching
|
||
19 | * disallowed characters in the machine name; e.g., '[^a-z0-9]+'.
|
||
20 | * - replace: A character to replace disallowed characters with; e.g., '_'
|
||
21 | * or '-'.
|
||
22 | * - standalone: Whether the preview should stay in its own element rather
|
||
23 | * than the suffix of the source element.
|
||
24 | * - field_prefix: The #field_prefix of the form element.
|
||
25 | * - field_suffix: The #field_suffix of the form element.
|
||
26 | */
|
||
27 | attach: function (context, settings) { |
||
28 | var self = this; |
||
29 | $.each(settings.machineName, function (source_id, options) { |
||
30 | var $source = $(source_id, context).addClass('machine-name-source'); |
||
31 | var $target = $(options.target, context).addClass('machine-name-target'); |
||
32 | var $suffix = $(options.suffix, context); |
||
33 | var $wrapper = $target.closest('.form-item'); |
||
34 | // All elements have to exist.
|
||
35 | if (!$source.length || !$target.length || !$suffix.length || !$wrapper.length) { |
||
36 | return;
|
||
37 | } |
||
38 | // Skip processing upon a form validation error on the machine name.
|
||
39 | if ($target.hasClass('error')) { |
||
40 | return;
|
||
41 | } |
||
42 | // Figure out the maximum length for the machine name.
|
||
43 | options.maxlength = $target.attr('maxlength'); |
||
44 | // Hide the form item container of the machine name form element.
|
||
45 | $wrapper.hide();
|
||
46 | // Determine the initial machine name value. Unless the machine name form
|
||
47 | // element is disabled or not empty, the initial default value is based on
|
||
48 | // the human-readable form element value.
|
||
49 | if ($target.is(':disabled') || $target.val() != '') { |
||
50 | var machine = $target.val(); |
||
51 | } |
||
52 | else {
|
||
53 | var machine = self.transliterate($source.val(), options); |
||
54 | } |
||
55 | // Append the machine name preview to the source field.
|
||
56 | var $preview = $('<span class="machine-name-value">' + options.field_prefix + Drupal.checkPlain(machine) + options.field_suffix + '</span>'); |
||
57 | $suffix.empty();
|
||
58 | if (options.label) {
|
||
59 | $suffix.append(' ').append('<span class="machine-name-label">' + options.label + ':</span>'); |
||
60 | } |
||
61 | $suffix.append(' ').append($preview); |
||
62 | |||
63 | // If the machine name cannot be edited, stop further processing.
|
||
64 | if ($target.is(':disabled')) { |
||
65 | return;
|
||
66 | } |
||
67 | |||
68 | // If it is editable, append an edit link.
|
||
69 | var $link = $('<span class="admin-link"><a href="#">' + Drupal.t('Edit') + '</a></span>') |
||
70 | .click(function () {
|
||
71 | $wrapper.show();
|
||
72 | $target.focus();
|
||
73 | $suffix.hide();
|
||
74 | $source.unbind('.machineName'); |
||
75 | return false; |
||
76 | }); |
||
77 | $suffix.append(' ').append($link); |
||
78 | |||
79 | // Preview the machine name in realtime when the human-readable name
|
||
80 | // changes, but only if there is no machine name yet; i.e., only upon
|
||
81 | // initial creation, not when editing.
|
||
82 | if ($target.val() == '') { |
||
83 | $source.bind('keyup.machineName change.machineName input.machineName', function () { |
||
84 | machine = self.transliterate($(this).val(), options); |
||
85 | // Set the machine name to the transliterated value.
|
||
86 | if (machine != '') { |
||
87 | if (machine != options.replace) {
|
||
88 | $target.val(machine);
|
||
89 | $preview.html(options.field_prefix + Drupal.checkPlain(machine) + options.field_suffix);
|
||
90 | } |
||
91 | $suffix.show();
|
||
92 | } |
||
93 | else {
|
||
94 | $suffix.hide();
|
||
95 | $target.val(machine);
|
||
96 | $preview.empty();
|
||
97 | } |
||
98 | }); |
||
99 | // Initialize machine name preview.
|
||
100 | $source.keyup();
|
||
101 | } |
||
102 | }); |
||
103 | }, |
||
104 | |||
105 | /**
|
||
106 | * Transliterate a human-readable name to a machine name.
|
||
107 | *
|
||
108 | * @param source
|
||
109 | * A string to transliterate.
|
||
110 | * @param settings
|
||
111 | * The machine name settings for the corresponding field, containing:
|
||
112 | * - replace_pattern: A regular expression (without modifiers) matching
|
||
113 | * disallowed characters in the machine name; e.g., '[^a-z0-9]+'.
|
||
114 | * - replace: A character to replace disallowed characters with; e.g., '_'
|
||
115 | * or '-'.
|
||
116 | * - maxlength: The maximum length of the machine name.
|
||
117 | *
|
||
118 | * @return
|
||
119 | * The transliterated source string.
|
||
120 | */
|
||
121 | transliterate: function (source, settings) { |
||
122 | var rx = new RegExp(settings.replace_pattern, 'g'); |
||
123 | return source.toLowerCase().replace(rx, settings.replace).substr(0, settings.maxlength); |
||
124 | } |
||
125 | }; |
||
126 | |||
127 | })(jQuery); |