Merge master into production

CONTRIBUTING.md

@@ -26,8 +26,16 @@ Pull requests are the greatest contributions, so be sure they are focused in sco
 	# Install the tools necessary for development
 	npm install
 	```
+2. Pull latest changes from "upstream" and push these changes to your "origin"(forked)
+	> NOTE - This step will repeat every time You plan to contribute
 
-2. Create a branch for your feature or fix:
+	```bash
+	# Pull latest changes from "upstream" repository
+	git pull upstream master
+	#Push latest changes to Your "origin" repository
+	git push origin master
+	```
+3. Create a branch for your feature or fix:
 	```bash
 	# Move into a new branch for a feature
 	git checkout -b feature/thing
@@ -37,7 +45,7 @@ Pull requests are the greatest contributions, so be sure they are focused in sco
 	git checkout -b fix/something
 	```
 
-3. Be sure your code follows our practices.
+4. Be sure your code follows our practices.
 	```bash
 	# Test current code
 	npm run test
@@ -49,7 +57,7 @@ Pull requests are the greatest contributions, so be sure they are focused in sco
 	nightwatch --test tests/functional/specs/Index_spec.js
 	```
 
-4. To create a PR you need to push your branch to the origin(forked) remote and then press some buttons on GitHub:
+5. To create a PR you need to push your branch to the origin(forked) remote and then press some buttons on GitHub:
 	```bash
 	# Push a feature branch
 	git push -u origin feature/thing
@@ -61,7 +69,7 @@ Pull requests are the greatest contributions, so be sure they are focused in sco
 
 	This will create the branch on your GitHub project. The ```-u``` flag links this branch with the remote one, so that in the future, you can simply type ```git push origin```.
 
-5. Now [open a pull request] with a clear title and description.
+6. Now [open a pull request] with a clear title and description.
 
 ## Sever-side integration
 Unless you have the backend API running locally, you will need to update the `API_URL`, in `development.env` file, from `localhost` to `api.quran.com`. Leave the port number same.

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:5.10.0
+FROM node:6.3
 
 ENV NODE_ENV production
 ENV API_URL http://api.quran.com:3000

bootstrap.config.prod.js

@@ -1,4 +1,4 @@
 const bootstrapConfig = require('./bootstrap.config.js');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
-bootstrapConfig.styleLoader = ExtractTextPlugin.extract('style-loader', 'css-loader!sass-loader');
+bootstrapConfig.styleLoader = ExtractTextPlugin.extract({fallbackLoader: 'style-loader', loader: 'css-loader!sass-loader'});
 module.exports = bootstrapConfig;

package.json

@@ -2,19 +2,18 @@
   "name": "quran",
   "version": "1.0.0",
   "private": false,
+  "repository": "https://github.com/quran/quran.com-frontend",
   "scripts": {
     "test": "npm run test:dev:unit",
-    "test:ci:unit": "./node_modules/karma/bin/karma start --browsers PhantomJS --single-run; npm run test:ci:lint",
+    "test:ci:unit": "karma start --browsers PhantomJS --single-run; npm run test:ci:lint",
     "test:ci:functional": "BROWSER=phantomjs bash tests/functional/test.sh start-ci",
     "posttest:ci:functional": "bash tests/functional/test.sh stop",
-    "test:ci:unit": "karma start --browsers PhantomJS --single-run; npm run test:ci:lint",
-    "test:dev:unit": "karma start",
-    "test:ci:lint": "eslint ./src/**/*.js",
     "test:dev:unit": "./node_modules/karma/bin/karma start",
+    "test:ci:lint": "eslint ./src/**/*.js",
     "test:dev:functional": "BROWSER=chrome bash tests/functional/test.sh start",
     "posttest:dev:functional": "bash tests/functional/test.sh stop",
-    "test:dev:lint": "eslint ./src/scripts/**/*.js",
-    "test:stylelint": "stylelint './src/**/*.scss' --config webpack/.stylelintrc",
+    "test:dev:lint": "node_modules/eslint/bin/eslint.js ./src/scripts/**/*.js",
+    "test:stylelint": "node_modules/stylelint/dist/cli.js './src/**/*.scss' --config webpack/.stylelintrc",
     "dev": "node webpack/dev-server.js & PORT=8000 node start.js",
     "start": "NODE_PATH=\"./src\" node ./start",
     "build": "node ./node_modules/webpack/bin/webpack.js --config webpack/prod.config.js",
@@ -23,12 +22,13 @@
     "analyze:json": "webpack-bundle-size-analyzer bundle-stats.json"
   },
   "engines": {
-    "node": ">= 5.1.0"
+    "node": ">= 6.3.0"
   },
   "dependencies": {
     "app-module-path": "^1.0.2",
     "autoprefixer-loader": "^3.1.0",
     "babel": "^6.5.2",
+    "babel-core": "^6.13.2",
     "babel-loader": "^6.2.4",
     "babel-plugin-add-module-exports": "^0.1.4",
     "babel-plugin-system-import-transformer": "^2.0.0",
@@ -37,12 +37,11 @@
     "babel-plugin-transform-runtime": "^6.7.5",
     "babel-plugin-typecheck": "^3.8.0",
     "babel-polyfill": "^6.7.4",
-    "babel-preset-es2015": "^6.6.0",
-    "babel-preset-es2015-webpack": "^6.4.1",
+    "babel-preset-es2015": "^6.13.2",
     "babel-preset-react": "^6.5.0",
     "babel-preset-stage-0": "^6.5.0",
-    "babel-register": "^6.7.2",
-    "babel-runtime": "^6.6.1",
+    "babel-register": "^6.11.6",
+    "babel-runtime": "^6.11.6",
     "body-parser": "^1.14.1",
     "bootstrap-loader": "^1.0.10",
     "bootstrap-sass": "~3.3.1",
@@ -59,10 +58,10 @@
     "debug": "^2.2.0",
     "dotenv": "^1.2.0",
     "errorhandler": "^1.4.2",
-    "express": "^4.3.2",
+    "express": "~4.14.0",
     "express-state": "^1.2.0",
     "express-useragent": "^0.2.0",
-    "extract-text-webpack-plugin": "^1.0.1",
+    "extract-text-webpack-plugin": "2.0.0-beta.3",
     "file-loader": "^0.8.4",
     "fontfaceobserver": "^1.7.1",
     "html-webpack-plugin": "^1.4.0",
@@ -107,17 +106,16 @@
     "superagent": "^1.2.0",
     "url": "^0.11.0",
     "url-loader": "~0.5.5",
-    "webpack": "2.1.0-beta.7",
+    "webpack": "2.1.0-beta.20",
     "webpack-isomorphic-tools": "^2.2.41",
     "winston": "^1.1.2"
   },
   "devDependencies": {
-    "babel-core": "^6.7.7",
     "babel-eslint": "^6.0.4",
     "babel-plugin-react-transform": "^2.0.2",
     "babel-preset-react-hmre": "^1.1.1",
     "chai": "^3.0.0",
-    "chromedriver": "^2.19.0",
+    "chromedriver": "^2.22.2",
     "del": "^2.0.2",
     "enzyme": "^2.2.0",
     "eslint": "^2.13.0",
@@ -127,7 +125,7 @@
     "eslint-plugin-jsx-a11y": "^1.5.3",
     "eslint-plugin-react": "^5.2.2",
     "jscs": "^2.1.1",
-    "karma": "^0.13.9",
+    "karma": "^1.1.2",
     "karma-chai": "^0.1.0",
     "karma-chai-sinon": "^0.1.5",
     "karma-chrome-launcher": "^0.2.0",
@@ -155,6 +153,7 @@
     "selenium-server": "^2.48.2",
     "sinon": "^1.15.3",
     "sinon-chai": "^2.8.0",
+    "stylelint": "^7.1.0",
     "stylelint-webpack-plugin": "^0.2.0",
     "wdio-mocha-framework": "^0.3.7",
     "wdio-spec-reporter": "0.0.3",

server.js

@@ -25,8 +25,8 @@ import debug from './src/helpers/debug';
 
 import Html from './src/helpers/Html';
 
-import { setUserAgent } from './src/redux/modules/audioplayer';
-import { setOption } from './src/redux/modules/options';
+import { setUserAgent } from './src/redux/actions/audioplayer.js';
+import { setOption } from './src/redux/actions/options.js';
 
 // Use varnish for the static routes, which will cache too
 server.use(raven.middleware.express.requestHandler(config.sentryServer));

server/config/sitemap.js

@@ -35,7 +35,7 @@ export default (server) => {
 
 
       const xml = sitemap.createSitemap({
-        hostname: 'http://quran.com',
+        hostname: 'https://quran.com',
         cacheTime: 600000,  // 600 sec cache period
         urls: [
           ...urls,

src/components/Audioplayer/RepeatDropdown/index.js

@@ -68,7 +68,7 @@ export default class RepeatButton extends Component {
               onChange={(event) => setRepeat({
                 ...repeat,
                 from: parseInt(event.target.value, 10),
-                to: parseInt(event.target.value, 10)
+                to: parseInt(event.target.value, 10) + 3
               })}
             >
               {

src/components/Audioplayer/index.js

@@ -3,7 +3,7 @@ import { connect } from 'react-redux';
 import { camelize } from 'humps';
 
 // Redux
-import * as AudioActions from '../../redux/modules/audioplayer';
+import * as AudioActions from '../../redux/actions/audioplayer';
 
 // Components
 import Track from './Track';

src/components/FontStyles/index.js

@@ -1,7 +1,7 @@
 import React, { Component, PropTypes } from 'react';
 import { connect } from 'react-redux';
 import { fontFaceStyle, fontFaceStyleLoaded } from '../../helpers/buildFontFaces';
-import { load } from 'redux/modules/fontFaces';
+import { load } from 'redux/actions/fontFace.js';
 
 import debug from 'helpers/debug';
 import selector from './selector';

src/components/IndexHeader/Nav/index.js

@@ -22,6 +22,16 @@ class IndexHeaderNav extends Component {
     if (this.props.navlink === false) {
       return (
         <ul className={classNames}>
+          <li>
+            <Link to="/apps" data-metrics-event-name="IndexHeader:Link:Mobile">
+              Mobile
+            </Link>
+          </li>
+          <li>
+            <a href="https://quran.zendesk.com/hc/en-us/articles/210090626-Development-help" target="_blank" data-metrics-event-name="IndexHeader:Link:Developer">
+              Developers
+            </a>
+          </li>
           <li>
             <a href="http://legacy.quran.com" data-metrics-event-name="IndexHeader:Link:Legacy">Legacy Quran.com</a>
           </li>
@@ -36,6 +46,16 @@ class IndexHeaderNav extends Component {
 
     return (
       <ul className={classNames}>
+        <li>
+          <Link to="/apps" data-metrics-event-name="IndexHeader:Link:Mobile">
+            Mobile
+          </Link>
+        </li>
+        <li>
+          <a href="https://quran.zendesk.com/hc/en-us/articles/210090626-Development-help" target="_blank" data-metrics-event-name="IndexHeader:Link:Developer">
+            Developers
+          </a>
+        </li>
         <li>
           <a href="http://legacy.quran.com" data-metrics-event-name="IndexHeader:Link:Legacy">Legacy Quran.com</a>
         </li>

src/components/Share/index.js

@@ -15,7 +15,7 @@ export default class Share extends Component {
   render() {
 
     const {surahId, name} = this.props.surah;
-    const surahUrl = encodeURIComponent(`http://quran.com/${surahId}`);
+    const surahUrl = encodeURIComponent(`https://quran.com/${surahId}`);
 
     return (
       <div className={`${Style.shareContainer} hidden-xs`}>

src/config.js

@@ -32,16 +32,16 @@ module.exports = Object.assign({
         {name: 'google-site-verification', content: 'ehFz7FvmL7V9MzP40F8_kLABhCzqGzMDMrCnUP44Too'},
         {name: 'theme-color', content: '#004f54'},
         {property: 'og:site_name', content: title},
-        {property: 'og:image', content: 'http://quran.com/images/thumbnail.png'},
+        {property: 'og:image', content: 'https://quran.com/images/thumbnail.png'},
         {property: 'og:locale', content: 'en_US'},
         {property: 'og:title', content: title},
         {property: 'og:description', content: description},
-        {property: 'og:url', content: 'http://quran.com'},
+        {property: 'og:url', content: 'https://quran.com'},
         {property: 'og:type', content: 'website'},
         {name: 'twitter:card', content: 'summary'},
         {name: 'twitter:title', content: title},
         {name: 'twitter:description', content: description},
-        {name: 'twitter:image', content: 'http://quran.com/images/thumbnail.png'},
+        {name: 'twitter:image', content: 'https://quran.com/images/thumbnail.png'},
         {name: 'twitter:image:width', content: '200'},
         {name: 'twitter:image:height', content: '200'}
       ],
@@ -59,10 +59,10 @@ module.exports = Object.assign({
             "@type": "WebSite",
             "name": "Quran",
             "alternateName": "Quran.com",
-            "url": "http://quran.com",
+            "url": "https://quran.com",
             "potentialAction": {
               "@type": "SearchAction",
-              "target": "http://quran.com/search?q={search_term_string}&referrer=sitelinks_searchbox",
+              "target": "https://quran.com/search?q={search_term_string}&referrer=sitelinks_searchbox",
               "query-input": "required name=search_term_string"
             }
           }`
@@ -72,8 +72,8 @@ module.exports = Object.assign({
           innerHTML: `{
             "@context": "http://schema.org",
             "@type": "Organization",
-            "url": "http://quran.com",
-            "logo": "http://quran.com/images/thumbnail.png"
+            "url": "https://quran.com",
+            "logo": "https://quran.com/images/thumbnail.png"
           }`
         }
       ],

src/containers/App/index.js

@@ -44,19 +44,19 @@ class App extends Component {
                   <li><a href="/about">About</a></li>
                   <li><a href="/contact">Contact</a></li>
                   <li>
-                    <a href="https://github.com/quran/quran.com-frontend" target="_blank">
+                    <a href="https://quran.zendesk.com/hc/en-us/articles/210090626-Development-help" target="_blank" data-metrics-event-name="Footer:Link:Developer">
                       Developers
                     </a>
                   </li>
                 </ul>
               </Col>
               <Col md={2} xs={5} className={styles.links}>
                 <ul className={`source-sans ${styles.list}`}>
-                  <li><a target="_blank" href="http://sunnah.com/">Sunnah.com</a></li>
-                  <li><a target="_blank" href="http://salah.com/">Salah.com</a></li>
-                  <li><a target="_blank" href="http://quranicaudio.com/">QuranicAudio.com</a></li>
+                  <li><a target="_blank" href="http://sunnah.com/" data-metrics-event-name="Footer:Link:Sunnah">Sunnah.com</a></li>
+                  <li><a target="_blank" href="http://salah.com/" data-metrics-event-name="Footer:Link:Salah">Salah.com</a></li>
+                  <li><a target="_blank" href="http://quranicaudio.com/" data-metrics-event-name="Footer:Link:QuranicAudio">QuranicAudio.com</a></li>
                   <li>
-                    <a target="_blank" href="http://corpus.quran.com/wordbyword.jsp">
+                    <a target="_blank" href="http://corpus.quran.com/wordbyword.jsp" data-metrics-event-name="Footer:Link:Corpus">
                       Corpus: Word by Word
                     </a>
                   </li>
@@ -77,7 +77,7 @@ class App extends Component {
                   <li>
                     <Link
                       to="/36"
-                      data-metrics-event-name="FooterLinks:Click"
+                      data-metrics-event-name="Footer:Link:Click"
                       data-metrics-surah-id="36"
                     >
                       Surah Yasin, Yaseen (يس)
@@ -86,7 +86,7 @@ class App extends Component {
                   <li>
                     <Link
                       to="/2/255"
-                      data-metrics-event-name="FooterLinks:Click"
+                      data-metrics-event-name="Footer:Link:Click"
                       data-metrics-surah-id="2/255"
                     >
                       Ayat Al-Kursi (آية الكرسي)

src/containers/Home/index.js

@@ -7,7 +7,7 @@ import { connect } from 'react-redux';
 
 import debug from '../../helpers/debug';
 
-import { isAllLoaded, loadAll } from '../../redux/modules/surahs';
+import { isAllLoaded, loadAll } from '../../redux/actions/surahs.js';
 
 const styles = require('./style.scss');