Intro (#100)

* Create base activity * Created some testers * Update theme and fix mess up * Update theme and replace paint * WIP intro drawables * Create intro screens * Clear unnecessary dependencies * Finalize intro panels * Clean up intro * Attack intro to settings * Fix lint * Finalize intro
AllanWang · Jul 30, 2017 · 1418593 · 1418593
1 parent d94bc85
commit 1418593
Show file tree

Hide file tree

Showing 46 changed files with 1,334 additions and 91 deletions.
diff --git a/app/build.gradle b/app/build.gradle
@@ -10,7 +10,7 @@ apply plugin: 'com.github.triplet.play'
 
 play {
     jsonFile = file('../files/gplay-keys.json')
-    track = 'beta'
+    track = 'alpha'
     errorOnSizeLimit = true
     uploadImages = false
     untrackOld = true
@@ -172,4 +172,5 @@ dependencies {
     compile "com.davemorrissey.labs:subsampling-scale-image-view:${SCALE_IMAGE_VIEW}"
 
     compile "com.sothree.slidinguppanel:library:${SLIDING_PANEL}"
+
 }
diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
@@ -105,7 +105,9 @@
                     android:scheme="https" />
             </intent-filter>
         </activity>
-
+        <activity
+            android:name=".activities.IntroActivity"
+            android:theme="@style/FrostTheme.Intro" />
         <activity
             android:name=".activities.LoginActivity"
             android:theme="@style/FrostTheme" />

diff --git a/app/src/main/assets/css/core/_base.scss b/app/src/main/assets/css/core/_base.scss
@@ -1,17 +1,35 @@
 @mixin placeholder {
-    ::-webkit-input-placeholder {
-        @content
-    }
+  ::-webkit-input-placeholder {
+    @content;
+  }
 
-    :-moz-placeholder {
-        @content
-    }
+  :-moz-placeholder {
+    @content;
+  }
 
-    ::-moz-placeholder {
-        @content
-    }
+  ::-moz-placeholder {
+    @content;
+  }
 
-    :-ms-input-placeholder {
-        @content
-    }
+  :-ms-input-placeholder {
+    @content;
+  }
+}
+
+@mixin keyframes($name) {
+  @-webkit-keyframes #{$name} {
+    @content;
+  }
+
+  @-moz-keyframes #{$name} {
+    @content;
+  }
+
+  @-ms-keyframes #{$name} {
+    @content;
+  }
+
+  @keyframes #{$name} {
+    @content;
+  }
 }
diff --git a/app/src/main/assets/css/core/_colors.scss b/app/src/main/assets/css/core/_colors.scss
@@ -8,4 +8,5 @@ $link: #d59ed5 !default;
 $background: #451515 !default;
 $background2: rgba(lighten($background, 35%), 0.2) !default;
 $bg_opaque: rgba($background, 1.0) !default;
+$bg_opaque2: rgba($background2, 1.0) !default;
 $divider: rgba($text, 0.3) !default;
