From 616b6867a0ef4ebfc1a6e6f0bd776c7a253f11f5 Mon Sep 17 00:00:00 2001
From: Akihiko Odaki <akihiko.odaki.4i@stu.hosei.ac.jp>
Date: Tue, 2 Jan 2018 13:07:56 +0900
Subject: [PATCH] Show mastodon on modal (#6129)

---
 .../authorize_follows_controller.rb           |   5 +++++
 app/controllers/remote_follow_controller.rb   |   4 ++++
 app/controllers/shares_controller.rb          |   2 +-
 .../{mastodon-drawer.png => mastodon-ui.png}  | Bin
 .../images/wave-compose-standalone.png        | Bin 0 -> 5921 bytes
 app/javascript/images/wave-modal.png          | Bin 0 -> 5200 bytes
 app/javascript/styles/application.scss        |   1 +
 .../styles/mastodon/components.scss           |   2 +-
 app/javascript/styles/mastodon/modal.scss     |  20 ++++++++++++++++++
 app/views/layouts/modal.html.haml             |   2 ++
 10 files changed, 34 insertions(+), 2 deletions(-)
 rename app/javascript/images/{mastodon-drawer.png => mastodon-ui.png} (100%)
 create mode 100644 app/javascript/images/wave-compose-standalone.png
 create mode 100644 app/javascript/images/wave-modal.png
 create mode 100644 app/javascript/styles/mastodon/modal.scss

diff --git a/app/controllers/authorize_follows_controller.rb b/app/controllers/authorize_follows_controller.rb
index 78b5641836..7afe664d1b 100644
--- a/app/controllers/authorize_follows_controller.rb
+++ b/app/controllers/authorize_follows_controller.rb
@@ -4,6 +4,7 @@ class AuthorizeFollowsController < ApplicationController
   layout 'modal'
 
   before_action :authenticate_user!
+  before_action :set_body_classes
 
   def show
     @account = located_account || render(:error)
@@ -58,4 +59,8 @@ class AuthorizeFollowsController < ApplicationController
   def acct_params
     params.fetch(:acct, '')
   end
+
+  def set_body_classes
+    @body_classes = 'modal-layout'
+  end
 end
diff --git a/app/controllers/remote_follow_controller.rb b/app/controllers/remote_follow_controller.rb
index 48b026aa5a..3b988e08d8 100644
--- a/app/controllers/remote_follow_controller.rb
+++ b/app/controllers/remote_follow_controller.rb
@@ -38,4 +38,8 @@ class RemoteFollowController < ApplicationController
   def suspended_account?
     @account.suspended?
   end
+
+  def set_body_classes
+    @body_classes = 'modal-layout'
+  end
 end
diff --git a/app/controllers/shares_controller.rb b/app/controllers/shares_controller.rb
index 994742c3df..fc2469deaa 100644
--- a/app/controllers/shares_controller.rb
+++ b/app/controllers/shares_controller.rb
@@ -25,6 +25,6 @@ class SharesController < ApplicationController
   end
 
   def set_body_classes
-    @body_classes = 'compose-standalone'
+    @body_classes = 'modal-layout compose-standalone'
   end
 end
diff --git a/app/javascript/images/mastodon-drawer.png b/app/javascript/images/mastodon-ui.png
similarity index 100%
rename from app/javascript/images/mastodon-drawer.png
rename to app/javascript/images/mastodon-ui.png
diff --git a/app/javascript/images/wave-compose-standalone.png b/app/javascript/images/wave-compose-standalone.png
new file mode 100644
index 0000000000000000000000000000000000000000..287ee639b3426947ff629f9b8d183d38d0f767cf
GIT binary patch
literal 5921
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
Do#k>L

literal 0
HcmV?d00001

diff --git a/app/javascript/images/wave-modal.png b/app/javascript/images/wave-modal.png
new file mode 100644
index 0000000000000000000000000000000000000000..88818a6d78a30e2827d4e86db12f2b0d3d8f24fe
GIT binary patch
literal 5200
zcmV-W6tC-vP)<h;3K|Lk000e1NJLTq007_s001ut1^@s6`jf_h000U7X+uL$Nkc;*
zaB^>EX>4Tx07!|ImUmPXSsKM(Rp&%%Xfiah$vGp?<SaRgLeou#7MducA~HAvBZ`O!
zC<8h~1xF=_2@yq<K|lfXG%^S%<6uBkRJM>EXLrxe*|WFK_v&}P^Ui(m)%&9^03-)i
za&jUp1V9oujpyrZM-L7OrQ@Ce67q-u9MEL3Q<H7Iy*<Ex7X-k&@zoK4JKC#We>3mz
zB+Q9QWg|A;2uE^K*+~eWMOcHK%u7R<kFZi^S~9{g8evf$vO$C;Ryk&kwN^QDjhSEP
z`1{%;><<8*%wq9k03b#neR>8v2Js>0BCN;d#BmWmg|Ia{mc>DM0b#AAq|FGEWDr)1
z{1=~?fAfs|=E-8keB-sVd==h5Dm5*NuK$02j{mKs#PmPcSpDkcC~kls@)kf!2Ka+0
zkP6a}kq(fh)1tD{RwvqTPTs<ci-}F6+afm<MR(=0b+qUPdiq8HtlsyU-J5$~9U&V2
zuU_~d07iPqxt0IwaZ>>}-;JEv?ysKOApnGE09?P$PUmH;^;WM7U;q&a0#P6d<bV=T
z1KPj<m;g(_1dhNBcp*Cu0h<6D#DXNi1DPNP>;wg%2<!s~K_#dG$3P=E2~LAfZ~<Ha
z*TF3?4937izz5Ud1y}&@z%m3uIEVsKAxTIcQh_uf1IP@rh8!Ue$QKHMBA^(E3#CIj
z&@QM5DupVcTBr&789E1Dfd-%v=sq+F%|WlBk1z@*!=kV(tP1PGX0R>n4*SC!;TSjt
z&W7{hy>JCw2cLjD;4APgcns#lFW^NKK#@>1lmbc{Wrngxd7(m4(I_5jJE{;>j;ceo
zqPkK2s5>Y=Y993gjYU(@bhI|w677NxK(o;)=<VoYbS1hG-GS~y-$75J7tmiY6pRc;
z6JvpK#ROwwFqxPFOgW|=(~h}@8N*Ct-eIv=8kT`I#kycau<_Wf*kbGvY#X)*JA$3U
zF5+-FNt`Cm3g?Am;nHvgxWl*;xXZXv+%)bzo`jdj8{nPrp?EGn4_}UN#$UpZ;%D&7
z1R;V7!GhpL;1ISDN(jdZ-GtkOX~Hs5n8+Yn5&enr#GS+nVk_|)@e%P2i9}K)nUj1-
zaim;Q1?d#&25FM?fh<DSAls9}$m!(0<OXsN`9Ap#g+fuKFe#ywG|FB|6Xh!93FW;2
zRX|6;Re&R~L!e5aLts?kr6562MbK7olVG-Bx!@VW+k*2#1R+%+dm)z4cA+Yvb3zkB
zi^5c4ePJ)*B;jJ=X5j(hSrMFws)(ZqM<ie5n8;O;DJqJpM75`~sk^Ahsn@8}qF7Oe
zsH<qaXp!hi(IL?VF%dB%u|Tmbu`02PVtg8krb=_ACDKZ0r)lG~kK(f8w&GFZd&FDC
zN5z*Uq$QXVQ4)m`Z4zS=A0_FMj*<zI`z1RiA4{R7G^Bi_GNq16U6Y!Z7L~S?W=j`J
zpO$_g1IuX0_{waRIVLkGvnVSk>nxirdsz0W?7SRJjwu%}S0;B!Zcd&mZ!I4uUnYN9
z{yANYZc9(3SJ3<D3kos{E(+-iwF*ND%Zd!e0L47THpRzEL?tt&Xr(fxUZn+Pd1X)K
z9OV|}2Py;=GnH7CLn{3$OR5ajAl2QfovO1835F{po6*8}q()J*QA<&)Q@g8<RX0;l
zP(PwRtO08nYs6|)Y24O?HBB_*G>>SGXkoO>wYXY!S`*r2ZCmXO?H27x9h#1ZPM%Ju
z&P!co-B8{Ay8XIe^o;cq^^WU3)ECir)6diI)_-lFVZb)1GPr9<F?2HAVc2E(%1F~F
z%IK)kJ!7h|r}1v%UgOUurY1a-R+BkXWzz`LYSRfbQ8RC|VzV3O7;`)G9p)FzKUkPp
zq*<J{_`_1$GQqOha&{eKUDUec>!z#}tyosIR(xx^b%gbg)_fZU8<tI-%~Pfllf$fM
z&e*Ek#@n8-eQBp>$Fpm<Te7#X-)7(AfO2qlD0CQd6mbl2taN<hr05jm)Z(<@Z0x+%
zxyJ?L;_kBFWx`d~mF?Q(y5MH&w#}{2o$T)CUg`eSL&JmT(d`L)x_KV(e6(I=J$HSl
z7w~fRI^gx#o8g_}eclJ_<Ly)B^UPP@H^;Z%kLnlh*X;Ms-_F0p|6zbyKzcxLpkQEF
zU{l~ykV8;u5I<Nqcw6wT5UG&3kgiZ%Xkci4=;8*)4F@+&hZ%<zgpF@xY|Pp?ut{oD
z;--t?g5j+2GZC1Gpor#(Pb@E19cwYtHL^N#fo;z|#D2kHa>_V!QC3l<Q8Uq2(WTL|
zF;+1LV&-CPV#{Oa<Lu)q<6gzP#Mi_xC3qz?B&;L`CAKBulOmGNaYeWZ+`i3no3l2L
zBx@!YB=b`&QVymp@Z5RzsZi?1)UGs9<i|Rgu9p5?`ecT6Mpef9%)rbuS;AS|tidfB
zTlQ?3$#%;AX)AgwduwlwLe9>d$!)gVYPUn%Be(bNP}-5dV>;J4w{a(NXTr{3^7Qgb
z^WN?X+SQ#eo1dFM^_}x~Ed>Gvyn>0{mb+`dM}Hsp{m>r6J%{&vDdZI1EYd3~FZxu>
zF24DL{tp#Dtn7{6J5*v)a&#YdA9vsQew+P`rNX7zrBeqy4|J5#%L>ch9t=M?P;OLS
zbBK5-{Sd#xqoV7u^5K1lKUKz7j#b%JwN=Yh@2Oro!Z|W}lzFtZMz*G?=HriXKi;c#
zuI;E(tt&r<J(h9o+3~>R{Xd!g)Ko83UsV6Of!n}u^lj{GGHq&VmT4|&fm_mB=1zp2
z7(VH6va40QwYH7cR&)xSN<a1d=ZK%jPrIM)J!5vJ^{mR->UL^-VF%Q)rDLHpwv*o#
z(lv6<?OboSWq12|o%0PB6fRU<6uVe*iFhgh(#qxR%Zok9J@Z#$u1xiY_ddKDeD!Xh
zPv6ir_iHz<J6*rpZ`*(QhSiM=0~Q14ZkpZfyk&B$W6*f8{TJh3+J{VrI&PcZ?iw~9
z?jBh;a%t3N^vWHFJJ;{J-n})per#ksVEo=h*aZI`=ico7#QU!vWIR}YnEMFxsPM7S
z<MJmmPwIYE|Fw;8!oN7_Fgf_t@9D!S_SB2tQh)n2o&SvTtb9g(rfJq-_QIUg-0<@a
z&!=A`zgV6x_+9w->X&LS&;G&uV{jpOVfq#C)ynJQH<E7}-Wt8_UG!dj@-FG!@>1b@
z$@h&P%s%vg4Ei{;ocRg&sp7Nx=k71=UmmR_t*j)oc&x8c0EHAB9Sy+i1^_4_08odK
z{2;KF$NtPR(^}tB&EN1^X8S4=0BUmq2w?&cgj5YujMW&_1AsTe{!9R;D}JkgDmB{B
zV9krviA0m~m6bO^0N~UC_&l+)vfR0{^0^+_>;nLL-mT@pRmmZlG<af_1{`E_{xgsL
z110>pO+#zSV*mgO4oO5oRCwC$oPDrVbs5J$XYb{D;ertFc?G8ENBs~)`9**r1R>g1
zI<15?j859LNrO%5XsOiXOKI;p5;m(%O}<n{tAK6^T9F}2o#_R~by!C&N+k+N0<M?K
z-TpYwoi^s~?m4^X?4HfvGjnH{dk^P+_c`D1^Y(krb+Bfw!In&=6F>*h4)g+jxooEY
zjpz#}WXDd)Wix-a6l*x4JAui-B%lw-=dzi<#}sQjFb+5$m<T)zYy<Y^vYEb^`}t%b
zk;`Td#!7$^(LOI<Hvu=jQ6pLtNHGQYD)2s_6X*wC0B#0;6em&(Pr8Bofq6h1a17W1
zd=l6lM-e7d=}Ewyzyjbnur4f)w}*uBdf)~T^bHb)Z)q_icL1X#i@Yu*?um0CNv6`{
zfu8{HED5FwU>a~YFa!8(j3B=S_#rT-<a-^!A|MN_N~Y4ga@kC8jC?#tu$@}+?a(;x
zgaB{_aGyAGz<PmIK(-Y!p@?s$WReAvMYaHIfLCG~l}`um72M^l5BNTCbuOEEt;u+Y
z0ULp36)t-b_$csX9DJTkrOy*?j~?X5y}+tmHnX8=0!*gT^Mt4)2Kn(Z;9}sXajxx!
z7}J370kcYcQUsm>J`VggPJtwuN>2rHg1ega1Dk+L!|YvZ==-h%Zmhz&BCrcs4(w~D
z&y%V263Kj{DqMC5Sf0yfo~rftB<cV-LmupiGM5YiegIsUOr?j%SbU3sdw?@eAcrH_
z<vw7VkSGqA4e*#x@eMrV^MQ5E_zdzpKM1V#5%33m{^csfj~eq_;6Wc4MgW^c3pH6=
zjR3oWpGm(|?fw@4|5VyMQ^>o$F(Gk6Y4au_=Iy{#dHBUaNHQ9DFR-nUcVBHX?!`ik
zQ){SnW&qQbHjfwb?$HJgUFHA}09^sFo(Ak!+WeuAcaJsL$L|0h2FCmRFI~VnN}FsU
z?;eU=fXP&PtN@%D;CCzsMk#InsI)m+$h*xfEfONCHNcmEu@%HuD#Ardn<ol+cW;w$
zF9#kf(~tNiwg$SDHX93hw-_~MrOjk1l_%7|%h|vVrOjU(#TS_cJO;ci;C~$>{CKdC
zcaKCSKoMUSm|w%gpCeItr_$!%g}mF>1QK@uZv}1zRs%x?UcZlWd>k-OX|tt}cMmog
z_X@n};qW?J`hiS1Qfc$cLf$<dA?7y&KL=Eew-_c^H!5w8L>(~XjBgX(@klLp3NT-3
zvpI+egZ6;yfrT{^zyZz$ehj=@`maWkc(^$CUf?6rql);7e*JJJaKDr(4awHYRQhu1
zQM)R;*6}OCHsA{2D-q%zEo45;ALg<)8@Mg%eo(5Sb-;V7<E@B!p=c!B446!%hbwLF
z20mOFfv=(J1YjxfveM=+g}mF-fPQbN^l{&jGAvPp_y(*SI74akNFnbYj<|%o3ivv3
zQZS!aeGUm=w$kRcLf(Bkf-2+N;%^_As|M{Ez)+>lZ=#qXi1@COFQ*P(4_r81X){%6
zv(*pYHlIXT4_s0?V>&^=j=(z)I;gaHUTM=CMV&7bxG~c2-6rBM?e}UqhH>!LzUB!j
z_D7Mel{VkN8{N0p7Vvy!!X;APJryFEuLC|6jLa1uMM5f%JxZJB!W_y7-phb*me)ey
z05>qnomj}bo9Y%|GL^m_xU%xKPAw7RB)lVlHegrSb-swNTS~3f|1II1BH^syO$O#l
zFLfY9+~a`_z)F7sudbf39ayNe*<HxH&xSzei-2zhBeO4S2hNuH!Je>sSEbDbz<2rI
zC6X`#oCC~K+VmCj?h`c&FqulP1-?*Q6!zupA;4TA^LC|8PZ*g{%AmJPDfEGoey<2c
zr#fkUB}WJEIN&U$&Gtgx-B&MWrOisbN$1QEN`1fAc1R}tT_NwjR0o;QmO;_bhyq5Z
zv@X9=+Wey)5lUM!A8(*IEF!!KV6oDsSjfA-4lKZAD*Yiz%^kHrTwg?K1Ez}z|0I1$
zJ<ja}7UONU%sC;8IKlAx!hec5dZ*H6Uo8Pd*2>lc*8(H!99-1$9J+vIay)UM2K=M&
z#`ohQ4j3l`26$K|>BSm@#av)><>8JK2Hu1O=&}`tQ^uiZ0*{t=Xi%pX{a&;~nqjw=
z^)(^F0wMFHU?81(@$bgl`0%~aFO%R;;4Ms#4<VS<`x%}FF3e>!e+%IA(ZC~=9p5`)
z<1OOtw|+Y4eyfzpv%=-JFaPcX&dp^rzpt7BWy@tFFeO?-lr8BD@TAh_P>_aOju}?q
zy*4t@KR`cO#n-LI$mH)irOiu~GNF{4OQrv~jPmPzA^O_aJ-UI(a-iJr)90Hd=!J~i
zsq}->fdfG{Wkh^u3AZOSkk<nh#$u(-Lnm&_ID=%62Y_?JCq$rXp#WSBJf6#Dj`(ow
zD7+(*FB0g?$cf@Jyn?sU|BKR0C^$RumKd(YJ9Fv`A7kC0Vc<2Jn=36t3s>#|-XAUY
zvUrcm&}VBdo9Xc}6Szo%b5|3qjIF@R(xrIk1cKa&xBc%#1F{(8!k6(z+MCO5@t3TX
zeGK><{`U=|D2+<(AaFU}-e$jGT!wcXGMkF$dXYzCKcC@s;Kp1wb87`cZ;%031F)CH
zyGQ)`e7RsDGl7&;8=cYPEmr&CUBK!Ayln!qU83F^>K=WELMTTX?&ZKSrOk_SR#=)*
z+GPN8EpScwX;xT+j6k2E6F5)){Vw1RDK)3y`z7e8#OLeY?Z5)1&0(d@&eCCrl%01-
zMsXU0z3lx)N>8^%X>)k6p^Vbz5+KtU@m0N-gZI`=r_yFyA@BCL3CL^k-tuja9%P{V
zbl|P`%miLg+Wbpt)2FmK8E?($b}2nO8cS+lBJKc|NQ53sptZj!#TQ6~OM&rn*4bBb
zMwx1y_^R3zyyfXfOW*R4K6@?ROV%BY^>x+B=v<(ukaxE`$y7QewfwNgf-DBTc&|jV
zt<v;gAsNtVE}@H!7Dh9A!n^Pe*f&t|Ef}X+Sc`ZI7q<XCBFL`+$>s)%ioQJpT<j!M
z=~tUD6{?lI#|3zo|BT|qfy6NsULgEM=?goXkH0L|W58$d{_f1BRD5&9iHmRdwl`0F
z1NRR^-ZrX^?3>|er%n+zQ+&SgJMj=-MXW>crr<*w(@KTn+X=DwGYd`VZ(<@s$ND;4
zUk`0He<zv`HtY$M6LT^;F~Awdb7%!$$3=WjPysqIcV?WUTQy=9iLW^==Id7ChT~U&
zPK*GyG9g;EysQ>LoEGzOyzwUDHw*~sKquy8ZdGAAF)KN1dH(Uo+umAaD7GM(O9uwF
zbhAFD6$SYJP}W(qKK9iETC--&3ecK0D?n@3tXTnCvt|Wo&6+hUKx@{l0IgZGW(8=?
zniZfmYu2m)ty!}Iv}Vnk6`(b1R)E&5S+fGPX3YxFnl)>K*?$12?(={*Bz+hF0000<
KMNUMnLSTZg*XzIl

literal 0
HcmV?d00001

diff --git a/app/javascript/styles/application.scss b/app/javascript/styles/application.scss
index 44aa105645..fd6665f65c 100644
--- a/app/javascript/styles/application.scss
+++ b/app/javascript/styles/application.scss
@@ -6,6 +6,7 @@
 
 @import 'mastodon/reset';
 @import 'mastodon/basics';
+@import 'mastodon/modal';
 @import 'mastodon/containers';
 @import 'mastodon/lists';
 @import 'mastodon/footer';
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 3240b38a42..bc193a15ad 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -1773,7 +1773,7 @@
   }
 
   > .mastodon {
-    background: url('../images/mastodon-drawer.png') no-repeat left bottom / contain;
+    background: url('../images/mastodon-ui.png') no-repeat left bottom / contain;
     flex: 1;
   }
 }
diff --git a/app/javascript/styles/mastodon/modal.scss b/app/javascript/styles/mastodon/modal.scss
new file mode 100644
index 0000000000..310dcb9249
--- /dev/null
+++ b/app/javascript/styles/mastodon/modal.scss
@@ -0,0 +1,20 @@
+.modal-layout {
+  background: $ui-base-color url('../images/wave-modal.png') repeat-x bottom fixed;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  padding: 0;
+}
+
+.modal-layout__mastodon {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  justify-content: flex-end;
+
+  > * {
+    flex: 1;
+    max-height: 235px;
+    background: url('../images/mastodon-ui.png') no-repeat left bottom / contain;
+  }
+}
diff --git a/app/views/layouts/modal.html.haml b/app/views/layouts/modal.html.haml
index a819e098d6..d01b6b6c56 100644
--- a/app/views/layouts/modal.html.haml
+++ b/app/views/layouts/modal.html.haml
@@ -12,5 +12,7 @@
         = fa_icon 'sign-out'
 
   .container= yield
+  .modal-layout__mastodon
+    %div
 
 = render template: 'layouts/application'