Skip to content

Commit 5499812

Browse files
author
zensations
committed
Missed files during last commit.
1 parent 0edbdaa commit 5499812

File tree

3 files changed

+267
-0
lines changed

3 files changed

+267
-0
lines changed

css/formawesome.theme.css

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
.form-item {
2+
position: relative;
3+
}
4+
5+
/* ====================================================================== */
6+
/* Inline error messages. */
7+
/* ====================================================================== */
8+
.form-error-message {
9+
background: #fef5f1;
10+
color: #8c2e0b;
11+
border: 1px solid #ed541d;
12+
bottom: 100%;
13+
margin-bottom: -0.5em;
14+
padding: 0.5em;
15+
}
16+
17+
/* ====================================================================== */
18+
/* styleable checkboxes and radio buttons */
19+
/* ====================================================================== */
20+
.form-type-radio label, .form-type-checkbox label {
21+
margin-bottom: 0;
22+
}
23+
24+
.form-selectable {
25+
vertical-align: middle;
26+
display: inline-block;
27+
width: 1em;
28+
height: 1em;
29+
background: #CCC;
30+
line-height: 1em;
31+
text-align: center;
32+
position: relative;
33+
}
34+
35+
.form-selectable:before {
36+
text-align: center;
37+
display: none;
38+
}
39+
40+
.form-filled .form-selectable:before {
41+
display: block;
42+
}
43+
44+
.form-type-checkbox .form-selectable:before {
45+
content: '\2716';
46+
}
47+
48+
.form-type-radio .form-selectable:before {
49+
content: '\25CF';
50+
}
51+
52+
/**
53+
* Radios are rounded. Yay!
54+
*/
55+
.form-type-radio .form-selectable {
56+
-webkit-border-radius: 1em;
57+
-moz-border-radius: 1em;
58+
-o-border-radius: 1em;
59+
-ms-border-radius: 1em;
60+
border-radius: 1em;
61+
}
62+
63+
/**
64+
* Stretch the actual input element to the full size of the indicator and
65+
* hide it with opacity 0.
66+
*/
67+
.form-selectable input {
68+
position: absolute;
69+
top: 0;
70+
left: 0;
71+
right: 0;
72+
bottom: 0;
73+
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
74+
filter: alpha(opacity=0);
75+
-moz-opacity: 0.0;
76+
-khtml-opacity: 0.0;
77+
z-index: 5;
78+
opacity: 0.0;
79+
}

js/formawesome.hint.js

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
/**
2+
* @file
3+
* jQuery plugin for attachable drupal form hints.
4+
*/
5+
(function($){
6+
$.fn.attachHint = function(callback) {
7+
$(this).each(function(){
8+
var $hint = $('<div class="form-hint"></div>');
9+
var added_classes = [];
10+
var $wrapper = $(this).parents('.form-item').first();
11+
$wrapper.append($hint);
12+
$(this).bind('keyup focus blur', function(){
13+
var value = $(this).val();
14+
var result = callback(value);
15+
16+
if (typeof result === 'string') {
17+
result = { text: result, class: false };
18+
}
19+
else if (typeof result !== 'object') {
20+
result = { text: false, class: false };
21+
}
22+
23+
if (result.text === value) {
24+
result.text = false;
25+
}
26+
27+
var c = false;
28+
while (c = added_classes.pop()) {
29+
$wrapper.removeClass(c);
30+
}
31+
32+
if (result.text) {
33+
$hint.text(result.text);
34+
$wrapper.removeClass('hint-hidden');
35+
}
36+
else {
37+
$hint.text('');
38+
$wrapper.addClass('hint-hidden');
39+
}
40+
41+
if (result.class) {
42+
if (typeof result.class !== 'array') {
43+
result.class = [result.class];
44+
}
45+
$.each(result.class, function (i, c) {
46+
added_classes.push(c);
47+
$wrapper.addClass(c);
48+
});
49+
}
50+
});
51+
});
52+
};
53+
}(jQuery));

js/formawesome.status.js

+135
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
/**
2+
* @file
3+
* Drupal behavior to pass form elements status changes to the form wrapper
4+
* for styling purposes.
5+
*/
6+
(function($, Drupal) {
7+
/**
8+
* Add classes for form element status to its wrapper div for styling
9+
* purposes.
10+
*
11+
* - formawesome-focused
12+
* - formawesome-filled
13+
*/
14+
Drupal.behaviors.formawesome_status = {
15+
attach: function(context, settings) {
16+
$('input, textarea, select', context).once(function() {
17+
var $input = $(this);
18+
var type = $input.attr('type');
19+
var hovered = false;
20+
var focused = false;
21+
22+
// Early abort if element is without status.
23+
if ($.inArray(type, ['submit', 'reset', 'button', 'image', 'hidden']) > -1) {
24+
return;
25+
}
26+
27+
// Search the according wrapper element.
28+
var $wrapper = $input.parents('.form-item').first();
29+
if ($wrapper.length === 0) {
30+
return;
31+
}
32+
33+
/**
34+
* Get change events and set filled-status on $wrapper.
35+
*/
36+
var change = function() {
37+
if (type === 'radio' || type == 'checkbox') {
38+
if ($input.is(':checked')) {
39+
if (type === 'radio') {
40+
$input.parents('.form-type-radios').find('.form-type-radio').removeClass('form-filled');
41+
}
42+
$wrapper.addClass('form-filled');
43+
}
44+
else {
45+
$wrapper.removeClass('form-filled');
46+
}
47+
}
48+
else {
49+
if ($input.val() !== '') {
50+
$wrapper.addClass('form-filled');
51+
}
52+
else {
53+
$wrapper.removeClass('form-filled');
54+
}
55+
}
56+
};
57+
58+
// Attach change event handler.
59+
$input.change(change);
60+
$input.keyup(change);
61+
62+
// Trigger an initial change for prefilled elements.
63+
change();
64+
65+
/**
66+
* Simple callback to refresh current focused state.
67+
*/
68+
var refreshFocus = function () {
69+
if (focused || hovered) {
70+
$wrapper.addClass('form-focused');
71+
}
72+
else {
73+
$wrapper.removeClass('form-focused');
74+
}
75+
};
76+
77+
// Act appropriatly on focus, hover and blur events.
78+
$input.focusin(function() {
79+
focused = true;
80+
refreshFocus();
81+
});
82+
$input.focusout(function() {
83+
focused = false;
84+
refreshFocus();
85+
});
86+
87+
$wrapper.hover(function() {
88+
hovered = true;
89+
refreshFocus();
90+
}, function() {
91+
hovered = false;
92+
refreshFocus();
93+
});
94+
95+
var checkEnabled = function () {
96+
// sync enabled state
97+
var disabled = $input.attr("disabled");
98+
if (disabled === undefined) disabled = false;
99+
if (disabled) {
100+
$wrapper.addClass('form-disabled');
101+
}
102+
else {
103+
$wrapper.removeClass('form-disabled');
104+
}
105+
106+
var readonly = $input.attr("readonly");
107+
if (readonly === undefined) readonly = false;
108+
if (readonly) {
109+
$wrapper.addClass('form-readonly');
110+
}
111+
else {
112+
$wrapper.removeClass('form-readonly');
113+
}
114+
};
115+
116+
// mozilla and IE
117+
$(this).bind("propertychange DOMAttrModified", checkEnabled);
118+
119+
// hold onto a reference of the callback to work around a chromium bug
120+
if (this.mutationCallback === undefined) {
121+
this.mutationCallback = function (mutations) {
122+
mutations.forEach(checkEnabled);
123+
}
124+
}
125+
126+
// safari and chrome
127+
if (typeof WebKitMutationObserver !== "undefined") {
128+
if (this.propertyObserver) { delete this.propertyObserver; this.propertyObserver = null; }
129+
this.propertyObserver = new WebKitMutationObserver(this.mutationCallback);
130+
this.propertyObserver.observe(this, { attributes:true, subtree:false });
131+
}
132+
});
133+
}
134+
};
135+
}(jQuery, Drupal));

0 commit comments

Comments
 (0)