Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
project
drupal
Commits
00175843
Commit
00175843
authored
Aug 01, 2012
by
Nathaniel Catchpole
Browse files
Issue
#1684830
by nod_, tim.plunkett: JSHint color.
parent
7a38d82d
Changes
2
Hide whitespace changes
Inline
Side-by-side
core/modules/color/color.js
View file @
00175843
...
...
@@ -9,7 +9,7 @@
Drupal
.
behaviors
.
color
=
{
attach
:
function
(
context
,
settings
)
{
var
i
,
j
,
colors
,
field_name
;
var
i
,
j
,
colors
;
// This behavior attaches by ID, so is only valid once on a page.
var
form
=
$
(
context
).
find
(
'
#system-theme-settings .color-form
'
).
once
(
'
color
'
);
if
(
form
.
length
===
0
)
{
...
...
@@ -27,7 +27,9 @@ Drupal.behaviors.color = {
// Decode reference colors to HSL.
var
reference
=
settings
.
color
.
reference
;
for
(
i
in
reference
)
{
reference
[
i
]
=
farb
.
RGBToHSL
(
farb
.
unpack
(
reference
[
i
]));
if
(
reference
.
hasOwnProperty
(
i
))
{
reference
[
i
]
=
farb
.
RGBToHSL
(
farb
.
unpack
(
reference
[
i
]));
}
}
// Build a preview.
...
...
@@ -35,18 +37,20 @@ Drupal.behaviors.color = {
var
width
=
[];
// Loop through all defined gradients.
for
(
i
in
settings
.
gradients
)
{
// Add element to display the gradient.
$
(
'
#preview
'
).
once
(
'
color
'
).
append
(
'
<div id="gradient-
'
+
i
+
'
"></div>
'
);
var
gradient
=
$
(
'
#preview #gradient-
'
+
i
);
// Add height of current gradient to the list (divided by 10).
height
.
push
(
parseInt
(
gradient
.
css
(
'
height
'
),
10
)
/
10
);
// Add width of current gradient to the list (divided by 10).
width
.
push
(
parseInt
(
gradient
.
css
(
'
width
'
),
10
)
/
10
);
// Add rows (or columns for horizontal gradients).
// Each gradient line should have a height (or width for horizontal
// gradients) of 10px (because we divided the height/width by 10 above).
for
(
j
=
0
;
j
<
(
settings
.
gradients
[
i
][
'
direction
'
]
===
'
vertical
'
?
height
[
i
]
:
width
[
i
]);
++
j
)
{
gradient
.
append
(
'
<div class="gradient-line"></div>
'
);
if
(
settings
.
gradients
.
hasOwnProperty
(
i
))
{
// Add element to display the gradient.
$
(
'
#preview
'
).
once
(
'
color
'
).
append
(
'
<div id="gradient-
'
+
i
+
'
"></div>
'
);
var
gradient
=
$
(
'
#preview #gradient-
'
+
i
);
// Add height of current gradient to the list (divided by 10).
height
.
push
(
parseInt
(
gradient
.
css
(
'
height
'
),
10
)
/
10
);
// Add width of current gradient to the list (divided by 10).
width
.
push
(
parseInt
(
gradient
.
css
(
'
width
'
),
10
)
/
10
);
// Add rows (or columns for horizontal gradients).
// Each gradient line should have a height (or width for horizontal
// gradients) of 10px (because we divided the height/width by 10 above).
for
(
j
=
0
;
j
<
(
settings
.
gradients
[
i
].
direction
===
'
vertical
'
?
height
[
i
]
:
width
[
i
]);
++
j
)
{
gradient
.
append
(
'
<div class="gradient-line"></div>
'
);
}
}
}
...
...
@@ -56,8 +60,10 @@ Drupal.behaviors.color = {
if
(
colorScheme
!==
''
&&
schemes
[
colorScheme
])
{
// Get colors of active scheme.
colors
=
schemes
[
colorScheme
];
for
(
field_name
in
colors
)
{
callback
(
$
(
'
#edit-palette-
'
+
field_name
),
colors
[
field_name
],
false
,
true
);
for
(
var
fieldName
in
colors
)
{
if
(
colors
.
hasOwnProperty
(
fieldName
))
{
callback
(
$
(
'
#edit-palette-
'
+
fieldName
),
colors
[
fieldName
],
false
,
true
);
}
}
preview
();
}
...
...
@@ -80,6 +86,7 @@ Drupal.behaviors.color = {
* shift_color(d, b, a) === c.
*/
function
shift_color
(
given
,
ref1
,
ref2
)
{
var
d
;
// Convert to HSL.
given
=
farb
.
RGBToHSL
(
farb
.
unpack
(
given
));
...
...
@@ -91,7 +98,7 @@ Drupal.behaviors.color = {
given
[
1
]
=
ref2
[
1
];
}
else
{
var
d
=
ref1
[
1
]
/
ref2
[
1
];
d
=
ref1
[
1
]
/
ref2
[
1
];
if
(
d
>
1
)
{
given
[
1
]
/=
d
;
}
...
...
@@ -105,7 +112,7 @@ Drupal.behaviors.color = {
given
[
2
]
=
ref2
[
2
];
}
else
{
var
d
=
ref1
[
2
]
/
ref2
[
2
];
d
=
ref1
[
2
]
/
ref2
[
2
];
if
(
d
>
1
)
{
given
[
2
]
/=
d
;
}
...
...
@@ -136,12 +143,16 @@ Drupal.behaviors.color = {
if
(
propagate
)
{
i
=
input
.
i
;
for
(
j
=
i
+
1
;
;
++
j
)
{
if
(
!
locks
[
j
-
1
]
||
$
(
locks
[
j
-
1
]).
is
(
'
.unlocked
'
))
break
;
if
(
!
locks
[
j
-
1
]
||
$
(
locks
[
j
-
1
]).
is
(
'
.unlocked
'
))
{
break
;
}
matched
=
shift_color
(
color
,
reference
[
input
.
key
],
reference
[
inputs
[
j
].
key
]);
callback
(
inputs
[
j
],
matched
,
false
);
}
for
(
j
=
i
-
1
;
;
--
j
)
{
if
(
!
locks
[
j
]
||
$
(
locks
[
j
]).
is
(
'
.unlocked
'
))
break
;
if
(
!
locks
[
j
]
||
$
(
locks
[
j
]).
is
(
'
.unlocked
'
))
{
break
;
}
matched
=
shift_color
(
color
,
reference
[
input
.
key
],
reference
[
inputs
[
j
].
key
]);
callback
(
inputs
[
j
],
matched
,
false
);
}
...
...
@@ -169,17 +180,19 @@ Drupal.behaviors.color = {
/**
* Focuses Farbtastic on a particular field.
*/
function
focus
()
{
var
input
=
this
;
function
focus
(
e
)
{
var
input
=
e
.
target
;
// Remove old bindings.
focused
&&
$
(
focused
).
unbind
(
'
keyup
'
,
farb
.
updateValue
)
if
(
focused
)
{
$
(
focused
).
unbind
(
'
keyup
'
,
farb
.
updateValue
)
.
unbind
(
'
keyup
'
,
preview
).
unbind
(
'
keyup
'
,
resetScheme
)
.
parent
().
removeClass
(
'
item-selected
'
);
}
// Add new bindings.
focused
=
this
;
focused
=
input
;
farb
.
linkTo
(
function
(
color
)
{
callback
(
input
,
color
,
true
,
false
);
});
farb
.
setColor
(
this
.
value
);
farb
.
setColor
(
input
.
value
);
$
(
focused
).
keyup
(
farb
.
updateValue
).
keyup
(
preview
).
keyup
(
resetScheme
)
.
parent
().
addClass
(
'
item-selected
'
);
}
...
...
@@ -218,7 +231,7 @@ Drupal.behaviors.color = {
);
$
(
this
).
after
(
lock
);
locks
.
push
(
lock
);
}
;
}
// Add hook.
var
hook
=
$
(
'
<div class="hook"></div>
'
);
...
...
@@ -234,7 +247,7 @@ Drupal.behaviors.color = {
form
.
find
(
'
#palette label
'
);
// Focus first color.
focus
.
call
(
inputs
[
0
]);
inputs
[
0
]
.
focus
(
);
// Render preview.
preview
();
...
...
core/modules/color/preview.js
View file @
00175843
...
...
@@ -16,24 +16,32 @@
form
.
find
(
'
#text
'
).
css
(
'
color
'
,
form
.
find
(
'
#palette input[name="palette[text]"]
'
).
val
());
form
.
find
(
'
#text a, #text h2
'
).
css
(
'
color
'
,
form
.
find
(
'
#palette input[name="palette[link]"]
'
).
val
());
function
gradientLineColor
(
i
,
element
)
{
for
(
var
k
in
accum
)
{
if
(
accum
.
hasOwnProperty
(
k
))
{
accum
[
k
]
+=
delta
[
k
];
}
}
element
.
style
.
backgroundColor
=
farb
.
pack
(
accum
);
}
// Set up gradients if there are some.
var
color_start
,
color_end
;
for
(
var
i
in
settings
.
gradients
)
{
color_start
=
farb
.
unpack
(
form
.
find
(
'
#palette input[name="palette[
'
+
settings
.
gradients
[
i
][
'
colors
'
][
0
]
+
'
]"]
'
).
val
());
color_end
=
farb
.
unpack
(
form
.
find
(
'
#palette input[name="palette[
'
+
settings
.
gradients
[
i
][
'
colors
'
][
1
]
+
'
]"]
'
).
val
());
if
(
color_start
&&
color_end
)
{
var
delta
=
[];
for
(
var
j
in
color_start
)
{
delta
[
j
]
=
(
color_end
[
j
]
-
color_start
[
j
])
/
(
settings
.
gradients
[
i
][
'
vertical
'
]
?
height
[
i
]
:
width
[
i
]);
}
var
accum
=
color_start
;
// Render gradient lines.
form
.
find
(
'
#gradient-
'
+
i
+
'
> div
'
).
each
(
function
()
{
for
(
j
in
accum
)
{
accum
[
j
]
+=
delta
[
j
];
if
(
settings
.
gradients
.
hasOwnProperty
(
i
))
{
color_start
=
farb
.
unpack
(
form
.
find
(
'
#palette input[name="palette[
'
+
settings
.
gradients
[
i
].
colors
[
0
]
+
'
]"]
'
).
val
());
color_end
=
farb
.
unpack
(
form
.
find
(
'
#palette input[name="palette[
'
+
settings
.
gradients
[
i
].
colors
[
1
]
+
'
]"]
'
).
val
());
if
(
color_start
&&
color_end
)
{
var
delta
=
[];
for
(
var
j
in
color_start
)
{
if
(
color_start
.
hasOwnProperty
(
j
))
{
delta
[
j
]
=
(
color_end
[
j
]
-
color_start
[
j
])
/
(
settings
.
gradients
[
i
].
vertical
?
height
[
i
]
:
width
[
i
]);
}
}
this
.
style
.
backgroundColor
=
farb
.
pack
(
accum
);
});
var
accum
=
color_start
;
// Render gradient lines.
form
.
find
(
'
#gradient-
'
+
i
+
'
> div
'
).
each
(
gradientLineColor
);
}
}
}
}
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment