Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
V
views_highlight_past_events
Manage
Activity
Members
Labels
Plan
Wiki
Custom issue tracker
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Locked files
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Model registry
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Code review analytics
Insights
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Terms and privacy
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
project
views_highlight_past_events
Commits
468b11a4
Commit
468b11a4
authored
5 months ago
by
Andrey Vitushkin
Browse files
Options
Downloads
Patches
Plain Diff
Issue
#3471618
: Only affected date field highlight
parent
348382e6
No related branches found
No related tags found
No related merge requests found
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
js/views-highlight-past-events.js
+23
-9
23 additions, 9 deletions
js/views-highlight-past-events.js
views_highlight_past_events.info.yml
+1
-1
1 addition, 1 deletion
views_highlight_past_events.info.yml
views_highlight_past_events.module
+19
-4
19 additions, 4 deletions
views_highlight_past_events.module
with
43 additions
and
14 deletions
js/views-highlight-past-events.js
+
23
−
9
View file @
468b11a4
...
...
@@ -11,6 +11,7 @@
return
;
}
const
highlightType
=
settings
[
'
views_highlight_past_events
'
][
'
highlight_type
'
];
const
color
=
settings
[
'
views_highlight_past_events
'
][
'
color
'
];
const
customClass
=
settings
[
'
views_highlight_past_events
'
][
'
custom_class
'
];
if
(
color
===
''
&&
customClass
===
''
)
{
...
...
@@ -37,13 +38,12 @@
}
/**
* If the "Add a custom class to the view row if the date is in the
* past" option is set, then add a custom CSS class to the view row
* so that a user can highlight it with CSS. The CSS class is added to
* the parent element of the date field.
* If the "Highlight the view row if the date is in the past" option is
* checked then set the background-color of the view row to gighlight it.
* The background-color is set on the parent element of the date field.
* If the "Add a custom class to date fields or to view rows if dates are
* in the past" option is set, then add a custom CSS class to the view
* field or to the row (depend on the settings) so that a user can
* highlight it with CSS. If the "Highlight past dates" option is checked
* then set the background-color of the view field or the view row
* (depend on the settings) to highlight it.
*/
function
highLightPastEvents
()
{
// The timestamp of the current time in seconds.
...
...
@@ -51,10 +51,24 @@
for
(
let
i
=
0
;
i
<
eventTimestamps
.
length
;
i
++
)
{
if
(
eventTimestamps
[
i
]
&&
eventTimestamps
[
i
]
<=
currentTimestamp
)
{
if
(
color
)
{
dateElements
[
i
].
parentElement
.
style
.
backgroundColor
=
color
;
// Highlight only the date field.
if
(
highlightType
===
'
highlight_field
'
)
{
dateElements
[
i
].
setAttribute
(
'
style
'
,
'
background-color:
'
+
color
);
}
// Highlight the entire row
else
if
(
highlightType
===
'
highlight_row
'
)
{
dateElements
[
i
].
parentElement
.
style
.
backgroundColor
=
color
;
}
}
if
(
customClass
)
{
dateElements
[
i
].
parentElement
.
classList
.
add
(
customClass
);
// Add a custom class to the date field.
if
(
highlightType
===
'
highlight_field
'
)
{
dateElements
[
i
].
classList
.
add
(
customClass
);
}
// Add a custom class to the entire row.
else
if
(
highlightType
===
'
highlight_row
'
)
{
dateElements
[
i
].
parentElement
.
classList
.
add
(
customClass
);
}
}
}
}
...
...
This diff is collapsed.
Click to expand it.
views_highlight_past_events.info.yml
+
1
−
1
View file @
468b11a4
...
...
@@ -2,6 +2,6 @@ name: Views highlight past events
type
:
module
description
:
Provides a user interface that enables to highlight past events displayed with the Views module.
package
:
Views
core_version_requirement
:
^9 || ^10
core_version_requirement
:
"
>=9"
dependencies
:
-
drupal:views
This diff is collapsed.
Click to expand it.
views_highlight_past_events.module
+
19
−
4
View file @
468b11a4
...
...
@@ -5,10 +5,10 @@
* Primary module hooks for Views highlight past events module.
*/
use
Drupal\views\ViewExecutable
;
use
Drupal\Core\Form\FormStateInterface
;
use
Drupal\Component\Utility\Xss
;
use
Drupal\Core\Form\FormStateInterface
;
use
Drupal\Core\Routing\RouteMatchInterface
;
use
Drupal\views\ViewExecutable
;
/**
* Implements hook_form_FORM_ID_alter() for views_ui_config_item_form.
...
...
@@ -22,6 +22,7 @@ function views_highlight_past_events_form_views_ui_config_item_form_alter(&$form
}
$view
=
$form_state
->
getStorage
()[
'view'
]
->
get
(
'storage'
);
$highlight_type
=
$view
->
getThirdPartySetting
(
'views_highlight_past_events'
,
'highlight_type'
,
'highlight_field'
);
$highlight_enabled
=
$view
->
getThirdPartySetting
(
'views_highlight_past_events'
,
'highlight_enabled'
,
0
);
$add_custom_class_enabled
=
$view
->
getThirdPartySetting
(
'views_highlight_past_events'
,
'add_custom_class_enabled'
);
$custom_class
=
$view
->
getThirdPartySetting
(
'views_highlight_past_events'
,
'custom_class'
);
...
...
@@ -34,9 +35,18 @@ function views_highlight_past_events_form_views_ui_config_item_form_alter(&$form
'#title'
=>
t
(
'Highlight past events'
),
];
$form
[
'options'
][
'settings'
][
'highlight_past_events'
][
'highlight_type'
]
=
[
'#type'
=>
'radios'
,
'#options'
=>
[
'highlight_field'
=>
t
(
'Highlight only the field'
),
'highlight_row'
=>
t
(
'Highlight the entire row'
),
],
'#default_value'
=>
$highlight_type
,
];
$form
[
'options'
][
'settings'
][
'highlight_past_events'
][
'add_custom_class_enabled'
]
=
[
'#type'
=>
'checkbox'
,
'#title'
=>
t
(
'Add a custom class to
the
view row if
the date is
in the past'
),
'#title'
=>
t
(
'Add a custom class to
date fields or to
view row
s
if
dates are
in the past'
),
'#default_value'
=>
Xss
::
filter
(
$add_custom_class_enabled
),
];
...
...
@@ -55,7 +65,7 @@ function views_highlight_past_events_form_views_ui_config_item_form_alter(&$form
$form
[
'options'
][
'settings'
][
'highlight_past_events'
][
'highlight_enabled'
]
=
[
'#type'
=>
'checkbox'
,
'#title'
=>
t
(
'Highlight
the view row if the date is in the past
'
),
'#title'
=>
t
(
'Highlight
past dates
'
),
'#default_value'
=>
Xss
::
filter
(
$highlight_enabled
),
];
...
...
@@ -123,6 +133,9 @@ function _views_highlight_past_events_validate_form($form, FormStateInterface $f
*/
function
_views_highlight_past_events_submit_form
(
$form
,
FormStateInterface
$form_state
)
{
$view
=
$form_state
->
getStorage
()[
'view'
]
->
get
(
'storage'
);
$highlight_type
=
$form_state
->
getValue
(
'options'
)[
'settings'
][
'highlight_past_events'
][
'highlight_type'
];
$view
->
setThirdPartySetting
(
'views_highlight_past_events'
,
'highlight_type'
,
$highlight_type
);
$highlight_enabled
=
$form_state
->
getValue
(
'options'
)[
'settings'
][
'highlight_past_events'
][
'highlight_enabled'
];
if
(
$highlight_enabled
)
{
...
...
@@ -167,6 +180,8 @@ function views_highlight_past_events_views_pre_render(ViewExecutable $view) {
if
(
$view
->
current_display
!==
$settings
[
'display_id'
])
{
return
;
}
$view
->
element
[
'#attached'
][
'drupalSettings'
][
'views_highlight_past_events'
][
'highlight_type'
]
=
$settings
[
'highlight_type'
];
$highlight_color
=
Xss
::
filter
(
$settings
[
'highlight_color'
]);
$view
->
element
[
'#attached'
][
'drupalSettings'
][
'views_highlight_past_events'
][
'color'
]
=
$highlight_color
;
// Create the selector of the HTML element of the date field. We will use it
...
...
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
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!
Save comment
Cancel
Please
register
or
sign in
to comment