diff --git a/assets/js/accordion.js b/assets/js/accordion.js
index adce567016288c97669b745983f426f34336de1f..a15ccd4df222a4bbea10287fd078d162db139038 100644
--- a/assets/js/accordion.js
+++ b/assets/js/accordion.js
@@ -2,7 +2,7 @@
Drupal.behaviors.AccordionBehavior = {
attach: function (context, settings) {
// can access setting from 'drupalSettings';
- $('.accordion-cern .panel-heading a').css('cssText','color: '+ drupalSettings.displayFormats.accordion.titleColor+ '!important;');
+ $('.accordion-cern .panel-heading a', context).once().css('cssText','color: '+ drupalSettings.displayFormats.accordion.titleColor+ ';');
}
};
})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
diff --git a/assets/js/countdown.js b/assets/js/countdown.js
new file mode 100644
index 0000000000000000000000000000000000000000..3788b05c0f7cf55f6005fd6e9d304313ad8bdc1f
--- /dev/null
+++ b/assets/js/countdown.js
@@ -0,0 +1,12 @@
+(function ($, Drupal, drupalSettings) {
+ Drupal.behaviors.CountdownBehavior = {
+ attach: function (context, settings) {
+ // can access setting from 'drupalSettings';
+ $('.events-countdown h1.mb-3', context).once().css('cssText','color: '+ drupalSettings.displayFormats.countdown.titleColor+ ';');
+ $('.agenda-coming-soon-date h2', context).once().css('cssText','color: '+ drupalSettings.displayFormats.countdown.dateColor+ ';');
+ $('.agenda-coming-soon-link a', context).once().css('cssText','color: '+ drupalSettings.displayFormats.countdown.linkColor+ ';');
+ $('.agenda-coming-soon-place', context).once().css('cssText','color: '+ drupalSettings.displayFormats.countdown.placeColor+ ';');
+ $('.agenda-coming-soon-countdown h1, .agenda-coming-soon-countdown h4', context).once().css('cssText','color: '+ drupalSettings.displayFormats.countdown.dateColor+ ';');
+ }
+ };
+})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
diff --git a/assets/js/event-grid.js b/assets/js/event-grid.js
deleted file mode 100644
index 0bef28521186f32f695043950091ec88e6caf5a5..0000000000000000000000000000000000000000
--- a/assets/js/event-grid.js
+++ /dev/null
@@ -1,8 +0,0 @@
-(function ($, Drupal, drupalSettings) {
- Drupal.behaviors.EventGridBehavior = {
- attach: function (context, settings) {
- // adds the css class via JS because Drupal filters underscores and changes them to hyphens
- $('.event-grid').addClass('cern-view-display-feature_events');
- }
- };
-})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
diff --git a/assets/js/featured-banner.js b/assets/js/featured-banner.js
new file mode 100644
index 0000000000000000000000000000000000000000..12054af1965e9fe390cadff1eb298dddb784ef79
--- /dev/null
+++ b/assets/js/featured-banner.js
@@ -0,0 +1,10 @@
+(function ($, Drupal, drupalSettings) {
+ Drupal.behaviors.FeaturedBannerBehavior = {
+ attach: function (context, settings) {
+ // can access setting from 'drupalSettings';
+ $('.featured-banner .featured-title a', context).once().css('cssText','color: '+ drupalSettings.displayFormats.featured_banner.linkColor+ ';');
+ $('.featured-banner .preview-cards__subtext *', context).once().css('cssText','color: '+ drupalSettings.displayFormats.featured_banner.subtextColor+ ';');
+ $('.featured-banner .component-preview-cards', context).once().css('cssText','background-color: '+ drupalSettings.displayFormats.featured_banner.backgroundColor+ ';');
+ }
+ };
+})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
diff --git a/assets/js/teaser-list.js b/assets/js/teaser-list.js
deleted file mode 100644
index 7ae4a92e89ac709146d5b4c6c65a09b90f2841ec..0000000000000000000000000000000000000000
--- a/assets/js/teaser-list.js
+++ /dev/null
@@ -1,9 +0,0 @@
-(function ($, Drupal, drupalSettings) {
- Drupal.behaviors.TeaserListBehavior = {
- attach: function (context, settings) {
- // can access setting from 'drupalSettings';
- $('.teaser-list .preview-list-component .preview-list-title a').css('cssText','color: '+ drupalSettings.displayFormats.teaser_list.titleColor+ '!important;');
- $('.teaser-list .component-preview-cards .preview-card__title a span').css('cssText','color: '+ drupalSettings.displayFormats.teaser_list.titleColorCard+ '!important;');
- }
- };
-})(jQuery, Drupal, drupalSettings);
\ No newline at end of file
diff --git a/cern_display_formats.libraries.yml b/cern_display_formats.libraries.yml
index ffad293ddd110256048bc817e46dc448a4a501bd..bf1ab9e65a3f820f87cd561abb64fcfbe1c91de9 100644
--- a/cern_display_formats.libraries.yml
+++ b/cern_display_formats.libraries.yml
@@ -4,6 +4,7 @@ accordion-stylesheets:
assets/js/accordion.js: {}
dependencies:
- core/jquery
+ - core/jquery.once
- core/drupalSettings
teaser-list-stylesheets:
@@ -13,12 +14,18 @@ teaser-list-stylesheets:
assets/css/teaser-list.css: {}
js:
assets/js/teaser-list.js: {}
+ dependencies:
+ - core/jquery
+ - core/jquery.once
+ - core/drupalSettings
featured-banner-stylesheets:
version: 1.x
css:
layout:
assets/css/featured-banner.css: {}
+ js:
+ assets/js/featured-banner.js: {}
event-grid-stylesheets:
version: 1.x
@@ -26,4 +33,17 @@ event-grid-stylesheets:
layout:
assets/css/event-grid.css: {}
js:
- assets/js/event-grid.js: {}
\ No newline at end of file
+ assets/js/event-grid.js: {}
+ dependencies:
+ - core/jquery
+ - core/jquery.once
+ - core/drupalSettings
+
+countdown-stylesheets:
+ version: 1.x
+ js:
+ assets/js/countdown.js: {}
+ dependencies:
+ - core/jquery
+ - core/jquery.once
+ - core/drupalSettings
\ No newline at end of file
diff --git a/cern_display_formats.links.menu.yml b/cern_display_formats.links.menu.yml
new file mode 100644
index 0000000000000000000000000000000000000000..fa92fdbc62ea1ec55a26147436f72e7555dc654d
--- /dev/null
+++ b/cern_display_formats.links.menu.yml
@@ -0,0 +1,13 @@
+cern_display_formats.cern_exclusive:
+ title: 'CERN Exclusive'
+ parent: system.admin_config
+ description: 'Settings of modules exclusively built for CERN infrastructure'
+ route_name: cern_display_formats.admin_settings_form
+ weight: -30
+
+cern_display_formats.admin_settings_form:
+ title: 'Display Formats'
+ route_name: cern_display_formats.admin_settings_form
+ description: 'Administrative settings for CERN Display Formats'
+ parent: cern_display_formats.cern_exclusive
+ weight: 0
\ No newline at end of file
diff --git a/cern_display_formats.module b/cern_display_formats.module
index a724ab61bd0ef8c184c26565a3c7442671f7d94c..4f5cd6c6b0dc00d54b1cb690fad259f62e5d374b 100755
--- a/cern_display_formats.module
+++ b/cern_display_formats.module
@@ -38,20 +38,33 @@ function cern_display_formats_theme($existing, $type, $theme, $path) {
* @param ViewExecutable $view
*/
function cern_display_formats_views_pre_render(ViewExecutable $view){
+
+ $admin_form = \Drupal::config('cern_display_formats.adminsettings'); // gets the admin form
+
if ($view->display_handler->view->style_plugin->getPluginId() == "horizontal_boxes") {
$view->display_handler->setOption('css_class', 'horizontal-boxes');
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "collision") {
$view->display_handler->setOption('css_class', 'events-collision');
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "countdown") {
+ $date_color = $admin_form->get('countdown_date_color');
+ $link_color = $admin_form->get('countdown_link_color');
+ $place_color = $admin_form->get('countdown_place_color');
+ $title_color = $admin_form->get('countdown_title_color');
+ $view->element['#attached']['drupalSettings']['displayFormats']['countdown']['titleColor'] = $title_color;
+ $view->element['#attached']['drupalSettings']['displayFormats']['countdown']['dateColor'] = $date_color;
+ $view->element['#attached']['drupalSettings']['displayFormats']['countdown']['linkColor'] = $link_color;
+ $view->element['#attached']['drupalSettings']['displayFormats']['countdown']['placeColor'] = $place_color;
+ $view->element['#attached']['library'][] = 'cern_display_formats/countdown-stylesheets';
$view->display_handler->setOption('css_class', 'events-countdown');
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "teaser_list") {
$view->display_handler->setOption('css_class', 'teaser-list');
- // injects the settings of teaser_list in the JS file
- $title_color = $view->style_plugin->options['title_color'];
- $title_color_card = $view->style_plugin->options['title_color_card'];
- $view->element['#attached']['drupalSettings']['displayFormats']['teaser_list']['titleColor'] = $title_color;
- $view->element['#attached']['drupalSettings']['displayFormats']['teaser_list']['titleColorCard'] = $title_color_card;
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "featured_banner") {
+ $link_color = $admin_form->get('featured_banner_link_color');
+ $subtext_color = $admin_form->get('featured_banner_subtext_color');
+ $background_color = $admin_form->get('featured_banner_background_color');
+ $view->element['#attached']['drupalSettings']['displayFormats']['featured_banner']['linkColor'] = $link_color;
+ $view->element['#attached']['drupalSettings']['displayFormats']['featured_banner']['subtextColor'] = $subtext_color;
+ $view->element['#attached']['drupalSettings']['displayFormats']['featured_banner']['backgroundColor'] = $background_color;
$view->display_handler->setOption('css_class', 'featured-banner');
$view->element['#attached']['library'][] = "cern_display_formats/featured-banner-stylesheets"; //attaches the stylesheet
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "vertical_boxes") {
@@ -59,12 +72,12 @@ function cern_display_formats_views_pre_render(ViewExecutable $view){
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "accordion") {
$view->display_handler->setOption('css_class', 'accordion-cern');
$view->element['#attached']['library'][] = 'cern_display_formats/accordion-stylesheets'; //attaches the stylesheet
- $title_color = $view->style_plugin->options['title_color'];
+ $title_color = $admin_form->get('accordion_title_color');
$view->element['#attached']['drupalSettings']['displayFormats']['accordion']['titleColor'] = $title_color;
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "card_grid") {
- $view->display_handler->setOption('css_class', 'cern-view-display-page cern-view-display-resources');
+ $view->display_handler->setOption('css_class', 'card-grid');
} elseif ($view->display_handler->view->style_plugin->getPluginId() == "event_grid") {
$view->display_handler->setOption('css_class', 'event-grid');
$view->element['#attached']['library'][] = "cern_display_formats/event-grid-stylesheets"; //attaches the stylesheet
}
-}
\ No newline at end of file
+}
diff --git a/cern_display_formats.routing.yml b/cern_display_formats.routing.yml
new file mode 100644
index 0000000000000000000000000000000000000000..a787b6014cbb2968be3de36968fe8b6317022cce
--- /dev/null
+++ b/cern_display_formats.routing.yml
@@ -0,0 +1,9 @@
+cern_display_formats.admin_settings_form:
+ path: '/admin/config/display-formats/settings'
+ defaults:
+ _form: '\Drupal\cern_display_formats\Form\DisplayFormatsSettingsForm'
+ _title: 'Display Formats'
+ requirements:
+ _permission: 'administer site configuration'
+ options:
+ _admin_route: TRUE
\ No newline at end of file
diff --git a/src/Form/DisplayFormatsSettingsForm.php b/src/Form/DisplayFormatsSettingsForm.php
new file mode 100644
index 0000000000000000000000000000000000000000..b00e79d0c2cd80e5ff220afa4de7a8c7dc0a0735
--- /dev/null
+++ b/src/Form/DisplayFormatsSettingsForm.php
@@ -0,0 +1,145 @@
+<?php
+
+
+namespace Drupal\cern_display_formats\Form;
+
+use Drupal\Core\Form\ConfigFormBase;
+use Drupal\Core\Form\FormStateInterface;
+
+/**
+ * Sets administrative form for CERN Display Formats
+ *
+ * Class DisplayFormatsSettingsForm
+ * @package Drupal\cern_display_formats\Form
+ */
+class DisplayFormatsSettingsForm extends ConfigFormBase {
+
+ /**
+ * {@inheritdoc}
+ */
+ protected function getEditableConfigNames() {
+ return [
+ 'cern_display_formats.adminsettings',
+ ];
+ }
+
+ /**
+ * {@inheritdoc}
+ */
+ public function getFormId() {
+ return 'cern_display_formats_settings';
+ }
+
+ /**
+ * {@inheritdoc}
+ */
+ public function buildForm(array $form, FormStateInterface $form_state) {
+ $config = $this->config('cern_display_formats.adminsettings');
+
+ // Accordion form settings
+ $form['accordion'] = array(
+ '#type' => 'details',
+ '#title' => $this->t('Accordion Format'),
+ '#open' => TRUE,
+ );
+
+ $form['accordion']['accordion_title_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Title Color'),
+ '#description' => t('Choose the color that you want the Accordion title to have. Defaults to #000000. '),
+ '#default_value' => (!empty($config->get('accordion_title_color'))) ? $config->get('accordion_title_color') : '#000000',
+ );
+
+ // Countdown form settings
+ $form['countdown'] = array(
+ '#type' => 'details',
+ '#title' => $this->t('Countdown Display Format'),
+ '#open' => TRUE,
+ );
+
+ $form['countdown']['countdown_title_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Countdown View Title Color'),
+ '#description' => t('Choose the color that you want the Countdown view title to have. Defaults to white.'),
+ '#default_value' => (!empty($config->get('countdown_title_color'))) ? $config->get('countdown_title_color') : '#FFFFFF',
+ );
+
+ $form['countdown']['countdown_date_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Countdown Date Color'),
+ '#description' => t('Choose the color that you want the Countdown date to be. Defaults to white.'),
+ '#default_value' => (!empty($config->get('countdown_date_color'))) ? $config->get('countdown_date_color') : '#FFFFFF',
+ );
+
+ $form['countdown']['countdown_link_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Countdown Link Color'),
+ '#description' => t('Choose the color that you want the Countdown link to be. Defaults to white.'),
+ '#default_value' => (!empty($config->get('countdown_link_color'))) ? $config->get('countdown_link_color') : '#FFFFFF',
+ );
+
+ $form['countdown']['countdown_place_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Countdown Place Color'),
+ '#description' => t('Choose the color that you want the Countdown place to be. Defaults to white.'),
+ '#default_value' => (!empty($config->get('countdown_place_color'))) ? $config->get('countdown_place_color') : '#FFFFFF',
+ );
+
+ // Featured Banner form settings
+ $form['featured_banner'] = array(
+ '#type' => 'details',
+ '#title' => $this->t('Featured Banner Display Format'),
+ '#open' => TRUE,
+ );
+
+ $form['featured_banner']['featured_banner_link_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Featured Banner link title'),
+ '#description' => t('Choose the color that you want the Featured Banner link titles to have. Defaults to blue.'),
+ '#default_value' => (!empty($config->get('featured_banner_link_color'))) ? $config->get('featured_banner_link_color') : '#2574b9',
+ );
+
+ $form['featured_banner']['featured_banner_subtext_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Featured Banner Subtext Color'),
+ '#description' => t('Choose the color that you want the Featured Banner subtext to have. Defaults to black.'),
+ '#default_value' => (!empty($config->get('featured_banner_subtext_color'))) ? $config->get('featured_banner_subtext_color') : '#000000',
+ );
+
+ $form['featured_banner']['featured_banner_background_color'] = array(
+ '#type' => 'color',
+ '#title' => t('Featured Banner Background Color'),
+ '#description' => t('Choose the color that you want the Featured Banner background color to be. Defaults to white.'),
+ '#default_value' => (!empty($config->get('featured_banner_background_color'))) ? $config->get('featured_banner_background_color') : '#FFFFFF',
+ );
+
+
+
+
+ return parent::buildForm($form, $form_state);
+ }
+
+
+ /**
+ * {@inheritdoc}
+ */
+ public function submitForm(array &$form, FormStateInterface $form_state) {
+ parent::submitForm($form, $form_state);
+
+ $this->config('cern_display_formats.adminsettings')
+ ->set('accordion_title_color', $form_state->getValue('accordion_title_color'))
+ ->set('teaser_list_title_color', $form_state->getValue('teaser_list_title_color'))
+ ->set('teaser_list_title_color_card', $form_state->getValue('teaser_list_title_color_card'))
+ ->set('countdown_date_color', $form_state->getValue('countdown_date_color'))
+ ->set('countdown_link_color', $form_state->getValue('countdown_link_color'))
+ ->set('countdown_place_color', $form_state->getValue('countdown_place_color'))
+ ->set('countdown_title_color', $form_state->getValue('countdown_title_color'))
+ ->set('featured_banner_link_color', $form_state->getValue('featured_banner_link_color'))
+ ->set('featured_banner_subtext_color', $form_state->getValue('featured_banner_subtext_color'))
+ ->set('featured_banner_background_color', $form_state->getValue('featured_banner_background_color'))
+ ->save();
+ \Drupal::service('cache.render')->invalidateAll(); // clears the caches
+ }
+
+
+}
\ No newline at end of file
diff --git a/src/Plugin/views/style/Accordion.php b/src/Plugin/views/style/Accordion.php
index 2ca6ee223abf391f61f5d22661cedf6592fc1921..a45ac82cd7bd34c9ba27749184a5e4e7b26951e6 100644
--- a/src/Plugin/views/style/Accordion.php
+++ b/src/Plugin/views/style/Accordion.php
@@ -52,7 +52,6 @@ class Accordion extends DefaultStyle {
protected function defineOptions(){
$options = parent::defineOptions();
$options['row_class'] = array('default'=> 'carousel-cern-item') ;
- $options['title_color'] = array('default'=> '#000000') ;
return $options;
}
@@ -73,13 +72,6 @@ class Accordion extends DefaultStyle {
'#disabled' => true,
);
- // Option to set a color for the accordion title
- $form['title_color'] = array(
- '#type' => 'color',
- '#title' => t('Title Color'),
- '#description' => t('Choose the color that you want the Accordion title to have'),
- '#default_value' => (!empty($this->options['title_color'])) ? $this->options['title_color'] : '#000000',
- );
}
}
\ No newline at end of file
diff --git a/src/Plugin/views/style/TeaserList.php b/src/Plugin/views/style/TeaserList.php
index 47fa4df767d4f7ba7c0f70b9370587b7e82c0f6d..d2625295d6bc0aa5cbdf45a9294f98d5b65365c1 100644
--- a/src/Plugin/views/style/TeaserList.php
+++ b/src/Plugin/views/style/TeaserList.php
@@ -37,8 +37,6 @@ class TeaserList extends DefaultStyle
*/
protected function defineOptions(){
$options = parent::defineOptions();
- $options['title_color'] = array('default'=> '#2574b9') ;
- $options['title_color_card'] = array('default' => '#FFFFFF');
$options['row_class'] = array('default' => '');
return $options;
}
@@ -60,23 +58,6 @@ class TeaserList extends DefaultStyle
'#disabled' => true,
);
- // Option to set a color for the teaser list title
- $form['title_color'] = array(
- '#type' => 'color',
- '#title' => t('Title Color'),
- '#description' => t('Choose the color that you want the Teaser List title to have. By default its CERN Blue.'),
- '#default_value' => (!empty($this->options['title_color'])) ? $this->options['title_color'] : '#2574b9',
- );
-
- // Option to set a color for the teaser list title in responsive mode
- $form['title_color_card'] = array(
- '#type' => 'color',
- '#title' => t('Title Color in responsive mode'),
- '#description' => t('Choose the color that you want the Teaser List title to have when in responsive mode
- (mobile devices). By default its white.'),
- '#default_value' => (!empty($this->options['title_color_card'])) ? $this->options['title_color_card'] : '#FFFFFF',
- );
-
}
}
diff --git a/src/Plugin/views/style/VerticalBoxes.php b/src/Plugin/views/style/VerticalBoxes.php
index 357a42b3e54c10418c05388a2b4d3b068b30dedf..be729558d2c0ab03b80b2723f1fb52bebf222936 100644
--- a/src/Plugin/views/style/VerticalBoxes.php
+++ b/src/Plugin/views/style/VerticalBoxes.php
@@ -4,6 +4,7 @@
namespace Drupal\cern_display_formats\Plugin\views\style;
+use Drupal\core\form\FormStateInterface;
use Drupal\views\Plugin\views\style\DefaultStyle;
/**