var form_div = document.getElementById('chnc_search');
if ( form_div.getAttribute('data-search') ) {
var search_titles = form_div.getAttribute('data-search').replace(/[^a-zA-Z0-9,]/gi, '');
} else {
var search_titles = "";
}
if ( form_div.getAttribute('data-heading') ) {
var heading = form_div.getAttribute('data-heading').replace(/[^a-zA-Z0-9 ]/gi, '');
} else {
var heading = "";
}
var color = form_div.getAttribute('data-color');
var addstyles = form_div.getAttribute('data-addstyles');
// Search specific titles or not
if ( search_titles ) {
var titles ="";
var titles_array = search_titles.split(",");
var i;
for (i = 0; i < titles_array.length; i++) {
titles += '';
}
} else {
var titles = "";
}
// Use heading or not
if ( heading && heading == "none" ) {
var form_heading = "";
} else if ( heading && heading != "yes" ) {
var form_heading = '
' + heading + '
';
} else {
var form_heading = '
Search Colorado Historic Newspapers
';
}
// Choose black or white image
if ( color && color == "dark" ) {
var logo_image = '';
} else {
var logo_image = '';
}
// Add styles or not
if ( addstyles != "no" || addstyles == "" ) {
var style = document.createElement('style');
// These are basic styles applicable to either light or dark; they just control the layout and basic colors
style.innerHTML = `
.chnc_widget { display: grid; grid-template-columns: minmax(60px, 80px) minmax(80%, 900px); align-items: center; max-width: 800px; }
.chnc-search-form { display: flex; margin-left: 1%; max-height: 70px; align-items: stretch; }
.chnc-search-form label { flex:1; }
input[type="search"].chnc-search-field { -webkit-appearance: none; width: 100%; height: 45px; border-radius: 2px 0 0 2px; }
input[type="submit"].chnc-search-submit { padding: 0 5%; height:45px; border-radius: 0 2px 2px 0; }
#chnc_search .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute!important; height: 0; width: 0; overflow: hidden; }
`;
if ( addstyles != "basic" ) {
style.innerHTML += `
input[type="submit"].chnc-search-submit { background-color: #b71928; }
input[type="submit"].chnc-search-submit:hover { background-color: #1d84b5; }
.chnc-search-field { color: #2c2a33; border: 1px solid #e1e5e6; border-radius: 3px; padding: 0.875rem; }
h3.chnc-search-heading { font-size: calc(16px + 4.5vw*.1); line-height: 1; margin: 1% 0; }
#chnc_search .chnc_widget img {border-radius: 0; box-shadow: none; }
`;
}
if ( color == "dark" ) {
style.innerHTML += `
#chnc_search { background-color: black; padding: 10px 15px; border-radius: 5px; }
h3.chnc-search-heading { color: white; }
#chnc_search .chnc_widget img {border-radius: 0; box-shadow: none; }
`;
}
document.head.appendChild(style);
}
// Build the form
var form = form_heading + '
' + logo_image +
'
';
// Display the form
form_div.innerHTML += form;