diff --git a/app/src/main/assets/css/core/main.compact.css b/app/src/main/assets/css/core/main.compact.css
@@ -8,9 +8,11 @@ body, #root, #header, [style*="background-color"], ._55wo, ._1upc, input, ._2f9r
 
 .jewel, .flyout, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, .mentions-suggest { background: #451515 !important; }
 
+._403n, ._1-kc { background: #c74646 !important; }
+
 button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._590n, ._4g8h, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, .excessItem, ._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, ._4qax, .aclb, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, .acbk { background: rgba(199, 70, 70, 0.2) !important; }
 
-[style*="color"], body, input, ._42rv, ._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, ._18qg, ._1_ac, textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, ._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, ._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, ._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, ._2new, .appCenterCategorySelectorButton, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, ._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, h1, h2, h3, h4, h5, h6 { color: #d7b0d7 !important; }
+[style*="color"], body, input, ._42rv, ._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, ._5xu2, ._3ml8, ._3mla, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, ._18qg, ._1_ac, textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, ._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, ._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, ._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, ._2new, .appCenterCategorySelectorButton, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, ._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, h1, h2, h3, h4, h5, h6 { color: #d7b0d7 !important; }
 
 ._15kl::before, ._5j35::after, ._2k4b, ._3to7, ._4nw8 { border-left: 1px solid rgba(215, 176, 215, 0.3) !important; }
 
@@ -24,7 +26,7 @@ button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS
 
 ._4o58::after, .acw, .aclb, ._4qax, ._5h8f { border-color: rgba(215, 176, 215, 0.3) !important; }
 
-._220g, ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { background: rgba(215, 176, 215, 0.3) !important; }
+._220g, ._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { background: rgba(215, 176, 215, 0.3) !important; }
 
 ._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
 
@@ -49,3 +51,19 @@ button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS
 a, ._5fpq { color: #d59ed5 !important; }
 
 .excessItem { outline: rgba(215, 176, 215, 0.3) !important; }
+
+@-webkit-keyframes highlightFade { 0% { background: rgba(199, 70, 70, 0.2); }
+  50% { background: rgba(199, 70, 70, 0.2); }
+  100% { background: rgba(255, 0, 255, 0.02); } }
+
+@-moz-keyframes highlightFade { 0% { background: rgba(199, 70, 70, 0.2); }
+  50% { background: rgba(199, 70, 70, 0.2); }
+  100% { background: rgba(255, 0, 255, 0.02); } }
+
+@-ms-keyframes highlightFade { 0% { background: rgba(199, 70, 70, 0.2); }
+  50% { background: rgba(199, 70, 70, 0.2); }
+  100% { background: rgba(255, 0, 255, 0.02); } }
+
+@keyframes highlightFade { 0% { background: rgba(199, 70, 70, 0.2); }
+  50% { background: rgba(199, 70, 70, 0.2); }
+  100% { background: rgba(255, 0, 255, 0.02); } }
diff --git a/app/src/main/assets/css/core/main.scss b/app/src/main/assets/css/core/main.scss
@@ -29,6 +29,10 @@ body, #root, #header, [style*="background-color"], ._55wo, ._1upc, input, ._2f9r
   background: $bg_opaque !important;
 }
 
+._403n, ._1-kc {
+  background: $bg_opaque2 !important;
+}
+
 button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._590n, ._4g8h,
 ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, .excessItem,
 ._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51,
@@ -38,7 +42,7 @@ button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS
 }
 
 [style*="color"], body, input, ._42rv,
-._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf,
+._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, ._5xu2, ._3ml8, ._3mla,
 ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, ._18qg, ._1_ac,
 textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, ._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, ._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb,
 ._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, ._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, ._2new, .appCenterCategorySelectorButton,
@@ -86,7 +90,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 ._220g,
-._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before {
+._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before {
   background: $divider !important;
 }
 
@@ -138,3 +142,18 @@ a,
 .excessItem {
   outline: $divider !important;
 }
+
+//new comment
+@include keyframes(highlightFade) {
+  0% {
+    background: $background2;
+  }
+
+  50% {
+    background: $background2;
+  }
+
+  100% {
+    background: $bg_transparent;
+  }
+}
diff --git a/app/src/main/assets/css/themes/custom.compact.css b/app/src/main/assets/css/themes/custom.compact.css
@@ -8,9 +8,11 @@ body, #root, #header, [style*="background-color"], ._55wo, ._1upc, input, ._2f9r
 
 .jewel, .flyout, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, .mentions-suggest { background: $O$ !important; }
 
+._403n, ._1-kc { background: $OO$ !important; }
+
 button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._590n, ._4g8h, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, .excessItem, ._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, ._4qax, .aclb, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, .acbk { background: $BBT$ !important; }
 
-[style*="color"], body, input, ._42rv, ._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, ._18qg, ._1_ac, textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, ._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, ._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, ._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, ._2new, .appCenterCategorySelectorButton, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, ._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, h1, h2, h3, h4, h5, h6 { color: $T$ !important; }
+[style*="color"], body, input, ._42rv, ._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, ._5xu2, ._3ml8, ._3mla, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, ._18qg, ._1_ac, textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, ._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, ._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, ._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, ._2new, .appCenterCategorySelectorButton, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, ._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, h1, h2, h3, h4, h5, h6 { color: $T$ !important; }
 
 ._15kl::before, ._5j35::after, ._2k4b, ._3to7, ._4nw8 { border-left: 1px solid $D$ !important; }
 
@@ -24,7 +26,7 @@ button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS
 
 ._4o58::after, .acw, .aclb, ._4qax, ._5h8f { border-color: $D$ !important; }
 
-._220g, ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { background: $D$ !important; }
+._220g, ._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { background: $D$ !important; }
 
 ._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
 
@@ -49,3 +51,19 @@ button:not([style*=image]), button::before, .touch ._56bt, ._56be::before, .btnS
 a, ._5fpq { color: $TT$ !important; }
 
 .excessItem { outline: $D$ !important; }
+
+@-webkit-keyframes highlightFade { 0% { background: $BBT$; }
+  50% { background: $BBT$; }
+  100% { background: $BT$; } }
+
+@-moz-keyframes highlightFade { 0% { background: $BBT$; }
+  50% { background: $BBT$; }
+  100% { background: $BT$; } }
+
+@-ms-keyframes highlightFade { 0% { background: $BBT$; }
+  50% { background: $BBT$; }
+  100% { background: $BT$; } }
+
+@keyframes highlightFade { 0% { background: $BBT$; }
+  50% { background: $BBT$; }
+  100% { background: $BT$; } }
diff --git a/app/src/main/assets/css/themes/custom.scss b/app/src/main/assets/css/themes/custom.scss
@@ -4,6 +4,7 @@ $link: unquote('$TT$');
 $background: unquote('$B$');
 $background2: unquote('$BBT$');
 $bg_opaque: unquote('$O$');
+$bg_opaque2: unquote('$OO$');
 $divider: unquote('$D$');
 
 @import "../core/main";
diff --git a/app/src/main/kotlin/com/pitchedapps/frost/activities/BaseActivity.kt b/app/src/main/kotlin/com/pitchedapps/frost/activities/BaseActivity.kt
@@ -1,11 +1,13 @@
 package com.pitchedapps.frost.activities
 
+import android.content.Intent
 import android.os.Bundle
 import android.support.v7.app.AppCompatActivity
 import com.pitchedapps.frost.R
 import com.pitchedapps.frost.utils.Prefs
 import com.pitchedapps.frost.utils.materialDialogThemed
 import com.pitchedapps.frost.utils.setFrostTheme
+import org.jetbrains.anko.contentView
 
 /**
  * Created by Allan Wang on 2017-06-12.

diff --git a/app/src/main/kotlin/com/pitchedapps/frost/activities/ImageActivity.kt b/app/src/main/kotlin/com/pitchedapps/frost/activities/ImageActivity.kt
@@ -122,7 +122,7 @@ class ImageActivity : AppCompatActivity() {
                 } else {
                     photo.setImage(ImageSource.uri(it))
                     fabAction = FabStates.DOWNLOAD
-                    photo.animate().alpha(1f).scaleX(1f).scaleY(1f).withEndAction { fab.show() }.start()
+                    photo.animate().alpha(1f).scaleXY(1f).withEndAction { fab.show() }.start()
                 }
             })
         } else {
@@ -283,9 +283,15 @@ internal enum class FabStates(val iicon: IIcon, val iconColor: Int = Prefs.iconC
      * If it's in view, give it some animations
      */
     fun update(fab: FloatingActionButton) {
-        fab.transition {
-            setIcon(iicon, color = iconColor)
-            backgroundTintList = ColorStateList.valueOf(backgroundTint)
+        if (fab.isHidden) {
+            fab.setIcon(iicon, color = iconColor)
+            fab.backgroundTintList = ColorStateList.valueOf(backgroundTint)
+            fab.show()
+        } else {
+            fab.fadeScaleTransition {
+                setIcon(iicon, color = iconColor)
+                backgroundTintList = ColorStateList.valueOf(backgroundTint)
+            }
         }
     }