Release 0.7.2 🚆

README.md

@@ -65,6 +65,11 @@ See [CONTRIBUTING.md](CONTRIBUTING.md)
 
 * [Extension](https://github.com/CaptainFact/captain-fact-extension)
 
+## Dependencies 
+
+Many thanks to [adorable.io](http://avatars.adorable.io/) for their great consistent avatar service (the funny faces
+you see if you don't set your own profile picture).
+
 ## License
 
 GNU AFFERO GENERAL PUBLIC LICENSE Version 3

app/API/http_api.js

@@ -1,26 +1,28 @@
 import "isomorphic-fetch"
 import trimRight from 'voca/trim_right'
+import fetch from 'isomorphic-fetch'
 
 import { SocketApi } from "./socket_api"
 import { HTTP_API_URL } from "../config.jsenv"
 import { parseServerError } from './server_error'
 import flashNoInternetError from './no_internet_error'
+import { optionsToQueryString } from '../lib/url_utils'
 
 
 class CaptainFactHttpApi {
   constructor(baseUrl, token) {
     this.baseUrl = trimRight(baseUrl, '/') + '/'
     this.hasToken = !!token
-    this.headers = {
-      'authorization': token ? `Bearer ${token}` : "",
-      'Content-Type': "application/json"
-    }
+    this.headers = {'Content-Type': 'application/json'}
+    if (token)
+      this.headers['authorization'] = `Bearer ${token}`
   }
 
   setAuthorizationToken(token) {
     this.hasToken = true
     localStorage.token = token
-    this.headers['authorization'] = token ? `Bearer ${token}` : ""
+    if (token)
+      this.headers['authorization'] = `Bearer ${token}`
     SocketApi.setAuthorizationToken(token)
   }
 
@@ -41,7 +43,8 @@ class CaptainFactHttpApi {
           else
             fulfill(body)
         })
-      }).catch(() => {
+      }).catch(e => {
+        console.error(e)
         // Special case when no internet connection
         reject('noInternet')
         flashNoInternetError()
@@ -58,8 +61,15 @@ class CaptainFactHttpApi {
     return this.prepareResponse(response)
   }
 
-  get(resourceUrl) {
-    const response = fetch(this.baseUrl + resourceUrl, {headers: this.headers})
+  /**
+   * Send a get request against the given `resourceUrl`.
+   * @param {string} resourceUrl
+   * @param {object} [options] - A map of options to convert to query string http://url?option1=xxx&option2=yyy
+   * @returns {Promise}
+   */
+  get(resourceUrl, options) {
+    const queryString = optionsToQueryString(options)
+    const response = fetch(this.baseUrl + resourceUrl + queryString, {headers: this.headers})
     return this.prepareResponse(response)
   }
 

app/assets/assets/help/en/credits.md

@@ -5,6 +5,8 @@ CaptainFact has grown on upon the soil of many great open source projects such a
 * [React](https://facebook.github.io/react/)
 * [Bulma](http://bulma.io/)
 * [Redux](http://redux.js.org/)
+* [adorable.io](http://avatars.adorable.io/) for their great consistent avatar service (the funny faces 
+  you see if you don't set your own profile picture)
 
 
 And the Wikimedia foundation for all the speakers pictures and other metadata. You

app/assets/assets/help/fr/credits.md

@@ -5,6 +5,8 @@ CaptainFact a grandit sur le sol fertile de nombreux projets open source tels qu
 * [React](https://facebook.github.io/react/)
 * [Bulma](http://bulma.io/)
 * [Redux](http://redux.js.org/)
+* [adorable.io](http://avatars.adorable.io/) for their great consistent avatar service (the funny faces 
+  you see if you don't set your own profile picture)
 
 
 Ainsi qu'à la fondation Wikimedia pour les images d'intervenants et d'autres métadonées associées. Vous

app/assets/assets/locales/en/main.json

@@ -53,5 +53,8 @@
     "clipboardFail": "Cannot copy to clipboard",
     "all": "All",
     "unknown": "Unknown"
+  },
+  "videos": {
+    "add": "Add Video"
   }
 }

app/assets/assets/locales/en/videoDebate.json

@@ -1,7 +1,7 @@
 {
   "debate": "Debate",
   "history": "History",
-  "approve": "Approve",
+  "approve": "Confirm",
   "refute": "Refute",
   "flagForm": {
     "title": "Why do you want to flag this comment ?",
@@ -14,14 +14,19 @@
   "comment": {
     "writeComment": "Write a comment...",
     "addSource": "Add a source to turn this comment into a fact",
-    "postComment": "Post Comment",
+    "post": "Post Comment",
+    "post_reply": "Post reply",
     "deleteThread": "Delete comment",
     "deleteThread_plural": "Delete thread",
     "replies_hide": "Hide replies",
     "replies_show": "Show replies ({{count}})",
     "loadMore_replies": "Load more replies ({{count}})",
     "loadMore_comments": "Load more comments ({{count}})",
-    "replyingTo": "Replying to"
+    "replyingTo": "Replying to",
+    "approve": "Confirm",
+    "approve_reply": "Confirm this comment",
+    "refute": "Refute",
+    "refute_reply": "Refute this comment"
   },
   "video": {
     "added": "Added",

app/assets/assets/locales/fr/main.json

@@ -34,7 +34,7 @@
     "remove": "Retirer",
     "delete": "Supprimer",
     "reply": "Répondre",
-    "approve": "Approuver",
+    "approve": "Confirmer",
     "refute": "Réfuter",
     "edit": "Éditer",
     "loading": "Chargement",
@@ -52,5 +52,8 @@
     "clipboardFail": "Impossible d'enregistrer l'adresse dans le presse papier",
     "all": "Tous",
     "unknown": "Inconnu"
+  },
+  "videos": {
+    "add": "Ajouter une vidéo"
   }
 }

app/assets/assets/locales/fr/videoDebate.json

@@ -1,7 +1,7 @@
 {
   "debate": "Débat",
   "history": "Historique",
-  "approve": "Approuve",
+  "approve": "Confirme",
   "refute": "Réfute",
   "flagForm": {
     "title": "Pourquoi signaler ce commentaire ?",
@@ -14,14 +14,19 @@
   "comment": {
     "writeComment": "Écrire un commentaire...",
     "addSource": "Ajouter une source",
-    "postComment": "Poster ce commentaire",
+    "post": "Ajouter en commentaire",
+    "post_reply": "Ajouter en réponse",
     "deleteThread": "Supprimer le commentaire",
     "deleteThread_plural": "Supprimer le fil de discussion",
     "replies_hide": "Cacher les réponses",
     "replies_show": "Montrer les réponses ({{count}})",
     "loadMore_replies": "Charger plus de réponses ({{count}})",
     "loadMore_comments": "Charger plus de commentaires ({{count}})",
-    "replyingTo": "En réponse à"
+    "replyingTo": "En réponse à",
+    "approve": "Confirmer",
+    "approve_reply": "Confirmer ce commentaire",
+    "refute": "Réfuter",
+    "refute_reply": "Réfuter ce commentaire"
   },
   "video": {
     "added": "Ajoutée",
@@ -38,9 +43,8 @@
     "title": "Titre",
     "titlePlaceholder": "Politicien, docteur, journaliste...",
     "titleFormat": "{{title}}",
-    "titleFormat_FR": "{{title}} français",
     "titles": {
-      "Politician": "Politicien",
+      "Politician": "Personnalité politique",
       "Journalist": "Journaliste"
     }
   },

app/components/App/LanguageSelector.jsx

@@ -11,7 +11,7 @@ const defaultLocales = new Map({
   fr: 'Français'
 })
 
-@translate([]) // Force waiting for translations to be loaded
+@translate() // Force waiting for translations to be loaded
 export default class LanguageSelector extends React.PureComponent {
   render() {
     return (

app/components/Comments/CommentDisplay.jsx

@@ -109,12 +109,13 @@ export class CommentDisplay extends React.PureComponent {
   }
 
   render() {
-    const { user, text, source, score, inserted_at } = this.props.comment
+    const { user, text, source, score, inserted_at, approve } = this.props.comment
     const { t, withoutActions, withoutHeader, replyingTo, nesting, replies, myVote, isVoting, hideThread, className, richMedias=true } = this.props
+    const approveClass = approve !== null && (approve ? 'approve' : 'refute')
     return (
       <div>
         <MediaLayout
-          className={classNames('comment', className, {isBlurred: this.state.isBlurred, hasSource: !!source})}
+          className={classNames('comment', className, approveClass, {isBlurred: this.state.isBlurred, hasSource: !!source})}
           ContainerType="article"
           left={
            <figure>

app/components/Comments/CommentForm.jsx

@@ -6,7 +6,7 @@ import isURL from 'validator/lib/isURL'
 import classNames from 'classnames'
 
 import { renderField, validateLength, cleanStrMultiline } from "../FormUtils"
-import { COMMENT_LENGTH, USER_PICTURE_MEDIUM } from "../../constants"
+import { COMMENT_LENGTH, USER_PICTURE_LARGE } from "../../constants"
 import TextareaAutosize from "../FormUtils/TextareaAutosize"
 import { Icon } from '../Utils/Icon'
 import Tag from '../Utils/Tag'
@@ -33,7 +33,7 @@ const validate = ({ source, text }) => {
 
 class CommentField extends React.PureComponent {
   render() {
-    const { input, label, placeholder, isReply, meta: { submitting } } = this.props
+    const { input, label, placeholder, isReply, meta: { submitting, error } } = this.props
     return (
       <p className="control">
         <TextareaAutosize {...input}
@@ -46,6 +46,7 @@ class CommentField extends React.PureComponent {
           </span>
             &nbsp;/ {COMMENT_LENGTH[1]}
         </span>
+        {error && <span className="help is-danger">{typeof(error) === 'string' ? error : error[0]}</span>}
       </p>
     )
   }
@@ -70,28 +71,27 @@ export class CommentForm extends React.PureComponent {
     })
   }
 
-  getSubmit(valid, sourceUrl) {
+  getSubmit(valid, sourceUrl, isReply) {
     const commonClasses = ['button', {'is-disabled': !valid}]
-    if (!sourceUrl) return (
-      <button type="submit" className={classNames(commonClasses, 'is-info')}>
-        {this.props.t('comment.postComment')}
+    const i18nParams = isReply ? {context: 'reply'} : null
+    if (!sourceUrl) return ([
+      <button key="comment" type="submit" className={classNames(commonClasses)}>
+        {this.props.t('comment.post', i18nParams)}
       </button>
-    )
-    else return (
-      <div>
-        <button type="submit" className={classNames(commonClasses, 'is-success')}
-          onClick={this.postAndReset(values => this.props.postComment({...values, approve: true}))}>
-          {this.props.t('main:actions.approve')}
-        </button>
-        <button type="submit" className={classNames(commonClasses, 'is-danger')}
-          onClick={this.postAndReset(values => this.props.postComment({...values, approve: false}))}>
-          {this.props.t('main:actions.refute')}
-        </button>
-        <button type="submit" className={classNames(commonClasses)}>
-          {this.props.t('comment.postComment')}
-        </button>
-      </div>
-    )
+    ])
+    else return ([
+      <button key="comment" type="submit" className={classNames(commonClasses)}>
+        {this.props.t('comment.post', i18nParams)}
+      </button>,
+      <button key="approve" type="submit" className={classNames(commonClasses, 'is-success')}
+              onClick={this.postAndReset(values => this.props.postComment({...values, approve: true}))}>
+        {this.props.t('comment.approve', i18nParams)}
+      </button>,
+      <button key="refute" type="submit" className={classNames(commonClasses, 'is-danger')}
+              onClick={this.postAndReset(values => this.props.postComment({...values, approve: false}))}>
+        {this.props.t('comment.refute', i18nParams)}
+      </button>
+    ])
   }
 
   render() {
@@ -103,7 +103,7 @@ export class CommentForm extends React.PureComponent {
         ContainerType="form"
         containerProps={{onSubmit: this.postAndReset(c => this.props.postComment(c))}}
         className="comment-form"
-        left={<UserPicture user={currentUser} size={USER_PICTURE_MEDIUM}/>}
+        left={<UserPicture user={currentUser} size={USER_PICTURE_LARGE}/>}
         content={
           <div>
             {formValues && formValues.reply_to &&
@@ -125,10 +125,14 @@ export class CommentForm extends React.PureComponent {
                    isReply={formValues && !!formValues.reply_to}
                    normalize={ cleanStrMultiline }
                    placeholder={t('comment.writeComment')}/>
-            <Field component={ renderField } name="source.url"
-                   label={t('comment.addSource')}
-                   normalize={s => s.trim()}/>
-            { this.getSubmit(valid, sourceUrl) }
+            <div className="level">
+              <Field component={ renderField } name="source.url"
+                     label={t('comment.addSource')}
+                     normalize={s => s.trim()}/>
+              <div className="submit-btns">
+                { this.getSubmit(valid, sourceUrl, formValues && formValues.reply_to) }
+              </div>
+            </div>
           </div>
         }
       />

app/components/Comments/Source.jsx

@@ -28,14 +28,15 @@ const isPlayer = url => {
 export const Source = ({ source: { url, title, site_name }, withoutPlayer }) => {
   if (!withoutPlayer && isPlayer(url)) {
     return <ReactPlayer  className="video" controls={true} height={180} width={320} url={url}
-                         youtubeConfig={{playerVars: { showinfo: 1 }}}
-    />
+                         config={{youtube: {playerVars: { showinfo: 1 }}}}/>
   } else {
-    return <a href={url} target="_BLANK" className="fact-source">
-      <span className="site-name">
-        {upperCase(site_name) || getDisplayableHostname(url)}
-      </span>
-      <span className="article-title">{title}</span>
-    </a>
+    return (
+      <a href={url} target="_BLANK" className="fact-source">
+        <span className="site-name">
+          {upperCase(site_name) || getDisplayableHostname(url)}
+        </span>
+        <span className="article-title">{title}</span>
+      </a>
+    )
   }
 }

app/components/Pages/BrowserExtensionsPage.jsx

@@ -18,11 +18,11 @@ const BrowserExtensionsPage = ({t}) => (
                             buttonLabel="Get on Chrome Web Store"
                             url="https://chrome.google.com/webstore/detail/captainfact-beta/fnnhlmbnlbgomamcolcpgncflofhjckm"/>
           <BrowserExtension browser="Mozilla Firefox" image="/assets/img/firefox.png"
-                            buttonLabel="Download for Firefox (Coming soon)" disabled={true}
-                            url="https://addons.mozilla.org/en-US/firefox/"/>
+                            buttonLabel="Download for Firefox"
+                            url="https://addons.mozilla.org/addon/captainfact/"/>
           <BrowserExtension browser="Internet Explorer" image="/assets/img/internet_explorer.png"
                             buttonLabel="Just kidding" disabled={true}
-                            url="https://www.mozilla.org/fr/firefox/new/"/>
+                            url="https://www.mozilla.org/fr/firefox/"/>
         </div>
       </div>
     </section>

app/components/Pages/Help.jsx

@@ -51,7 +51,7 @@ export class Help extends React.PureComponent {
     }
     return (
       <div className="help-page">
-        <section className="hero is-info">
+        <section className="hero is-info is-bold">
           <div className="hero-body">
             <div className="container">
               { header }