From 835eec8a4cbf8fa340241fc0bd83e07e8c19ef5d Mon Sep 17 00:00:00 2001
From: David Yip <yipdw@member.fsf.org>
Date: Mon, 8 Jan 2018 10:40:34 -0600
Subject: Prototype out glitchy elephant friend.  #294.

Glitched elephant friends kindly provided by @ncls7615.
---
 app/javascript/flavours/glitch/images/mbstobon-ui-1.png | Bin 0 -> 39646 bytes
 app/javascript/flavours/glitch/images/mbstobon-ui-2.png | Bin 0 -> 43609 bytes
 app/javascript/flavours/glitch/images/mbstobon-ui-3.png | Bin 0 -> 40376 bytes
 3 files changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 app/javascript/flavours/glitch/images/mbstobon-ui-1.png
 create mode 100644 app/javascript/flavours/glitch/images/mbstobon-ui-2.png
 create mode 100644 app/javascript/flavours/glitch/images/mbstobon-ui-3.png

(limited to 'app/javascript/flavours/glitch/images')

diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-1.png b/app/javascript/flavours/glitch/images/mbstobon-ui-1.png
new file mode 100644
index 000000000..25e1707c9
Binary files /dev/null and b/app/javascript/flavours/glitch/images/mbstobon-ui-1.png differ
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-2.png b/app/javascript/flavours/glitch/images/mbstobon-ui-2.png
new file mode 100644
index 000000000..64cf3cbf3
Binary files /dev/null and b/app/javascript/flavours/glitch/images/mbstobon-ui-2.png differ
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-3.png b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png
new file mode 100644
index 000000000..b767a9122
Binary files /dev/null and b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png differ
-- 
cgit 


From 1dbb6b5e08b6672a77d2f7f4121e7874b750db60 Mon Sep 17 00:00:00 2001
From: David Yip <yipdw@member.fsf.org>
Date: Sat, 13 Jan 2018 21:22:37 -0600
Subject: Set glitchy elephant friend variant in initial state.  #294.

Also lay some groundwork needed to interactively change the
glitchfriend.

The codebase uses "elefriend" because it's shorter and didn't require me
to realign the actions in actions/compose.js.  Same idea, though.
---
 app/javascript/flavours/glitch/actions/compose.js   |   7 +++++++
 .../flavours/glitch/features/drawer/index.js        |  11 ++++++-----
 .../flavours/glitch/images/mbstobon-ui-0.png        | Bin 0 -> 39646 bytes
 .../flavours/glitch/images/mbstobon-ui-1.png        | Bin 39646 -> 43609 bytes
 .../flavours/glitch/images/mbstobon-ui-2.png        | Bin 43609 -> 40376 bytes
 .../flavours/glitch/images/mbstobon-ui-3.png        | Bin 40376 -> 0 bytes
 app/javascript/flavours/glitch/reducers/compose.js  |   7 +++++++
 .../flavours/glitch/styles/components/drawer.scss   |   4 ++--
 8 files changed, 22 insertions(+), 7 deletions(-)
 create mode 100644 app/javascript/flavours/glitch/images/mbstobon-ui-0.png
 delete mode 100644 app/javascript/flavours/glitch/images/mbstobon-ui-3.png

(limited to 'app/javascript/flavours/glitch/images')

diff --git a/app/javascript/flavours/glitch/actions/compose.js b/app/javascript/flavours/glitch/actions/compose.js
index a88dba1b1..c46387104 100644
--- a/app/javascript/flavours/glitch/actions/compose.js
+++ b/app/javascript/flavours/glitch/actions/compose.js
@@ -12,6 +12,7 @@ import {
 } from './timelines';
 
 export const COMPOSE_CHANGE          = 'COMPOSE_CHANGE';
+export const COMPOSE_CYCLE_ELEFRIEND = 'COMPOSE_CYCLE_ELEFRIEND';
 export const COMPOSE_SUBMIT_REQUEST  = 'COMPOSE_SUBMIT_REQUEST';
 export const COMPOSE_SUBMIT_SUCCESS  = 'COMPOSE_SUBMIT_SUCCESS';
 export const COMPOSE_SUBMIT_FAIL     = 'COMPOSE_SUBMIT_FAIL';
