Unverified Commit 6397ac8a authored by Karishma Chadha's avatar Karishma Chadha Committed by GitHub

Revert "[Master] Hotfix/totally normal 2021"

parent 9c06f27c
This diff is collapsed.
const React = require('react');
const bindAll = require('lodash.bindall');
const Modal = require('../modal/base/modal.jsx');
const ModalTitle = require('../modal/base/modal-title.jsx');
require('./cats.scss');
const catImages = [
'/images/cats/IMG_9775.jpg',
'/images/cats/IMG_9766.jpg',
'/images/cats/IMG_9587.jpg',
'/images/cats/IMG_6558.jpg',
'/images/cats/IMG_6521.jpg',
'/images/cats/IMG_6020.jpg',
'/images/cats/IMG_5880.jpg',
'/images/cats/IMG_3218.jpg',
'/images/cats/IMG_2776.jpg',
'/images/cats/IMG_2775.jpg',
'/images/cats/IMG_2681.jpg',
'/images/cats/IMG_1092.jpg',
'/images/cats/IMG_0684.jpg',
'/images/cats/IMG_0698.jpg',
'/images/cats/IMG_0504.jpg',
'/images/cats/IMG_0288.jpg',
'/images/cats/IMG_0122.jpg',
'/images/cats/IMG_2507.jpg',
'/images/cats/IMG_1977.jpg',
'/images/cats/IMG_1696.jpg',
'/images/cats/IMG_1463.jpg',
'/images/cats/IMG_1157.jpg',
'/images/cats/IMG_0681.jpg',
'/images/cats/IMG_0135.jpg',
'/images/cats/IMG_0071.jpg',
'/images/cats/1.jpg',
'/images/cats/2.jpg',
'/images/cats/3.jpg',
'/images/cats/4.jpg',
'/images/cats/cat-meme.jpg',
'/images/cats/cat-meme2.jpg',
'/images/cats/Cat1.jpg',
'/images/cats/Cat2.jpg',
'/images/cats/Cat3.jpg',
'/images/cats/Cat4.jpg',
'/images/cats/Cat5.jpg',
'/images/cats/Cat6.png',
'/images/cats/Cat7.jpg',
'/images/cats/Cat8.jpg',
'/images/cats/Cat9.jpg',
'/images/cats/Cat10.png',
'/images/cats/Cat11.png',
'/images/cats/Cat12.png',
'/images/cats/Cat13.png',
'/images/cats/Cat14.png',
'/images/cats/IMG_2167.jpg',
'/images/cats/IMG_4316.jpg',
'/images/cats/IMG_5396.jpg'
];
/* eslint-disable max-len */
const mysteryFacts = [
'I became a pet after retiring from NASA.',
'I was cursed to take this form by an evil wizard.',
'My alter ego is Katy Purry.',
'You should feed me now or I\'ll be late to my bowling league.',
'You think you know, but you have no idea. This is the diary of Scratch Cat...',
'I\'m a criminal paw-secutor.',
'By night, I put on a human costume and fight crime.',
'My grandma was the inspiration for Warrior Cats.',
'You think I\'m running back and forth for no reason, but I\'ve got a marathon in June I\'m training for.',
'Can you please put on the movie Ratatouille?',
'In my secret lab I\'ve almost perfected prosthetic opposable thumbs.',
'I\'m late for my audition for Cats: The Musical.',
'Actually I\'m a famous opera meower.',
'My purrs are ancient healing magic.',
'I purr because I contain a small motor.',
'I\'m not trying to stab you with my claws, I\'m practicing to be on The Great British Bakeoff.',
'My name is Alexander Hameowlton.',
'When my humans go to school, I host tea parties with the neighborhood pets.',
'When I scratch at the furniture it\'s my way of telling you it\'s time for a new couch',
'I knock things off the table, because things on the table are my mortal enemies.',
'When I sleep, I dream about three things: fish, catnip, and you. But mostly fish.',
'This is my angry face.',
'I\'m a cat during the day, but I\'m a loaf ... also during the day.',
'At night I closely study the word "homeowner" because the word "meow" is in it.',
'My journal is filled with so many cat puns, I almost cat believe it.',
'I\'m gonna change the world super soon, quick 3-hour power nap first.',
'If Scratch code happened in real life, "Move 10" would make me just sit there and look at you',
'I theorized the existence of radium and then was so disappointed to out that Marie Curie had beat me to it in 1902!',
'In my free time, I like to go bird watching.',
'Hannah Meowtana was inspired by my life.'
];
/* eslint-enable max-len */
class Cats extends React.Component {
constructor (props) {
super(props);
bindAll(this, [
'handleCatsClick',
'handleClose',
'pickRandomFact'
]);
this.state = {
open: false
};
}
handleCatsClick () {
this.setState({open: true});
}
handleClose () {
this.setState({open: false});
}
pickRandomFact () {
const randomNumber = Math.floor(Math.random() * (mysteryFacts.length - 1));
const catFact = mysteryFacts[randomNumber];
return catFact;
}
pickRandomCatImage () {
const randomNumber = Math.floor(Math.random() * (catImages.length - 1));
const catImage = catImages[randomNumber];
return catImage;
}
render () {
return (<React.Fragment>
<div onClick={this.handleCatsClick}>
<a> {'Secret Lives'} </a>
</div>
<Modal
useStandardSizes
className="mod-cats"
isOpen={this.state.open}
onRequestClose={this.handleClose}
>
<div className="cats-modal-header modal-header">
<ModalTitle title={'Shhh... 🤫'} />
</div>
<div className="cats-modal-content modal-content">
<p> {this.pickRandomFact()} </p>
<img src={this.pickRandomCatImage()} />
</div>
</Modal>
</React.Fragment>
);
}
}
module.exports = Cats;
@import "../../colors";
@import "../../frameless";
.mod-cats {
min-height: 15rem;
max-height: calc(100% - 5rem);
overflow: hidden;
}
.cats-modal-header {
box-shadow: inset 0 -1px 0 0 $ui-blue-dark;
background-color: $ui-blue;
}
.cats-modal-content {
margin: 0 auto;
box-shadow: none;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding: 20px 50px;
}
.cats-modal-content img {
width: 400px;
@media #{$small}, #{$small-height} {
width: 100%;
}
}
......@@ -8,7 +8,6 @@ const React = require('react');
const FooterBox = require('../container/footer.jsx');
const LanguageChooser = require('../../languagechooser/languagechooser.jsx');
const Cats = require('../../cats/cats.jsx');
const frameless = require('../../../lib/frameless');
const getScratchWikiLink = require('../../../lib/scratch-wiki');
......@@ -35,9 +34,6 @@ const Footer = props => (
<FormattedMessage id="general.contactUs" />
</a>
</dd>
<dd>
<Cats />
</dd>
</dl>
<dl>
<dd>
......@@ -104,9 +100,7 @@ const Footer = props => (
<FormattedMessage id="general.donate" />
</a>
</dd>
<dd>
<Cats />
</dd>
</dl>
<dl>
<dt>
......
......@@ -9,9 +9,7 @@ const thumbnailUrl = require('../../lib/user-thumbnail');
require('./grid.scss');
const Grid = props => (
<div
className={classNames('grid', props.className)}
>
<div className={classNames('grid', props.className)}>
<FlexRow>
{props.items.map((item, key) => {
const href = `/${props.itemType}/${item.id}/`;
......@@ -21,7 +19,6 @@ const Grid = props => (
avatar={thumbnailUrl(item.author.id)}
creator={item.author.username}
favorites={item.stats.favorites}
isUpsideDown={props.isUpsideDown}
href={href}
key={key}
loves={item.stats.loves}
......@@ -41,7 +38,6 @@ const Grid = props => (
return (
<Thumbnail
href={href}
isUpsideDown={props.isUpsideDown}
key={key}
owner={item.owner}
src={item.image}
......@@ -56,7 +52,6 @@ const Grid = props => (
Grid.propTypes = {
className: PropTypes.string,
isUpsideDown: PropTypes.bool,
itemType: PropTypes.string,
items: PropTypes.arrayOf(PropTypes.object),
showAvatar: PropTypes.bool,
......
......@@ -11,16 +11,6 @@
$project-height: 208px;
$gallery-height: 164px;
&.cat {
background-image: url("/svgs/space-cat.svg");
background-size: contain;
background-repeat: no-repeat;
.thumbnail {
opacity: .85;
}
}
.flex-row {
margin: 0 auto;
padding: 12px 0;
......
......@@ -110,16 +110,12 @@ const Thumbnail = props => {
</a>
);
}
const surpriseClass = props.isUpsideDown ? 'upsideDown' : '';
return (
<div
className={classNames(
'thumbnail',
props.type,
props.className,
surpriseClass
props.className
)}
>
{imgElement}
......@@ -140,7 +136,6 @@ Thumbnail.propTypes = {
className: PropTypes.string,
creator: PropTypes.string,
favorites: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
isUpsideDown: PropTypes.bool,
href: PropTypes.string,
linkTitle: PropTypes.bool,
loves: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
......
......@@ -112,8 +112,4 @@
height: $gallery-height;
}
}
&.upsideDown {
transform: rotate(180deg);
}
}
......@@ -82,5 +82,5 @@
}
</script>
<% } %>
<div style="color: #fff">;</div></body>
</body>
</html>
......@@ -29,8 +29,7 @@ class Search extends React.Component {
'getSearchState',
'handleChangeSortMode',
'handleGetSearchMore',
'getTab',
'tick'
'getTab'
]);
this.state = this.getSearchState();
this.state.loaded = [];
......@@ -39,12 +38,6 @@ class Search extends React.Component {
this.state.offset = 0;
this.state.loadMore = false;
this.state.isUpsideDown = false;
this.state.isRainbow = false;
this.state.isSecret = false;
this.state.elapsed = 0;
let mode = '';
const query = window.location.search;
const m = query.lastIndexOf('mode=');
......@@ -61,6 +54,7 @@ class Search extends React.Component {
if (ACCEPTABLE_MODES.indexOf(mode) !== -1) {
this.state.mode = mode;
}
}
componentDidMount () {
// just in case there's a URL in the wild with pluses to indicate spaces,
......@@ -92,22 +86,13 @@ class Search extends React.Component {
// Error means that term was not URI encoded and decoding failed.
// We can silence this error because not all query strings are intended to be decoded.
}
this.props.dispatch(navigationActions.setSearchTerm(term));
}
componentDidUpdate (prevProps) {
if (this.props.searchTerm !== prevProps.searchTerm) {
this.setEasterEggs(this.props.searchTerm);
this.handleGetSearchMore();
}
}
tick () {
this.setState(prevState => (
{elapsed: (prevState.elapsed + 10) % 360}
));
}
encodeSearchTerm () {
let termText = '';
if (this.props.searchTerm) {
......@@ -137,23 +122,6 @@ class Search extends React.Component {
window.location = newLocation;
}
}
setEasterEggs (term) {
if (term === 'upside down' || term === 'upsidedown' || term === 'upside-down') {
this.setState({isUpsideDown: true});
}
if (term.includes('rainbow')) {
this.setState({isRainbow: true});
setInterval(this.tick, 200);
}
if (term.includes('secret life')) {
this.setState({isSecret: true});
setInterval(this.tick, 200);
}
}
handleGetSearchMore () {
const termText = this.encodeSearchTerm();
const locale = this.props.intl.locale;
......@@ -212,14 +180,11 @@ class Search extends React.Component {
}
return allTab;
}
getProjectBox () {
const results = (
<Grid
cards
className={this.state.isSecret ? 'cat' : null}
showAvatar
isUpsideDown={this.state.isUpsideDown}
itemType={this.state.tab}
items={this.state.loaded}
showFavorites={false}
......@@ -228,7 +193,6 @@ class Search extends React.Component {
/>
);
let searchAction = null;
if (this.state.loaded.length === 0 && this.state.offset !== 0) {
searchAction = <h2 className="search-prompt"><FormattedMessage id="general.searchEmpty" /></h2>;
} else if (this.state.loadMore) {
......@@ -244,30 +208,16 @@ class Search extends React.Component {
<div
id="projectBox"
key="projectBox"
style={this.fancyStyle()}
>
{results}
{searchAction}
</div>
);
}
fancyStyle () {
if (this.state.isRainbow) {
return {
filter: `hue-rotate(${this.state.elapsed}deg) saturate(400%)`
};
}
return {};
}
render () {
return (
<div>
<div
className="outer"
>
<div className="outer">
<TitleBanner className="masthead">
<div className="inner">
<h1 className="title-banner-h1">
......
This diff is collapsed.
Markdown is supported
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