@r3l/app
Version:
509 lines (450 loc) • 19.2 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _redux = require("redux");
var _reactRedux = require("react-redux");
var _web = require("../styled/web");
var _styled = require("../styled");
var _reactNativeWeb = require("react-native-web");
var _styles = require("../../styles");
var _utils = require("../../utils");
var navigationActions = _interopRequireWildcard(require("../navigation/navigation.actions"));
var _communityList = _interopRequireDefault(require("../community/communityList.component"));
var _social = _interopRequireDefault(require("../navigation/social.icons"));
var _community = require("../community/community.actions");
var _post = _interopRequireDefault(require("./post.marquee"));
var _appStoreButtons = _interopRequireDefault(require("./appStoreButtons"));
var _dripsy = require("dripsy");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
if (process.env.BROWSER === true) {
require("../../styles/fonts.css");
require('react-toastify/dist/ReactToastify.css');
require('react-smartbanner/dist/main.css');
}
var SHOW_FIXED_JOIN_HEIGHT = 250;
var SHOW_FIXED_LOGO = 500;
var VID_RATIO = 2.167042889390519;
var VID_TO_PHONE = 0.85;
var Section = function Section(_ref) {
var sx = _ref.sx,
children = _ref.children;
return /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: _objectSpread({
flex: 1,
flexDirection: 'column',
justifyContent: 'center',
marginLeft: 'auto',
marginRight: 'auto',
padding: 6,
paddingLeft: 2,
paddingRight: 2,
maxWidth: 75 * 8
}, sx)
}, children);
};
var SplashText = (0, _dripsy.styled)(_reactNativeWeb.Text)({
fontFamily: _styles.fonts.HELVETICA_NEUE,
color: 'black',
fontSize: [4, 5],
lineHeight: [4, 5],
marginTop: 2
});
var SectionText = (0, _dripsy.styled)(_reactNativeWeb.Text)({
fontFamily: _styles.fonts.HELVETICA_NEUE,
flexDirection: 'column',
fontSize: [2.001 * 8, 3.001 * 8],
lineHeight: [2.001 * 8, 3.001 * 8]
});
var Splash = /*#__PURE__*/function (_Component) {
(0, _inherits2.default)(Splash, _Component);
var _super = _createSuper(Splash);
function Splash() {
var _this;
(0, _classCallCheck2.default)(this, Splash);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _super.call.apply(_super, [this].concat(args));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
showJoinButton: false
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onScroll", function () {
var showJoinButton = document.body.scrollHeight - window.innerHeight - window.scrollY < SHOW_FIXED_JOIN_HEIGHT;
if (_this.state.showJoinButton !== showJoinButton) _this.setState({
showJoinButton: showJoinButton
});
var showFixedLogo = window.scrollY > SHOW_FIXED_LOGO;
if (_this.state.showFixedLogo !== showFixedLogo) _this.setState({
showFixedLogo: showFixedLogo
});
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "signUp", /*#__PURE__*/function () {
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(modal) {
var _this$props, actions, history;
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
_this$props = _this.props, actions = _this$props.actions, history = _this$props.history;
history.push('/communities');
actions.showModal(modal);
case 3:
case "end":
return _context.stop();
}
}
}, _callee);
}));
return function (_x) {
return _ref2.apply(this, arguments);
};
}());
return _this;
}
(0, _createClass2.default)(Splash, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this$props2 = this.props,
communities = _this$props2.communities,
actions = _this$props2.actions;
window.addEventListener('scroll', this.onScroll);
_utils.tween.start();
if (!communities.length) actions.getCommunities();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
window.removeEventListener('scroll', this.onScroll);
_utils.tween.stop();
}
}, {
key: "render",
value: function render() {
var _this2 = this;
var screenSize = this.props.screenSize;
var _this$state = this.state,
showFixedLogo = _this$state.showFixedLogo,
showJoinButton = _this$state.showJoinButton;
var sectionSpace = screenSize ? 4 : 8;
return /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
bg: 'white',
flex: 1,
overflow: 'hidden'
}
}, /*#__PURE__*/_react.default.createElement(_styles.GlobalStyle, null), /*#__PURE__*/_react.default.createElement(_post.default, null), /*#__PURE__*/_react.default.createElement(Section, {
sx: {
mt: [4, 0],
minHeight: '100vh'
}
}, /*#__PURE__*/_react.default.createElement(_styled.InlineLink, {
to: '/relevant/top'
}, /*#__PURE__*/_react.default.createElement(_styled.Image, {
sx: {
height: [7 * 8, 10 * 8],
width: [7 * 8 * 5, 10 * 8 * 5],
maxWidth: '100%'
},
resizeMode: "contain",
source: require("../../../public/img/logo.png"),
alt: 'Relevant'
})), /*#__PURE__*/_react.default.createElement(_styled.Box, {
sx: {
mt: [6, 12]
}
}), /*#__PURE__*/_react.default.createElement(SplashText, {
style: {
width: 'calc(100vw - 32px)'
}
}, "Resist algorithmic ", /*#__PURE__*/_react.default.createElement("span", {
style: {
whiteSpace: 'nowrap'
}
}, "oppression.")), /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
mt: 6
},
style: {
width: 'calc(100vw - 32px)'
}
}, "Get", ' ', /*#__PURE__*/_react.default.createElement("span", {
style: {
whiteSpace: 'nowrap'
}
}, "Relevant", ' ', /*#__PURE__*/_react.default.createElement("span", {
role: "img",
"aria-label": "emoji"
}, "\uD83E\uDD18"))), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
mt: [12 * 8, 8],
flexDirection: ['column', 'row'],
alignItems: 'center'
}
}, /*#__PURE__*/_react.default.createElement(_styled.View, {
webContainerSx: {
alignSelf: ['stretch', 'flex-start']
},
sx: {
alignSelf: ['stretch', 'flex-start']
}
}, /*#__PURE__*/_react.default.createElement(_styled.Button, {
sx: {
height: 8,
px: 6,
py: 2,
mr: [0, 2],
flex: 1
},
onPress: function onPress() {
return _this2.signUp('signupSocial');
}
}, /*#__PURE__*/_react.default.createElement(SectionText, {
sx: {
color: 'white'
}
}, "Join Now"))), /*#__PURE__*/_react.default.createElement(_styled.Box, {
sx: {
mt: [2, 0],
mr: [0, 2]
}
}, /*#__PURE__*/_react.default.createElement(SectionText, null, "or")), /*#__PURE__*/_react.default.createElement(_styled.Box, {
sx: {
mt: [2, 0]
}
}, /*#__PURE__*/_react.default.createElement(_styled.TextButton, {
onPress: function onPress() {
return _this2.signUp('login');
}
}, /*#__PURE__*/_react.default.createElement(SectionText, {
sx: {
textDecorationLine: 'underline',
color: 'blue'
}
}, "Log In"))))), /*#__PURE__*/_react.default.createElement(Section, {
mt: sectionSpace
}, /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
fontWeight: 'bold'
}
}, "No Likes."), /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
mt: 6
}
}, "On Relevant posts are ranked according to quality, not popularity. This means only relevant content reaches the top of the feed.")), /*#__PURE__*/_react.default.createElement(Section, {
mt: sectionSpace
}, /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
fontWeight: 'bold'
}
}, "No Followers."), /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
mt: 6
}
}, "Relevant is a community-centric platform. You don\u2019t need thousands of followers to be heard.")), /*#__PURE__*/_react.default.createElement(Section, {
mt: sectionSpace
}, /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
fontWeight: 'bold'
}
}, "No algorithms."), /*#__PURE__*/_react.default.createElement(SplashText, {
sx: {
mt: 6
}
}, "Forget filter bubbles, on Relevant everyone sees the same information. Communities decide what is relevant to them.")), /*#__PURE__*/_react.default.createElement(Section, {
mt: sectionSpace
}, /*#__PURE__*/_react.default.createElement(SplashText, {
style: {
fontWeight: 'bold'
}
}, "Find your community..."), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
mt: 4
}
}), /*#__PURE__*/_react.default.createElement(_communityList.default, {
p: 0,
hashtags: true
})), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
margin: 'auto',
flex: [null, 1],
mt: sectionSpace,
flexDirection: ['column', 'revert'],
justifyContent: 'center',
alignItems: 'center',
height: ['100vh', 'auto'],
mb: 0
}
}, /*#__PURE__*/_react.default.createElement(_styled.View, {
webContainerSx: {
zIndex: 10
},
sx: {
flex: ['auto', 1],
flexDirection: 'column',
align: ['center', 'flex-start'],
justifyContent: 'center',
zIndex: 10,
overflow: 'hidden'
}
}, /*#__PURE__*/_react.default.createElement(_styled.Row, {
sx: {
alignItems: 'center'
}
}, /*#__PURE__*/_react.default.createElement(_styled.Image, {
sx: {
height: [0, 8 * 8],
width: [0, 8 * 8 * 5],
mt: 'auto',
zIndex: 1
},
resizeMode: "contain",
source: require("../../../public/img/logo.png"),
alt: 'Relevant'
})), /*#__PURE__*/_react.default.createElement(_appStoreButtons.default, {
sx: {
mt: [4, 8],
mb: [1, 0]
}
}), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
top: ['auto', 4],
right: ['auto', 1],
alignSelf: 'center',
position: ['relative', 'fixed'],
justifyContent: 'center'
}
}, /*#__PURE__*/_react.default.createElement(_social.default, null))), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
position: ['absolute', 'relative'],
bottom: [0, 'auto'],
right: ['-35vw', 'auto'],
opacity: [0.5, 1],
transform: 'rotate(-2.82deg)',
ml: 3,
justifyContent: 'center',
alignItems: 'center'
}
}, /*#__PURE__*/_react.default.createElement(_web.Video, {
sx: {
position: 'absolute',
top: '50%',
left: '50%',
transform: 'translate3d(-50%, -50%, 0)',
width: ['auto', VID_TO_PHONE * 50 * 8],
height: ["".concat(VID_TO_PHONE * 100, "vh"), VID_TO_PHONE * 50 * VID_RATIO * 8]
},
autoPlay: true,
loop: true,
muted: true,
playsInline: true
}, /*#__PURE__*/_react.default.createElement("source", {
src: "/img/vid.webm",
type: "video/webm"
}), /*#__PURE__*/_react.default.createElement("source", {
src: "/img/vid.mp4",
type: "video/mp4"
})), /*#__PURE__*/_react.default.createElement(_styled.Image, {
sx: {
width: [60 * 8, 60 * 8],
height: ['100vh', VID_TO_PHONE * 50 * VID_RATIO * 8 * 2]
},
resizeMode: "contain",
source: require("../../../public/img/phone-blank.png"),
alt: 'Relevant Phone'
}))), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
mt: [1, 2],
position: 'fixed',
left: 3,
top: 4,
opacity: showFixedLogo && !screenSize ? 1 : 0,
transition: 'opacity 0.1s linear'
}
}, /*#__PURE__*/_react.default.createElement(_styled.InlineLink, {
to: '/relevant/top'
}, /*#__PURE__*/_react.default.createElement(_styled.Image, {
sx: {
height: [5, 7],
width: [5, 7]
},
resizeMode: "contain",
source: require("../../../public/img/r-big.png"),
alt: 'Relevant'
}))), /*#__PURE__*/_react.default.createElement(_styled.View, {
sx: {
position: 'fixed',
left: '50%',
transform: "translate3d(-50%, ".concat(showJoinButton ? '0px' : '200px', ", 0)"),
transition: 'transform 0.3s ease-in',
bottom: [5, 8],
zIndex: 1000,
width: 'auto',
mb: 0,
px: [2, 0]
}
}, /*#__PURE__*/_react.default.createElement(_styled.Button, {
sx: {
flex: 1,
height: 8,
px: 6,
py: 2
},
onPress: function onPress() {
return _this2.signUp('signupSocial');
}
}, /*#__PURE__*/_react.default.createElement(SectionText, {
sx: {
color: 'white'
}
}, "Join Relevant"))));
}
}], [{
key: "fetchData",
value: function fetchData(dispatch) {
return dispatch((0, _community.getCommunities)());
}
}]);
return Splash;
}(_react.Component);
(0, _defineProperty2.default)(Splash, "propTypes", {
history: _propTypes.default.object,
actions: _propTypes.default.object,
communities: _propTypes.default.object,
screenSize: _propTypes.default.number
});
function mapStateToProps(state) {
return {
screenSize: state.navigation.screenSize,
communities: state.community.communities
};
}
function mapDispatchToProps(dispatch) {
return {
actions: (0, _redux.bindActionCreators)(_objectSpread(_objectSpread({}, navigationActions), {}, {
getCommunities: _community.getCommunities
}), dispatch)
};
}
var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(Splash);
exports.default = _default;
//# sourceMappingURL=about.component.js.map