@@ -54,6 +55,12 @@ export function changeCompose(text) {
   };
 };
 
+export function cycleElefriendCompose() {
+  return {
+    type: COMPOSE_CYCLE_ELEFRIEND,
+  };
+};
+
 export function replyCompose(status, router) {
   return (dispatch, getState) => {
     dispatch({
diff --git a/app/javascript/flavours/glitch/features/drawer/index.js b/app/javascript/flavours/glitch/features/drawer/index.js
index ba56f1a30..8f9719096 100644
--- a/app/javascript/flavours/glitch/features/drawer/index.js
+++ b/app/javascript/flavours/glitch/features/drawer/index.js
@@ -28,6 +28,7 @@ import { wrap } from 'flavours/glitch/util/redux_helpers';
 const mapStateToProps = state => ({
   account: state.getIn(['accounts', me]),
   columns: state.getIn(['settings', 'columns']),
+  elefriend: state.getIn(['compose', 'elefriend']),
   results: state.getIn(['search', 'results']),
   searchHidden: state.getIn(['search', 'hidden']),
   searchValue: state.getIn(['search', 'value']),
@@ -56,6 +57,7 @@ class Drawer extends React.Component {
     const {
       account,
       columns,
+      elefriend,
       intl,
       multiColumn,
       onChange,
@@ -69,10 +71,8 @@ class Drawer extends React.Component {
       submitted,
     } = this.props;
 
-    let choices = ['mbstobon-bg-1', 'mbstobon-bg-2', 'mbstobon-bg-3'];
-    let glitchyFriendDecision = choices[Math.floor(Math.random() * choices.length)];
-    let drawerAttrs = {
-      className: classNames('contents', glitchyFriendDecision)
+    let elefriendAttrs = {
+      className: classNames('mastodon', 'mbstobon-' + elefriend),
     };
 
     //  The result.
@@ -98,7 +98,7 @@ class Drawer extends React.Component {
           <DrawerAccount account={account} />
           <div className='drawer__inner'>
             <Composer />
-            {multiColumn && <div className="mastodon mbstobon-bg-1" />}
+            {multiColumn && <div {...elefriendAttrs} />}
           </div>
           <DrawerResults
             results={results}
@@ -120,6 +120,7 @@ Drawer.propTypes = {
   account: ImmutablePropTypes.map,
   columns: ImmutablePropTypes.list,
   results: ImmutablePropTypes.map,
+  elefriend: PropTypes.number,
   searchHidden: PropTypes.bool,
   searchValue: PropTypes.string,
   submitted: PropTypes.bool,
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-0.png b/app/javascript/flavours/glitch/images/mbstobon-ui-0.png
new file mode 100644
index 000000000..25e1707c9
Binary files /dev/null and b/app/javascript/flavours/glitch/images/mbstobon-ui-0.png differ
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-1.png b/app/javascript/flavours/glitch/images/mbstobon-ui-1.png
index 25e1707c9..64cf3cbf3 100644
Binary files a/app/javascript/flavours/glitch/images/mbstobon-ui-1.png and b/app/javascript/flavours/glitch/images/mbstobon-ui-1.png differ
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-2.png b/app/javascript/flavours/glitch/images/mbstobon-ui-2.png
index 64cf3cbf3..b767a9122 100644
Binary files a/app/javascript/flavours/glitch/images/mbstobon-ui-2.png and b/app/javascript/flavours/glitch/images/mbstobon-ui-2.png differ
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-3.png b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png
deleted file mode 100644
index b767a9122..000000000
Binary files a/app/javascript/flavours/glitch/images/mbstobon-ui-3.png and /dev/null differ
diff --git a/app/javascript/flavours/glitch/reducers/compose.js b/app/javascript/flavours/glitch/reducers/compose.js
index f341977b7..dfab38387 100644
--- a/app/javascript/flavours/glitch/reducers/compose.js
+++ b/app/javascript/flavours/glitch/reducers/compose.js
@@ -2,6 +2,7 @@ import {
   COMPOSE_MOUNT,
   COMPOSE_UNMOUNT,
   COMPOSE_CHANGE,
+  COMPOSE_CYCLE_ELEFRIEND,
   COMPOSE_REPLY,
   COMPOSE_REPLY_CANCEL,
   COMPOSE_MENTION,
@@ -35,6 +36,8 @@ import uuid from 'flavours/glitch/util/uuid';
 import { me } from 'flavours/glitch/util/initial_state';
 import { overwrite } from 'flavours/glitch/util/js_helpers';
 
+const totalElefriends = 3;
+
 const initialState = ImmutableMap({
   mounted: false,
   advanced_options: ImmutableMap({
@@ -42,6 +45,7 @@ const initialState = ImmutableMap({
     threaded_mode: false,
   }),
   sensitive: false,
+  elefriend: Math.floor(Math.random() * totalElefriends),
   spoiler: false,
   spoiler_text: '',
   privacy: null,
@@ -259,6 +263,9 @@ export default function compose(state = initialState, action) {
     return state
       .set('text', action.text)
       .set('idempotencyKey', uuid());
+  case COMPOSE_CYCLE_ELEFRIEND:
+    return state
+      .set('elefriend', (state.get('elefriend') + 1) % totalElefriends);
   case COMPOSE_REPLY:
     return state.withMutations(map => {
       map.set('in_reply_to', action.status.get('id'));
diff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss
index 75b5d6b04..8526003bf 100644
--- a/app/javascript/flavours/glitch/styles/components/drawer.scss
+++ b/app/javascript/flavours/glitch/styles/components/drawer.scss
@@ -66,8 +66,8 @@
     .mastodon {
       flex: 1;
 
-      @for $i from 1 through 3 {
-        &.mbstobon-bg-#{$i} {
+      @for $i from 0 through 2 {
+        &.mbstobon-#{$i} {
           background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain;
         }
       }
-- 
cgit 


From e64cc311dd8db5d56b6299e9d40e7060d0c25b7e Mon Sep 17 00:00:00 2001
From: David Yip <yipdw@member.fsf.org>
Date: Sun, 14 Jan 2018 04:19:29 -0600
Subject: Introduce a bit of luck into the elefriend selection.  #294.

---
 .../flavours/glitch/features/drawer/index.js       |   9 ++++-----
 .../flavours/glitch/images/mbstobon-ui-3.png       | Bin 0 -> 32449 bytes
 .../glitch/images/wave-drawer-glitched.png         | Bin 0 -> 3544 bytes
 .../flavours/glitch/images/wave-drawer.png         | Bin 0 -> 3269 bytes
 app/javascript/flavours/glitch/reducers/compose.js |   6 +++++-
 .../flavours/glitch/styles/components/drawer.scss  |  22 +++++++++++++++------
 6 files changed, 25 insertions(+), 12 deletions(-)
 create mode 100644 app/javascript/flavours/glitch/images/mbstobon-ui-3.png
 create mode 100644 app/javascript/flavours/glitch/images/wave-drawer-glitched.png
 create mode 100644 app/javascript/flavours/glitch/images/wave-drawer.png

(limited to 'app/javascript/flavours/glitch/images')

diff --git a/app/javascript/flavours/glitch/features/drawer/index.js b/app/javascript/flavours/glitch/features/drawer/index.js
index 832b16e6f..93457ad31 100644
--- a/app/javascript/flavours/glitch/features/drawer/index.js
+++ b/app/javascript/flavours/glitch/features/drawer/index.js
@@ -74,9 +74,8 @@ class Drawer extends React.Component {
       submitted,
     } = this.props;
 
-    let elefriendAttrs = {
-      className: classNames('mastodon', 'mbstobon-' + elefriend),
-      onClick: onClickElefriend,
+    let innerDrawerAttrs = {
+      className: classNames('drawer--inner', 'mbstobon-' + elefriend),
     };
 
     //  The result.
@@ -100,9 +99,9 @@ class Drawer extends React.Component {
         />
         <div className='contents'>
           <DrawerAccount account={account} />
-          <div className='drawer__inner'>
+          <div {...innerDrawerAttrs}>
             <Composer />
-            {multiColumn && <div {...elefriendAttrs} />}
+            {multiColumn && <div className='mastodon' onClick={onClickElefriend} role='button' />}
           </div>
           <DrawerResults
             results={results}
diff --git a/app/javascript/flavours/glitch/images/mbstobon-ui-3.png b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png
new file mode 100644
index 000000000..a1fb642a0
Binary files /dev/null and b/app/javascript/flavours/glitch/images/mbstobon-ui-3.png differ
diff --git a/app/javascript/flavours/glitch/images/wave-drawer-glitched.png b/app/javascript/flavours/glitch/images/wave-drawer-glitched.png
new file mode 100644
index 000000000..2290663db
Binary files /dev/null and b/app/javascript/flavours/glitch/images/wave-drawer-glitched.png differ
diff --git a/app/javascript/flavours/glitch/images/wave-drawer.png b/app/javascript/flavours/glitch/images/wave-drawer.png
new file mode 100644
index 000000000..ca9f9e1d8
Binary files /dev/null and b/app/javascript/flavours/glitch/images/wave-drawer.png differ
diff --git a/app/javascript/flavours/glitch/reducers/compose.js b/app/javascript/flavours/glitch/reducers/compose.js
index dfab38387..24f76cf86 100644
--- a/app/javascript/flavours/glitch/reducers/compose.js
+++ b/app/javascript/flavours/glitch/reducers/compose.js
@@ -38,6 +38,10 @@ import { overwrite } from 'flavours/glitch/util/js_helpers';
 
 const totalElefriends = 3;
 
+// ~4% chance you'll end up with an unexpected friend
+// glitch-soc/mastodon repo created_at date: 2017-04-20T21:55:28Z
+const glitchProbability = 1 - 0.0420215528;
+
 const initialState = ImmutableMap({
   mounted: false,
   advanced_options: ImmutableMap({
@@ -45,7 +49,7 @@ const initialState = ImmutableMap({
     threaded_mode: false,
   }),
   sensitive: false,
-  elefriend: Math.floor(Math.random() * totalElefriends),
+  elefriend: Math.random() < glitchProbability ? Math.floor(Math.random() * totalElefriends) : totalElefriends,
   spoiler: false,
   spoiler_text: '',
   privacy: null,
diff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss
index c7581fb4f..d0d79c86b 100644
--- a/app/javascript/flavours/glitch/styles/components/drawer.scss
+++ b/app/javascript/flavours/glitch/styles/components/drawer.scss
@@ -50,9 +50,8 @@
     contain: strict;
   }
 
-  .drawer__inner {
+  .drawer--inner {
     position: absolute;
-    background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer.png') no-repeat bottom / 100% auto;
     top: 0;
     left: 0;
     box-sizing: border-box;
@@ -66,11 +65,22 @@
 
     .mastodon {
       flex: 1;
+    }
+  }
+
+  @for $i from 0 through 3 {
+    .drawer--inner.mbstobon-#{$i} {
+      @if $i == 3 {
+        background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer.png') no-repeat bottom / 100% auto;
+      } @else {
+        background: lighten($ui-base-color, 13%) url('~flavours/glitch/images/wave-drawer-glitched.png') no-repeat bottom / 100% auto;
+      }
+
+      .mastodon {
+        background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain;
 
-      @for $i from 0 through 2 {
-        &.mbstobon-#{$i} {
-          background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png") no-repeat left bottom / contain;
-          filter: saturate(80%) contrast(50%) brightness(50%);
+        @if $i != 3 {
+          filter: contrast(50%) brightness(50%);
         }
       }
     }
-- 
cgit