scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 09:35:56 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Search page functions

Browse source
This commit is contained in:
Rachel Thornton 2016-04-30 11:44:10 -04:00
parent 405f666109
commit 74a6d132bd
5 changed files with 24 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/box/box.jsx
View file

@ -7,6 +7,7 @@ var Box = React.createClass({
type: 'Box',
propTypes: {
title: React.PropTypes.string.isRequired,
subtitle: React.PropTypes.string,
moreTitle: React.PropTypes.string,
moreHref: React.PropTypes.string,
moreProps: React.PropTypes.object
@ -20,6 +21,7 @@ var Box = React.createClass({
<div className={classes}>
<div className="box-header">
<h4>{this.props.title}</h4>
<h2>{this.props.subtitle}</h2>
<p>
<a href={this.props.moreHref} {...this.props.moreProps}>
{this.props.moreTitle}

8
src/components/box/box.scss
View file

@ -73,6 +73,14 @@ $base-bg: $ui-white;
float: left;
}
h2 {
display: inline-block;
float: left;
font-size: 1rem;
font-weight: normal;
padding-left:5px;
}
p {
display: inline-block;
float: right;

10
src/components/carousel/carousel.jsx
View file

@ -44,14 +44,8 @@ var Carousel = React.createClass({
{this.props.items.map(function (item) {
var href = '';
var thumbnail_url = item.thumbnail_url;
if (item.thumbnail_url==undefined && item.thumbnail!=undefined) {
var lastFour = (item.id%10000).toString();
if (item.id%10000<1000) {
while (lastFour.length<4) {
lastFour = "0" + lastFour;
}
}
thumbnail_url = "//cdn.scratch.mit.edu/static/site/projects/thumbnails/"+Math.floor(item.id/10000)+"/"+lastFour+".png";
if (item.image!=undefined) {
thumbnail_url = item.image;
}
switch (item.type) {
case 'gallery':

2
src/views/explore/explore.jsx
View file

@ -29,7 +29,7 @@ var Explore = injectIntl(React.createClass({
return {};
},
componentDidMount: function () {
var pathname = window.location.pathname
var pathname = window.location.pathname;
if (pathname.substring(pathname.length-1,pathname.length)=="/") {
pathname = pathname.substring(0,pathname.length-1);
};

18
src/views/search/search.jsx
View file

@ -15,6 +15,7 @@ var Carousel = require('../../components/carousel/carousel.jsx');
var Select = require('../../components/forms/select.jsx');
var offset = 0;
var more = [];
var tab = "projects";
var searchTerm = "";
require('./search.scss');
@ -28,11 +29,13 @@ var Search = injectIntl(React.createClass({
return {};
},
componentDidMount: function () {
var pathname = window.location.search;
var q = pathname.lastIndexOf("q=");
var and = pathname.indexOf("&");
if (q!=-1 && and!=-1) {
searchTerm = pathname.substring(q+2,and).toLowerCase();
};
searchTerm = searchTerm.split('+').join(' ');
this.getSearchResults(0);
},
getSearchResults: function () {
@ -68,20 +71,20 @@ var Search = injectIntl(React.createClass({
row4 = row4.slice(12,16);
}
var rows = [
<Carousel items={this.state.searchResults}
<Carousel items={this.state.searchResults} showLoves={true}
settings={{slidesToShow: 4, slidesToScroll: 0}} />,
<Carousel items={row2}
<Carousel items={row2} showLoves={true}
settings={{slidesToShow: 4, slidesToScroll: 0}} />,
<Carousel items={row3}
<Carousel items={row3} showLoves={true}
settings={{slidesToShow: 4, slidesToScroll: 0}} />,
<Carousel items={row4}
<Carousel items={row4} showLoves={true}
settings={{slidesToShow: 4, slidesToScroll: 0}} />,
]
if (this.state.searchMore!=undefined && more.length<offset) more = more.concat(this.state.searchMore);
if (more.length>0) {
for (var i = 0; i<more.length; i+=4) {
var rowNext = more.slice(i,i+4);
rows.push(<Carousel items={rowNext} settings={{slidesToShow: 4, slidesToScroll: 0}} />);
rows.push(<Carousel items={rowNext} showLoves={true} settings={{slidesToShow: 4, slidesToScroll: 0}} />);
}
}
return rows;
@ -114,15 +117,16 @@ var Search = injectIntl(React.createClass({
return (
<div>
<div className="outer">
<Box title={'Search Results: '+searchTerm}
<Box title={'Search Results:'} subtitle={searchTerm}
moreProps={{
className: 'subnavigation'
}}>
<SubNavigation className="tabs">
{this.getTab("all")}
{this.getTab("projects")}
{this.getTab("studios")}
{this.getTab("forums")}
{this.getTab("users")}
{this.getTab("studios")}
{/*<div id="sorter">
<div id="sortText">
Sort by: