mirror of
https://github.com/chaoticbackup/chaoticbackup.github.io.git
synced 2026-04-18 14:47:29 -05:00
fix search; colletion collapsible boxes remember state
This commit is contained in:
parent
687dd1380a
commit
b65959ed3d
|
|
@ -1 +1 @@
|
|||
.icon14{height:14px;padding-bottom:2px}.icon16{height:16px}.icon20{height:20px}.icon24{height:24px}.bigger{font-size:14px}.name{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.name .subname:before{content:"\a ";white-space:pre}.name .subname{font-size:13px;padding-bottom:4px;display:inherit}@media only screen and (min-width:975px){.collection{margin-top:5px;margin-right:5px;margin-left:5px}.collection>.left{font-family:Roboto,Arial,sans-serif;float:left;width:30%}.collection>.right{font-family:Roboto,Arial,sans-serif;float:right;width:70%}}@media only screen and (min-width:975px){.collection #buttons{margin:0 0 2% 1%}.collection #buttons,.collection .button,.collection input[type=button],.collection input[type=text]{border-radius:5px;border-color:transparent;text-align:center;outline:none}.collection input[type=text]{margin-bottom:2px}.collection .centeredCheckBox,.collection input[type=text]{width:220px}.collection .text-entry{display:flex;justify-content:center;align-items:center}.collection .text-entry input:focus{outline:none}.collection .card{text-align:left;display:flex;border:1px solid #aeaeae}.collection .card .left,.collection .card .right,.collection .card .stats{padding-top:4px}.collection .card .bigger{text-align:center;font-weight:700}.collection .card .energy{display:flex;width:20px!important}.collection .card .left{vertical-align:text-top;float:left;width:210px;padding-left:4px}.collection .card .right{float:left;width:calc(100% - 322px);border-left:2px solid #aeaeae;padding-left:4px;padding-right:4px;padding-bottom:6px;white-space:pre-line}.collection .creature .right{width:calc(100% - 366px)}.collection .creature .stats{vertical-align:text-top;float:left;text-align:right;width:40px}.collection .SearchForm{padding-top:3px;font-family:Roboto,Arial,sans-serif}.collection .searchName{display:flex;justify-content:center;align-items:center;padding:2%;font-size:16pt}.collection .centeredCheckBox{margin:0 auto;text-align:left}.collection .centeredSpacing{display:flex;justify-content:space-between}.collection .setBox{width:80%;float:right}.collection #sets{width:80%}.collection .centeredButtons{display:flex;justify-content:center;align-items:center}.collection #search{width:25%;margin:2%;border-radius:5px;border-color:transparent;text-align:center}.collection .minMax{display:flex;justify-content:space-between;margin:0 auto;width:50%;text-align:right}.collection .brainwashed{border-radius:3px;background-color:#dcdddf;color:#000!important}.collection .chieftain,.collection .flavortext{font-style:italic}.collection .disciplines input{width:30px;height:14px;text-align:center;margin-top:2px}.collection .mull input{margin-left:0;margin-top:1px}.collection .Collapsible__contentInner input,.collection .mull input{vertical-align:middle}.collection .Collapsible__contentInner .centeredCheckBox{width:50%}.collection .mcbp input{width:24px;height:14px;padding:unset;text-align:center;margin-top:2px}.collection .tribes{width:96%;text-align:center}.collection .and,.collection .disciplines{text-align:center}.collection .and{vertical-align:text-bottom;width:15%;border-radius:5px;border-color:transparent;margin:2%}}.collection .card .icon14,.collection .card .icon16,.collection .card .icon20,.collection .card .icon24{vertical-align:middle}.collection .thumb{width:100px;height:98px}.collection .card .thumb{float:left}.collection .Collapsible{margin-bottom:5px;margin-top:5px;width:96%}.collection .Collapsible__trigger{background-color:#333;display:block;position:relative;padding-top:5px;padding-bottom:5px;text-indent:5px;font-weight:700;white-space:pre}.collection .Collapsible__trigger:hover{background-color:red}.collection .Collapsible__trigger:after{content:"^";position:absolute;right:10px;top:10px;display:block;transition:transform .4s}.collection .Collapsible__trigger.is-open:after{transform:rotate(180deg);right:5px;top:5px}.collection .Collapsible__trigger.is-disabled{opacity:.5;background-color:grey}.collection .Collapsible__contentInner{margin-top:5px}.collection .left{position:relative}.collection .card_img{position:absolute;width:100%;z-index:2;left:-11px}.collection .card_img .hidden{display:none;max-height:0}.collection .card_img img{max-width:250px;max-height:350px}.collection .entries{text-align:left;width:100%}.collection .entries input[type=button]{margin:0 0 2% 1%}.collection .list-nav-top{display:flex}.collection .extended .fullcard{max-width:250px;max-height:350px}.collection hr{width:96%;margin-inline-start:0}.collection .none{display:inline}.collection .none>span{top:-3px;position:relative}.collection label{user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-o-user-select:none;-moz-user-select:none}
|
||||
.icon14{height:14px;padding-bottom:2px}.icon16{height:16px}.icon20{height:20px}.icon24{height:24px}.bigger{font-size:14px}.name{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.name .subname:before{content:"\a ";white-space:pre}.name .subname{font-size:13px;padding-bottom:4px;display:inherit}@media only screen and (min-width:975px){.collection{margin-top:5px;margin-right:5px;margin-left:5px}}@media only screen and (min-width:975px){.collection>.left{font-family:Roboto,Arial,sans-serif;float:left;width:30%}.collection>.right{font-family:Roboto,Arial,sans-serif;float:right;width:70%}.collection #buttons{margin:0 0 2% 1%}.collection #buttons,.collection .button,.collection input[type=button],.collection input[type=text]{border-radius:5px;border-color:transparent;text-align:center;outline:none}.collection input[type=text]{margin-bottom:2px}.collection .centeredCheckBox,.collection input[type=text]{width:220px}.collection .text-entry{display:flex;justify-content:center;align-items:center}.collection .text-entry input:focus{outline:none}.collection .card{text-align:left;display:flex;border:1px solid #aeaeae}.collection .card .left,.collection .card .right,.collection .card .stats{padding-top:4px}.collection .card .bigger{text-align:center;font-weight:700}.collection .card .energy{display:flex;width:20px!important}.collection .card .left{vertical-align:text-top;float:left;width:210px;padding-left:4px}.collection .card .right{float:left;width:calc(100% - 322px);border-left:2px solid #aeaeae;padding-left:4px;padding-right:4px;padding-bottom:6px;white-space:pre-line}.collection .creature .right{width:calc(100% - 366px)}.collection .creature .stats{vertical-align:text-top;float:left;text-align:right;width:40px}.collection .SearchForm{padding-top:3px;font-family:Roboto,Arial,sans-serif}.collection .searchName{display:flex;justify-content:center;align-items:center;padding:2%;font-size:16pt}.collection .centeredCheckBox{margin:0 auto;text-align:left}.collection .centeredSpacing{display:flex;justify-content:space-between}.collection .setBox{width:80%;float:right}.collection #sets{width:80%}.collection .centeredButtons{display:flex;justify-content:center;align-items:center}.collection #search{width:25%;margin:2%;border-radius:5px;border-color:transparent;text-align:center}.collection .minMax{display:flex;justify-content:space-between;margin:0 auto;width:50%;text-align:right}.collection .brainwashed{border-radius:3px;background-color:#dcdddf;color:#000!important}.collection .chieftain,.collection .flavortext{font-style:italic}.collection .mull input{margin-left:0;margin-top:1px}.collection .Collapsible__contentInner input,.collection .mull input{vertical-align:middle}.collection .Collapsible__contentInner .centeredCheckBox{width:50%}.collection .tribes{width:96%;text-align:center}.collection .and,.collection .disciplines{text-align:center}.collection .and{vertical-align:text-bottom;width:15%;border-radius:5px;border-color:transparent;margin:2%}}.collection .disciplines input{width:30px;height:14px;text-align:center;margin-top:2px}.collection .mcbp input{width:24px;height:14px;padding:unset;text-align:center;margin-top:2px}.collection .card .icon14,.collection .card .icon16,.collection .card .icon20,.collection .card .icon24{vertical-align:middle}.collection .thumb{width:100px;height:98px}.collection .card .thumb{float:left}.collection .Collapsible{margin-bottom:5px;margin-top:5px;width:96%}.collection .Collapsible__trigger{background-color:#333;display:block;position:relative;padding-top:5px;padding-bottom:5px;text-indent:5px;font-weight:700;white-space:pre}.collection .Collapsible__trigger:hover{background-color:red}.collection .Collapsible__trigger:after{content:"^";position:absolute;right:10px;top:10px;display:block;transition:transform .4s}.collection .Collapsible__trigger.is-open:after{transform:rotate(180deg);right:5px;top:5px}.collection .Collapsible__trigger.is-disabled{opacity:.5;background-color:grey}.collection .Collapsible__contentInner{margin-top:5px}.collection .left{position:relative}.collection .card_img{position:absolute;width:100%;z-index:2;left:-11px}.collection .card_img .hidden{display:none;max-height:0}.collection .card_img img{max-width:250px;max-height:350px}.collection .entries{text-align:left;width:100%}.collection .entries input[type=button]{margin:0 0 2% 1%}.collection .list-nav-top{display:flex}.collection .extended .fullcard{max-width:250px;max-height:350px}.collection hr{width:96%;margin-inline-start:0}.collection .none{display:inline}.collection .none>span{top:-3px;position:relative}.collection label{user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;-o-user-select:none;-moz-user-select:none}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
|||
.icon14{height:14px;padding-bottom:2px}.icon16{height:16px}.icon20{height:20px}.icon24{height:24px}.bigger{font-size:14px}.name{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.name .subname:before{content:"\a ";white-space:pre}.name .subname{font-size:13px;padding-bottom:4px;display:inherit}.portal .navbar h1{font-size:16px}.portal .navbar ul{list-style-type:none;margin:0;padding:0;overflow:hidden;background-color:#333}.portal .navbar li{float:left}.portal .navbar .dropbtn,.portal .navbar li a{display:inline-block;color:#fff;text-align:center;padding:14px 16px;text-decoration:none}.portal .navbar .dropdown:hover .dropbtn,.portal .navbar li a:hover{background-color:red}.portal .navbar li.dropdown{display:inline-block}.portal .navbar .dropdown-content{display:none;position:absolute;background-color:#333;min-width:140px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1}.portal .navbar .dropdown-content a{color:#fff;padding:12px 16px;text-decoration:none;display:block;text-align:left}.portal .navbar .dropdown:hover .dropdown-content{display:block}.portal .magnifying-glass{cursor:pointer;transition:color .2s;z-index:1;vertical-align:middle;fill:currentColor;height:18px;min-width:18px;width:18px}.portal .search .results div{padding-bottom:10px}.portal .search .results a{font-size:16px;line-height:20px}.portal .entry{font-size:1.2em}.portal .entry .title{font-weight:700;font-size:16px}.portal .entry .left{float:left;width:100px}.portal .entry .right{float:right;width:86%}.portal .entry .left .title{text-align:left;padding-bottom:10px}.portal .entry .icon14,.portal .entry .icon16,.portal .entry .icon20,.portal .entry .icon24{vertical-align:middle}.portal .entry .entry_content{min-height:550px;height:calc(100vh - 300px);overflow-y:auto;width:100%;position:relative}.portal .entry .entry_content .entry_splash{padding-bottom:4px}.portal .entry .entry_content .entry_splash img{max-width:100%}.portal .entry .entry_content .entry_splash .arrow{position:absolute;color:#f1f1f1;font-size:40px;font-weight:700;width:100%;top:95%}.portal .entry .entry_content .entry_body{position:relative;max-width:100%;padding-bottom:4px;display:flex;flex-wrap:wrap}.portal .entry .entry_content .entry_body hr{margin:0}.portal .entry .entry_content .entry_body .title{min-width:100%}.portal .entry .entry_content .entry_body .title hr{margin-top:8px}.portal .entry .entry_content .entry_body .column>div,.portal .entry .entry_content .entry_body .nocolumn>div{padding:8px}.portal .entry .entry_content .entry_body .column:nth-child(2){flex-grow:1;text-align:left;min-width:0;width:30%}.portal .entry .entry_content .entry_body .column:last-child{flex-grow:2;min-width:0;flex:60%;border-left:1px solid #fff}.portal .entry .entry_content .entry_body .ability{white-space:pre-line;word-wrap:break-all}.portal .entry .entry_content .entry_body div{white-space:pre-line}.portal .entry .entry_content::-webkit-scrollbar{width:1px}.portal .entry .cat_title{text-align:left;background-color:#1a1a1a;font-weight:700;font-size:16px;padding-top:1px;padding-left:4px}.portal .entry .entry_nav{background-color:#1a1a1a;overflow-x:scroll;overflow-y:hidden;white-space:nowrap}.portal .entry .entry_nav>div{display:inline-block}.portal .entry .entry_nav>div img{margin-right:3px;margin-left:3px;height:100px}.portal .entry.base_path .cat_title,.portal .entry.base_path .entry_nav{background-color:inherit}.portal .entry.base_path .cat_title{padding-top:1em;padding-bottom:1em}.portal .entry.base_path .entry_nav{overflow-y:auto;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-content:space-between}.portal .entry.base_path .entry_nav>div{overflow-wrap:break-word;margin:3px;max-width:106px}.portal .entry .modal{position:fixed;z-index:10;padding-top:50px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.9)}.portal .entry .modal.hidden{display:none}.portal .entry .modal-content{margin:auto;display:block;max-height:calc(100vh - 100px);max-width:90vw}.portal .entry .caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}.portal .entry #caption,.portal .entry .modal-content{-webkit-animation-name:zoom;-webkit-animation-duration:.6s;animation-name:zoom;animation-duration:.6s}@-webkit-keyframes zoom{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1)}}@keyframes zoom{0%{transform:scale(0)}to{transform:scale(1)}}.portal .entry .close{position:fixed;top:35px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s}.portal .entry .close:focus,.portal .entry .close:hover{color:#bbb;text-decoration:none;cursor:pointer}
|
||||
.icon14{height:14px;padding-bottom:2px}.icon16{height:16px}.icon20{height:20px}.icon24{height:24px}.bigger{font-size:14px}.name{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}.name .subname:before{content:"\a ";white-space:pre}.name .subname{font-size:13px;padding-bottom:4px;display:inherit}.portal .navbar h1{font-size:16px}.portal .navbar ul{list-style-type:none;margin:0;padding:0;overflow:hidden;background-color:#333}.portal .navbar li{float:left}.portal .navbar .dropbtn,.portal .navbar li a{display:inline-block;color:#fff;text-align:center;padding:14px 16px;text-decoration:none}.portal .navbar .dropdown:hover .dropbtn,.portal .navbar li a:hover{background-color:red}.portal .navbar li.dropdown{display:inline-block}.portal .navbar .dropdown-content{display:none;position:absolute;background-color:#333;min-width:140px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1}.portal .navbar .dropdown-content a{color:#fff;padding:12px 16px;text-decoration:none;display:block;text-align:left}.portal .navbar .dropdown:hover .dropdown-content{display:block}.portal .magnifying-glass{cursor:pointer;transition:color .2s;z-index:1;vertical-align:middle;fill:currentColor;height:18px;min-width:18px;width:18px}.portal .search .results div{padding-bottom:10px}.portal .search .results a{font-size:16px;line-height:20px}.portal .entry{font-size:1.2em}.portal .entry .title{font-weight:700;font-size:16px}.portal .entry .left{float:left;width:100px}.portal .entry .right{float:right;width:86%}.portal .entry .left .title{text-align:left;padding-bottom:10px}.portal .entry .icon14,.portal .entry .icon16,.portal .entry .icon20,.portal .entry .icon24{vertical-align:middle}.portal .entry .entry_content{min-height:550px;height:calc(100vh - 300px);overflow-y:auto;width:100%;position:relative}.portal .entry .entry_content .entry_splash{padding-bottom:4px}.portal .entry .entry_content .entry_splash img{max-width:100%}.portal .entry .entry_content .entry_splash .arrow{position:absolute;color:#f1f1f1;font-size:40px;font-weight:700;width:100%;top:95%}.portal .entry .entry_content .entry_body{position:relative;max-width:100%;padding-bottom:4px;display:flex;flex-wrap:wrap}.portal .entry .entry_content .entry_body hr{margin:0}.portal .entry .entry_content .entry_body .title{min-width:100%}.portal .entry .entry_content .entry_body .title hr{margin-top:8px}.portal .entry .entry_content .entry_body .column>div,.portal .entry .entry_content .entry_body .nocolumn>div{padding:8px}.portal .entry .entry_content .entry_body .column:nth-child(2){flex-grow:1;text-align:left;min-width:0;width:30%}.portal .entry .entry_content .entry_body .column:last-child{flex-grow:2;min-width:0;flex:60%;border-left:1px solid #fff}.portal .entry .entry_content .entry_body .ability{white-space:pre-line;word-wrap:break-all}.portal .entry .entry_content .entry_body div{white-space:pre-line}.portal .entry .entry_content::-webkit-scrollbar{width:1px}.portal .entry .cat_title{text-align:left;background-color:#1a1a1a;font-weight:700;font-size:16px;padding-top:1px;padding-left:4px}.portal .entry .entry_nav{background-color:#1a1a1a;overflow-x:scroll;overflow-y:hidden;white-space:nowrap}.portal .entry .entry_nav .nav_item{display:inline-block;margin-right:3px;margin-left:3px}.portal .entry .entry_nav .nav_item img{min-width:96px;height:100px}.portal .entry.base_path .cat_title,.portal .entry.base_path .entry_nav{background-color:inherit}.portal .entry.base_path .cat_title{padding-top:1em;padding-bottom:1em}.portal .entry.base_path .entry_nav{overflow-y:auto;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-content:space-between}.portal .entry.base_path .entry_nav .nav_item{overflow-wrap:break-word;margin:3px;max-width:106px}.portal .entry .modal{position:fixed;z-index:10;padding-top:50px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.9)}.portal .entry .modal.hidden{display:none}.portal .entry .modal-content{margin:auto;display:block;max-height:calc(100vh - 100px);max-width:90vw}.portal .entry .caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}.portal .entry #caption,.portal .entry .modal-content{-webkit-animation-name:zoom;-webkit-animation-duration:.6s;animation-name:zoom;animation-duration:.6s}@-webkit-keyframes zoom{0%{-webkit-transform:scale(0)}to{-webkit-transform:scale(1)}}@keyframes zoom{0%{transform:scale(0)}to{transform:scale(1)}}.portal .entry .close{position:fixed;top:35px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s}.portal .entry .close:focus,.portal .entry .close:hover{color:#bbb;text-decoration:none;cursor:pointer}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,11 +1,16 @@
|
|||
@import '../base';
|
||||
|
||||
@media only screen and (min-width: 975px) {
|
||||
|
||||
.collection {
|
||||
margin-top: 5px;
|
||||
margin-right: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.collection {
|
||||
|
||||
@media only screen and (min-width: 975px) {
|
||||
|
||||
> .left {
|
||||
font-family: Roboto, Arial, sans-serif;
|
||||
|
|
@ -18,12 +23,6 @@
|
|||
float: right;
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.collection {
|
||||
|
||||
@media only screen and (min-width: 975px) {
|
||||
|
||||
#buttons {
|
||||
border-radius: 5px;
|
||||
|
|
@ -179,13 +178,6 @@
|
|||
font-style: italic;
|
||||
}
|
||||
|
||||
.disciplines input {
|
||||
width: 30px;
|
||||
height: 14px;
|
||||
text-align: center;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.mull input {
|
||||
margin-left: 0px;
|
||||
margin-top: 1px;
|
||||
|
|
@ -201,14 +193,6 @@
|
|||
width: 50%;
|
||||
}
|
||||
|
||||
.mcbp input {
|
||||
width: 24px;
|
||||
height: 14px;
|
||||
padding: unset;
|
||||
text-align: center;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.tribes {
|
||||
width: 96%;
|
||||
text-align: center;
|
||||
|
|
@ -230,6 +214,21 @@
|
|||
}
|
||||
/* desktop */
|
||||
|
||||
.disciplines input {
|
||||
width: 30px;
|
||||
height: 14px;
|
||||
text-align: center;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.mcbp input {
|
||||
width: 24px;
|
||||
height: 14px;
|
||||
padding: unset;
|
||||
text-align: center;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.card .icon14, .card .icon16,
|
||||
.card .icon20, .card .icon24 {
|
||||
vertical-align: middle;
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import search_api from './search';
|
|||
export default class SearchCollection extends React.Component {
|
||||
@observable loaded = false;
|
||||
@observable input;
|
||||
@observable collapsed;
|
||||
list = ["sets", "types", "rarity", "tribes", "elements", "mull", "gender"];
|
||||
|
||||
constructor(props) {
|
||||
|
|
@ -19,10 +20,35 @@ export default class SearchCollection extends React.Component {
|
|||
this.search = this.search.bind(this);
|
||||
this.handleChange = this.handleChange.bind(this);
|
||||
this.reset = this.reset.bind(this);
|
||||
this.handleTriggerClick = this.handleTriggerClick.bind(this);
|
||||
|
||||
this.props.handleContent([{'text': 'Loading...'}]);
|
||||
|
||||
this.cleanInput();
|
||||
this.parseQuery();
|
||||
|
||||
this.fetchCollapsed();
|
||||
}
|
||||
|
||||
fetchCollapsed = () => {
|
||||
let collapsed = localStorage.getItem("collapsed")
|
||||
|
||||
if (collapsed) collapsed = JSON.parse(collapsed);
|
||||
else collapsed = {
|
||||
disciplines: true,
|
||||
energy: true,
|
||||
bpmc: true,
|
||||
types: true,
|
||||
rarity: false,
|
||||
sets: false
|
||||
}
|
||||
|
||||
this.collapsed = collapsed;
|
||||
}
|
||||
|
||||
handleTriggerClick = (type) => {
|
||||
this.collapsed[type] = !this.collapsed[type];
|
||||
localStorage.setItem("collapsed", JSON.stringify(this.collapsed));
|
||||
}
|
||||
|
||||
cleanInput = () => {
|
||||
|
|
@ -249,38 +275,70 @@ export default class SearchCollection extends React.Component {
|
|||
<input type="button" value={this.input.elements.none ? "only" : "and"} className="and" disabled={this.input.elements.and} onClick={(e)=>{this.input.elements.and=true;}} />
|
||||
</div>
|
||||
<hr />
|
||||
<div className="disciplines">
|
||||
{disciplines}
|
||||
</div>
|
||||
<Collapsible open={true} trigger="Energy">
|
||||
<CollapsibleWrapper
|
||||
type="disciplines"
|
||||
trigger="Disciplines"
|
||||
open={this.collapsed.disciplines}
|
||||
onClick={this.handleTriggerClick}
|
||||
>
|
||||
<div className="disciplines">
|
||||
{disciplines}
|
||||
</div>
|
||||
</CollapsibleWrapper>
|
||||
<CollapsibleWrapper
|
||||
type="energy"
|
||||
trigger="Energy"
|
||||
open={this.collapsed.energy}
|
||||
onClick={this.handleTriggerClick}
|
||||
>
|
||||
<div className="minMax">
|
||||
<label className="mcbp">Min <input type="text" name="min" value={this.input.energy.min} onChange={e => this.handleChange(e, "energy")} /></label>
|
||||
<label className="mcbp">Max <input type="text" name="max" value={this.input.energy.max} onChange={e => this.handleChange(e, "energy")} /></label>
|
||||
</div>
|
||||
</Collapsible>
|
||||
<Collapsible open={true} trigger="Build Points Mugic Counters/Cost">
|
||||
</CollapsibleWrapper>
|
||||
<CollapsibleWrapper
|
||||
type="bpmc"
|
||||
trigger="Build Points Mugic Counters/Cost"
|
||||
open={this.collapsed.bpmc}
|
||||
onClick={this.handleTriggerClick}
|
||||
>
|
||||
<div className="minMax">
|
||||
<label className="mcbp">Min <input type="text" name="min" value={this.input.mcbp.min} onChange={e => this.handleChange(e, "mcbp")} /></label>
|
||||
<label className="mcbp">Max <input type="text" name="max" value={this.input.mcbp.max} onChange={e => this.handleChange(e, "mcbp")} /></label>
|
||||
</div>
|
||||
</Collapsible>
|
||||
<Collapsible open={true} trigger="Types">
|
||||
</CollapsibleWrapper>
|
||||
<CollapsibleWrapper
|
||||
type="types"
|
||||
trigger="Card Type"
|
||||
open={this.collapsed.types}
|
||||
onClick={this.handleTriggerClick}
|
||||
>
|
||||
<div className="centeredCheckBox">
|
||||
{types}
|
||||
</div>
|
||||
</Collapsible>
|
||||
<Collapsible trigger="Rarity">
|
||||
</CollapsibleWrapper>
|
||||
<CollapsibleWrapper
|
||||
type="rarity"
|
||||
trigger="Rarity"
|
||||
open={this.collapsed.rarity}
|
||||
onClick={this.handleTriggerClick}
|
||||
>
|
||||
<div className="centeredCheckBox">
|
||||
{rarity}
|
||||
</div>
|
||||
</Collapsible>
|
||||
<Collapsible trigger="Sets">
|
||||
</CollapsibleWrapper>
|
||||
<CollapsibleWrapper
|
||||
type="sets"
|
||||
trigger="Sets"
|
||||
open={this.collapsed.sets}
|
||||
onClick={this.handleTriggerClick}
|
||||
>
|
||||
<div className="setBox">
|
||||
<div className="centeredCheckBox" id="sets">
|
||||
{sets}
|
||||
</div>
|
||||
</div>
|
||||
</Collapsible>
|
||||
</CollapsibleWrapper>
|
||||
{/*<Collapsible trigger="Gender (fan content)">{gender}</Collapsible>*/}
|
||||
<div className="centeredButtons">
|
||||
<input id="search" type="submit" value="Search" />
|
||||
|
|
@ -290,5 +348,18 @@ export default class SearchCollection extends React.Component {
|
|||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function CollapsibleWrapper(props) {
|
||||
const {type, children, onClick, ...rest} = props;
|
||||
|
||||
return (
|
||||
<span onClick={() => onClick(type)} >
|
||||
<Collapsible
|
||||
{...rest}
|
||||
>
|
||||
{children}
|
||||
</Collapsible>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
|
@ -66,24 +66,26 @@ export default function search_api(input) {
|
|||
return ({'$regex': new RegExp(item.trim(), 'i')});
|
||||
});
|
||||
// clean text
|
||||
let inputtext = input.text.replace(/\\/g, '').replace(/\(|\)/g, (match) => {return ("\\"+match)});
|
||||
let inputtext = new RegExp(input.text.replace(/\\/g, '').replace(/\(|\)/g, (match) => {return ("\\"+match)}), "i");
|
||||
|
||||
console.log(inputtext);
|
||||
let parm = (() => {
|
||||
let list = [
|
||||
{'gsx$tags': {"$or": textList}},
|
||||
{'gsx$ability': {"$or": {'$regex': new RegExp(inputtext, 'i')}}}
|
||||
{'gsx$ability': {'$regex': inputtext}}
|
||||
]
|
||||
if (input.flavor) {
|
||||
list.push({'gsx$flavortext': {"$or": textList}});
|
||||
list.push({'gsx$artist': {"$or": textList}});
|
||||
}
|
||||
console.log(list);
|
||||
return list;
|
||||
})();
|
||||
|
||||
attackResults = attackResults.find({'$or': parm});
|
||||
battlegearResults = battlegearResults.find({'$or': parm});
|
||||
creatureResults = creatureResults.find({'$or':
|
||||
(parm.concat([{'gsx$brainwashed': {"$or": textList}}]))
|
||||
(parm.concat([{'gsx$brainwashed': {'$regex': inputtext}}]))
|
||||
});
|
||||
locationResults = locationResults.find({'$or': parm});
|
||||
mugicResults = mugicResults.find({'$or': parm});
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@ export default class Category extends React.Component {
|
|||
// Prevent site from crashing due to misspelled/missing data
|
||||
if (!data) return (<div key={i}></div>);
|
||||
|
||||
return (<div key={i}>
|
||||
return (<div key={i} className="nav_item">
|
||||
<Interactive as={Link}
|
||||
to={url || `/portal/${this.props.type}/${card.gsx$name}`}
|
||||
{...s.link}
|
||||
|
|
|
|||
|
|
@ -221,11 +221,13 @@
|
|||
overflow-x: scroll;
|
||||
overflow-y: hidden;
|
||||
white-space: nowrap;
|
||||
> div {
|
||||
|
||||
.nav_item {
|
||||
display: inline-block;
|
||||
margin-right: 3px;
|
||||
margin-left: 3px;
|
||||
|
||||
img {
|
||||
margin-right: 3px;
|
||||
margin-left: 3px;
|
||||
min-width: 96px;
|
||||
height: 100px;
|
||||
}
|
||||
|
|
@ -247,7 +249,8 @@
|
|||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
align-content: space-between;
|
||||
> div {
|
||||
|
||||
.nav_item {
|
||||
overflow-wrap: break-word;
|
||||
margin: 3px;
|
||||
max-width: 106px;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user