Hello World
;\n * }\n * });\n *\n * The class specification supports a specific protocol of methods that have\n * special meaning (e.g. `render`). See `ReactClassInterface` for\n * more the comprehensive protocol. Any other properties and methods in the\n * class specification will be available on the prototype.\n *\n * @interface ReactClassInterface\n * @internal\n */\n var ReactClassInterface = {\n /**\n * An array of Mixin objects to include when defining your component.\n *\n * @type {array}\n * @optional\n */\n mixins: 'DEFINE_MANY',\n\n /**\n * An object containing properties and methods that should be defined on\n * the component's constructor instead of its prototype (static methods).\n *\n * @type {object}\n * @optional\n */\n statics: 'DEFINE_MANY',\n\n /**\n * Definition of prop types for this component.\n *\n * @type {object}\n * @optional\n */\n propTypes: 'DEFINE_MANY',\n\n /**\n * Definition of context types for this component.\n *\n * @type {object}\n * @optional\n */\n contextTypes: 'DEFINE_MANY',\n\n /**\n * Definition of context types this component sets for its children.\n *\n * @type {object}\n * @optional\n */\n childContextTypes: 'DEFINE_MANY',\n\n // ==== Definition methods ====\n\n /**\n * Invoked when the component is mounted. Values in the mapping will be set on\n * `this.props` if that prop is not specified (i.e. using an `in` check).\n *\n * This method is invoked before `getInitialState` and therefore cannot rely\n * on `this.state` or use `this.setState`.\n *\n * @return {object}\n * @optional\n */\n getDefaultProps: 'DEFINE_MANY_MERGED',\n\n /**\n * Invoked once before the component is mounted. The return value will be used\n * as the initial value of `this.state`.\n *\n * getInitialState: function() {\n * return {\n * isOn: false,\n * fooBaz: new BazFoo()\n * }\n * }\n *\n * @return {object}\n * @optional\n */\n getInitialState: 'DEFINE_MANY_MERGED',\n\n /**\n * @return {object}\n * @optional\n */\n getChildContext: 'DEFINE_MANY_MERGED',\n\n /**\n * Uses props from `this.props` and state from `this.state` to render the\n * structure of the component.\n *\n * No guarantees are made about when or how often this method is invoked, so\n * it must not have side effects.\n *\n * render: function() {\n * var name = this.props.name;\n * return Hello, {name}!
;\n * }\n *\n * @return {ReactComponent}\n * @required\n */\n render: 'DEFINE_ONCE',\n\n // ==== Delegate methods ====\n\n /**\n * Invoked when the component is initially created and about to be mounted.\n * This may have side effects, but any external subscriptions or data created\n * by this method must be cleaned up in `componentWillUnmount`.\n *\n * @optional\n */\n componentWillMount: 'DEFINE_MANY',\n\n /**\n * Invoked when the component has been mounted and has a DOM representation.\n * However, there is no guarantee that the DOM node is in the document.\n *\n * Use this as an opportunity to operate on the DOM when the component has\n * been mounted (initialized and rendered) for the first time.\n *\n * @param {DOMElement} rootNode DOM element representing the component.\n * @optional\n */\n componentDidMount: 'DEFINE_MANY',\n\n /**\n * Invoked before the component receives new props.\n *\n * Use this as an opportunity to react to a prop transition by updating the\n * state using `this.setState`. Current props are accessed via `this.props`.\n *\n * componentWillReceiveProps: function(nextProps, nextContext) {\n * this.setState({\n * likesIncreasing: nextProps.likeCount > this.props.likeCount\n * });\n * }\n *\n * NOTE: There is no equivalent `componentWillReceiveState`. An incoming prop\n * transition may cause a state change, but the opposite is not true. If you\n * need it, you are probably looking for `componentWillUpdate`.\n *\n * @param {object} nextProps\n * @optional\n */\n componentWillReceiveProps: 'DEFINE_MANY',\n\n /**\n * Invoked while deciding if the component should be updated as a result of\n * receiving new props, state and/or context.\n *\n * Use this as an opportunity to `return false` when you're certain that the\n * transition to the new props/state/context will not require a component\n * update.\n *\n * shouldComponentUpdate: function(nextProps, nextState, nextContext) {\n * return !equal(nextProps, this.props) ||\n * !equal(nextState, this.state) ||\n * !equal(nextContext, this.context);\n * }\n *\n * @param {object} nextProps\n * @param {?object} nextState\n * @param {?object} nextContext\n * @return {boolean} True if the component should update.\n * @optional\n */\n shouldComponentUpdate: 'DEFINE_ONCE',\n\n /**\n * Invoked when the component is about to update due to a transition from\n * `this.props`, `this.state` and `this.context` to `nextProps`, `nextState`\n * and `nextContext`.\n *\n * Use this as an opportunity to perform preparation before an update occurs.\n *\n * NOTE: You **cannot** use `this.setState()` in this method.\n *\n * @param {object} nextProps\n * @param {?object} nextState\n * @param {?object} nextContext\n * @param {ReactReconcileTransaction} transaction\n * @optional\n */\n componentWillUpdate: 'DEFINE_MANY',\n\n /**\n * Invoked when the component's DOM representation has been updated.\n *\n * Use this as an opportunity to operate on the DOM when the component has\n * been updated.\n *\n * @param {object} prevProps\n * @param {?object} prevState\n * @param {?object} prevContext\n * @param {DOMElement} rootNode DOM element representing the component.\n * @optional\n */\n componentDidUpdate: 'DEFINE_MANY',\n\n /**\n * Invoked when the component is about to be removed from its parent and have\n * its DOM representation destroyed.\n *\n * Use this as an opportunity to deallocate any external resources.\n *\n * NOTE: There is no `componentDidUnmount` since your component will have been\n * destroyed by that point.\n *\n * @optional\n */\n componentWillUnmount: 'DEFINE_MANY',\n\n /**\n * Replacement for (deprecated) `componentWillMount`.\n *\n * @optional\n */\n UNSAFE_componentWillMount: 'DEFINE_MANY',\n\n /**\n * Replacement for (deprecated) `componentWillReceiveProps`.\n *\n * @optional\n */\n UNSAFE_componentWillReceiveProps: 'DEFINE_MANY',\n\n /**\n * Replacement for (deprecated) `componentWillUpdate`.\n *\n * @optional\n */\n UNSAFE_componentWillUpdate: 'DEFINE_MANY',\n\n // ==== Advanced methods ====\n\n /**\n * Updates the component's currently mounted DOM representation.\n *\n * By default, this implements React's rendering and reconciliation algorithm.\n * Sophisticated clients may wish to override this.\n *\n * @param {ReactReconcileTransaction} transaction\n * @internal\n * @overridable\n */\n updateComponent: 'OVERRIDE_BASE'\n };\n\n /**\n * Similar to ReactClassInterface but for static methods.\n */\n var ReactClassStaticInterface = {\n /**\n * This method is invoked after a component is instantiated and when it\n * receives new props. Return an object to update state in response to\n * prop changes. Return null to indicate no change to state.\n *\n * If an object is returned, its keys will be merged into the existing state.\n *\n * @return {object || null}\n * @optional\n */\n getDerivedStateFromProps: 'DEFINE_MANY_MERGED'\n };\n\n /**\n * Mapping from class specification keys to special processing functions.\n *\n * Although these are declared like instance properties in the specification\n * when defining classes using `React.createClass`, they are actually static\n * and are accessible on the constructor instead of the prototype. Despite\n * being static, they must be defined outside of the \"statics\" key under\n * which all other static methods are defined.\n */\n var RESERVED_SPEC_KEYS = {\n displayName: function(Constructor, displayName) {\n Constructor.displayName = displayName;\n },\n mixins: function(Constructor, mixins) {\n if (mixins) {\n for (var i = 0; i < mixins.length; i++) {\n mixSpecIntoComponent(Constructor, mixins[i]);\n }\n }\n },\n childContextTypes: function(Constructor, childContextTypes) {\n if (false) {\n validateTypeDef(Constructor, childContextTypes, 'childContext');\n }\n Constructor.childContextTypes = _assign(\n {},\n Constructor.childContextTypes,\n childContextTypes\n );\n },\n contextTypes: function(Constructor, contextTypes) {\n if (false) {\n validateTypeDef(Constructor, contextTypes, 'context');\n }\n Constructor.contextTypes = _assign(\n {},\n Constructor.contextTypes,\n contextTypes\n );\n },\n /**\n * Special case getDefaultProps which should move into statics but requires\n * automatic merging.\n */\n getDefaultProps: function(Constructor, getDefaultProps) {\n if (Constructor.getDefaultProps) {\n Constructor.getDefaultProps = createMergedResultFunction(\n Constructor.getDefaultProps,\n getDefaultProps\n );\n } else {\n Constructor.getDefaultProps = getDefaultProps;\n }\n },\n propTypes: function(Constructor, propTypes) {\n if (false) {\n validateTypeDef(Constructor, propTypes, 'prop');\n }\n Constructor.propTypes = _assign({}, Constructor.propTypes, propTypes);\n },\n statics: function(Constructor, statics) {\n mixStaticSpecIntoComponent(Constructor, statics);\n },\n autobind: function() {}\n };\n\n function validateTypeDef(Constructor, typeDef, location) {\n for (var propName in typeDef) {\n if (typeDef.hasOwnProperty(propName)) {\n // use a warning instead of an _invariant so components\n // don't show up in prod but only in __DEV__\n if (false) {\n warning(\n typeof typeDef[propName] === 'function',\n '%s: %s type `%s` is invalid; it must be a function, usually from ' +\n 'React.PropTypes.',\n Constructor.displayName || 'ReactClass',\n ReactPropTypeLocationNames[location],\n propName\n );\n }\n }\n }\n }\n\n function validateMethodOverride(isAlreadyDefined, name) {\n var specPolicy = ReactClassInterface.hasOwnProperty(name)\n ? ReactClassInterface[name]\n : null;\n\n // Disallow overriding of base class methods unless explicitly allowed.\n if (ReactClassMixin.hasOwnProperty(name)) {\n _invariant(\n specPolicy === 'OVERRIDE_BASE',\n 'ReactClassInterface: You are attempting to override ' +\n '`%s` from your class specification. Ensure that your method names ' +\n 'do not overlap with React methods.',\n name\n );\n }\n\n // Disallow defining methods more than once unless explicitly allowed.\n if (isAlreadyDefined) {\n _invariant(\n specPolicy === 'DEFINE_MANY' || specPolicy === 'DEFINE_MANY_MERGED',\n 'ReactClassInterface: You are attempting to define ' +\n '`%s` on your component more than once. This conflict may be due ' +\n 'to a mixin.',\n name\n );\n }\n }\n\n /**\n * Mixin helper which handles policy validation and reserved\n * specification keys when building React classes.\n */\n function mixSpecIntoComponent(Constructor, spec) {\n if (!spec) {\n if (false) {\n var typeofSpec = typeof spec;\n var isMixinValid = typeofSpec === 'object' && spec !== null;\n\n if (process.env.NODE_ENV !== 'production') {\n warning(\n isMixinValid,\n \"%s: You're attempting to include a mixin that is either null \" +\n 'or not an object. Check the mixins included by the component, ' +\n 'as well as any mixins they include themselves. ' +\n 'Expected object but got %s.',\n Constructor.displayName || 'ReactClass',\n spec === null ? null : typeofSpec\n );\n }\n }\n\n return;\n }\n\n _invariant(\n typeof spec !== 'function',\n \"ReactClass: You're attempting to \" +\n 'use a component class or function as a mixin. Instead, just use a ' +\n 'regular object.'\n );\n _invariant(\n !isValidElement(spec),\n \"ReactClass: You're attempting to \" +\n 'use a component as a mixin. Instead, just use a regular object.'\n );\n\n var proto = Constructor.prototype;\n var autoBindPairs = proto.__reactAutoBindPairs;\n\n // By handling mixins before any other properties, we ensure the same\n // chaining order is applied to methods with DEFINE_MANY policy, whether\n // mixins are listed before or after these methods in the spec.\n if (spec.hasOwnProperty(MIXINS_KEY)) {\n RESERVED_SPEC_KEYS.mixins(Constructor, spec.mixins);\n }\n\n for (var name in spec) {\n if (!spec.hasOwnProperty(name)) {\n continue;\n }\n\n if (name === MIXINS_KEY) {\n // We have already handled mixins in a special case above.\n continue;\n }\n\n var property = spec[name];\n var isAlreadyDefined = proto.hasOwnProperty(name);\n validateMethodOverride(isAlreadyDefined, name);\n\n if (RESERVED_SPEC_KEYS.hasOwnProperty(name)) {\n RESERVED_SPEC_KEYS[name](Constructor, property);\n } else {\n // Setup methods on prototype:\n // The following member methods should not be automatically bound:\n // 1. Expected ReactClass methods (in the \"interface\").\n // 2. Overridden methods (that were mixed in).\n var isReactClassMethod = ReactClassInterface.hasOwnProperty(name);\n var isFunction = typeof property === 'function';\n var shouldAutoBind =\n isFunction &&\n !isReactClassMethod &&\n !isAlreadyDefined &&\n spec.autobind !== false;\n\n if (shouldAutoBind) {\n autoBindPairs.push(name, property);\n proto[name] = property;\n } else {\n if (isAlreadyDefined) {\n var specPolicy = ReactClassInterface[name];\n\n // These cases should already be caught by validateMethodOverride.\n _invariant(\n isReactClassMethod &&\n (specPolicy === 'DEFINE_MANY_MERGED' ||\n specPolicy === 'DEFINE_MANY'),\n 'ReactClass: Unexpected spec policy %s for key %s ' +\n 'when mixing in component specs.',\n specPolicy,\n name\n );\n\n // For methods which are defined more than once, call the existing\n // methods before calling the new property, merging if appropriate.\n if (specPolicy === 'DEFINE_MANY_MERGED') {\n proto[name] = createMergedResultFunction(proto[name], property);\n } else if (specPolicy === 'DEFINE_MANY') {\n proto[name] = createChainedFunction(proto[name], property);\n }\n } else {\n proto[name] = property;\n if (false) {\n // Add verbose displayName to the function, which helps when looking\n // at profiling tools.\n if (typeof property === 'function' && spec.displayName) {\n proto[name].displayName = spec.displayName + '_' + name;\n }\n }\n }\n }\n }\n }\n }\n\n function mixStaticSpecIntoComponent(Constructor, statics) {\n if (!statics) {\n return;\n }\n\n for (var name in statics) {\n var property = statics[name];\n if (!statics.hasOwnProperty(name)) {\n continue;\n }\n\n var isReserved = name in RESERVED_SPEC_KEYS;\n _invariant(\n !isReserved,\n 'ReactClass: You are attempting to define a reserved ' +\n 'property, `%s`, that shouldn\\'t be on the \"statics\" key. Define it ' +\n 'as an instance property instead; it will still be accessible on the ' +\n 'constructor.',\n name\n );\n\n var isAlreadyDefined = name in Constructor;\n if (isAlreadyDefined) {\n var specPolicy = ReactClassStaticInterface.hasOwnProperty(name)\n ? ReactClassStaticInterface[name]\n : null;\n\n _invariant(\n specPolicy === 'DEFINE_MANY_MERGED',\n 'ReactClass: You are attempting to define ' +\n '`%s` on your component more than once. This conflict may be ' +\n 'due to a mixin.',\n name\n );\n\n Constructor[name] = createMergedResultFunction(Constructor[name], property);\n\n return;\n }\n\n Constructor[name] = property;\n }\n }\n\n /**\n * Merge two objects, but throw if both contain the same key.\n *\n * @param {object} one The first object, which is mutated.\n * @param {object} two The second object\n * @return {object} one after it has been mutated to contain everything in two.\n */\n function mergeIntoWithNoDuplicateKeys(one, two) {\n _invariant(\n one && two && typeof one === 'object' && typeof two === 'object',\n 'mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.'\n );\n\n for (var key in two) {\n if (two.hasOwnProperty(key)) {\n _invariant(\n one[key] === undefined,\n 'mergeIntoWithNoDuplicateKeys(): ' +\n 'Tried to merge two objects with the same key: `%s`. This conflict ' +\n 'may be due to a mixin; in particular, this may be caused by two ' +\n 'getInitialState() or getDefaultProps() methods returning objects ' +\n 'with clashing keys.',\n key\n );\n one[key] = two[key];\n }\n }\n return one;\n }\n\n /**\n * Creates a function that invokes two functions and merges their return values.\n *\n * @param {function} one Function to invoke first.\n * @param {function} two Function to invoke second.\n * @return {function} Function that invokes the two argument functions.\n * @private\n */\n function createMergedResultFunction(one, two) {\n return function mergedResult() {\n var a = one.apply(this, arguments);\n var b = two.apply(this, arguments);\n if (a == null) {\n return b;\n } else if (b == null) {\n return a;\n }\n var c = {};\n mergeIntoWithNoDuplicateKeys(c, a);\n mergeIntoWithNoDuplicateKeys(c, b);\n return c;\n };\n }\n\n /**\n * Creates a function that invokes two functions and ignores their return vales.\n *\n * @param {function} one Function to invoke first.\n * @param {function} two Function to invoke second.\n * @return {function} Function that invokes the two argument functions.\n * @private\n */\n function createChainedFunction(one, two) {\n return function chainedFunction() {\n one.apply(this, arguments);\n two.apply(this, arguments);\n };\n }\n\n /**\n * Binds a method to the component.\n *\n * @param {object} component Component whose method is going to be bound.\n * @param {function} method Method to be bound.\n * @return {function} The bound method.\n */\n function bindAutoBindMethod(component, method) {\n var boundMethod = method.bind(component);\n if (false) {\n boundMethod.__reactBoundContext = component;\n boundMethod.__reactBoundMethod = method;\n boundMethod.__reactBoundArguments = null;\n var componentName = component.constructor.displayName;\n var _bind = boundMethod.bind;\n boundMethod.bind = function(newThis) {\n for (\n var _len = arguments.length,\n args = Array(_len > 1 ? _len - 1 : 0),\n _key = 1;\n _key < _len;\n _key++\n ) {\n args[_key - 1] = arguments[_key];\n }\n\n // User is trying to bind() an autobound method; we effectively will\n // ignore the value of \"this\" that the user is trying to use, so\n // let's warn.\n if (newThis !== component && newThis !== null) {\n if (process.env.NODE_ENV !== 'production') {\n warning(\n false,\n 'bind(): React component methods may only be bound to the ' +\n 'component instance. See %s',\n componentName\n );\n }\n } else if (!args.length) {\n if (process.env.NODE_ENV !== 'production') {\n warning(\n false,\n 'bind(): You are binding a component method to the component. ' +\n 'React does this for you automatically in a high-performance ' +\n 'way, so you can safely remove this call. See %s',\n componentName\n );\n }\n return boundMethod;\n }\n var reboundMethod = _bind.apply(boundMethod, arguments);\n reboundMethod.__reactBoundContext = component;\n reboundMethod.__reactBoundMethod = method;\n reboundMethod.__reactBoundArguments = args;\n return reboundMethod;\n };\n }\n return boundMethod;\n }\n\n /**\n * Binds all auto-bound methods in a component.\n *\n * @param {object} component Component whose method is going to be bound.\n */\n function bindAutoBindMethods(component) {\n var pairs = component.__reactAutoBindPairs;\n for (var i = 0; i < pairs.length; i += 2) {\n var autoBindKey = pairs[i];\n var method = pairs[i + 1];\n component[autoBindKey] = bindAutoBindMethod(component, method);\n }\n }\n\n var IsMountedPreMixin = {\n componentDidMount: function() {\n this.__isMounted = true;\n }\n };\n\n var IsMountedPostMixin = {\n componentWillUnmount: function() {\n this.__isMounted = false;\n }\n };\n\n /**\n * Add more to the ReactClass base class. These are all legacy features and\n * therefore not already part of the modern ReactComponent.\n */\n var ReactClassMixin = {\n /**\n * TODO: This will be deprecated because state should always keep a consistent\n * type signature and the only use case for this, is to avoid that.\n */\n replaceState: function(newState, callback) {\n this.updater.enqueueReplaceState(this, newState, callback);\n },\n\n /**\n * Checks whether or not this composite component is mounted.\n * @return {boolean} True if mounted, false otherwise.\n * @protected\n * @final\n */\n isMounted: function() {\n if (false) {\n warning(\n this.__didWarnIsMounted,\n '%s: isMounted is deprecated. Instead, make sure to clean up ' +\n 'subscriptions and pending requests in componentWillUnmount to ' +\n 'prevent memory leaks.',\n (this.constructor && this.constructor.displayName) ||\n this.name ||\n 'Component'\n );\n this.__didWarnIsMounted = true;\n }\n return !!this.__isMounted;\n }\n };\n\n var ReactClassComponent = function() {};\n _assign(\n ReactClassComponent.prototype,\n ReactComponent.prototype,\n ReactClassMixin\n );\n\n /**\n * Creates a composite component class given a class specification.\n * See https://facebook.github.io/react/docs/top-level-api.html#react.createclass\n *\n * @param {object} spec Class specification (which must define `render`).\n * @return {function} Component constructor function.\n * @public\n */\n function createClass(spec) {\n // To keep our warnings more understandable, we'll use a little hack here to\n // ensure that Constructor.name !== 'Constructor'. This makes sure we don't\n // unnecessarily identify a class without displayName as 'Constructor'.\n var Constructor = identity(function(props, context, updater) {\n // This constructor gets overridden by mocks. The argument is used\n // by mocks to assert on what gets mounted.\n\n if (false) {\n warning(\n this instanceof Constructor,\n 'Something is calling a React component directly. Use a factory or ' +\n 'JSX instead. See: https://fb.me/react-legacyfactory'\n );\n }\n\n // Wire up auto-binding\n if (this.__reactAutoBindPairs.length) {\n bindAutoBindMethods(this);\n }\n\n this.props = props;\n this.context = context;\n this.refs = emptyObject;\n this.updater = updater || ReactNoopUpdateQueue;\n\n this.state = null;\n\n // ReactClasses doesn't have constructors. Instead, they use the\n // getInitialState and componentWillMount methods for initialization.\n\n var initialState = this.getInitialState ? this.getInitialState() : null;\n if (false) {\n // We allow auto-mocks to proceed as if they're returning null.\n if (\n initialState === undefined &&\n this.getInitialState._isMockFunction\n ) {\n // This is probably bad practice. Consider warning here and\n // deprecating this convenience.\n initialState = null;\n }\n }\n _invariant(\n typeof initialState === 'object' && !Array.isArray(initialState),\n '%s.getInitialState(): must return an object or null',\n Constructor.displayName || 'ReactCompositeComponent'\n );\n\n this.state = initialState;\n });\n Constructor.prototype = new ReactClassComponent();\n Constructor.prototype.constructor = Constructor;\n Constructor.prototype.__reactAutoBindPairs = [];\n\n injectedMixins.forEach(mixSpecIntoComponent.bind(null, Constructor));\n\n mixSpecIntoComponent(Constructor, IsMountedPreMixin);\n mixSpecIntoComponent(Constructor, spec);\n mixSpecIntoComponent(Constructor, IsMountedPostMixin);\n\n // Initialize the defaultProps property after all mixins have been merged.\n if (Constructor.getDefaultProps) {\n Constructor.defaultProps = Constructor.getDefaultProps();\n }\n\n if (false) {\n // This is a tag to indicate that the use of these method names is ok,\n // since it's used with createClass. If it's not, then it's likely a\n // mistake so we'll warn you to use the static property, property\n // initializer or constructor respectively.\n if (Constructor.getDefaultProps) {\n Constructor.getDefaultProps.isReactClassApproved = {};\n }\n if (Constructor.prototype.getInitialState) {\n Constructor.prototype.getInitialState.isReactClassApproved = {};\n }\n }\n\n _invariant(\n Constructor.prototype.render,\n 'createClass(...): Class specification must implement a `render` method.'\n );\n\n if (false) {\n warning(\n !Constructor.prototype.componentShouldUpdate,\n '%s has a method called ' +\n 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' +\n 'The name is phrased as a question because the function is ' +\n 'expected to return a value.',\n spec.displayName || 'A component'\n );\n warning(\n !Constructor.prototype.componentWillRecieveProps,\n '%s has a method called ' +\n 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?',\n spec.displayName || 'A component'\n );\n warning(\n !Constructor.prototype.UNSAFE_componentWillRecieveProps,\n '%s has a method called UNSAFE_componentWillRecieveProps(). ' +\n 'Did you mean UNSAFE_componentWillReceiveProps()?',\n spec.displayName || 'A component'\n );\n }\n\n // Reduce time spent doing lookups by setting these on the prototype.\n for (var methodName in ReactClassInterface) {\n if (!Constructor.prototype[methodName]) {\n Constructor.prototype[methodName] = null;\n }\n }\n\n return Constructor;\n }\n\n return createClass;\n}\n\nmodule.exports = factory;\n\n\n/***/ }),\n/* 156 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nexports.__esModule = true;\nexports.Track = undefined;\n\nvar _react = __webpack_require__(0);\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _objectAssign = __webpack_require__(5);\n\nvar _objectAssign2 = _interopRequireDefault(_objectAssign);\n\nvar _classnames = __webpack_require__(19);\n\nvar _classnames2 = _interopRequireDefault(_classnames);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar getSlideClasses = function getSlideClasses(spec) {\n var slickActive, slickCenter, slickCloned;\n var centerOffset, index;\n\n if (spec.rtl) {\n index = spec.slideCount - 1 - spec.index;\n } else {\n index = spec.index;\n }\n slickCloned = index < 0 || index >= spec.slideCount;\n if (spec.centerMode) {\n centerOffset = Math.floor(spec.slidesToShow / 2);\n slickCenter = (index - spec.currentSlide) % spec.slideCount === 0;\n if (index > spec.currentSlide - centerOffset - 1 && index <= spec.currentSlide + centerOffset) {\n slickActive = true;\n }\n } else {\n slickActive = spec.currentSlide <= index && index < spec.currentSlide + spec.slidesToShow;\n }\n return (0, _classnames2.default)({\n 'slick-slide': true,\n 'slick-active': slickActive,\n 'slick-center': slickCenter,\n 'slick-cloned': slickCloned\n });\n};\n\nvar getSlideStyle = function getSlideStyle(spec) {\n var style = {};\n\n if (spec.variableWidth === undefined || spec.variableWidth === false) {\n style.width = spec.slideWidth;\n }\n\n if (spec.fade) {\n style.position = 'relative';\n style.left = -spec.index * spec.slideWidth;\n style.opacity = spec.currentSlide === spec.index ? 1 : 0;\n style.transition = 'opacity ' + spec.speed + 'ms ' + spec.cssEase;\n style.WebkitTransition = 'opacity ' + spec.speed + 'ms ' + spec.cssEase;\n }\n\n return style;\n};\n\nvar getKey = function getKey(child, fallbackKey) {\n // key could be a zero\n return child.key === null || child.key === undefined ? fallbackKey : child.key;\n};\n\nvar renderSlides = function renderSlides(spec) {\n var key;\n var slides = [];\n var preCloneSlides = [];\n var postCloneSlides = [];\n var count = _react2.default.Children.count(spec.children);\n\n _react2.default.Children.forEach(spec.children, function (elem, index) {\n var child = void 0;\n var childOnClickOptions = {\n message: 'children',\n index: index,\n slidesToScroll: spec.slidesToScroll,\n currentSlide: spec.currentSlide\n };\n\n if (!spec.lazyLoad | (spec.lazyLoad && spec.lazyLoadedList.indexOf(index) >= 0)) {\n child = elem;\n } else {\n child = _react2.default.createElement('div', null);\n }\n var childStyle = getSlideStyle((0, _objectAssign2.default)({}, spec, { index: index }));\n var slideClass = child.props.className || '';\n\n var onClick = function onClick(e) {\n child.props && child.props.onClick && child.props.onClick(e);\n if (spec.focusOnSelect) {\n spec.focusOnSelect(childOnClickOptions);\n }\n };\n\n slides.push(_react2.default.cloneElement(child, {\n key: 'original' + getKey(child, index),\n 'data-index': index,\n className: (0, _classnames2.default)(getSlideClasses((0, _objectAssign2.default)({ index: index }, spec)), slideClass),\n tabIndex: '-1',\n style: (0, _objectAssign2.default)({ outline: 'none' }, child.props.style || {}, childStyle),\n onClick: onClick\n }));\n\n // variableWidth doesn't wrap properly.\n if (spec.infinite && spec.fade === false) {\n var infiniteCount = spec.variableWidth ? spec.slidesToShow + 1 : spec.slidesToShow;\n\n if (index >= count - infiniteCount) {\n key = -(count - index);\n preCloneSlides.push(_react2.default.cloneElement(child, {\n key: 'precloned' + getKey(child, key),\n 'data-index': key,\n className: (0, _classnames2.default)(getSlideClasses((0, _objectAssign2.default)({ index: key }, spec)), slideClass),\n style: (0, _objectAssign2.default)({}, child.props.style || {}, childStyle),\n onClick: onClick\n }));\n }\n\n if (index < infiniteCount) {\n key = count + index;\n postCloneSlides.push(_react2.default.cloneElement(child, {\n key: 'postcloned' + getKey(child, key),\n 'data-index': key,\n className: (0, _classnames2.default)(getSlideClasses((0, _objectAssign2.default)({ index: key }, spec)), slideClass),\n style: (0, _objectAssign2.default)({}, child.props.style || {}, childStyle),\n onClick: onClick\n }));\n }\n }\n });\n\n if (spec.rtl) {\n return preCloneSlides.concat(slides, postCloneSlides).reverse();\n } else {\n return preCloneSlides.concat(slides, postCloneSlides);\n }\n};\n\nvar Track = exports.Track = function (_React$Component) {\n _inherits(Track, _React$Component);\n\n function Track() {\n _classCallCheck(this, Track);\n\n return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n Track.prototype.render = function render() {\n var slides = renderSlides.call(this, this.props);\n return _react2.default.createElement(\n 'div',\n { className: 'slick-track', style: this.props.trackStyle },\n slides\n );\n };\n\n return Track;\n}(_react2.default.Component);\n\n/***/ }),\n/* 157 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nexports.__esModule = true;\nexports.Dots = undefined;\n\nvar _react = __webpack_require__(0);\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _classnames = __webpack_require__(19);\n\nvar _classnames2 = _interopRequireDefault(_classnames);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar getDotCount = function getDotCount(spec) {\n var dots;\n dots = Math.ceil(spec.slideCount / spec.slidesToScroll);\n return dots;\n};\n\nvar Dots = exports.Dots = function (_React$Component) {\n _inherits(Dots, _React$Component);\n\n function Dots() {\n _classCallCheck(this, Dots);\n\n return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n Dots.prototype.clickHandler = function clickHandler(options, e) {\n // In Autoplay the focus stays on clicked button even after transition\n // to next slide. That only goes away by click somewhere outside\n e.preventDefault();\n this.props.clickHandler(options);\n };\n\n Dots.prototype.render = function render() {\n var _this2 = this;\n\n var dotCount = getDotCount({\n slideCount: this.props.slideCount,\n slidesToScroll: this.props.slidesToScroll\n });\n\n // Apply join & split to Array to pre-fill it for IE8\n //\n // Credit: http://stackoverflow.com/a/13735425/1849458\n var dots = Array.apply(null, Array(dotCount + 1).join('0').split('')).map(function (x, i) {\n\n var leftBound = i * _this2.props.slidesToScroll;\n var rightBound = i * _this2.props.slidesToScroll + (_this2.props.slidesToScroll - 1);\n var className = (0, _classnames2.default)({\n 'slick-active': _this2.props.currentSlide >= leftBound && _this2.props.currentSlide <= rightBound\n });\n\n var dotOptions = {\n message: 'dots',\n index: i,\n slidesToScroll: _this2.props.slidesToScroll,\n currentSlide: _this2.props.currentSlide\n };\n\n var onClick = _this2.clickHandler.bind(_this2, dotOptions);\n\n return _react2.default.createElement(\n 'li',\n { key: i, className: className },\n _react2.default.cloneElement(_this2.props.customPaging(i), { onClick: onClick })\n );\n });\n\n return _react2.default.createElement(\n 'ul',\n { className: this.props.dotsClass, style: { display: 'block' } },\n dots\n );\n };\n\n return Dots;\n}(_react2.default.Component);\n\n/***/ }),\n/* 158 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nexports.__esModule = true;\nexports.NextArrow = exports.PrevArrow = undefined;\n\nvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\nvar _react = __webpack_require__(0);\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _classnames = __webpack_require__(19);\n\nvar _classnames2 = _interopRequireDefault(_classnames);\n\nvar _helpers = __webpack_require__(36);\n\nvar _helpers2 = _interopRequireDefault(_helpers);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar PrevArrow = exports.PrevArrow = function (_React$Component) {\n _inherits(PrevArrow, _React$Component);\n\n function PrevArrow() {\n _classCallCheck(this, PrevArrow);\n\n return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n PrevArrow.prototype.clickHandler = function clickHandler(options, e) {\n if (e) {\n e.preventDefault();\n }\n this.props.clickHandler(options, e);\n };\n\n PrevArrow.prototype.render = function render() {\n var prevClasses = { 'slick-arrow': true, 'slick-prev': true };\n var prevHandler = this.clickHandler.bind(this, { message: 'previous' });\n\n if (!this.props.infinite && (this.props.currentSlide === 0 || this.props.slideCount <= this.props.slidesToShow)) {\n prevClasses['slick-disabled'] = true;\n prevHandler = null;\n }\n\n var prevArrowProps = {\n key: '0',\n 'data-role': 'none',\n className: (0, _classnames2.default)(prevClasses),\n style: { display: 'block' },\n onClick: prevHandler\n };\n var customProps = {\n currentSlide: this.props.currentSlide,\n slideCount: this.props.slideCount\n };\n var prevArrow = void 0;\n\n if (this.props.prevArrow) {\n prevArrow = _react2.default.cloneElement(this.props.prevArrow, _extends({}, prevArrowProps, customProps));\n } else {\n prevArrow = _react2.default.createElement(\n 'button',\n _extends({ key: '0', type: 'button' }, prevArrowProps),\n ' Previous'\n );\n }\n\n return prevArrow;\n };\n\n return PrevArrow;\n}(_react2.default.Component);\n\nvar NextArrow = exports.NextArrow = function (_React$Component2) {\n _inherits(NextArrow, _React$Component2);\n\n function NextArrow() {\n _classCallCheck(this, NextArrow);\n\n return _possibleConstructorReturn(this, _React$Component2.apply(this, arguments));\n }\n\n NextArrow.prototype.clickHandler = function clickHandler(options, e) {\n if (e) {\n e.preventDefault();\n }\n this.props.clickHandler(options, e);\n };\n\n NextArrow.prototype.render = function render() {\n var nextClasses = { 'slick-arrow': true, 'slick-next': true };\n var nextHandler = this.clickHandler.bind(this, { message: 'next' });\n\n if (!_helpers2.default.canGoNext(this.props)) {\n nextClasses['slick-disabled'] = true;\n nextHandler = null;\n }\n\n var nextArrowProps = {\n key: '1',\n 'data-role': 'none',\n className: (0, _classnames2.default)(nextClasses),\n style: { display: 'block' },\n onClick: nextHandler\n };\n var customProps = {\n currentSlide: this.props.currentSlide,\n slideCount: this.props.slideCount\n };\n var nextArrow = void 0;\n\n if (this.props.nextArrow) {\n nextArrow = _react2.default.cloneElement(this.props.nextArrow, _extends({}, nextArrowProps, customProps));\n } else {\n nextArrow = _react2.default.createElement(\n 'button',\n _extends({ key: '1', type: 'button' }, nextArrowProps),\n ' Next'\n );\n }\n\n return nextArrow;\n };\n\n return NextArrow;\n}(_react2.default.Component);\n\n/***/ }),\n/* 159 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar camel2hyphen = __webpack_require__(160);\n\nvar isDimension = function (feature) {\n var re = /[height|width]$/;\n return re.test(feature);\n};\n\nvar obj2mq = function (obj) {\n var mq = '';\n var features = Object.keys(obj);\n features.forEach(function (feature, index) {\n var value = obj[feature];\n feature = camel2hyphen(feature);\n // Add px to dimension features\n if (isDimension(feature) && typeof value === 'number') {\n value = value + 'px';\n }\n if (value === true) {\n mq += feature;\n } else if (value === false) {\n mq += 'not ' + feature;\n } else {\n mq += '(' + feature + ': ' + value + ')';\n }\n if (index < features.length-1) {\n mq += ' and '\n }\n });\n return mq;\n};\n\nvar json2mq = function (query) {\n var mq = '';\n if (typeof query === 'string') {\n return query;\n }\n // Handling array of media queries\n if (query instanceof Array) {\n query.forEach(function (q, index) {\n mq += obj2mq(q);\n if (index < query.length-1) {\n mq += ', '\n }\n });\n return mq;\n }\n // Handling single media query\n return obj2mq(query);\n};\n\nmodule.exports = json2mq;\n\n/***/ }),\n/* 160 */\n/***/ (function(module, exports) {\n\nvar camel2hyphen = function (str) {\n return str\n .replace(/[A-Z]/g, function (match) {\n return '-' + match.toLowerCase();\n })\n .toLowerCase();\n};\n\nmodule.exports = camel2hyphen;\n\n/***/ }),\n/* 161 */\n/***/ (function(module, exports) {\n\nvar canUseDOM = !!(\n typeof window !== 'undefined' &&\n window.document &&\n window.document.createElement\n);\n\nmodule.exports = canUseDOM;\n\n/***/ }),\n/* 162 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar MediaQueryDispatch = __webpack_require__(163);\nmodule.exports = new MediaQueryDispatch();\n\n\n/***/ }),\n/* 163 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar MediaQuery = __webpack_require__(164);\nvar Util = __webpack_require__(55);\nvar each = Util.each;\nvar isFunction = Util.isFunction;\nvar isArray = Util.isArray;\n\n/**\n * Allows for registration of query handlers.\n * Manages the query handler's state and is responsible for wiring up browser events\n *\n * @constructor\n */\nfunction MediaQueryDispatch () {\n if(!window.matchMedia) {\n throw new Error('matchMedia not present, legacy browsers require a polyfill');\n }\n\n this.queries = {};\n this.browserIsIncapable = !window.matchMedia('only all').matches;\n}\n\nMediaQueryDispatch.prototype = {\n\n constructor : MediaQueryDispatch,\n\n /**\n * Registers a handler for the given media query\n *\n * @param {string} q the media query\n * @param {object || Array || Function} options either a single query handler object, a function, or an array of query handlers\n * @param {function} options.match fired when query matched\n * @param {function} [options.unmatch] fired when a query is no longer matched\n * @param {function} [options.setup] fired when handler first triggered\n * @param {boolean} [options.deferSetup=false] whether setup should be run immediately or deferred until query is first matched\n * @param {boolean} [shouldDegrade=false] whether this particular media query should always run on incapable browsers\n */\n register : function(q, options, shouldDegrade) {\n var queries = this.queries,\n isUnconditional = shouldDegrade && this.browserIsIncapable;\n\n if(!queries[q]) {\n queries[q] = new MediaQuery(q, isUnconditional);\n }\n\n //normalise to object in an array\n if(isFunction(options)) {\n options = { match : options };\n }\n if(!isArray(options)) {\n options = [options];\n }\n each(options, function(handler) {\n if (isFunction(handler)) {\n handler = { match : handler };\n }\n queries[q].addHandler(handler);\n });\n\n return this;\n },\n\n /**\n * unregisters a query and all it's handlers, or a specific handler for a query\n *\n * @param {string} q the media query to target\n * @param {object || function} [handler] specific handler to unregister\n */\n unregister : function(q, handler) {\n var query = this.queries[q];\n\n if(query) {\n if(handler) {\n query.removeHandler(handler);\n }\n else {\n query.clear();\n delete this.queries[q];\n }\n }\n\n return this;\n }\n};\n\nmodule.exports = MediaQueryDispatch;\n\n\n/***/ }),\n/* 164 */\n/***/ (function(module, exports, __webpack_require__) {\n\nvar QueryHandler = __webpack_require__(165);\nvar each = __webpack_require__(55).each;\n\n/**\n * Represents a single media query, manages it's state and registered handlers for this query\n *\n * @constructor\n * @param {string} query the media query string\n * @param {boolean} [isUnconditional=false] whether the media query should run regardless of whether the conditions are met. Primarily for helping older browsers deal with mobile-first design\n */\nfunction MediaQuery(query, isUnconditional) {\n this.query = query;\n this.isUnconditional = isUnconditional;\n this.handlers = [];\n this.mql = window.matchMedia(query);\n\n var self = this;\n this.listener = function(mql) {\n // Chrome passes an MediaQueryListEvent object, while other browsers pass MediaQueryList directly\n self.mql = mql.currentTarget || mql;\n self.assess();\n };\n this.mql.addListener(this.listener);\n}\n\nMediaQuery.prototype = {\n\n constuctor : MediaQuery,\n\n /**\n * add a handler for this query, triggering if already active\n *\n * @param {object} handler\n * @param {function} handler.match callback for when query is activated\n * @param {function} [handler.unmatch] callback for when query is deactivated\n * @param {function} [handler.setup] callback for immediate execution when a query handler is registered\n * @param {boolean} [handler.deferSetup=false] should the setup callback be deferred until the first time the handler is matched?\n */\n addHandler : function(handler) {\n var qh = new QueryHandler(handler);\n this.handlers.push(qh);\n\n this.matches() && qh.on();\n },\n\n /**\n * removes the given handler from the collection, and calls it's destroy methods\n *\n * @param {object || function} handler the handler to remove\n */\n removeHandler : function(handler) {\n var handlers = this.handlers;\n each(handlers, function(h, i) {\n if(h.equals(handler)) {\n h.destroy();\n return !handlers.splice(i,1); //remove from array and exit each early\n }\n });\n },\n\n /**\n * Determine whether the media query should be considered a match\n *\n * @return {Boolean} true if media query can be considered a match, false otherwise\n */\n matches : function() {\n return this.mql.matches || this.isUnconditional;\n },\n\n /**\n * Clears all handlers and unbinds events\n */\n clear : function() {\n each(this.handlers, function(handler) {\n handler.destroy();\n });\n this.mql.removeListener(this.listener);\n this.handlers.length = 0; //clear array\n },\n\n /*\n * Assesses the query, turning on all handlers if it matches, turning them off if it doesn't match\n */\n assess : function() {\n var action = this.matches() ? 'on' : 'off';\n\n each(this.handlers, function(handler) {\n handler[action]();\n });\n }\n};\n\nmodule.exports = MediaQuery;\n\n\n/***/ }),\n/* 165 */\n/***/ (function(module, exports) {\n\n/**\n * Delegate to handle a media query being matched and unmatched.\n *\n * @param {object} options\n * @param {function} options.match callback for when the media query is matched\n * @param {function} [options.unmatch] callback for when the media query is unmatched\n * @param {function} [options.setup] one-time callback triggered the first time a query is matched\n * @param {boolean} [options.deferSetup=false] should the setup callback be run immediately, rather than first time query is matched?\n * @constructor\n */\nfunction QueryHandler(options) {\n this.options = options;\n !options.deferSetup && this.setup();\n}\n\nQueryHandler.prototype = {\n\n constructor : QueryHandler,\n\n /**\n * coordinates setup of the handler\n *\n * @function\n */\n setup : function() {\n if(this.options.setup) {\n this.options.setup();\n }\n this.initialised = true;\n },\n\n /**\n * coordinates setup and triggering of the handler\n *\n * @function\n */\n on : function() {\n !this.initialised && this.setup();\n this.options.match && this.options.match();\n },\n\n /**\n * coordinates the unmatch event for the handler\n *\n * @function\n */\n off : function() {\n this.options.unmatch && this.options.unmatch();\n },\n\n /**\n * called when a handler is to be destroyed.\n * delegates to the destroy or unmatch callbacks, depending on availability.\n *\n * @function\n */\n destroy : function() {\n this.options.destroy ? this.options.destroy() : this.off();\n },\n\n /**\n * determines equality by reference.\n * if object is supplied compare options, if function, compare match callback\n *\n * @function\n * @param {object || function} [target] the target for comparison\n */\n equals : function(target) {\n return this.options === target || this.options.match === target;\n }\n\n};\n\nmodule.exports = QueryHandler;\n\n\n/***/ }),\n/* 166 */\n/***/ (function(module, exports) {\n\nmodule.exports = [{\"year\":1949,\"title\":\"גורי קארטר - Rock Awhile\",\"text\":\"לא בטוח שזה באמת השיר שעשה היסטוריה - קשה להתייחס אליו כאל מחולל המהפכה לאור העובדה שאף אחד כמעט לא מכיר אותו - אבל יש הטוענים כי \\\"Rock Awhile\\\" של גורי קארטר, מוזיקאי בלוז אלמוני מיוסטון, טקסס, שהקליט את צלילי הגיטרה ה\\\"מלוכלכים\\\" שלו כבר ב-1949, עוד לפני שמלאו לו 20, היה החלוץ הראשון של עידן הדיסטורשן. שנים מאוחר יותר סיפר קארטר שכתב את השיר בשעה אחת, כשהקליט עם להקתו את אלבום הבכורה שלו, ויתר הנגנים היו ב\\\"הפסקת סנדוויצ'ים\\\". השיר לא ממש הפך ללהיט, וקארטר נותר אלמוני יחסית - אבל החלוציות שלו כן זכתה לתשומת לב מצד כמה היסטוריונים של מוזיקה פופולרית, והם הכתירו אותו כמי שהקדים את זמנו בכמה שנים טובות.\",\"filename\":\"rock_awhile.mp3\"},{\"year\":1951,\"title\":\"ג'קי ברנסטון ואייק טרנר - Rocket 88\",\"text\":\"כמו \\\"Rock Awhile\\\", גם \\\"Rocket 88\\\" של ג'קי ברנסטון והדלטה קאטס (למעשה היו אלו אייק טרנר ולהקתו Kings of Rhythm) נחשב לאחד השירים שבישרו את עליית הרוקנ'רול. גם הוא, כמו קודמו, כולל צלילי גיטרה מחוספסים (הפעם היה אחראי עליהם ווילי קיזארט) - צלילים שנוצרו מ\\\"דחיקת\\\" המגבר על לקצה גבול יכולתו. ובניגוד לשירו של גורי קארטר - \\\"Rocket 88\\\" באמת הפך ללהיט. במרוצת השנים צצו כמה סיפורים על מקורם של צלילי הגיטרה החלוציים וה\\\"מעוותים\\\", הנשמעים בבירור בעיקר בסוף השיר. גרסה אחת מספרת שהמגבר צנח מגג הרכב ששימש את הלהקה, בגרסה אחרת הוא בכלל נרטב בתא המטען. כך או כך, התקלה כנראה מצאה חן בעיני חברי הלהקה והמפיק סם פיליפס ומצאה את דרכה לגרסה הסופית של השיר - ולהיסטוריה של הרוקנ'רול.\",\"filename\":\"rocket_88.mp3\"},{\"year\":1955,\"title\":\"לינק ריי - Rumble\",\"text\":\"האגדה מספרת שלינק ריי השתמש בעיפרון להשחית ולחורר את מגבר הגיטרה שלו כדי להשיג את הצליל המחוספס של \\\"Rumble\\\". גרסה אחרת מספרת שהוא השתמש במברג. יהיה הכלי המשחית אשר יהיה, הנזק עשה את שלו: עם צאתו ב-1958 הפך השיר לאחד מקטעי הגיטרה המוכרים ביותר בתולדות הרוקנ'רול (רבים בוודאי יזהו אותו מהפסקול של \\\"ספרות זולה\\\"). זוהי גם אחת הפעמים היחידות בהיסטוריה שקטע אינסטרומנטלי נאסר להשמעה בתחנות רדיו רבות ברחבי ארצות הברית, מחשש שמא ישפיע לרעה על בני הנעורים.\",\"filename\":\"rumble.mp3\"},{\"year\":1961,\"title\":\"מארטי רובינס - Don't Worry\",\"text\":\"עד עכשיו דיברנו על אלו שהקדימו את זמנם, וצלילי הבס של גריידי מרטין ב \\\"Don't Worry\\\" של המוזיקאי מארטי רובינס מייצגים את שלב המעבר: מתקלה מקרית לאפקט שניתן לשחזר (ולמסחר). גם כאן זה התחיל בציוד מקולקל - הפעם מעגל חשמלי פגום בקונסולה ששימשה את מרטין בהקלטת השיר - אולם התקלה הזו הובילה ליצירת ה-Maestro FZ-1 Fuzz-Tone: \\\"קופסת הפאזז\\\" הראשונה, שאפשרה לנגנים להלביש על נגינתם את אותו צליל חמים ומחוספס בדריכה קטנה עם הרגל.\",\"filename\":\"dont_worry.mp3\"},{\"year\":1964,\"title\":\"הקינקס - You Really Got Me\",\"text\":\"דייב דיוויס, גיטריסט להקת הרוק המצליחה, דווקא לא השתמש באפקט הטרי יחסית שהונדס רק שלוש שנים קודם לכן. את צלילי הגיטרה הקשוחים של הלהיט המוכר \\\"You Really Got Me\\\" הוא השיג - כמו רבים מקודמיו - באמצעות פגיעה מכוונת במגבר שלו. \\\"חתכתי אותו בסכין גילוח מתוך תסכול - ונדהמתי, הופתעתי והתרגשתי לשמוע איך זה עובד\\\", סיפר בעבר. אחיו ריי, סולן הלהקה, דווקא התעקש שהוא האחראי לסאונד פורץ הדרך ושהוא יצר אותו בנעיצת מחט במגבר.\",\"filename\":\"you_really_got_me.mp3\"},{\"year\":1965,\"title\":\"The Rolling Stones - (I Can't Get No) Satisfaction\",\"text\":\"גם כאן, כמו במקרה של הקינקס, מדובר כבר בלהיט רוקנ'רול על-זמני - אבל הפעם השתמשו ב\\\"קופסת הפאזז\\\", שנוצרה לאחר הקלטת \\\"Don't Worry\\\", ללא כל צורך להשמיד ולהשחית ציוד יקר. ההצלחה של אחד הלהיטים הגדולים של הסטונס הפכה את אפקט ה-Fuzz ללהיט מסחרי בעצמו, אחרי כמה שנים של מכירות מאכזבות. הדיסטורשן הפך למיינסטרים, לצלילי המזוהה ביותר עם סגנון המוזיקה שהלך וכבש את המצעדים, את גלי האתר ואת הבמות ברחבי העולם. מהפכת הרוקנ'רול חייבת לא מעט לא רק למוזיקאים שהובילו אותה - אלא גם לתקלות ולאנשי הסאונד שהעניקו לה את רעש הרקע שהיא כל כך הייתה זקוקה לו.\",\"filename\":\"satisfaction.mp3\"}]\n\n/***/ }),\n/* 167 */\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react__ = __webpack_require__(0);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_react__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_styled_components__ = __webpack_require__(1);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__styles_vars__ = __webpack_require__(2);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__static_images_backgrounds_waves_jpg__ = __webpack_require__(168);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__static_images_backgrounds_waves_jpg___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_3__static_images_backgrounds_waves_jpg__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__static_images_icons_small_play_png__ = __webpack_require__(169);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__static_images_icons_small_play_png___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_4__static_images_icons_small_play_png__);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__static_images_icons_pause2_png__ = __webpack_require__(170);\n/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__static_images_icons_pause2_png___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_5__static_images_icons_pause2_png__);\nvar _createClass=function(){function defineProperties(target,props){for(var i=0;i\r\n \r\n {this.props.idx}. \r\n {this.props.title} \r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.props.content} \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default Index;\n\n\n// WEBPACK FOOTER //\n// ./src/pages/Index.jsx","import React from 'react'\r\nimport styled from 'styled-components'\r\nimport { media, colors } from '../styles/vars'\r\n\r\n\r\nconst Container = styled.a`\r\ndisplay:inline-block;\r\nposition:relative;\r\ncursor:pointer;\r\nwidth:40px;\r\nheight:40px;\r\nborder-radius:50%;\r\nbackground-color:${colors.purple};\r\ncolor:#fff;\r\nmargin-left:10px;\r\n${props => props.botMargin ? 'margin:0 auto 9px' : ''};\r\ndisplay:${props => props.desktopOnly ? 'none' : 'inline-block'};\r\n${\r\n media.desktop`\r\n display:${props => props.mobileOnly ? 'none' : 'inline-block'};\r\n ${props => props.botMargin ? 'margin: 0 0 0 10px' : ''};\r\n `\r\n }\r\n`\r\nconst ShareIconImg = styled.img`\r\nposition:absolute;\r\nleft:0;\r\nbottom:0;\r\nright:0;\r\ntop:0;\r\nmargin:auto;\r\nmax-width:50%;\r\nfilter:${props => props.white ? 'invert(100%)' : 'unset'};\r\n`\r\nconst ShareIcon = (props) => {\r\n return (\r\n \r\n פרויקט מיוחד \r\n
\r\n \r\n 
\r\n
\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n {this.props.year} \r\n
\r\n Hello World
;\n * }\n * });\n *\n * The class specification supports a specific protocol of methods that have\n * special meaning (e.g. `render`). See `ReactClassInterface` for\n * more the comprehensive protocol. Any other properties and methods in the\n * class specification will be available on the prototype.\n *\n * @interface ReactClassInterface\n * @internal\n */\n var ReactClassInterface = {\n /**\n * An array of Mixin objects to include when defining your component.\n *\n * @type {array}\n * @optional\n */\n mixins: 'DEFINE_MANY',\n\n /**\n * An object containing properties and methods that should be defined on\n * the component's constructor instead of its prototype (static methods).\n *\n * @type {object}\n * @optional\n */\n statics: 'DEFINE_MANY',\n\n /**\n * Definition of prop types for this component.\n *\n * @type {object}\n * @optional\n */\n propTypes: 'DEFINE_MANY',\n\n /**\n * Definition of context types for this component.\n *\n * @type {object}\n * @optional\n */\n contextTypes: 'DEFINE_MANY',\n\n /**\n * Definition of context types this component sets for its children.\n *\n * @type {object}\n * @optional\n */\n childContextTypes: 'DEFINE_MANY',\n\n // ==== Definition methods ====\n\n /**\n * Invoked when the component is mounted. Values in the mapping will be set on\n * `this.props` if that prop is not specified (i.e. using an `in` check).\n *\n * This method is invoked before `getInitialState` and therefore cannot rely\n * on `this.state` or use `this.setState`.\n *\n * @return {object}\n * @optional\n */\n getDefaultProps: 'DEFINE_MANY_MERGED',\n\n /**\n * Invoked once before the component is mounted. The return value will be used\n * as the initial value of `this.state`.\n *\n * getInitialState: function() {\n * return {\n * isOn: false,\n * fooBaz: new BazFoo()\n * }\n * }\n *\n * @return {object}\n * @optional\n */\n getInitialState: 'DEFINE_MANY_MERGED',\n\n /**\n * @return {object}\n * @optional\n */\n getChildContext: 'DEFINE_MANY_MERGED',\n\n /**\n * Uses props from `this.props` and state from `this.state` to render the\n * structure of the component.\n *\n * No guarantees are made about when or how often this method is invoked, so\n * it must not have side effects.\n *\n * render: function() {\n * var name = this.props.name;\n * return Hello, {name}!
;\n * }\n *\n * @return {ReactComponent}\n * @required\n */\n render: 'DEFINE_ONCE',\n\n // ==== Delegate methods ====\n\n /**\n * Invoked when the component is initially created and about to be mounted.\n * This may have side effects, but any external subscriptions or data created\n * by this method must be cleaned up in `componentWillUnmount`.\n *\n * @optional\n */\n componentWillMount: 'DEFINE_MANY',\n\n /**\n * Invoked when the component has been mounted and has a DOM representation.\n * However, there is no guarantee that the DOM node is in the document.\n *\n * Use this as an opportunity to operate on the DOM when the component has\n * been mounted (initialized and rendered) for the first time.\n *\n * @param {DOMElement} rootNode DOM element representing the component.\n * @optional\n */\n componentDidMount: 'DEFINE_MANY',\n\n /**\n * Invoked before the component receives new props.\n *\n * Use this as an opportunity to react to a prop transition by updating the\n * state using `this.setState`. Current props are accessed via `this.props`.\n *\n * componentWillReceiveProps: function(nextProps, nextContext) {\n * this.setState({\n * likesIncreasing: nextProps.likeCount > this.props.likeCount\n * });\n * }\n *\n * NOTE: There is no equivalent `componentWillReceiveState`. An incoming prop\n * transition may cause a state change, but the opposite is not true. If you\n * need it, you are probably looking for `componentWillUpdate`.\n *\n * @param {object} nextProps\n * @optional\n */\n componentWillReceiveProps: 'DEFINE_MANY',\n\n /**\n * Invoked while deciding if the component should be updated as a result of\n * receiving new props, state and/or context.\n *\n * Use this as an opportunity to `return false` when you're certain that the\n * transition to the new props/state/context will not require a component\n * update.\n *\n * shouldComponentUpdate: function(nextProps, nextState, nextContext) {\n * return !equal(nextProps, this.props) ||\n * !equal(nextState, this.state) ||\n * !equal(nextContext, this.context);\n * }\n *\n * @param {object} nextProps\n * @param {?object} nextState\n * @param {?object} nextContext\n * @return {boolean} True if the component should update.\n * @optional\n */\n shouldComponentUpdate: 'DEFINE_ONCE',\n\n /**\n * Invoked when the component is about to update due to a transition from\n * `this.props`, `this.state` and `this.context` to `nextProps`, `nextState`\n * and `nextContext`.\n *\n * Use this as an opportunity to perform preparation before an update occurs.\n *\n * NOTE: You **cannot** use `this.setState()` in this method.\n *\n * @param {object} nextProps\n * @param {?object} nextState\n * @param {?object} nextContext\n * @param {ReactReconcileTransaction} transaction\n * @optional\n */\n componentWillUpdate: 'DEFINE_MANY',\n\n /**\n * Invoked when the component's DOM representation has been updated.\n *\n * Use this as an opportunity to operate on the DOM when the component has\n * been updated.\n *\n * @param {object} prevProps\n * @param {?object} prevState\n * @param {?object} prevContext\n * @param {DOMElement} rootNode DOM element representing the component.\n * @optional\n */\n componentDidUpdate: 'DEFINE_MANY',\n\n /**\n * Invoked when the component is about to be removed from its parent and have\n * its DOM representation destroyed.\n *\n * Use this as an opportunity to deallocate any external resources.\n *\n * NOTE: There is no `componentDidUnmount` since your component will have been\n * destroyed by that point.\n *\n * @optional\n */\n componentWillUnmount: 'DEFINE_MANY',\n\n /**\n * Replacement for (deprecated) `componentWillMount`.\n *\n * @optional\n */\n UNSAFE_componentWillMount: 'DEFINE_MANY',\n\n /**\n * Replacement for (deprecated) `componentWillReceiveProps`.\n *\n * @optional\n */\n UNSAFE_componentWillReceiveProps: 'DEFINE_MANY',\n\n /**\n * Replacement for (deprecated) `componentWillUpdate`.\n *\n * @optional\n */\n UNSAFE_componentWillUpdate: 'DEFINE_MANY',\n\n // ==== Advanced methods ====\n\n /**\n * Updates the component's currently mounted DOM representation.\n *\n * By default, this implements React's rendering and reconciliation algorithm.\n * Sophisticated clients may wish to override this.\n *\n * @param {ReactReconcileTransaction} transaction\n * @internal\n * @overridable\n */\n updateComponent: 'OVERRIDE_BASE'\n };\n\n /**\n * Similar to ReactClassInterface but for static methods.\n */\n var ReactClassStaticInterface = {\n /**\n * This method is invoked after a component is instantiated and when it\n * receives new props. Return an object to update state in response to\n * prop changes. Return null to indicate no change to state.\n *\n * If an object is returned, its keys will be merged into the existing state.\n *\n * @return {object || null}\n * @optional\n */\n getDerivedStateFromProps: 'DEFINE_MANY_MERGED'\n };\n\n /**\n * Mapping from class specification keys to special processing functions.\n *\n * Although these are declared like instance properties in the specification\n * when defining classes using `React.createClass`, they are actually static\n * and are accessible on the constructor instead of the prototype. Despite\n * being static, they must be defined outside of the \"statics\" key under\n * which all other static methods are defined.\n */\n var RESERVED_SPEC_KEYS = {\n displayName: function(Constructor, displayName) {\n Constructor.displayName = displayName;\n },\n mixins: function(Constructor, mixins) {\n if (mixins) {\n for (var i = 0; i < mixins.length; i++) {\n mixSpecIntoComponent(Constructor, mixins[i]);\n }\n }\n },\n childContextTypes: function(Constructor, childContextTypes) {\n if (process.env.NODE_ENV !== 'production') {\n validateTypeDef(Constructor, childContextTypes, 'childContext');\n }\n Constructor.childContextTypes = _assign(\n {},\n Constructor.childContextTypes,\n childContextTypes\n );\n },\n contextTypes: function(Constructor, contextTypes) {\n if (process.env.NODE_ENV !== 'production') {\n validateTypeDef(Constructor, contextTypes, 'context');\n }\n Constructor.contextTypes = _assign(\n {},\n Constructor.contextTypes,\n contextTypes\n );\n },\n /**\n * Special case getDefaultProps which should move into statics but requires\n * automatic merging.\n */\n getDefaultProps: function(Constructor, getDefaultProps) {\n if (Constructor.getDefaultProps) {\n Constructor.getDefaultProps = createMergedResultFunction(\n Constructor.getDefaultProps,\n getDefaultProps\n );\n } else {\n Constructor.getDefaultProps = getDefaultProps;\n }\n },\n propTypes: function(Constructor, propTypes) {\n if (process.env.NODE_ENV !== 'production') {\n validateTypeDef(Constructor, propTypes, 'prop');\n }\n Constructor.propTypes = _assign({}, Constructor.propTypes, propTypes);\n },\n statics: function(Constructor, statics) {\n mixStaticSpecIntoComponent(Constructor, statics);\n },\n autobind: function() {}\n };\n\n function validateTypeDef(Constructor, typeDef, location) {\n for (var propName in typeDef) {\n if (typeDef.hasOwnProperty(propName)) {\n // use a warning instead of an _invariant so components\n // don't show up in prod but only in __DEV__\n if (process.env.NODE_ENV !== 'production') {\n warning(\n typeof typeDef[propName] === 'function',\n '%s: %s type `%s` is invalid; it must be a function, usually from ' +\n 'React.PropTypes.',\n Constructor.displayName || 'ReactClass',\n ReactPropTypeLocationNames[location],\n propName\n );\n }\n }\n }\n }\n\n function validateMethodOverride(isAlreadyDefined, name) {\n var specPolicy = ReactClassInterface.hasOwnProperty(name)\n ? ReactClassInterface[name]\n : null;\n\n // Disallow overriding of base class methods unless explicitly allowed.\n if (ReactClassMixin.hasOwnProperty(name)) {\n _invariant(\n specPolicy === 'OVERRIDE_BASE',\n 'ReactClassInterface: You are attempting to override ' +\n '`%s` from your class specification. Ensure that your method names ' +\n 'do not overlap with React methods.',\n name\n );\n }\n\n // Disallow defining methods more than once unless explicitly allowed.\n if (isAlreadyDefined) {\n _invariant(\n specPolicy === 'DEFINE_MANY' || specPolicy === 'DEFINE_MANY_MERGED',\n 'ReactClassInterface: You are attempting to define ' +\n '`%s` on your component more than once. This conflict may be due ' +\n 'to a mixin.',\n name\n );\n }\n }\n\n /**\n * Mixin helper which handles policy validation and reserved\n * specification keys when building React classes.\n */\n function mixSpecIntoComponent(Constructor, spec) {\n if (!spec) {\n if (process.env.NODE_ENV !== 'production') {\n var typeofSpec = typeof spec;\n var isMixinValid = typeofSpec === 'object' && spec !== null;\n\n if (process.env.NODE_ENV !== 'production') {\n warning(\n isMixinValid,\n \"%s: You're attempting to include a mixin that is either null \" +\n 'or not an object. Check the mixins included by the component, ' +\n 'as well as any mixins they include themselves. ' +\n 'Expected object but got %s.',\n Constructor.displayName || 'ReactClass',\n spec === null ? null : typeofSpec\n );\n }\n }\n\n return;\n }\n\n _invariant(\n typeof spec !== 'function',\n \"ReactClass: You're attempting to \" +\n 'use a component class or function as a mixin. Instead, just use a ' +\n 'regular object.'\n );\n _invariant(\n !isValidElement(spec),\n \"ReactClass: You're attempting to \" +\n 'use a component as a mixin. Instead, just use a regular object.'\n );\n\n var proto = Constructor.prototype;\n var autoBindPairs = proto.__reactAutoBindPairs;\n\n // By handling mixins before any other properties, we ensure the same\n // chaining order is applied to methods with DEFINE_MANY policy, whether\n // mixins are listed before or after these methods in the spec.\n if (spec.hasOwnProperty(MIXINS_KEY)) {\n RESERVED_SPEC_KEYS.mixins(Constructor, spec.mixins);\n }\n\n for (var name in spec) {\n if (!spec.hasOwnProperty(name)) {\n continue;\n }\n\n if (name === MIXINS_KEY) {\n // We have already handled mixins in a special case above.\n continue;\n }\n\n var property = spec[name];\n var isAlreadyDefined = proto.hasOwnProperty(name);\n validateMethodOverride(isAlreadyDefined, name);\n\n if (RESERVED_SPEC_KEYS.hasOwnProperty(name)) {\n RESERVED_SPEC_KEYS[name](Constructor, property);\n } else {\n // Setup methods on prototype:\n // The following member methods should not be automatically bound:\n // 1. Expected ReactClass methods (in the \"interface\").\n // 2. Overridden methods (that were mixed in).\n var isReactClassMethod = ReactClassInterface.hasOwnProperty(name);\n var isFunction = typeof property === 'function';\n var shouldAutoBind =\n isFunction &&\n !isReactClassMethod &&\n !isAlreadyDefined &&\n spec.autobind !== false;\n\n if (shouldAutoBind) {\n autoBindPairs.push(name, property);\n proto[name] = property;\n } else {\n if (isAlreadyDefined) {\n var specPolicy = ReactClassInterface[name];\n\n // These cases should already be caught by validateMethodOverride.\n _invariant(\n isReactClassMethod &&\n (specPolicy === 'DEFINE_MANY_MERGED' ||\n specPolicy === 'DEFINE_MANY'),\n 'ReactClass: Unexpected spec policy %s for key %s ' +\n 'when mixing in component specs.',\n specPolicy,\n name\n );\n\n // For methods which are defined more than once, call the existing\n // methods before calling the new property, merging if appropriate.\n if (specPolicy === 'DEFINE_MANY_MERGED') {\n proto[name] = createMergedResultFunction(proto[name], property);\n } else if (specPolicy === 'DEFINE_MANY') {\n proto[name] = createChainedFunction(proto[name], property);\n }\n } else {\n proto[name] = property;\n if (process.env.NODE_ENV !== 'production') {\n // Add verbose displayName to the function, which helps when looking\n // at profiling tools.\n if (typeof property === 'function' && spec.displayName) {\n proto[name].displayName = spec.displayName + '_' + name;\n }\n }\n }\n }\n }\n }\n }\n\n function mixStaticSpecIntoComponent(Constructor, statics) {\n if (!statics) {\n return;\n }\n\n for (var name in statics) {\n var property = statics[name];\n if (!statics.hasOwnProperty(name)) {\n continue;\n }\n\n var isReserved = name in RESERVED_SPEC_KEYS;\n _invariant(\n !isReserved,\n 'ReactClass: You are attempting to define a reserved ' +\n 'property, `%s`, that shouldn\\'t be on the \"statics\" key. Define it ' +\n 'as an instance property instead; it will still be accessible on the ' +\n 'constructor.',\n name\n );\n\n var isAlreadyDefined = name in Constructor;\n if (isAlreadyDefined) {\n var specPolicy = ReactClassStaticInterface.hasOwnProperty(name)\n ? ReactClassStaticInterface[name]\n : null;\n\n _invariant(\n specPolicy === 'DEFINE_MANY_MERGED',\n 'ReactClass: You are attempting to define ' +\n '`%s` on your component more than once. This conflict may be ' +\n 'due to a mixin.',\n name\n );\n\n Constructor[name] = createMergedResultFunction(Constructor[name], property);\n\n return;\n }\n\n Constructor[name] = property;\n }\n }\n\n /**\n * Merge two objects, but throw if both contain the same key.\n *\n * @param {object} one The first object, which is mutated.\n * @param {object} two The second object\n * @return {object} one after it has been mutated to contain everything in two.\n */\n function mergeIntoWithNoDuplicateKeys(one, two) {\n _invariant(\n one && two && typeof one === 'object' && typeof two === 'object',\n 'mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.'\n );\n\n for (var key in two) {\n if (two.hasOwnProperty(key)) {\n _invariant(\n one[key] === undefined,\n 'mergeIntoWithNoDuplicateKeys(): ' +\n 'Tried to merge two objects with the same key: `%s`. This conflict ' +\n 'may be due to a mixin; in particular, this may be caused by two ' +\n 'getInitialState() or getDefaultProps() methods returning objects ' +\n 'with clashing keys.',\n key\n );\n one[key] = two[key];\n }\n }\n return one;\n }\n\n /**\n * Creates a function that invokes two functions and merges their return values.\n *\n * @param {function} one Function to invoke first.\n * @param {function} two Function to invoke second.\n * @return {function} Function that invokes the two argument functions.\n * @private\n */\n function createMergedResultFunction(one, two) {\n return function mergedResult() {\n var a = one.apply(this, arguments);\n var b = two.apply(this, arguments);\n if (a == null) {\n return b;\n } else if (b == null) {\n return a;\n }\n var c = {};\n mergeIntoWithNoDuplicateKeys(c, a);\n mergeIntoWithNoDuplicateKeys(c, b);\n return c;\n };\n }\n\n /**\n * Creates a function that invokes two functions and ignores their return vales.\n *\n * @param {function} one Function to invoke first.\n * @param {function} two Function to invoke second.\n * @return {function} Function that invokes the two argument functions.\n * @private\n */\n function createChainedFunction(one, two) {\n return function chainedFunction() {\n one.apply(this, arguments);\n two.apply(this, arguments);\n };\n }\n\n /**\n * Binds a method to the component.\n *\n * @param {object} component Component whose method is going to be bound.\n * @param {function} method Method to be bound.\n * @return {function} The bound method.\n */\n function bindAutoBindMethod(component, method) {\n var boundMethod = method.bind(component);\n if (process.env.NODE_ENV !== 'production') {\n boundMethod.__reactBoundContext = component;\n boundMethod.__reactBoundMethod = method;\n boundMethod.__reactBoundArguments = null;\n var componentName = component.constructor.displayName;\n var _bind = boundMethod.bind;\n boundMethod.bind = function(newThis) {\n for (\n var _len = arguments.length,\n args = Array(_len > 1 ? _len - 1 : 0),\n _key = 1;\n _key < _len;\n _key++\n ) {\n args[_key - 1] = arguments[_key];\n }\n\n // User is trying to bind() an autobound method; we effectively will\n // ignore the value of \"this\" that the user is trying to use, so\n // let's warn.\n if (newThis !== component && newThis !== null) {\n if (process.env.NODE_ENV !== 'production') {\n warning(\n false,\n 'bind(): React component methods may only be bound to the ' +\n 'component instance. See %s',\n componentName\n );\n }\n } else if (!args.length) {\n if (process.env.NODE_ENV !== 'production') {\n warning(\n false,\n 'bind(): You are binding a component method to the component. ' +\n 'React does this for you automatically in a high-performance ' +\n 'way, so you can safely remove this call. See %s',\n componentName\n );\n }\n return boundMethod;\n }\n var reboundMethod = _bind.apply(boundMethod, arguments);\n reboundMethod.__reactBoundContext = component;\n reboundMethod.__reactBoundMethod = method;\n reboundMethod.__reactBoundArguments = args;\n return reboundMethod;\n };\n }\n return boundMethod;\n }\n\n /**\n * Binds all auto-bound methods in a component.\n *\n * @param {object} component Component whose method is going to be bound.\n */\n function bindAutoBindMethods(component) {\n var pairs = component.__reactAutoBindPairs;\n for (var i = 0; i < pairs.length; i += 2) {\n var autoBindKey = pairs[i];\n var method = pairs[i + 1];\n component[autoBindKey] = bindAutoBindMethod(component, method);\n }\n }\n\n var IsMountedPreMixin = {\n componentDidMount: function() {\n this.__isMounted = true;\n }\n };\n\n var IsMountedPostMixin = {\n componentWillUnmount: function() {\n this.__isMounted = false;\n }\n };\n\n /**\n * Add more to the ReactClass base class. These are all legacy features and\n * therefore not already part of the modern ReactComponent.\n */\n var ReactClassMixin = {\n /**\n * TODO: This will be deprecated because state should always keep a consistent\n * type signature and the only use case for this, is to avoid that.\n */\n replaceState: function(newState, callback) {\n this.updater.enqueueReplaceState(this, newState, callback);\n },\n\n /**\n * Checks whether or not this composite component is mounted.\n * @return {boolean} True if mounted, false otherwise.\n * @protected\n * @final\n */\n isMounted: function() {\n if (process.env.NODE_ENV !== 'production') {\n warning(\n this.__didWarnIsMounted,\n '%s: isMounted is deprecated. Instead, make sure to clean up ' +\n 'subscriptions and pending requests in componentWillUnmount to ' +\n 'prevent memory leaks.',\n (this.constructor && this.constructor.displayName) ||\n this.name ||\n 'Component'\n );\n this.__didWarnIsMounted = true;\n }\n return !!this.__isMounted;\n }\n };\n\n var ReactClassComponent = function() {};\n _assign(\n ReactClassComponent.prototype,\n ReactComponent.prototype,\n ReactClassMixin\n );\n\n /**\n * Creates a composite component class given a class specification.\n * See https://facebook.github.io/react/docs/top-level-api.html#react.createclass\n *\n * @param {object} spec Class specification (which must define `render`).\n * @return {function} Component constructor function.\n * @public\n */\n function createClass(spec) {\n // To keep our warnings more understandable, we'll use a little hack here to\n // ensure that Constructor.name !== 'Constructor'. This makes sure we don't\n // unnecessarily identify a class without displayName as 'Constructor'.\n var Constructor = identity(function(props, context, updater) {\n // This constructor gets overridden by mocks. The argument is used\n // by mocks to assert on what gets mounted.\n\n if (process.env.NODE_ENV !== 'production') {\n warning(\n this instanceof Constructor,\n 'Something is calling a React component directly. Use a factory or ' +\n 'JSX instead. See: https://fb.me/react-legacyfactory'\n );\n }\n\n // Wire up auto-binding\n if (this.__reactAutoBindPairs.length) {\n bindAutoBindMethods(this);\n }\n\n this.props = props;\n this.context = context;\n this.refs = emptyObject;\n this.updater = updater || ReactNoopUpdateQueue;\n\n this.state = null;\n\n // ReactClasses doesn't have constructors. Instead, they use the\n // getInitialState and componentWillMount methods for initialization.\n\n var initialState = this.getInitialState ? this.getInitialState() : null;\n if (process.env.NODE_ENV !== 'production') {\n // We allow auto-mocks to proceed as if they're returning null.\n if (\n initialState === undefined &&\n this.getInitialState._isMockFunction\n ) {\n // This is probably bad practice. Consider warning here and\n // deprecating this convenience.\n initialState = null;\n }\n }\n _invariant(\n typeof initialState === 'object' && !Array.isArray(initialState),\n '%s.getInitialState(): must return an object or null',\n Constructor.displayName || 'ReactCompositeComponent'\n );\n\n this.state = initialState;\n });\n Constructor.prototype = new ReactClassComponent();\n Constructor.prototype.constructor = Constructor;\n Constructor.prototype.__reactAutoBindPairs = [];\n\n injectedMixins.forEach(mixSpecIntoComponent.bind(null, Constructor));\n\n mixSpecIntoComponent(Constructor, IsMountedPreMixin);\n mixSpecIntoComponent(Constructor, spec);\n mixSpecIntoComponent(Constructor, IsMountedPostMixin);\n\n // Initialize the defaultProps property after all mixins have been merged.\n if (Constructor.getDefaultProps) {\n Constructor.defaultProps = Constructor.getDefaultProps();\n }\n\n if (process.env.NODE_ENV !== 'production') {\n // This is a tag to indicate that the use of these method names is ok,\n // since it's used with createClass. If it's not, then it's likely a\n // mistake so we'll warn you to use the static property, property\n // initializer or constructor respectively.\n if (Constructor.getDefaultProps) {\n Constructor.getDefaultProps.isReactClassApproved = {};\n }\n if (Constructor.prototype.getInitialState) {\n Constructor.prototype.getInitialState.isReactClassApproved = {};\n }\n }\n\n _invariant(\n Constructor.prototype.render,\n 'createClass(...): Class specification must implement a `render` method.'\n );\n\n if (process.env.NODE_ENV !== 'production') {\n warning(\n !Constructor.prototype.componentShouldUpdate,\n '%s has a method called ' +\n 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' +\n 'The name is phrased as a question because the function is ' +\n 'expected to return a value.',\n spec.displayName || 'A component'\n );\n warning(\n !Constructor.prototype.componentWillRecieveProps,\n '%s has a method called ' +\n 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?',\n spec.displayName || 'A component'\n );\n warning(\n !Constructor.prototype.UNSAFE_componentWillRecieveProps,\n '%s has a method called UNSAFE_componentWillRecieveProps(). ' +\n 'Did you mean UNSAFE_componentWillReceiveProps()?',\n spec.displayName || 'A component'\n );\n }\n\n // Reduce time spent doing lookups by setting these on the prototype.\n for (var methodName in ReactClassInterface) {\n if (!Constructor.prototype[methodName]) {\n Constructor.prototype[methodName] = null;\n }\n }\n\n return Constructor;\n }\n\n return createClass;\n}\n\nmodule.exports = factory;\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/create-react-class/factory.js\n// module id = 155\n// module chunks = 0","'use strict';\n\nexports.__esModule = true;\nexports.Track = undefined;\n\nvar _react = require('react');\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _objectAssign = require('object-assign');\n\nvar _objectAssign2 = _interopRequireDefault(_objectAssign);\n\nvar _classnames = require('classnames');\n\nvar _classnames2 = _interopRequireDefault(_classnames);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar getSlideClasses = function getSlideClasses(spec) {\n var slickActive, slickCenter, slickCloned;\n var centerOffset, index;\n\n if (spec.rtl) {\n index = spec.slideCount - 1 - spec.index;\n } else {\n index = spec.index;\n }\n slickCloned = index < 0 || index >= spec.slideCount;\n if (spec.centerMode) {\n centerOffset = Math.floor(spec.slidesToShow / 2);\n slickCenter = (index - spec.currentSlide) % spec.slideCount === 0;\n if (index > spec.currentSlide - centerOffset - 1 && index <= spec.currentSlide + centerOffset) {\n slickActive = true;\n }\n } else {\n slickActive = spec.currentSlide <= index && index < spec.currentSlide + spec.slidesToShow;\n }\n return (0, _classnames2.default)({\n 'slick-slide': true,\n 'slick-active': slickActive,\n 'slick-center': slickCenter,\n 'slick-cloned': slickCloned\n });\n};\n\nvar getSlideStyle = function getSlideStyle(spec) {\n var style = {};\n\n if (spec.variableWidth === undefined || spec.variableWidth === false) {\n style.width = spec.slideWidth;\n }\n\n if (spec.fade) {\n style.position = 'relative';\n style.left = -spec.index * spec.slideWidth;\n style.opacity = spec.currentSlide === spec.index ? 1 : 0;\n style.transition = 'opacity ' + spec.speed + 'ms ' + spec.cssEase;\n style.WebkitTransition = 'opacity ' + spec.speed + 'ms ' + spec.cssEase;\n }\n\n return style;\n};\n\nvar getKey = function getKey(child, fallbackKey) {\n // key could be a zero\n return child.key === null || child.key === undefined ? fallbackKey : child.key;\n};\n\nvar renderSlides = function renderSlides(spec) {\n var key;\n var slides = [];\n var preCloneSlides = [];\n var postCloneSlides = [];\n var count = _react2.default.Children.count(spec.children);\n\n _react2.default.Children.forEach(spec.children, function (elem, index) {\n var child = void 0;\n var childOnClickOptions = {\n message: 'children',\n index: index,\n slidesToScroll: spec.slidesToScroll,\n currentSlide: spec.currentSlide\n };\n\n if (!spec.lazyLoad | (spec.lazyLoad && spec.lazyLoadedList.indexOf(index) >= 0)) {\n child = elem;\n } else {\n child = _react2.default.createElement('div', null);\n }\n var childStyle = getSlideStyle((0, _objectAssign2.default)({}, spec, { index: index }));\n var slideClass = child.props.className || '';\n\n var onClick = function onClick(e) {\n child.props && child.props.onClick && child.props.onClick(e);\n if (spec.focusOnSelect) {\n spec.focusOnSelect(childOnClickOptions);\n }\n };\n\n slides.push(_react2.default.cloneElement(child, {\n key: 'original' + getKey(child, index),\n 'data-index': index,\n className: (0, _classnames2.default)(getSlideClasses((0, _objectAssign2.default)({ index: index }, spec)), slideClass),\n tabIndex: '-1',\n style: (0, _objectAssign2.default)({ outline: 'none' }, child.props.style || {}, childStyle),\n onClick: onClick\n }));\n\n // variableWidth doesn't wrap properly.\n if (spec.infinite && spec.fade === false) {\n var infiniteCount = spec.variableWidth ? spec.slidesToShow + 1 : spec.slidesToShow;\n\n if (index >= count - infiniteCount) {\n key = -(count - index);\n preCloneSlides.push(_react2.default.cloneElement(child, {\n key: 'precloned' + getKey(child, key),\n 'data-index': key,\n className: (0, _classnames2.default)(getSlideClasses((0, _objectAssign2.default)({ index: key }, spec)), slideClass),\n style: (0, _objectAssign2.default)({}, child.props.style || {}, childStyle),\n onClick: onClick\n }));\n }\n\n if (index < infiniteCount) {\n key = count + index;\n postCloneSlides.push(_react2.default.cloneElement(child, {\n key: 'postcloned' + getKey(child, key),\n 'data-index': key,\n className: (0, _classnames2.default)(getSlideClasses((0, _objectAssign2.default)({ index: key }, spec)), slideClass),\n style: (0, _objectAssign2.default)({}, child.props.style || {}, childStyle),\n onClick: onClick\n }));\n }\n }\n });\n\n if (spec.rtl) {\n return preCloneSlides.concat(slides, postCloneSlides).reverse();\n } else {\n return preCloneSlides.concat(slides, postCloneSlides);\n }\n};\n\nvar Track = exports.Track = function (_React$Component) {\n _inherits(Track, _React$Component);\n\n function Track() {\n _classCallCheck(this, Track);\n\n return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n Track.prototype.render = function render() {\n var slides = renderSlides.call(this, this.props);\n return _react2.default.createElement(\n 'div',\n { className: 'slick-track', style: this.props.trackStyle },\n slides\n );\n };\n\n return Track;\n}(_react2.default.Component);\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/react-slick/lib/track.js\n// module id = 156\n// module chunks = 0","'use strict';\n\nexports.__esModule = true;\nexports.Dots = undefined;\n\nvar _react = require('react');\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _classnames = require('classnames');\n\nvar _classnames2 = _interopRequireDefault(_classnames);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar getDotCount = function getDotCount(spec) {\n var dots;\n dots = Math.ceil(spec.slideCount / spec.slidesToScroll);\n return dots;\n};\n\nvar Dots = exports.Dots = function (_React$Component) {\n _inherits(Dots, _React$Component);\n\n function Dots() {\n _classCallCheck(this, Dots);\n\n return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n Dots.prototype.clickHandler = function clickHandler(options, e) {\n // In Autoplay the focus stays on clicked button even after transition\n // to next slide. That only goes away by click somewhere outside\n e.preventDefault();\n this.props.clickHandler(options);\n };\n\n Dots.prototype.render = function render() {\n var _this2 = this;\n\n var dotCount = getDotCount({\n slideCount: this.props.slideCount,\n slidesToScroll: this.props.slidesToScroll\n });\n\n // Apply join & split to Array to pre-fill it for IE8\n //\n // Credit: http://stackoverflow.com/a/13735425/1849458\n var dots = Array.apply(null, Array(dotCount + 1).join('0').split('')).map(function (x, i) {\n\n var leftBound = i * _this2.props.slidesToScroll;\n var rightBound = i * _this2.props.slidesToScroll + (_this2.props.slidesToScroll - 1);\n var className = (0, _classnames2.default)({\n 'slick-active': _this2.props.currentSlide >= leftBound && _this2.props.currentSlide <= rightBound\n });\n\n var dotOptions = {\n message: 'dots',\n index: i,\n slidesToScroll: _this2.props.slidesToScroll,\n currentSlide: _this2.props.currentSlide\n };\n\n var onClick = _this2.clickHandler.bind(_this2, dotOptions);\n\n return _react2.default.createElement(\n 'li',\n { key: i, className: className },\n _react2.default.cloneElement(_this2.props.customPaging(i), { onClick: onClick })\n );\n });\n\n return _react2.default.createElement(\n 'ul',\n { className: this.props.dotsClass, style: { display: 'block' } },\n dots\n );\n };\n\n return Dots;\n}(_react2.default.Component);\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/react-slick/lib/dots.js\n// module id = 157\n// module chunks = 0","'use strict';\n\nexports.__esModule = true;\nexports.NextArrow = exports.PrevArrow = undefined;\n\nvar _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };\n\nvar _react = require('react');\n\nvar _react2 = _interopRequireDefault(_react);\n\nvar _classnames = require('classnames');\n\nvar _classnames2 = _interopRequireDefault(_classnames);\n\nvar _helpers = require('./mixins/helpers');\n\nvar _helpers2 = _interopRequireDefault(_helpers);\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return call && (typeof call === \"object\" || typeof call === \"function\") ? call : self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function, not \" + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }\n\nvar PrevArrow = exports.PrevArrow = function (_React$Component) {\n _inherits(PrevArrow, _React$Component);\n\n function PrevArrow() {\n _classCallCheck(this, PrevArrow);\n\n return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));\n }\n\n PrevArrow.prototype.clickHandler = function clickHandler(options, e) {\n if (e) {\n e.preventDefault();\n }\n this.props.clickHandler(options, e);\n };\n\n PrevArrow.prototype.render = function render() {\n var prevClasses = { 'slick-arrow': true, 'slick-prev': true };\n var prevHandler = this.clickHandler.bind(this, { message: 'previous' });\n\n if (!this.props.infinite && (this.props.currentSlide === 0 || this.props.slideCount <= this.props.slidesToShow)) {\n prevClasses['slick-disabled'] = true;\n prevHandler = null;\n }\n\n var prevArrowProps = {\n key: '0',\n 'data-role': 'none',\n className: (0, _classnames2.default)(prevClasses),\n style: { display: 'block' },\n onClick: prevHandler\n };\n var customProps = {\n currentSlide: this.props.currentSlide,\n slideCount: this.props.slideCount\n };\n var prevArrow = void 0;\n\n if (this.props.prevArrow) {\n prevArrow = _react2.default.cloneElement(this.props.prevArrow, _extends({}, prevArrowProps, customProps));\n } else {\n prevArrow = _react2.default.createElement(\n 'button',\n _extends({ key: '0', type: 'button' }, prevArrowProps),\n ' Previous'\n );\n }\n\n return prevArrow;\n };\n\n return PrevArrow;\n}(_react2.default.Component);\n\nvar NextArrow = exports.NextArrow = function (_React$Component2) {\n _inherits(NextArrow, _React$Component2);\n\n function NextArrow() {\n _classCallCheck(this, NextArrow);\n\n return _possibleConstructorReturn(this, _React$Component2.apply(this, arguments));\n }\n\n NextArrow.prototype.clickHandler = function clickHandler(options, e) {\n if (e) {\n e.preventDefault();\n }\n this.props.clickHandler(options, e);\n };\n\n NextArrow.prototype.render = function render() {\n var nextClasses = { 'slick-arrow': true, 'slick-next': true };\n var nextHandler = this.clickHandler.bind(this, { message: 'next' });\n\n if (!_helpers2.default.canGoNext(this.props)) {\n nextClasses['slick-disabled'] = true;\n nextHandler = null;\n }\n\n var nextArrowProps = {\n key: '1',\n 'data-role': 'none',\n className: (0, _classnames2.default)(nextClasses),\n style: { display: 'block' },\n onClick: nextHandler\n };\n var customProps = {\n currentSlide: this.props.currentSlide,\n slideCount: this.props.slideCount\n };\n var nextArrow = void 0;\n\n if (this.props.nextArrow) {\n nextArrow = _react2.default.cloneElement(this.props.nextArrow, _extends({}, nextArrowProps, customProps));\n } else {\n nextArrow = _react2.default.createElement(\n 'button',\n _extends({ key: '1', type: 'button' }, nextArrowProps),\n ' Next'\n );\n }\n\n return nextArrow;\n };\n\n return NextArrow;\n}(_react2.default.Component);\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/react-slick/lib/arrows.js\n// module id = 158\n// module chunks = 0","var camel2hyphen = require('string-convert/camel2hyphen');\n\nvar isDimension = function (feature) {\n var re = /[height|width]$/;\n return re.test(feature);\n};\n\nvar obj2mq = function (obj) {\n var mq = '';\n var features = Object.keys(obj);\n features.forEach(function (feature, index) {\n var value = obj[feature];\n feature = camel2hyphen(feature);\n // Add px to dimension features\n if (isDimension(feature) && typeof value === 'number') {\n value = value + 'px';\n }\n if (value === true) {\n mq += feature;\n } else if (value === false) {\n mq += 'not ' + feature;\n } else {\n mq += '(' + feature + ': ' + value + ')';\n }\n if (index < features.length-1) {\n mq += ' and '\n }\n });\n return mq;\n};\n\nvar json2mq = function (query) {\n var mq = '';\n if (typeof query === 'string') {\n return query;\n }\n // Handling array of media queries\n if (query instanceof Array) {\n query.forEach(function (q, index) {\n mq += obj2mq(q);\n if (index < query.length-1) {\n mq += ', '\n }\n });\n return mq;\n }\n // Handling single media query\n return obj2mq(query);\n};\n\nmodule.exports = json2mq;\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/json2mq/index.js\n// module id = 159\n// module chunks = 0","var camel2hyphen = function (str) {\n return str\n .replace(/[A-Z]/g, function (match) {\n return '-' + match.toLowerCase();\n })\n .toLowerCase();\n};\n\nmodule.exports = camel2hyphen;\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/string-convert/camel2hyphen.js\n// module id = 160\n// module chunks = 0","var canUseDOM = !!(\n typeof window !== 'undefined' &&\n window.document &&\n window.document.createElement\n);\n\nmodule.exports = canUseDOM;\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/can-use-dom/index.js\n// module id = 161\n// module chunks = 0","var MediaQueryDispatch = require('./MediaQueryDispatch');\nmodule.exports = new MediaQueryDispatch();\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/enquire.js/src/index.js\n// module id = 162\n// module chunks = 0","var MediaQuery = require('./MediaQuery');\nvar Util = require('./Util');\nvar each = Util.each;\nvar isFunction = Util.isFunction;\nvar isArray = Util.isArray;\n\n/**\n * Allows for registration of query handlers.\n * Manages the query handler's state and is responsible for wiring up browser events\n *\n * @constructor\n */\nfunction MediaQueryDispatch () {\n if(!window.matchMedia) {\n throw new Error('matchMedia not present, legacy browsers require a polyfill');\n }\n\n this.queries = {};\n this.browserIsIncapable = !window.matchMedia('only all').matches;\n}\n\nMediaQueryDispatch.prototype = {\n\n constructor : MediaQueryDispatch,\n\n /**\n * Registers a handler for the given media query\n *\n * @param {string} q the media query\n * @param {object || Array || Function} options either a single query handler object, a function, or an array of query handlers\n * @param {function} options.match fired when query matched\n * @param {function} [options.unmatch] fired when a query is no longer matched\n * @param {function} [options.setup] fired when handler first triggered\n * @param {boolean} [options.deferSetup=false] whether setup should be run immediately or deferred until query is first matched\n * @param {boolean} [shouldDegrade=false] whether this particular media query should always run on incapable browsers\n */\n register : function(q, options, shouldDegrade) {\n var queries = this.queries,\n isUnconditional = shouldDegrade && this.browserIsIncapable;\n\n if(!queries[q]) {\n queries[q] = new MediaQuery(q, isUnconditional);\n }\n\n //normalise to object in an array\n if(isFunction(options)) {\n options = { match : options };\n }\n if(!isArray(options)) {\n options = [options];\n }\n each(options, function(handler) {\n if (isFunction(handler)) {\n handler = { match : handler };\n }\n queries[q].addHandler(handler);\n });\n\n return this;\n },\n\n /**\n * unregisters a query and all it's handlers, or a specific handler for a query\n *\n * @param {string} q the media query to target\n * @param {object || function} [handler] specific handler to unregister\n */\n unregister : function(q, handler) {\n var query = this.queries[q];\n\n if(query) {\n if(handler) {\n query.removeHandler(handler);\n }\n else {\n query.clear();\n delete this.queries[q];\n }\n }\n\n return this;\n }\n};\n\nmodule.exports = MediaQueryDispatch;\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/enquire.js/src/MediaQueryDispatch.js\n// module id = 163\n// module chunks = 0","var QueryHandler = require('./QueryHandler');\nvar each = require('./Util').each;\n\n/**\n * Represents a single media query, manages it's state and registered handlers for this query\n *\n * @constructor\n * @param {string} query the media query string\n * @param {boolean} [isUnconditional=false] whether the media query should run regardless of whether the conditions are met. Primarily for helping older browsers deal with mobile-first design\n */\nfunction MediaQuery(query, isUnconditional) {\n this.query = query;\n this.isUnconditional = isUnconditional;\n this.handlers = [];\n this.mql = window.matchMedia(query);\n\n var self = this;\n this.listener = function(mql) {\n // Chrome passes an MediaQueryListEvent object, while other browsers pass MediaQueryList directly\n self.mql = mql.currentTarget || mql;\n self.assess();\n };\n this.mql.addListener(this.listener);\n}\n\nMediaQuery.prototype = {\n\n constuctor : MediaQuery,\n\n /**\n * add a handler for this query, triggering if already active\n *\n * @param {object} handler\n * @param {function} handler.match callback for when query is activated\n * @param {function} [handler.unmatch] callback for when query is deactivated\n * @param {function} [handler.setup] callback for immediate execution when a query handler is registered\n * @param {boolean} [handler.deferSetup=false] should the setup callback be deferred until the first time the handler is matched?\n */\n addHandler : function(handler) {\n var qh = new QueryHandler(handler);\n this.handlers.push(qh);\n\n this.matches() && qh.on();\n },\n\n /**\n * removes the given handler from the collection, and calls it's destroy methods\n *\n * @param {object || function} handler the handler to remove\n */\n removeHandler : function(handler) {\n var handlers = this.handlers;\n each(handlers, function(h, i) {\n if(h.equals(handler)) {\n h.destroy();\n return !handlers.splice(i,1); //remove from array and exit each early\n }\n });\n },\n\n /**\n * Determine whether the media query should be considered a match\n *\n * @return {Boolean} true if media query can be considered a match, false otherwise\n */\n matches : function() {\n return this.mql.matches || this.isUnconditional;\n },\n\n /**\n * Clears all handlers and unbinds events\n */\n clear : function() {\n each(this.handlers, function(handler) {\n handler.destroy();\n });\n this.mql.removeListener(this.listener);\n this.handlers.length = 0; //clear array\n },\n\n /*\n * Assesses the query, turning on all handlers if it matches, turning them off if it doesn't match\n */\n assess : function() {\n var action = this.matches() ? 'on' : 'off';\n\n each(this.handlers, function(handler) {\n handler[action]();\n });\n }\n};\n\nmodule.exports = MediaQuery;\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/enquire.js/src/MediaQuery.js\n// module id = 164\n// module chunks = 0","/**\n * Delegate to handle a media query being matched and unmatched.\n *\n * @param {object} options\n * @param {function} options.match callback for when the media query is matched\n * @param {function} [options.unmatch] callback for when the media query is unmatched\n * @param {function} [options.setup] one-time callback triggered the first time a query is matched\n * @param {boolean} [options.deferSetup=false] should the setup callback be run immediately, rather than first time query is matched?\n * @constructor\n */\nfunction QueryHandler(options) {\n this.options = options;\n !options.deferSetup && this.setup();\n}\n\nQueryHandler.prototype = {\n\n constructor : QueryHandler,\n\n /**\n * coordinates setup of the handler\n *\n * @function\n */\n setup : function() {\n if(this.options.setup) {\n this.options.setup();\n }\n this.initialised = true;\n },\n\n /**\n * coordinates setup and triggering of the handler\n *\n * @function\n */\n on : function() {\n !this.initialised && this.setup();\n this.options.match && this.options.match();\n },\n\n /**\n * coordinates the unmatch event for the handler\n *\n * @function\n */\n off : function() {\n this.options.unmatch && this.options.unmatch();\n },\n\n /**\n * called when a handler is to be destroyed.\n * delegates to the destroy or unmatch callbacks, depending on availability.\n *\n * @function\n */\n destroy : function() {\n this.options.destroy ? this.options.destroy() : this.off();\n },\n\n /**\n * determines equality by reference.\n * if object is supplied compare options, if function, compare match callback\n *\n * @function\n * @param {object || function} [target] the target for comparison\n */\n equals : function(target) {\n return this.options === target || this.options.match === target;\n }\n\n};\n\nmodule.exports = QueryHandler;\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./node_modules/enquire.js/src/QueryHandler.js\n// module id = 165\n// module chunks = 0","module.exports = [{\"year\":1949,\"title\":\"גורי קארטר - Rock Awhile\",\"text\":\"לא בטוח שזה באמת השיר שעשה היסטוריה - קשה להתייחס אליו כאל מחולל המהפכה לאור העובדה שאף אחד כמעט לא מכיר אותו - אבל יש הטוענים כי \\\"Rock Awhile\\\" של גורי קארטר, מוזיקאי בלוז אלמוני מיוסטון, טקסס, שהקליט את צלילי הגיטרה ה\\\"מלוכלכים\\\" שלו כבר ב-1949, עוד לפני שמלאו לו 20, היה החלוץ הראשון של עידן הדיסטורשן. שנים מאוחר יותר סיפר קארטר שכתב את השיר בשעה אחת, כשהקליט עם להקתו את אלבום הבכורה שלו, ויתר הנגנים היו ב\\\"הפסקת סנדוויצ'ים\\\". השיר לא ממש הפך ללהיט, וקארטר נותר אלמוני יחסית - אבל החלוציות שלו כן זכתה לתשומת לב מצד כמה היסטוריונים של מוזיקה פופולרית, והם הכתירו אותו כמי שהקדים את זמנו בכמה שנים טובות.\",\"filename\":\"rock_awhile.mp3\"},{\"year\":1951,\"title\":\"ג'קי ברנסטון ואייק טרנר - Rocket 88\",\"text\":\"כמו \\\"Rock Awhile\\\", גם \\\"Rocket 88\\\" של ג'קי ברנסטון והדלטה קאטס (למעשה היו אלו אייק טרנר ולהקתו Kings of Rhythm) נחשב לאחד השירים שבישרו את עליית הרוקנ'רול. גם הוא, כמו קודמו, כולל צלילי גיטרה מחוספסים (הפעם היה אחראי עליהם ווילי קיזארט) - צלילים שנוצרו מ\\\"דחיקת\\\" המגבר על לקצה גבול יכולתו. ובניגוד לשירו של גורי קארטר - \\\"Rocket 88\\\" באמת הפך ללהיט. במרוצת השנים צצו כמה סיפורים על מקורם של צלילי הגיטרה החלוציים וה\\\"מעוותים\\\", הנשמעים בבירור בעיקר בסוף השיר. גרסה אחת מספרת שהמגבר צנח מגג הרכב ששימש את הלהקה, בגרסה אחרת הוא בכלל נרטב בתא המטען. כך או כך, התקלה כנראה מצאה חן בעיני חברי הלהקה והמפיק סם פיליפס ומצאה את דרכה לגרסה הסופית של השיר - ולהיסטוריה של הרוקנ'רול.\",\"filename\":\"rocket_88.mp3\"},{\"year\":1955,\"title\":\"לינק ריי - Rumble\",\"text\":\"האגדה מספרת שלינק ריי השתמש בעיפרון להשחית ולחורר את מגבר הגיטרה שלו כדי להשיג את הצליל המחוספס של \\\"Rumble\\\". גרסה אחרת מספרת שהוא השתמש במברג. יהיה הכלי המשחית אשר יהיה, הנזק עשה את שלו: עם צאתו ב-1958 הפך השיר לאחד מקטעי הגיטרה המוכרים ביותר בתולדות הרוקנ'רול (רבים בוודאי יזהו אותו מהפסקול של \\\"ספרות זולה\\\"). זוהי גם אחת הפעמים היחידות בהיסטוריה שקטע אינסטרומנטלי נאסר להשמעה בתחנות רדיו רבות ברחבי ארצות הברית, מחשש שמא ישפיע לרעה על בני הנעורים.\",\"filename\":\"rumble.mp3\"},{\"year\":1961,\"title\":\"מארטי רובינס - Don't Worry\",\"text\":\"עד עכשיו דיברנו על אלו שהקדימו את זמנם, וצלילי הבס של גריידי מרטין ב \\\"Don't Worry\\\" של המוזיקאי מארטי רובינס מייצגים את שלב המעבר: מתקלה מקרית לאפקט שניתן לשחזר (ולמסחר). גם כאן זה התחיל בציוד מקולקל - הפעם מעגל חשמלי פגום בקונסולה ששימשה את מרטין בהקלטת השיר - אולם התקלה הזו הובילה ליצירת ה-Maestro FZ-1 Fuzz-Tone: \\\"קופסת הפאזז\\\" הראשונה, שאפשרה לנגנים להלביש על נגינתם את אותו צליל חמים ומחוספס בדריכה קטנה עם הרגל.\",\"filename\":\"dont_worry.mp3\"},{\"year\":1964,\"title\":\"הקינקס - You Really Got Me\",\"text\":\"דייב דיוויס, גיטריסט להקת הרוק המצליחה, דווקא לא השתמש באפקט הטרי יחסית שהונדס רק שלוש שנים קודם לכן. את צלילי הגיטרה הקשוחים של הלהיט המוכר \\\"You Really Got Me\\\" הוא השיג - כמו רבים מקודמיו - באמצעות פגיעה מכוונת במגבר שלו. \\\"חתכתי אותו בסכין גילוח מתוך תסכול - ונדהמתי, הופתעתי והתרגשתי לשמוע איך זה עובד\\\", סיפר בעבר. אחיו ריי, סולן הלהקה, דווקא התעקש שהוא האחראי לסאונד פורץ הדרך ושהוא יצר אותו בנעיצת מחט במגבר.\",\"filename\":\"you_really_got_me.mp3\"},{\"year\":1965,\"title\":\"The Rolling Stones - (I Can't Get No) Satisfaction\",\"text\":\"גם כאן, כמו במקרה של הקינקס, מדובר כבר בלהיט רוקנ'רול על-זמני - אבל הפעם השתמשו ב\\\"קופסת הפאזז\\\", שנוצרה לאחר הקלטת \\\"Don't Worry\\\", ללא כל צורך להשמיד ולהשחית ציוד יקר. ההצלחה של אחד הלהיטים הגדולים של הסטונס הפכה את אפקט ה-Fuzz ללהיט מסחרי בעצמו, אחרי כמה שנים של מכירות מאכזבות. הדיסטורשן הפך למיינסטרים, לצלילי המזוהה ביותר עם סגנון המוזיקה שהלך וכבש את המצעדים, את גלי האתר ואת הבמות ברחבי העולם. מהפכת הרוקנ'רול חייבת לא מעט לא רק למוזיקאים שהובילו אותה - אלא גם לתקלות ולאנשי הסאונד שהעניקו לה את רעש הרקע שהיא כל כך הייתה זקוקה לו.\",\"filename\":\"satisfaction.mp3\"}]\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./src/data/timeline.json\n// module id = 166\n// module chunks = 0","import React, { Component } from 'react'\r\nimport styled, { keyframes } from 'styled-components'\r\nimport { colors, media } from '../styles/vars'\r\nimport wavesImg from '../static/images/backgrounds/waves.jpg'\r\nimport playIcon from '../static/images/icons/small_play.png'\r\nimport pauseIcon from '../static/images/icons/pause2.png'\r\n\r\nconst infiniteMotion = keyframes`\r\n0%{\r\n background-position:0;\r\n}\r\n100%{\r\n background-position:2000px;\r\n}\r\n`\r\nconst Container = styled.div`\r\npadding:20px;\r\nborder:2px solid #393939;\r\ncolor:${colors.white};\r\ntext-align:center;\r\nbackground-color:${colors.black};\r\nmax-width:85%;\r\nmargin:0 auto;\r\n\r\n${\r\n media.desktop`\r\n position:absolute;\r\n right:0;\r\n top:130px;\r\n width:400px;\r\n height:640px;\r\n max-width:initial;\r\n `\r\n }\r\n`\r\nconst DynamicContainer = styled(Container) `\r\n${\r\n media.desktop`\r\n transition:transform .8s;\r\n will-change:transform;\r\n transform:translate3d(${props => props.translateX ? `${props.translateX}px` : 0}, 0, 0);\r\n `\r\n }\r\n`\r\n\r\nconst TextContainer = styled.div`\r\nmargin: 15px 0;\r\noverflow-wrap:break-word;\r\nmax-height:48vw;\r\noverflow-y:auto;\r\nbox-shadow: inset 0 -10px 20px -10px rgba(255, 255, 255, .6);\r\n${\r\n media.desktop`\r\n max-height:initial;\r\n overflow:initial;\r\n box-shadow:none;\r\n `\r\n }\r\n`\r\n\r\nconst Title = styled.h3`\r\nfont-size:3rem;\r\nmargin-bottom:10px;\r\ntext-align:right;\r\ndirection:ltr;\r\n`\r\nconst Paragraph = styled.p`\r\nfont-size:2.4rem;\r\ntext-align:justify;\r\n${\r\n media.small`\r\n text-align:right;\r\n `\r\n }\r\n`\r\nconst StyledAudioPlayer = styled.div`\r\nmax-width:70%;\r\nmargin:0 auto;\r\npadding-bottom:40%;\r\nbackground-size:contain;\r\nbackground-position:center;\r\nbackground-image:url(${wavesImg});\r\nposition:relative;\r\ncursor:pointer;\r\n`\r\nconst DynamicAudioPlayer = styled(StyledAudioPlayer) `\r\nanimation:${props => props.active ? `${infiniteMotion} 30s linear infinite` : 'none'};\r\nbackground-position:${props => `${props.pos}px`};\r\n`\r\nconst PlayerStateIcon = styled.img`\r\nposition:absolute;\r\nleft:0;\r\nright:0;\r\ntop:0;\r\nbottom:0;\r\nmargin:auto;\r\ntransition:visibility .2s, opacity .2s;\r\n`\r\nconst DynamicPlayerIcon = styled(PlayerStateIcon) `\r\nvisibility:${props => props.active ? `visible` : 'hidden'};\r\nopacity:${props => props.active ? `1` : '0'};\r\n`\r\nclass TimelineDetails extends Component {\r\n componentWillReceiveProps() {\r\n this.paragraphNode.scrollTop = 0;\r\n }\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n - \r\n {props.comments.map((c, idx) =>\r\n
- \r\n {props.replies.map((r, idx) =>\r\n