Skip to content
Snippets Groups Projects
Commit e8e9af0d authored by Michael Lee's avatar Michael Lee
Browse files

Initial commit

parents
Branches main
Tags v1.0.0
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 1632 additions and 0 deletions
sass/_variables.scss 0 → 100644
+ 22
− 0
View file @ e8e9af0d
$modularstorage-color-a: #84653d;
$modularstorage-color-b: #b24800;
$modularstorage-color-c: #099fc9;
$modularstorage-color-d: #5e6caa;
$modularstorage-color-e: #78879d;
$medium-gray: #757575;
$focus-color: #9dccfd;
$screen-xs-min: 480px !default;
$screen-sm-min: 768px !default;
$screen-md-min: 992px !default;
$screen-lg-min: 1200px !default;
$screen-xl-min: 1440px !default;
$screen-xs-max: ($screen-sm-min - 1) !default;
$screen-sm-max: ($screen-md-min - 1) !default;
$screen-md-max: ($screen-lg-min - 1) !default;
$alt-font-sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
sass/customizations.css 0 → 100644
+ 299
− 0
View file @ e8e9af0d
.btn-primary {
background-color: #dab06a;
border-radius: 0;
padding: 7px 30px;
color: white;
border: none; }
.btn-primary:hover, .btn-primary:focus {
background-color: #d09a42;
color: white; }
.btn-primary:active {
background-color: #b37f2c; }
.btn-secondary {
background-color: #43bad6;
border-radius: 0;
padding: 7px 30px;
color: white;
border: none; }
.btn-secondary:hover, .btn-secondary:focus {
background-color: #29a1bd;
color: white; }
.btn-secondary:active {
background-color: #207d93; }
@media (min-width: 768px) {
.interior-content {
width: 100%; } }
@media (min-width: 1440px) {
.interior-content {
width: 1440px; } }
@media screen and (max-width: 992px) {
.interior-content {
padding: 0; } }
.step {
display: block;
font-size: 1.4em;
margin-bottom: 0.5em;
font-weight: bold; }
.step-1 {
padding-right: 1em; }
#questionlist {
font-size: 1em;
padding-left: 2em; }
#questionlist li {
color: #207d93;
font-weight: bold;
font-size: 1.4em;
margin-bottom: 1em; }
#questionlist h4 {
font-weight: bold;
font-size: 1em;
line-height: 1.2; }
#questionlist label {
font-weight: normal;
font-size: 0.7em;
color: #333; }
#questionlist .control-indicator {
font-family: "FontAwesome";
text-decoration: none;
color: silver;
font-weight: normal; }
#questionlist .control-indicator.collapsed {
transform: rotate(180deg); }
#questionlist .control-indicator::before {
content: '\f05a';
display: inline; }
#questionlist .control-indicator:hover::before {
color: #8d8d8d; }
#questionlist .control-indicator:active::before {
color: #5a5a5a; }
#questionlist .explanation {
color: #8d8d8d;
font-weight: normal; }
#questionlist .explanation, #questionlist .explanation p, #questionlist .explanation li {
font-size: initial;
margin-bottom: initial; }
#questionlist .explanation .panel-title, #questionlist .explanation .panel-body {
font-size: 12px;
padding: 10px;
margin: 0; }
#questionlist .explanation .panel-heading {
margin: 0;
padding: 0;
background-color: #95789d;
border-color: #95789d; }
.mismatch {
opacity: 0.35; }
#rdmsg-services {
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin: 0;
padding: 0.25em 0.3em; }
#rdmsg-services .service-panel {
box-sizing: border-box;
margin: 0.25em;
width: calc(20% - 0.5em);
display: flex; }
#rdmsg-services .service-panel label {
position: relative;
width: 100%;
flex-basis: auto;
padding: 1em;
margin-bottom: 1px; }
#rdmsg-services .service-panel input {
position: absolute;
left: -9999px; }
#rdmsg-services .service-panel input ~ .control-indicator {
margin: 0;
background-color: #f2eef3;
border: 2px #c3b3c8 solid;
border-radius: 0.25em;
height: 100%;
width: 100%;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
font-size: 2em; }
#rdmsg-services .service-panel input ~ .control-indicator::before {
content: "\f10c";
font-family: "FontAwesome";
display: block;
color: #7b5f83;
font-weight: normal;
margin-left: 0.25em;
position: absolute;
top: 10px;
right: 10px; }
#rdmsg-services .service-panel input:checked ~ .control-indicator {
background-color: #c3b3c8; }
#rdmsg-services .service-panel input:checked ~ .control-indicator::before {
content: "\f058";
color: #443448; }
#rdmsg-services .service-panel input:checked ~ h4, #rdmsg-services .service-panel input:checked ~ p {
color: #513f57; }
@media screen and (max-width: 1440px) {
#rdmsg-services .service-panel {
width: calc(25% - 0.5em); } }
@media screen and (max-width: 1200px) {
#rdmsg-services .service-panel {
width: calc(33% - 0.5em); } }
@media screen and (max-width: 992px) {
#rdmsg-services .service-panel {
width: calc(50% - 0.5em); } }
#rdmsg-services .service-panel h4, #rdmsg-services .service-panel p {
color: #6d5474;
margin: 0; }
#rdmsg-services .service-panel h4 {
font-size: 0.8em;
font-size: 1.4em; }
#rdmsg-services .service-panel .service-title {
padding: 0;
padding-right: 1.8em; }
#rdmsg-services .service-panel .service-title + p {
margin-top: 10px; }
#rdmsg-services .service-panel p {
font-size: 12px;
padding-right: 1.8em; }
.comparisonlist-wrapper {
display: flex;
flex-wrap: wrap;
margin: 1em 0; }
.comparisonlist-wrapper input {
position: absolute;
left: -9999px; }
.comparisonlist-wrapper input + .control-indicator::before {
content: "\f070";
font-family: "FontAwesome";
display: block;
color: #c3b3c8;
margin-left: 0.25em; }
.comparisonlist-wrapper input:checked + .control-indicator::before {
content: "\f06e";
color: #95789d; }
.comparisonlist-wrapper label {
display: flex;
padding: 0.25em 0.4em 0.2em;
color: #95789d;
border: 1px solid #c3b3c8;
margin: 0.25em;
border-radius: 0.25em;
cursor: pointer; }
#comparisonchart th:first-of-type {
width: 15%; }
@media screen and (max-width: 768px) {
#comparisonchart th:first-of-type {
display: none; } }
#comparisonchart th {
width: calc(85%/3); }
#comparisonchart td {
width: calc(85%/3);
overflow: hidden; }
@media screen and (max-width: 768px) {
#comparisonchart td::before {
content: attr(data-label);
display: block;
font-weight: bold; } }
#comparisonchart td, #comparisonchart th {
height: 5em;
overflow: hidden; }
#comparisonchart thead th {
height: auto;
font-size: 1.4em;
position: -webkit-sticky;
position: sticky;
background: white;
top: 0;
border-bottom: 0; }
#comparisonchart thead th::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
border-bottom: 1px solid #ddd; }
#comparisonchart p, #comparisonchart ul {
font-size: 14px; }
.jump-to-chart {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
padding: 1em 0;
background: #207d93;
z-index: 2;
display: none; }
.jump-to-chart p {
color: white; }
.jump-to-chart p span {
font-size: 120%; }
.btn-compare-results {
white-space: nowrap; }
.pager {
position: -webkit-sticky;
position: sticky;
bottom: 0;
background-color: white; }
.pager button {
margin: 0.5em; }
.pager .previous button {
float: left; }
.pager .next button {
float: right; }
.cd-row {
display: table-row; }
@media screen and (max-width: 768px) {
.cd-row {
display: block; } }
.cd-cell {
display: table-cell; }
@media screen and (max-width: 768px) {
.cd-cell {
display: block;
width: 100%; } }
.cd-questions {
position: relative;
width: 30%; }
@media screen and (max-width: 768px) {
.cd-questions {
position: static;
width: 100%; } }
.cd-services {
width: 70%; }
@media screen and (max-width: 768px) {
.cd-services {
width: 100%; } }
.cd-overflow {
overflow-y: scroll;
position: absolute;
top: 0;
width: 100%;
height: 100%;
padding-right: 1em; }
@media screen and (max-width: 768px) {
.cd-overflow {
position: static;
width: 100%;
height: auto;
overflow: auto; } }
/*# sourceMappingURL=customizations.css.map */
sass/customizations.css.map 0 → 100644
+ 8
− 0
View file @ e8e9af0d
{
"version": 3,
"mappings": "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",
"sources": ["buttons.scss","variables.scss","customizations.scss"],
"names": [],
"file": "customizations.css"
}
\ No newline at end of file
sass/customizations.scss 0 → 100644
+ 642
− 0
View file @ e8e9af0d
@import 'variables';
@import 'buttons';
// web accessibility overrides
footer a {
color: $rdmsg-ochre;
text-decoration: underline
}
#bs-example-navbar-collapse-1 {
ul li {
a {
color: darken($medium-gray, 37);
&:hover {
color: darken($medium-gray, 6);
}
}
&.active a {
color: darken($medium-gray, 6);
}
}
}
.hero .about h1, .interior-content h2.title, .interior-content h2 {
color: darken($rdmsg-teal, 6);
}
#bs-example-navbar-collapse-1 ul li.active a {
color: #666;
}
// end wa overrides
.interior-content a {
text-decoration: underline;
color: $rdmsg-ochre;
}
.skip-link.visually-hidden.focusable {
background-color: $rdmsg-teal;
color: white;
}
.skip-link.visually-hidden.focusable:focus {
position: absolute !important;
padding: 1em;
top: 1em;
left: 1em;
z-index: 1;
display: inline-block;
}
.interior-content {
@media (min-width: $screen-sm-min) {
width: 100%;
}
@media (min-width: $screen-xl-min) {
width: 1440px;
}
@media screen and (max-width: $screen-md-min) {
padding: 0;
}
}
.interior-content p, .interior-content ul, .interior-content ol, #comparisonchart th, #comparisonchart td, .cwd-scrolling-table {
font-family: $alt-font-sans-standard;
font-size: 14px;
}
#comparisonchart th, #comparisonchart td {
padding: 12px;
}
#comparisonchart thead th, #comparisonchart thead td, .floating-col-header > div, {
white-space: nowrap;
background-color: $rdmsg-green;
}
.cwd-scrolling-table .floating-row-header {
background-color: lighten($medium-gray, 50);
}
.hero, .hero:hover {
background-image: url('../images/bg-hero-home-t.jpg') !important;
}
.hero .about {
padding: 0 12px;
}
.questions-header {
padding: 10px 0 22px;
margin-bottom: 20px;
border-bottom: 2px dashed #dedede;
}
.services-header {
padding-bottom: 15px;
}
.interior-content h3, .interior-content .h3 {
font-family: $alt-font-sans-standard;
color: #555;
font-size: 14px;
font-weight: 700;
line-height: 1.4;
margin: 0;
}
.services-header h3 {
position: relative;
text-indent: 30px;
margin-left: -3px !important;
@media (max-width: $screen-sm-min) {
margin-left: 0 !important;
text-indent: 0;
}
}
.services-header h3 .fa {
position: absolute;
top: -2px;
left: 3px;
font-size: 24px;
color: #29a1bd;
opacity: 0.4;
text-indent: 0;
@media (max-width: $screen-sm-min) {
display: none;
}
}
.btn-secondary {
@media (max-width: $screen-sm-min) {
padding: 7px 24px;
}
}
.services-header .btn-secondary {
margin: 4px 0;
}
.step-1 + button {
margin-top: 1.75em;
}
.title {
margin: 1.5em 0 0.35em;
}
.title + .lead {
color: #757575;
font-family: $alt-font-sans-standard;
font-size: 21px;
margin-bottom: 1em;
}
.cert {
position: relative;
text-indent: 24px;
color: $rdmsg-green;
}
.cert .fa {
position: absolute;
top: -1px;
left: 0;
font-size: 22px;
color: #7ab034;
opacity: 0.68;
text-indent: 0;
}
.app-title {
margin-bottom: 2em;
}
h2.sub-heading {
//color: #222;
font-size: 24px;
margin: 1em 0 1em;
}
h2.sub-heading.heading-services {
margin-bottom: 0.5em;
}
.section-break {
border-color: #00b7ac;
opacity: 0.2;
border-top-width: 3px;
margin-top: 30px;
}
.section-break.dashed {
border-style: dashed;
}
.email-options {
margin-bottom: 0.75em;
font-family: $alt-font-sans-standard;
legend {
font-size: 1em;
border-bottom: none;
margin-bottom: 10px;
}
}
#questionlist {
font-size: 1em;
padding-left: 2em;
li {
color: $rdmsg-teal;
font-weight: bold;
font-size: 1.4em;
margin-bottom: 1em;
margin-left: 2px;
}
.question-wrapper {
margin: 10px 0;
h4 {
display: inline
}
}
h4 {
font-weight: bold;
font-size: 16px;
line-height: 1.2;
}
label {
font-family: $alt-font-sans-standard;
font-weight: normal;
font-size: 13px;
color: #333;
}
input[type="checkbox"] {
margin-top: 3px;
}
.control-indicator {
font-family: "FontAwesome";
text-decoration: none;
color: $medium-gray;
font-weight: normal;
&::before {
content: '\f05a';
display: inline-block;
}
&:hover::before {
color: darken(silver, 20);
}
&:active::before {
color: darken(silver, 40);
}
}
.explanation {
color: $medium-gray;
font-weight: normal;
margin-bottom: 10px;
&, p, li {
font-size: 13px;
}
p, li {
margin-bottom: initial;
}
.panel-title, .panel-body {
font-size: 12px;
padding: 10px;
margin: 0;
}
.panel-heading {
margin: 0;
padding: 0;
background-color: $rdmsg-purple;
}
.panel-heading, .panel-primary {
border-color: darken($rdmsg-purple, 20);
}
}
}
.mismatch {
opacity: 0.35;
}
#rdmsg-services {
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin: 0 -0.25em;
padding: 0.25em 0;
.service-panel {
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: 0.25em;
width: calc(20% - 0.5em);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
&:focus-within {
-webkit-box-shadow: 0px 0px 0px 4px $focus-color;
-moz-box-shadow: 0px 0px 0px 4px $focus-color;
box-shadow: 0px 0px 0px 4px $focus-color;
border-radius: 0.5em;
}
label {
position: relative;
width: 100%;
flex-basis: auto;
padding: 1em;
margin-bottom: 1px;
}
input {
position: absolute;
left: -9999px;
~ .control-indicator {
margin: 0;
background-color: lighten($rdmsg-purple, 40);
border: 2px lighten($rdmsg-purple, 20) solid;
border-radius: 0.25em;
height: 100%;
width: 100%;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1;
font-size: 2em;
&::before {
content: "\f10c";
font-family: "FontAwesome";
display: block;
color: darken($rdmsg-purple, 10);
font-weight: normal;
margin-left: 0.25em;
position: absolute;
top: 10px;
right: 10px;
}
}
&:checked {
~ .control-indicator {
background-color: lighten($rdmsg-purple, 20);
&::before {
content: "\f058";
color: darken($rdmsg-purple, 30);
}
}
~ h4, ~ p {
color: darken($rdmsg-purple, 25);
}
}
}
@media screen and (max-width: $screen-xl-min) {
width: calc(25% - 0.5em);
}
@media screen and (max-width: $screen-lg-min) {
width: calc(33% - 0.5em);
}
@media screen and (max-width: $screen-md-min) {
width: calc(50% - 0.5em);
}
h4, p {
color: darken($rdmsg-purple, 15);
margin: 0;
}
h4 {
font-size: 18px;
@media (max-width: $screen-sm-min) {
font-size: 15px;
}
}
.service-title {
padding: 0;
padding-right: 1.8em;
+ p {
margin-top: 10px;
}
}
p {
font-size: 12px;
padding-right: 1.8em;
}
}
}
.comparisonlist-wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin: 1em 0;
input {
position: absolute;
left: -9999px;
+ .control-indicator {
&::before {
content: "\f111";
font-family: "FontAwesome";
display: block;
color: lighten($rdmsg-purple, 20);
margin-left: 0.25em;
}
}
&:checked + .control-indicator {
&::before {
content: "\f058";
color: $rdmsg-purple;
}
}
}
label {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 0.25em 0.4em 0.2em;
margin: 0.25em;
color: darken($rdmsg-purple, 10);
border: 1px solid lighten($rdmsg-purple, 20);
margin: 0.25em;
border-radius: 0.25em;
cursor: pointer;
&:focus-within {
-webkit-box-shadow: 0px 0px 0px 4px $focus-color;
-moz-box-shadow: 0px 0px 0px 4px $focus-color;
box-shadow: 0px 0px 0px 4px $focus-color;
border-radius: 0.5em;
}
}
}
.jump-to-chart {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
padding: 1em 0;
background: $rdmsg-teal;
z-index: 2;
display: none;
p {
color: white;
span {
font-size: 120%;
}
}
}
.btn-compare-results {
white-space: nowrap;
}
.pager {
position: -webkit-sticky;
position: sticky;
bottom: 0;
background-color: white;
button {
margin: 0.5em;
}
.previous {
button {
float: left;
}
}
.next {
button {
float: right;
}
}
}
.popup .fa.fa-info-circle {
font-family: "FontAwesome";
text-decoration: none;
color: $medium-gray;
font-weight: normal;
font-size: 1.4em;
&::before {
content: '\f05a';
}
&:hover::before {
color: darken(silver, 20);
}
&:active::before {
color: darken(silver, 40);
}
}
.cd-row {
display: flex;
@media screen and (max-width: $screen-sm-min) {
display: block;
}
}
.cd-row:first-of-type .cd-cell {
vertical-align: bottom;
padding-bottom: 15px;
}
#app .cd-row:last-of-type .cd-cell:first-child {
background: radial-gradient(ellipse at right center, rgba(180,225,212,0.1) 0%,rgba(255,255,255,0) 70%);
@media screen and (max-width: $screen-sm-min) {
background: none;
}
}
.cd-cell {
//display: table-cell;
@media screen and (max-width: $screen-sm-min) {
display: block;
width: 100%;
}
}
.cd-cell:last-child {
padding-left: 3%;
@media screen and (max-width: $screen-sm-min) {
padding-left: 0;
}
}
.cd-questions {
position: relative;
width: 30%;
@media screen and (max-width: $screen-sm-min) {
position: static;
width: 100%;
}
}
.cd-services {
width: 70%;
@media screen and (max-width: $screen-sm-min) {
width: 100%;
}
}
.cd-overflow {
overflow-y: scroll;
position: absolute;
top: 0;
width: 100%;
height: 100%;
padding-right: 1.5em;
@media screen and (max-width: $screen-sm-min) {
position: static;
width: 100%;
height: auto;
overflow: visible;
padding-right: 0;
}
}
.services-header {
display: flex;
align-items: center;
@media screen and (max-width: $screen-sm-min) {
display: block;
//flex-direction: column;
}
h3 {
margin: 0 1em 0 0;
@media screen and (max-width: $screen-sm-min) {
margin: 1em 0;
}
}
div:first-of-type {
flex: 1;
}
div:last-of-type {
@media screen and (max-width: $screen-sm-min) {
margin-bottom: 1em;
}
}
div {
@media screen and (max-width: $screen-sm-min) {
width: 100%;
align-items: flex-start;
}
}
}
.form-control {
border-color: $medium-gray;
}
sass/finder.scss 0 → 100644
+ 4
− 0
View file @ e8e9af0d
@import 'variables';
@import 'buttons';
@import 'customizations';
\ No newline at end of file
sass/variables.css.map 0 → 100644
+ 8
− 0
View file @ e8e9af0d
{
"version": 3,
"mappings": "",
"sources": [],
"names": [],
"file": "variables.css"
}
\ No newline at end of file
sass/variables.scss 0 → 100644
+ 20
− 0
View file @ e8e9af0d
$rdmsg-teal: #207d93;
$rdmsg-yellow: #f8bc5b;
$rdmsg-ochre: darken($rdmsg-yellow, 36);
$rdmsg-purple: #95789d;
$rdmsg-green: #5A8128;
$medium-gray: #757575;
$focus-color: #9dccfd;
$screen-xs-min: 480px !default;
$screen-sm-min: 768px !default;
$screen-md-min: 992px !default;
$screen-lg-min: 1200px !default;
$screen-xl-min: 1440px !default;
$screen-xs-max: ($screen-sm-min - 1) !default;
$screen-sm-max: ($screen-md-min - 1) !default;
$screen-md-max: ($screen-lg-min - 1) !default;
$alt-font-sans: 'Raleway', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$alt-font-sans-standard: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
\ No newline at end of file
src/Controller/FinderController.php 0 → 100644
+ 367
− 0
View file @ e8e9af0d
<?php
namespace Drupal\finder\Controller;
use Drupal\Core\Controller\ControllerBase;
use \Drupal;
use \Drupal\taxonomy\Entity\Term;
use \Symfony\Component\HttpFoundation\JsonResponse;
class FinderController extends ControllerBase {
/**
* Display the markup.
*
* @return array
*/
public function content() {
/*
return array(
'#type' => 'markup',
'#markup' => $this->t('Hello, World! From the Finder controller.'),
);
*/
// assure that a session has been started, and then set the csrf_token
return [
'#theme' => 'finder',
'#attached' => [
'library' => [
'finder/finder',
],
],
];
}
/* Return a JSON representation of the facets tree
* @return JsonResponse the facet tree
*/
private function createfacettree() {
$terms=Drupal::entityTypeManager()
->getStorage('taxonomy_term')
->loadTree("facets", 0, null, true);
// $vid, $parent, $max_depth, $load_entities);
// extract data for all of the terms
foreach ($terms as $term) {
if (sizeof($term->get('field_control_type')->getValue()) > 0) {
$tid = $term->get('field_control_type')->getValue()[0]["target_id"];
$control_type = Term::load($tid)->getName();
} else {
$control_type = null;
}
$term_data[] = [
'id' => $term->tid->value,
'name' => $term->name->value,
"control_type" => $control_type,
'parent' => $term->parents[0], // there will only be one
'weight' => $term->weight->value,
'selected' => false,
'description' => $term->getDescription()
];
}
// find the questions and add choices array
$questions = [];
foreach ($term_data as $td) {
if ($td["parent"] == "0") {
$td["choices"] = [];
array_push($questions, $td);
}
}
$temp_questions = [];
// get the facets for each of the questions
foreach ($questions as $q) {
foreach ($term_data as $td) {
if ($td["parent"] == $q["id"]) {
array_push($q["choices"], $td);
}
}
// sort the choices by weight ascending
$weight = [];
foreach ($q["choices"] as $key=>$row){
$weight[$key] = $row["weight"];
}
array_multisort($weight, SORT_ASC, $q["choices"]);
array_push($temp_questions, $q);
}
$questions = $temp_questions;
// sort the questions by weight
$weight = [];
foreach ($questions as $key=>$row) {
$weight[$key] = $row["weight"]; // convert to number
}
array_multisort($weight, SORT_ASC, $questions);
return $questions;
}
public function facettree() {
$questions = $this->createfacettree();
return new JsonResponse($questions);
}
private function createtestservicelist() {
$values = [
'type' => 'service'
];
$nodes = Drupal::entityTypeManager()
->getListBuilder('node')
->getStorage()
->loadByProperties($values);
$services = []; // where we will build the service data
// this is how to get the node info
$display = \Drupal::entityTypeManager()
->getStorage('entity_view_display')
->load("node" . '.' . "service" . '.' . "default");
//echo(json_encode($display->toArray())); echo"<br>";
$paragraph_display = \Drupal::entityTypeManager()
->getStorage('entity_view_display')
->load("paragraph.service_paragraphs.default");
// ->load("paragraph" . '.' . "service_paragraphs" . '.' . "default");
foreach ($nodes as $node) {
$s = [];
$s["id"] = $node->nid->value;
$s["title"] = $node->title->value;
// get the facet matches
$s["facet_matches"] = [];
foreach ($node->field_facet_matches as $match) {
$s["facet_matches"][] = $match->target_id;
}
$s["summary"] = $node->field_summary->value;
// get the service_paragraphs
$paragraph = $node->get('field_service_paragraphs')->first();
if ($paragraph) {
$pdoutput = [];
$paragraph = $paragraph->get('entity')->getTarget();
//var_dump($paragraph); echo("<br>");
// the order of the paragraphs is in $paragraph_display[
// the fields are array_keys($paragraph_display["content"])
// the weights are $paragraph_display["content"][$field]["weight"]
//var_dump($paragraph_display); exit;
$pdcontent = $paragraph_display->toArray()["content"];
foreach ($pdcontent as $machine_name => $field_data) {
$field_data = [];
if (sizeof($paragraph->get($machine_name)->getValue())> 0) {
$field_data["value"] = $paragraph->get($machine_name)->getValue()[0]["value"];
//var_dump($paragraph->get($machine_name)->getValue()[0]["value"]); echo("<br>");
}
$field_config = \Drupal::entityTypeManager()->getStorage('field_config')->load("paragraph" . '.' . "service_paragraphs" . '.' . $machine_name)->toArray();
$field_data["label"] = $field_config["label"];
$field_data["weight"] = $pdcontent[$machine_name]["weight"];
$pdoutput[$machine_name] = $field_data;
//var_dump($field_data); exit;
}
$s["field_data"] = $pdoutput;
}
//echo(json_encode($s));
//echo(json_encode($paragraph_display->toArray())); exit;
array_push($services, $s);
}
$title = [];
foreach ($services as $key=>$row){
$title[$key] = $row["title"];
}
array_multisort($title, SORT_ASC, $services);
return $services;
}
public function servicelist() {
$services = $this->createtestservicelist();
return new JsonResponse($services);
}
public function send_email() {
if (\Drupal::service('session')->isStarted() === FALSE) {
return new JsonResponse("no session, so sorry");
}
//$url = \Drupal::request()->getSchemeAndHttpHost().
// "/session/token";
//$desiredtoken = $this->get_web_page($url);
//$desired_token = session_id();
//$desired_token = Drupal::csrfToken()->get();
//$intoken = \Drupal::request()->headers->get("X-CSRF-Token");
//return new JsonResponse(["want $desired_token got $intoken"]);
// data include name, email, facets (string)
$json_string = \Drupal::request()->getContent();
// \Drupal::logger('finder')->notice("email json is $json_string");
$decoded = \Drupal\Component\Serialization\Json::decode($json_string);
// get $qdata from $decoded
$qdata = $decoded["qdata"];
// get $sdata from $decoded
$sdata = $decoded["sdata"];
$body = "Thank you for using the Finder tool. " .
"We hope it was useful.\r\n\r\n" .
"Your selected criteria were:\r\n";
$questions = $this->createfacettree();
$facets = [];
foreach ($qdata as $qitem) {
$question_id = $qitem[0];
$facet_id = $qitem[1];
$facets[] = $facet_id;
foreach ($questions as $question) {
if ($question["id"] == $question_id) {
$body = $body . "* " . $question["name"] . " -- ";
foreach ($question["choices"] as $choice) {
if ($choice["id"] == $facet_id) {
$body = $body . $choice["name"] . "\r\n";
}
}
}
}
}
$body = $body . "\r\nYour resulting choices were:\r\n";
$services = $this->createtestservicelist();
foreach ($sdata as $svc) {
foreach ($services as $service) {
if ($service["id"] == $svc) {
$body = $body . "* " . $service["title"] . "\r\n";
}
}
}
$body = $body . "\r\nUse this link to return to the tool ".
"with your criteria already selected: " .
\Drupal::request()->getSchemeAndHttpHost() .
"/finder?facets=" .
implode($facets,",") .
"\r\n\r\n" .
"If you have any further questions or need more information about " .
"Finder services, please contact the helpdesk to set up a consultation, ".
"or contact the service owners " .
"directly (contact details in tool comparison table).\r\n\r\n";
$subject = "Assistance request from Finder application";
$mailManager = \Drupal::service('plugin.manager.mail');
$module = "finder";
$key = 'complete_form';
$to = $decoded['email'];
$params['message'] = $body;
$params['subject'] = "ABC";
\Drupal::logger('finder')->notice("to is $to");
\Drupal::logger('finder')->notice("message is {$params['message']}");
//$params['node_title'] = $entity->label();
$langcode = \Drupal::currentUser()->getPreferredLangcode();
$send = true;
$result = $mailManager->mail($module, $key, $to, $langcode, $params, NULL, $send);
if ($result['result'] !== true) {
drupal_set_message(t('There was a problem sending your message and it was not sent.'), 'error');
return new JsonResponse("problem");
}
else {
drupal_set_message(t('Your message has been sent.'));
return new JsonResponse("success");
}
}
public function configuration() {
if (\Drupal::service('session')->isStarted() === FALSE) {
\Drupal::service('session')->start();
\Drupal::service('session')->set('foo', 'bar');
}
\Drupal::logger('finder')->notice("starting session.");
$config = \Drupal::service('config.factory')->getEditable("finder.settings");
$data = [];
$data["title"] = $config->get("title");
$data["subtitle"] = $config->get("subtitle");
$data["question_header"] = $config->get("question_header");
$data["service_header"] = $config->get("service_header");
$data["chart_header"] = $config->get("chart_header");
$data["email_form_header"] = $config->get("email_form_header");
$data["email_address"] = $config->get("email_address");
$data["email_name"] = $config->get("email_name");
$data["main_header"] = $config->get("main_header");
$data["button_select_all"] = $config->get("button_select_all");
$data["button_clear_selections"] = $config->get("button_clear_selections");
return new JsonResponse($data);
}
private function get_web_page($url) {
$options = array(
CURLOPT_RETURNTRANSFER => true, // return web page
CURLOPT_HEADER => false, // don't return headers
CURLOPT_FOLLOWLOCATION => true, // follow redirects
CURLOPT_MAXREDIRS => 10, // stop after 10 redirects
CURLOPT_ENCODING => "", // handle compressed
CURLOPT_USERAGENT => "test", // name of client
CURLOPT_AUTOREFERER => true, // set referrer on redirect
CURLOPT_CONNECTTIMEOUT => 120, // time-out on connect
CURLOPT_TIMEOUT => 120, // time-out on response
);
$ch = curl_init($url);
curl_setopt_array($ch, $options);
$content = curl_exec($ch);
curl_close($ch);
return $content;
}
}
src/Form/finderSettingsForm.php 0 → 100644
+ 138
− 0
View file @ e8e9af0d
<?PHP
// see
// https://www.drupal.org/docs/8/api/configuration-api/working-with-configuration-forms
//
namespace Drupal\finder\Form;
use Drupal\Core\Form\ConfigFormBase;
use Drupal\Core\Form\FormStateInterface;
/**
* Configure example settings for this site.
*/
class finderSettingsForm extends ConfigFormBase {
/**
* {@inheritdoc}
*/
public function getFormId() {
return 'finder_admin_settings';
}
/**
* {@inheritdoc}
*/
protected function getEditableConfigNames() {
return [
'finder.settings',
];
}
/**
* {@inheritdoc}
*/
public function buildForm(array $form, FormStateInterface $form_state) {
$config = $this->config('finder.settings');
$form['title'] = array(
'#type' => 'textfield',
'#title' => $this->t('Title'),
'#default_value' => $config->get('title'),
);
$form['subtitle'] = array(
'#type' => 'textarea',
'#title' => $this->t('Subtitle'),
'#default_value' => $config->get('subtitle'),
);
$form['question_header'] = array(
'#type' => 'textarea',
'#title' => $this->t('Question Header'),
'#default_value' => $config->get('question_header'),
);
$form['service_header'] = array(
'#type' => 'textarea',
'#title' => $this->t('Service Header'),
'#default_value' => $config->get('service_header'),
);
$form['chart_header'] = array(
'#type' => 'textarea',
'#title' => $this->t('Chart Header'),
'#default_value' => $config->get('chart_header'),
);
$form['email_form_header'] = array(
'#type' => 'textarea',
'#title' => $this->t('Email Header'),
'#default_value' => $config->get('email_form_header'),
);
$form['email_address'] = array(
'#type' => 'textfield',
'#title' => $this->t('Email Address'),
'#default_value' => $config->get('email_address'),
);
$form['email_name'] = array(
'#type' => 'textfield',
'#title' => $this->t('Email Name'),
'#default_value' => $config->get('email_name'),
);
$form['email_body'] = array(
'#type' => 'textfield',
'#title' => $this->t('Email Body'),
'#default_value' => $config->get('email_body'),
);
$form['main_header'] = array(
'#type' => 'textfield',
'#title' => $this->t('Main header (text in green)'),
'#default_value' => $config->get('main_header'),
);
$form['button_select_all'] = array(
'#type' => 'textfield',
'#title' => $this->t('Text in the "Select All" button'),
'#default_value' => $config->get('button_select_all'),
);
$form['button_clear_selections'] = array(
'#type' => 'textfield',
'#title' => $this->t('Text in the "Clear Selections" button'),
'#default_value' => $config->get('button_clear_selections'),
);
return parent::buildForm($form, $form_state);
}
/**
* {@inheritdoc}
*/
public function submitForm(array &$form, FormStateInterface $form_state) {
// Retrieve the configuration
\Drupal::configFactory()->getEditable('finder.settings')
// Set the submitted configuration setting
// You can set multiple configurations at once by making
// multiple calls to set()
->set('title', $form_state->getValue('title'))
->set('subtitle', $form_state->getValue('subtitle'))
->set('question_header', $form_state->getValue('question_header'))
->set('service_header', $form_state->getValue('service_header'))
->set('chart_header', $form_state->getValue('chart_header'))
->set('email_form_header', $form_state->getValue('email_form_header'))
->set('email_address', $form_state->getValue('email_address'))
->set('email_name', $form_state->getValue('email_name'))
->set('email_body', $form_state->getValue('email_body'))
->set('main_header', $form_state->getValue('main_header'))
->set('button_select_all', $form_state->getValue('button_select_all'))
->set('button_clear_selections', $form_state->getValue('button_clear_selections'))
->save();
parent::submitForm($form, $form_state);
}
}
templates/finder.html.twig 0 → 100644
+ 124
− 0
View file @ e8e9af0d
<div id="app" role="main">
<div class="row">
<div class="col-md-12 app-title">
<h2 class="title" id='pagetitle'>Page Title</h2>
<p class="lead" id='pagesubtitle'>This tool is intended to help you choose among services.</p>
<p class="cert"><span class="fa fa-comments"></span>We welcome feedback on this tool.</p>
</div>
</div>
<div class="row">
<div class="col-md-12">
<hr class="section-break">
<h2 class="sub-heading heading-services" >Describe your data</h2>
<div class="cd-row">
<div class="cd-cell cd-questions">
<div class="cd-overflow">
<div class="questions-header">
<h3 class="step-1" id='pagequestionheader'>
Answer these questions to help identify services that are suitable for your needs.
</h3>
<button class="btn btn-secondary btn-clear-filters ">Clear Answers</button>
</div>
<ol id="questionlist"></ol>
</div>
</div>
<div class="cd-cell cd-services">
<hr class="section-break hidden-sm hidden-md hidden-lg">
<h2 class="sub-heading hidden-sm hidden-md hidden-lg">Services</h2>
<div class="services-header">
<div>
<h3>
<span class="fa fa-arrow-circle-right" ></span>
<span id='pageserviceheader'>
Select services you would like to compare.
</span>
</h3>
</div>
<div>
<button class="btn btn-secondary btn-select-all selectall-button">Select All</button>
<button class="btn btn-secondary btn-select-none clear-button">Clear Selections</button>
</div>
</div>
<div id="modularstorage-services"></div>
</div>
</div>
</div>
</div>
<div id="container34" style="display:none;">
<hr class="section-break">
<div class="row">
<div class="col-md-12">
<h2 class="comparisonchart-wrapper-wrapper sub-heading" id='pagechartheader'>
Compare the services which match your selected criteria.
</h2>
<div>
<button class="btn btn-sm btn-secondary chart-select-all selectall-button">Select All</button>
<button class="btn btn-sm btn-primary chart-select-none clear-button">Clear Selections</button>
</div>
<fieldset>
<legend class="sr-only">Present in comparison table?</legend>
<div class="comparisonlist-wrapper"></div>
</fieldset>
<div class="comparisonchart-wrapper">
<table class="table table-striped table-bordered scrolling" id="comparisonchart"></table>
</div>
</div>
</div>
<hr class="section-break">
<div class="row">
<div class="col-md-12">
<h2 class="sub-heading">
Would you like more help, and/or to email your results to yourself?
</h2>
<span id='pageemailformheader'>
Email selected criteria and resulting choices to yourself and/or the consultants to learn more.
</span>
<div class="form-group">
<label for="name"> Name:
<input name="name" id="name" type="text" class="form-control">
</label>
</div>
<div class="form-group">
<label for="emailaddr"> Email:
<input name="emailaddr" id="emailaddr" type="email" class="form-control">
</label>
</div>
<div class="email-options">
<fieldset>
<legend>Send email with selections to:</legend>
<input type="checkbox" id="emailtoself" checked> <label for="emailtoself">self</label>; and/or
<input type="checkbox" id="emailtordmsg" checked> <label for="emailtordmsg">helpdesk</label>.
</fieldset>
</div>
<button type="button" id="send_email" class="btn btn-secondary">Send Email</button>
</div>
</div>
</div>
<div class="jump-to-chart">
<div class="container">
<div class="media">
<div class="media-body">
<p>
<span id="selection-number">0</span> Services Selected
</p>
</div>
<div class="media-right media-middle">
<button class="btn btn-secondary jump_button">Compare Results</button>
</div>
</div>
</div>
</div>
<div style="margin-top:25px;">
<p class="cert"><span class="fa fa-comments"></span>We welcome feedback on this tool.</p>
</div>
</div>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment