Add onboarding screens

app/build.gradle

@@ -50,7 +50,7 @@ dependencies {
   implementation "com.android.support:cardview-v7:$supportLibraryVersion"
   implementation 'com.android.support:multidex:1.0.2'
 
-  compile 'com.android.support.constraint:constraint-layout:1.0.2'
+  implementation "com.android.support.constraint:constraint-layout:$constraintLayoutVersion"
 
   androidTestImplementation 'com.android.support.test.uiautomator:uiautomator-v18:2.1.3'
 
@@ -76,6 +76,9 @@ dependencies {
   androidTestImplementation 'com.android.support.test:runner:1.0.1'
   androidTestImplementation 'com.android.support.test:rules:1.0.1'
 
+  // Tab indicator
+  implementation "com.pacioianu.david:ink-page-indicator:$inkPageIndicatorVersion"
+
   // Guava
   implementation group: 'com.google.guava', name: 'guava', version: '21.0'
 

app/src/main/AndroidManifest.xml

@@ -195,6 +195,7 @@
         android:resource="@xml/provider_paths" />
     </provider>
 
+    <activity android:name=".intro.IntroActivity" />
   </application>
 
 </manifest>

app/src/main/java/org/kiwix/kiwixmobile/base/BaseActivity.java

@@ -18,16 +18,35 @@
 package org.kiwix.kiwixmobile.base;
 
 import android.os.Bundle;
+import android.support.annotation.LayoutRes;
 import android.support.annotation.Nullable;
 import android.support.v7.app.AppCompatActivity;
 
+import butterknife.ButterKnife;
+import butterknife.Unbinder;
 import dagger.android.AndroidInjection;
 
 public abstract class BaseActivity extends AppCompatActivity {
 
+  Unbinder unbinder;
+
   @Override
   protected void onCreate(@Nullable Bundle savedInstanceState) {
     AndroidInjection.inject(this);
     super.onCreate(savedInstanceState);
   }
+
+  @Override
+  public void setContentView(@LayoutRes int layoutResID) {
+    super.setContentView(layoutResID);
+    unbinder = ButterKnife.bind(this);
+  }
+
+  @Override
+  protected void onDestroy() {
+    super.onDestroy();
+    if (unbinder != null) {
+      unbinder.unbind();
+    }
+  }
 }

app/src/main/java/org/kiwix/kiwixmobile/di/modules/ActivityBindingModule.java

@@ -3,9 +3,11 @@ package org.kiwix.kiwixmobile.di.modules;
 import org.kiwix.kiwixmobile.bookmark.BookmarksActivity;
 import org.kiwix.kiwixmobile.di.PerActivity;
 import org.kiwix.kiwixmobile.error.ErrorActivity;
+import org.kiwix.kiwixmobile.intro.IntroActivity;
 import org.kiwix.kiwixmobile.main.MainActivity;
 import org.kiwix.kiwixmobile.search.SearchActivity;
 import org.kiwix.kiwixmobile.settings.KiwixSettingsActivity;
+import org.kiwix.kiwixmobile.splash.SplashActivity;
 import org.kiwix.kiwixmobile.zim_manager.ZimManageActivity;
 
 import dagger.Module;
@@ -42,4 +44,12 @@ public abstract class ActivityBindingModule {
   @PerActivity
   @ContributesAndroidInjector
   public abstract ErrorActivity provideErrorActivity();
+
+  @PerActivity
+  @ContributesAndroidInjector
+  public abstract IntroActivity provideIntroActivity();
+
+  @PerActivity
+  @ContributesAndroidInjector
+  public abstract SplashActivity provideSplashActivity();
 }

app/src/main/java/org/kiwix/kiwixmobile/intro/CustomViewPager.java

@@ -0,0 +1,59 @@
+package org.kiwix.kiwixmobile.intro;
+
+import android.content.Context;
+import android.support.v4.view.ViewPager;
+import android.util.AttributeSet;
+import android.util.Log;
+import android.view.animation.Interpolator;
+import android.widget.Scroller;
+
+import java.lang.reflect.Field;
+
+/**
+ * A custom implementation of {@link ViewPager} to decrease the speed of auto-scroll animation
+ * of {@link ViewPager}.
+ */
+
+public class CustomViewPager extends ViewPager {
+
+  public CustomViewPager(Context context) {
+    super(context);
+    postInitViewPager();
+  }
+
+  public CustomViewPager(Context context, AttributeSet attrs) {
+    super(context, attrs);
+    postInitViewPager();
+  }
+
+  /**
+   * Override the Scroller instance with our own class so we can change the
+   * duration
+   */
+  private void postInitViewPager() {
+    try {
+      Field scroller = ViewPager.class.getDeclaredField("mScroller");
+      scroller.setAccessible(true);
+      Field interpolator = ViewPager.class.getDeclaredField("sInterpolator");
+      interpolator.setAccessible(true);
+
+      CustomScroller customScroller = new CustomScroller(getContext(),
+          (Interpolator) interpolator.get(null));
+      scroller.set(this, customScroller);
+    } catch (Exception e) {
+      Log.e("CustomViewPager", e.toString());
+    }
+  }
+
+  class CustomScroller extends Scroller {
+
+    CustomScroller(Context context, Interpolator interpolator) {
+      super(context, interpolator);
+    }
+
+    @Override
+    public void startScroll(int startX, int startY, int dx, int dy, int duration) {
+      super.startScroll(startX, startY, dx, dy, duration * 3);
+    }
+  }
+}

app/src/main/java/org/kiwix/kiwixmobile/intro/IntroActivity.java

@@ -0,0 +1,162 @@
+package org.kiwix.kiwixmobile.intro;
+
+import android.animation.ValueAnimator;
+import android.content.Intent;
+import android.os.Bundle;
+import android.os.Handler;
+import android.support.constraint.ConstraintLayout;
+import android.support.v4.view.ViewPager;
+import android.view.LayoutInflater;
+import android.view.View;
+import android.view.animation.LinearInterpolator;
+import android.widget.ImageView;
+
+import com.pixelcan.inkpageindicator.InkPageIndicator;
+
+import org.kiwix.kiwixmobile.R;
+import org.kiwix.kiwixmobile.base.BaseActivity;
+import org.kiwix.kiwixmobile.main.MainActivity;
+import org.kiwix.kiwixmobile.utils.SharedPreferenceUtil;
+
+import java.util.Timer;
+import java.util.TimerTask;
+import java.util.concurrent.TimeUnit;
+
+import javax.inject.Inject;
+
+import butterknife.BindView;
+import butterknife.OnClick;
+
+public class IntroActivity extends BaseActivity {
+
+  @BindView(R.id.view_pager)
+  ViewPager viewPager;
+  @BindView(R.id.tab_indicator)
+  InkPageIndicator tabIndicator;
+  @Inject
+  SharedPreferenceUtil preferences;
+
+  private ValueAnimator tedAnimator;
+  private ValueAnimator stackExchangeAnimator;
+  private ValueAnimator wikivoyageAnimator;
+  private ImageView airPlane;
+  private Handler handler = new Handler();
+  private Timer timer = new Timer();
+  private int currentPage = 0;
+  private ViewPager.OnPageChangeListener pageChangeListener = new ViewPager.OnPageChangeListener() {
+    @Override
+    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
+
+    }
+
+    @Override
+    public void onPageSelected(int position) {
+      if (position == 2) {
+        airPlane.setVisibility(View.VISIBLE);
+        airPlane.animate()
+            .translationX(airPlane.getWidth())
+            .setDuration(800);
+      } else {
+        airPlane.setVisibility(View.INVISIBLE);
+        airPlane.animate()
+            .translationX(-airPlane.getWidth());
+      }
+      currentPage = position;
+    }
+
+    @Override
+    public void onPageScrollStateChanged(int state) {
+      if (state == ViewPager.SCROLL_STATE_DRAGGING) {
+        dismissAutoRotate();
+      }
+    }
+  };
+  private View[] views;
+
+  @Override
+  protected void onCreate(Bundle savedInstanceState) {
+    super.onCreate(savedInstanceState);
+    setContentView(R.layout.activity_intro);
+    LayoutInflater layoutInflater = getLayoutInflater();
+    views = new View[]{
+        layoutInflater.inflate(R.layout.item_intro_1, viewPager, false),
+        layoutInflater.inflate(R.layout.item_intro_2, viewPager, false),
+        layoutInflater.inflate(R.layout.item_intro_3, viewPager, false)
+    };
+    IntroPagerAdapter introPagerAdapter = new IntroPagerAdapter(views);
+    viewPager.setAdapter(introPagerAdapter);
+    tabIndicator.setViewPager(viewPager);
+
+    stackExchangeAnimator = animateImage(views[1].findViewById(R.id.ic_stack_exchange),
+        TimeUnit.SECONDS.toMillis(6));
+    wikivoyageAnimator = animateImage(views[1].findViewById(R.id.ic_wikivoyage),
+        TimeUnit.SECONDS.toMillis(9));
+    tedAnimator = animateImage(views[1].findViewById(R.id.ic_ted),
+        TimeUnit.SECONDS.toMillis(12));
+
+    tedAnimator.start();
+    stackExchangeAnimator.start();
+    wikivoyageAnimator.start();
+
+    airPlane = views[2].findViewById(R.id.airplane);
+    viewPager.addOnPageChangeListener(pageChangeListener);
+
+    timer.schedule(new TimerTask() {
+      @Override
+      public void run() {
+        handler.post(() -> {
+          if (currentPage == views.length) {
+            currentPage = 0;
+          }
+          viewPager.setCurrentItem(currentPage++, true);
+        });
+      }
+    }, 0, 2000);
+
+    for (View view : views) {
+      view.findViewById(R.id.root).setOnClickListener(v -> dismissAutoRotate());
+    }
+  }
+
+  @Override
+  protected void onDestroy() {
+    super.onDestroy();
+    tedAnimator.end();
+    wikivoyageAnimator.end();
+    stackExchangeAnimator.end();
+    handler.removeCallbacksAndMessages(null);
+    timer.cancel();
+    for (View view : views) {
+      view.findViewById(R.id.root).setOnClickListener(null);
+    }
+  }
+
+  @OnClick(R.id.get_started)
+  void startMainActivity() {
+    dismissAutoRotate();
+    startActivity(new Intent(this, MainActivity.class));
+    preferences.setIntroShown();
+    finish();
+  }
+
+  private void dismissAutoRotate() {
+    handler.removeCallbacksAndMessages(null);
+    timer.cancel();
+  }
+
+  private ValueAnimator animateImage(ImageView imageView, long orbitDuration) {
+    ValueAnimator anim = ValueAnimator.ofInt(0, 359);
+    anim.addUpdateListener(valueAnimator -> {
+      int val = (Integer) valueAnimator.getAnimatedValue();
+      ConstraintLayout.LayoutParams layoutParams = (ConstraintLayout.LayoutParams) imageView.getLayoutParams();
+      layoutParams.circleAngle = val;
+      imageView.setLayoutParams(layoutParams);
+    });
+    anim.setDuration(orbitDuration);
+    anim.setInterpolator(new LinearInterpolator());
+    anim.setRepeatMode(ValueAnimator.RESTART);
+    anim.setRepeatCount(ValueAnimator.INFINITE);
+
+    return anim;
+  }
+}

app/src/main/java/org/kiwix/kiwixmobile/intro/IntroPagerAdapter.java

@@ -0,0 +1,36 @@
+package org.kiwix.kiwixmobile.intro;
+
+import android.support.annotation.NonNull;
+import android.support.v4.view.PagerAdapter;
+import android.view.View;
+import android.view.ViewGroup;
+
+public class IntroPagerAdapter extends PagerAdapter {
+  private View views[];
+
+  IntroPagerAdapter(View views[]) {
+    this.views = views;
+  }
+
+  @Override
+  public int getCount() {
+    return views.length;
+  }
+
+  @NonNull
+  @Override
+  public Object instantiateItem(@NonNull ViewGroup container, int position) {
+    container.addView(views[position]);
+    return views[position];
+  }
+
+  @Override
+  public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
+    container.removeView((View) object);
+  }
+
+  @Override
+  public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
+    return view == object;
+  }
+}

app/src/main/java/org/kiwix/kiwixmobile/splash/SplashActivity.java

@@ -20,13 +20,20 @@ package org.kiwix.kiwixmobile.splash;
 import android.content.Context;
 import android.content.Intent;
 import android.os.Bundle;
-import android.support.v7.app.AppCompatActivity;
 
+import org.kiwix.kiwixmobile.base.BaseActivity;
 import org.kiwix.kiwixmobile.error.ErrorActivity;
+import org.kiwix.kiwixmobile.intro.IntroActivity;
 import org.kiwix.kiwixmobile.main.MainActivity;
+import org.kiwix.kiwixmobile.utils.SharedPreferenceUtil;
+
+import javax.inject.Inject;
 
 
-public class SplashActivity extends AppCompatActivity {
+public class SplashActivity extends BaseActivity {
+
+  @Inject
+  SharedPreferenceUtil preferences;
 
   @Override
   protected void onCreate(Bundle savedInstanceState) {
@@ -49,7 +56,12 @@ public class SplashActivity extends AppCompatActivity {
       System.exit(10);
     });
 
-    Intent intent = new Intent(this, MainActivity.class);
+    Intent intent;
+    if (!preferences.showIntro()) {
+      intent = new Intent(this, MainActivity.class);
+    } else {
+      intent = new Intent(this, IntroActivity.class);
+    }
     startActivity(intent);
     finish();
   }

app/src/main/java/org/kiwix/kiwixmobile/utils/Constants.java

@@ -80,6 +80,8 @@ public final class Constants {
 
     public static final String PREF_IS_FIRST_RUN = "isFirstRun";
 
+    static final String PREF_SHOW_INTRO = "showIntro";
+
     // Tags
     public static final String TAG_FILE_SEARCHED = "searchedarticle";
 

app/src/main/java/org/kiwix/kiwixmobile/utils/SharedPreferenceUtil.java

@@ -13,12 +13,12 @@ import static org.kiwix.kiwixmobile.utils.Constants.PREF_BACK_TO_TOP;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_BOTTOM_TOOLBAR;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_EXTERNAL_LINK_POPUP;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_FULLSCREEN;
-import static org.kiwix.kiwixmobile.utils.Constants.PREF_FULL_TEXT_SEARCH;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_HIDE_TOOLBAR;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_IS_FIRST_RUN;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_LANG;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_NEW_TAB_BACKGROUND;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_NIGHTMODE;
+import static org.kiwix.kiwixmobile.utils.Constants.PREF_SHOW_INTRO;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_STORAGE;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_STORAGE_TITLE;
 import static org.kiwix.kiwixmobile.utils.Constants.PREF_WIFI_ONLY;
@@ -140,4 +140,12 @@ public class SharedPreferenceUtil {
   public void putPrefExternalLinkPopup(boolean externalLinkPopup) {
     editor.putBoolean(PREF_EXTERNAL_LINK_POPUP, externalLinkPopup).apply();
   }
+
+  public boolean showIntro() {
+    return sharedPreferences.getBoolean(PREF_SHOW_INTRO, true);
+  }
+
+  public void setIntroShown() {
+    editor.putBoolean(PREF_SHOW_INTRO, false).apply();
+  }
 }

app/src/main/res/drawable/ic_airplane.xml

@@ -0,0 +1,53 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+  android:width="449dp"
+  android:height="121dp"
+  android:viewportHeight="1210"
+  android:viewportWidth="4490">
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M970,1203c-106,-3 -138,-7 -152,-20 -16,-15 -18,-38 -18,-260l0,-243 -30,-1c-16,-1 -34,-3 -40,-4 -5,-1 -73,-3 -150,-4 -88,-1 -140,-5 -140,-11 0,-7 66,-9 193,-8l192,3 3,250c1,137 6,253 11,258 8,8 363,13 1061,16 143,1 240,5 235,10 -10,9 -916,20 -1165,14z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M2226,1191c-3,-5 44,-11 107,-13 61,-2 118,-7 125,-11 9,-6 12,-101 12,-415 0,-373 5,-464 24,-417 3,9 6,198 6,419 0,347 -2,405 -16,424 -14,21 -23,22 -134,22 -65,0 -121,-4 -124,-9z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M3564,1035c-3,-8 10,-44 30,-79l36,-65 -57,-11c-141,-28 -345,-96 -428,-143 -34,-19 -40,-28 -43,-60 -3,-33 -6,-37 -32,-37 -16,0 -39,-4 -52,-9 -13,-5 -137,-90 -275,-189 -189,-135 -262,-182 -290,-186 -21,-3 -422,-8 -892,-12l-854,-7 -22,-25c-16,-19 -32,-26 -58,-26 -43,0-72,23 -89,71 -11,30 -15,33 -48,31 -28,-2 -37,1 -45,20 -9,20 -17,22 -82,22 -42,0 -73,-4 -73,-10 0,-6 26,-10 59,-10 52,0 61,-3 75,-25 12,-18 25,-25 50,-25 28,0 36,-5 46,-30 29,-71 120,-94 177,-46l29,24 839,6c462,4 858,9 880,12 57,8 92,30 349,217 187,136 236,167 263,167 38,0 38,0 18,-68 -9,-29 -13,-57 -10,-62 3,-6 30,-10 59,-10 65,0 113,28 139,82 26,54 10,69 -20,19 -27,-46 -67,-71 -114,-71 -28,0 -31,3 -25,23 4,12 12,55 19,96l12,73 58,30c76,38 214,83 347,114l104,23 23,-21c34,-31 29,-15 -27,89 -54,101 -55,100 32,82 85,-18 162,-65 234,-142 68,-74 92,-83 53,-21l-23,37 68,-7c37,-4 102,-18 146,-31 75,-24 170,-78 177,-101 7,-22 -250,-124 -311,-124 -16,0 -27,10 -37,33 -19,43 -71,69 -126,64 -55,-6 -91,-30 -110,-74l-15,-36 -156,7c-86,4 -176,10 -201,13 -35,5 -43,3 -39,-8 3,-8 26,-17 59,-21 77,-11 349,-24 358,-18 5,3 10,11 13,19 2,9 12,1 26,-22 24,-41 63,-57 88,-36 14,11 19,10 36,-11 12,-15 18,-36 16,-57 -1,-18 2,-34 7,-35 6,-2 11,18 13,43 2,37 -2,52 -21,74 -21,25 -22,32 -13,67 12,46 28,44 40,-5 12,-46 25,-47 152,-13 151,41 264,99 264,136 0,10 -16,32 -35,49 -76,67 -219,118 -355,128 -76,6 -88,10 -130,41 -56,43 -112,68 -186,81 -77,15 -94,14 -100,-4z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#b5d9f6"
+    android:pathData="M3900,668c-1,-26 -40,-98 -53,-98 -19,0 -44,30 -52,62 -5,19 -2,29 12,37 26,15 93,14 93,-1z" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M4310,951c-5,-11 -10,-28 -10,-38 0,-15 2,-14 16,5 8,12 19,22 24,22 33,0 53,-242 26,-333 -9,-31 -20,-57 -25,-57 -5,0 -15,10 -24,23 -20,30 -35,12 -16,-21 41,-74 108,7 117,143 5,80 -11,192 -35,243 -18,37 -56,44 -73,13z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M2571,944c38,-46 362,-274 389,-274 29,0 -22,40 -262,208 -113,79 -157,102 -127,66z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M976,671c-12,-18 32,-21 308,-21 286,0 380,5 370,21 -7,12 -671,12 -678,0z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M3775,486c-21,-32 -17,-54 16,-78 32,-24 61,-17 78,18 28,63 -57,117 -94,60zM3853,466c6,-15 -11,-36 -28,-36 -17,0 -34,21 -28,36 3,8 15,14 28,14 13,0 25,-6 28,-14z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M190,480c0,-6 48,-10 124,-10 73,0 127,4 131,10 4,6 -40,10 -124,10 -81,0 -131,-4 -131,-10z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M1008,481c-245,-3 -449,-9 -452,-12 -20,-19 1049,-19 1082,0 12,8 -2,10 -54,11 -39,0 -84,1 -100,3 -16,2 -230,1 -476,-2z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M97,333c-52,-6 -36,-23 21,-23 57,0 94,9 86,21 -5,9 -34,9 -107,2z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#545d79"
+    android:pathData="M806,155c-14,-36 -6,-92 15,-111 20,-18 47,-19 837,-17 695,2 818,5 830,17 11,11 13,28 8,70 -9,67 -26,65 -26,-3l0,-49 -792,-7c-436,-4 -804,-6 -818,-4 -22,4 -26,10 -31,57 -8,59 -13,71 -23,47z"
+    android:strokeColor="#00000000" />
+</vector>

app/src/main/res/drawable/ic_stack_exchange.xml

@@ -0,0 +1,18 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+  android:width="32dp"
+  android:height="32dp"
+  android:viewportHeight="120"
+  android:viewportWidth="120">
+  <path
+    android:fillColor="#376db6"
+    android:pathData="M22.4,57.5h74.8v15.4H22.4z" />
+  <path
+    android:fillColor="#4ca2da"
+    android:pathData="M22.4,37.6h74.8V53H22.4z" />
+  <path
+    android:fillColor="#91d8f4"
+    android:pathData="M85.5,17H34.4c-6.6,0 -12,5.5 -12,12.3v4h74.8v-4C97.2,22.5 92,17 85.5,17z" />
+  <path
+    android:fillColor="#1e5397"
+    android:pathData="M22.4,77.3v4c0,6.8 5.4,12.3 12,12.3h32v16.3l15.8,-16.3h3.5c6.6,0 12,-5.5 12,-12.3v-4H22.4z" />
+</vector>

app/src/main/res/drawable/ic_ted.xml

@@ -0,0 +1,18 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+  android:width="64dp"
+  android:height="23dp"
+  android:viewportHeight="5870"
+  android:viewportWidth="16000">
+  <path
+    android:fillColor="#e62b1e"
+    android:pathData="M2140,3620l0,-1980 -740,0 -740,0 0,-685 0,-685 2305,0 2305,0 0,685 0,685 -740,0 -740,0 0,1980 0,1980 -825,0 -825,0 0,-1980z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#e62b1e"
+    android:pathData="M5510,2935l0,-2665 2245,0 2245,0 0,685 0,685 -1420,0 -1420,0 0,320 0,320 1420,0 1420,0 0,645 0,645 -1420,0 -1420,0 0,330 0,330 1420,0 1420,0 0,685 0,685 -2245,0 -2245,0 0,-2665z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#e62b1e"
+    android:pathData="M10250,2935l0,-2666 1493,4c1086,3 1512,7 1567,16 41,6 107,16 145,23 214,34 453,107 635,196 67,32 230,124 255,144 6,5 42,32 80,60 138,102 281,245 383,383 28,39 56,75 60,81 5,5 15,21 22,35 7,13 16,26 19,29 3,3 12,15 19,27 6,13 18,33 25,45 6,13 14,25 17,28 14,12 126,251 155,330 9,25 20,54 25,65 22,56 81,256 93,315 2,14 12,61 21,105 28,140 34,178 45,275 26,231 31,313 31,497 0,679 -148,1240 -441,1673 -96,141 -127,179 -249,300 -120,121 -158,153 -301,250 -124,84 -293,174 -436,231 -13,5 -33,13 -45,19 -130,55 -444,132 -653,159 -44,6 -116,16 -160,22 -55,8 -504,13 -1442,16l-1363,5 0,-2667zM12731,4215c331,-47 557,-174 722,-407 80,-113 159,-302 192,-461 30,-147 37,-219 38,-407 1,-250 -22,-389 -95,-575 -31,-78 -41,-98 -89,-180 -121,-209 -336,-374 -589,-453 -198,-62 -292,-72 -686,-72l-337,0 6,647c4,355 7,934 7,1285l0,638 363,0c267,0 391,-4 468,-15z"
+    android:strokeColor="#00000000" />
+</vector>

app/src/main/res/drawable/ic_wikivoyage.xml

@@ -0,0 +1,18 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+  android:width="40dp"
+  android:height="40dp"
+  android:viewportHeight="16000"
+  android:viewportWidth="16000">
+  <path
+    android:fillColor="#990000"
+    android:pathData="M12440,6711c-5,-11 -10,-27 -10,-35 0,-21 -116,-369 -141,-423 -10,-24 -19,-46 -19,-50 -1,-5 -9,-26 -20,-48 -11,-22 -19,-44 -20,-49 0,-12 -202,-415 -235,-471 -14,-22 -35,-57 -47,-79 -98,-167 -276,-414 -432,-601 -65,-78 -433,-446 -511,-511 -141,-117 -271,-215 -430,-322 -110,-74 -115,-77 -171,-110 -22,-12 -57,-34 -79,-47 -49,-31 -441,-224 -510,-252 -109,-44 -152,-61 -205,-80 -30,-11 -71,-25 -90,-32 -42,-16 -149,-48 -205,-63 -66,-17 -85,-27 -85,-43 0,-10 1051,-540 3225,-1627 2542,-1272 3227,-1610 3237,-1600 9,9 -329,694 -1601,3237 -997,1995 -1618,3225 -1626,3225 -8,0 -19,-9 -25,-19z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#006699"
+    android:pathData="M6174,8322c-56,-37 -108,-71 -116,-77 -8,-5 -35,-23 -59,-40 -24,-16 -51,-34 -61,-40 -9,-5 -37,-25 -63,-42 -25,-18 -48,-33 -50,-33 -2,0 -25,-15 -50,-32 -26,-18 -54,-37 -64,-43 -19,-12 -117,-77 -536,-354 -170,-113 -314,-208 -320,-211 -5,-3 -30,-18 -54,-35 -24,-16 -51,-34 -60,-40 -9,-5 -104,-68 -211,-139 -107,-71 -280,-186 -385,-255 -104,-69 -197,-130 -207,-136 -9,-5 -37,-25 -63,-42 -25,-18 -48,-33 -51,-33 -3,0 -29,-18 -59,-40 -30,-22 -56,-40 -59,-40 -4,0 -115,-73 -631,-416 -115,-76 -214,-141 -220,-144 -5,-3 -30,-18 -54,-35 -24,-16 -51,-34 -60,-40 -17,-10 -234,-154 -656,-434 -137,-91 -257,-170 -266,-176 -10,-5 -38,-25 -64,-42 -25,-18 -48,-33 -51,-33 -3,0 -29,-18 -59,-40 -30,-22 -56,-40 -59,-40 -4,0 -115,-73 -631,-416 -115,-76 -214,-141 -220,-144 -5,-3 -30,-18 -54,-35 -24,-16 -51,-35 -60,-40 -9,-6 -89,-59 -179,-118 -151,-100 -184,-128 -169,-144 7,-6 343,-30 902,-63 592,-35 1000,-60 1335,-80 366,-22 829,-50 1340,-80 190,-11 487,-29 660,-40 173,-11 470,-29 660,-40 1142,-68 1637,-98 1983,-120 169,-12 312,-18 318,-14 19,11 5,31 -102,145 -158,169 -311,362 -447,564 -74,110 -77,116 -110,171 -12,22 -32,55 -44,74 -39,65 -98,174 -139,260 -23,47 -52,108 -66,135 -14,28 -31,66 -38,85 -7,19 -36,92 -64,163 -28,70 -51,131 -51,136 0,4 -8,30 -19,57 -71,186 -147,502 -196,814 -20,130 -44,474 -44,635 0,332 46,729 120,1030 23,92 28,156 14,161 -5,2 -55,-27 -111,-64z"
+    android:strokeColor="#00000000" />
+  <path
+    android:fillColor="#339966"
+    android:pathData="M11519,15668c-10,-19 -75,-120 -245,-377 -42,-63 -55,-83 -91,-135 -18,-26 -33,-48 -33,-50 0,-2 -76,-118 -168,-257 -164,-247 -216,-326 -237,-361 -5,-9 -41,-63 -80,-119 -38,-56 -72,-107 -75,-113 -3,-6 -36,-58 -75,-115 -38,-57 -75,-111 -80,-120 -6,-9 -32,-50 -60,-91 -27,-41 -124,-190 -217,-330 -92,-140 -177,-268 -188,-285 -18,-25 -63,-93 -135,-203 -40,-61 -379,-574 -426,-645 -33,-48 -59,-90 -59,-93 0,-3 -18,-29 -40,-59 -22,-30 -40,-58 -40,-63 0,-5 -9,-17 -20,-27 -11,-10 -20,-21 -20,-26 0,-4 -42,-69 -92,-144 -51,-75 -97,-144 -103,-153 -5,-10 -62,-96 -126,-192 -64,-96 -160,-242 -214,-325 -54,-82 -123,-187 -154,-233 -31,-46 -61,-92 -67,-103 -6,-10 -18,-27 -27,-37 -10,-10 -17,-21 -17,-24 0,-4 -71,-114 -158,-245 -323,-486 -397,-598 -402,-608 -3,-6 -36,-57 -75,-114 -38,-57 -75,-111 -80,-120 -6,-9 -41,-63 -78,-120 -66,-100 -79,-142 -39,-126 9,3 39,11 65,16 27,5 52,11 56,14 5,2 75,18 157,34 649,126 1289,116 1919,-31 146,-34 442,-122 535,-159 25,-9 76,-30 115,-44 76,-30 94,-38 210,-90 83,-38 116,-54 150,-72 11,-6 40,-21 65,-34 78,-41 136,-73 206,-114 37,-22 79,-47 93,-55 182,-107 483,-338 699,-539 79,-72 127,-110 133,-104 6,6 2,116 -10,304 -11,162 -29,447 -41,634 -44,755 -61,1035 -80,1345 -49,818 -61,1007 -80,1330 -11,190 -29,489 -40,665 -11,176 -29,475 -40,665 -40,672 -92,1534 -115,1920 -21,335 -23,350 -46,350 -10,0 -24,-10 -30,-22z"
+    android:strokeColor="#00000000" />
+</vector>

app/src/main/res/layout/activity_intro.xml

@@ -0,0 +1,36 @@
+<?xml version="1.0" encoding="utf-8"?>
+<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  xmlns:app="http://schemas.android.com/apk/res-auto"
+  xmlns:tools="http://schemas.android.com/tools"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent"
+  tools:context=".intro.IntroActivity">
+
+  <org.kiwix.kiwixmobile.intro.CustomViewPager
+    android:id="@+id/view_pager"
+    android:layout_width="match_parent"
+    android:layout_height="0dp"
+    app:layout_constraintBottom_toTopOf="@id/get_started"
+    app:layout_constraintTop_toTopOf="parent" />
+
+  <Button
+    android:id="@+id/get_started"
+    style="@style/WhiteButton"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginBottom="32dp"
+    android:text="@string/get_started"
+    android:textColor="@color/blue800"
+    app:layout_constraintBottom_toTopOf="@id/tab_indicator"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent" />
+
+  <com.pixelcan.inkpageindicator.InkPageIndicator
+    android:id="@+id/tab_indicator"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:layout_marginBottom="@dimen/activity_vertical_margin"
+    app:ipi_currentPageIndicatorColor="@color/blue800"
+    app:ipi_pageIndicatorColor="@color/blueTransparent"
+    app:layout_constraintBottom_toBottomOf="parent" />
+</android.support.constraint.ConstraintLayout>

app/src/main/res/layout/item_intro_1.xml

@@ -0,0 +1,51 @@
+<?xml version="1.0" encoding="utf-8"?>
+<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  xmlns:app="http://schemas.android.com/apk/res-auto"
+  android:id="@+id/root"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent"
+  android:padding="24dp">
+
+  <ImageView
+    android:layout_width="160dp"
+    android:layout_height="160dp"
+    android:contentDescription="@string/kiwi"
+    android:src="@drawable/kiwix_icon_with_title"
+    app:layout_constraintBottom_toTopOf="@id/heading"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    app:layout_constraintTop_toTopOf="parent" />
+
+  <TextView
+    android:id="@+id/heading"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginBottom="@dimen/activity_vertical_margin"
+    android:text="@string/welcome_to_the_family"
+    android:textAlignment="center"
+    android:textColor="@android:color/black"
+    android:textSize="24sp"
+    android:textStyle="bold"
+    app:layout_constraintBottom_toTopOf="@id/subheading"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent" />
+
+  <android.support.constraint.Guideline
+    android:id="@+id/guideline"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:orientation="horizontal"
+    app:layout_constraintGuide_end="56dp" />
+
+  <TextView
+    android:id="@+id/subheading"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:text="@string/human_kind_knowledge"
+    android:textAlignment="center"
+    android:textColor="@color/secondary_text"
+    android:textSize="15sp"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    app:layout_constraintTop_toBottomOf="@id/guideline" />
+</android.support.constraint.ConstraintLayout>

app/src/main/res/layout/item_intro_2.xml

@@ -0,0 +1,85 @@
+<?xml version="1.0" encoding="utf-8"?>
+<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  xmlns:app="http://schemas.android.com/apk/res-auto"
+  android:id="@+id/root"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent">
+
+  <ImageView
+    android:id="@+id/ic_stack_exchange"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:contentDescription="@string/stack_exchange"
+    app:layout_constraintCircle="@id/ic_wikipedia"
+    app:layout_constraintCircleAngle="235"
+    app:layout_constraintCircleRadius="56dp"
+    app:srcCompat="@drawable/ic_stack_exchange" />
+
+  <ImageView
+    android:id="@+id/ic_ted"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:contentDescription="@string/ted"
+    app:layout_constraintCircle="@id/ic_wikipedia"
+    app:layout_constraintCircleAngle="90"
+    app:layout_constraintCircleRadius="145dp"
+    app:srcCompat="@drawable/ic_ted" />
+
+  <ImageView
+    android:id="@+id/ic_wikivoyage"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:contentDescription="@string/wikivoyage"
+    app:layout_constraintCircle="@id/ic_wikipedia"
+    app:layout_constraintCircleAngle="45"
+    app:layout_constraintCircleRadius="92dp"
+    app:srcCompat="@drawable/ic_wikivoyage" />
+
+  <ImageView
+    android:id="@+id/ic_wikipedia"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:contentDescription="@string/wikipedia"
+    android:src="@drawable/ic_wikipedia"
+    app:layout_constraintBottom_toTopOf="@id/heading"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    app:layout_constraintTop_toTopOf="parent" />
+
+  <TextView
+    android:id="@+id/heading"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginBottom="@dimen/activity_vertical_margin"
+    android:text="@string/find_something_to_read"
+    android:textAlignment="center"
+    android:textColor="@android:color/black"
+    android:textSize="24sp"
+    android:textStyle="bold"
+    app:layout_constraintBottom_toTopOf="@id/subheading"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent" />
+
+  <android.support.constraint.Guideline
+    android:id="@+id/guideline"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:orientation="horizontal"
+    android:paddingEnd="24dp"
+    android:paddingStart="24dp"
+    app:layout_constraintGuide_end="80dp" />
+
+  <TextView
+    android:id="@+id/subheading"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:paddingEnd="24dp"
+    android:paddingStart="24dp"
+    android:text="@string/get_internet_content_message"
+    android:textAlignment="center"
+    android:textColor="@color/secondary_text"
+    android:textSize="15sp"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    app:layout_constraintTop_toBottomOf="@id/guideline" />
+</android.support.constraint.ConstraintLayout>

app/src/main/res/layout/item_intro_3.xml

@@ -0,0 +1,54 @@
+<?xml version="1.0" encoding="utf-8"?>
+<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+  xmlns:app="http://schemas.android.com/apk/res-auto"
+  android:id="@+id/root"
+  android:layout_width="match_parent"
+  android:layout_height="match_parent"
+  android:padding="24dp">
+
+  <ImageView
+    android:id="@+id/airplane"
+    android:layout_width="0dp"
+    android:layout_height="wrap_content"
+    android:alpha="1.0"
+    android:contentDescription="@string/save_books_offline"
+    android:visibility="invisible"
+    app:layout_constraintBottom_toTopOf="@id/heading"
+    app:layout_constraintEnd_toStartOf="parent"
+    app:layout_constraintTop_toTopOf="parent"
+    app:srcCompat="@drawable/ic_airplane" />
+
+  <TextView
+    android:id="@+id/heading"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginBottom="@dimen/activity_vertical_margin"
+    android:text="@string/save_books_offline"
+    android:textAlignment="center"
+    android:textColor="@android:color/black"
+    android:textSize="24sp"
+    android:textStyle="bold"
+    app:layout_constraintBottom_toTopOf="@id/subheading"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent" />
+
+  <android.support.constraint.Guideline
+    android:id="@+id/guideline"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:orientation="horizontal"
+    app:layout_constraintGuide_end="56dp" />
+
+  <TextView
+    android:id="@+id/subheading"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:text="@string/download_books_message"
+    android:textAlignment="center"
+    android:textColor="@color/secondary_text"
+    android:textSize="15sp"
+    app:layout_constraintEnd_toEndOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    app:layout_constraintTop_toBottomOf="@id/guideline" />
+
+</android.support.constraint.ConstraintLayout>

app/src/main/res/values/colors.xml

@@ -25,4 +25,6 @@
   <color name="back_to_top_text">@android:color/black</color>
   <color name="back_to_top_background_night">#FF000000</color>
   <color name="back_to_top_text_night">#FFFFFFFF</color>
+  <color name="blue800">#1565c0</color>
+  <color name="blueTransparent">#962e7ac4</color>
 </resources>

app/src/main/res/values/strings.xml

@@ -1,5 +1,6 @@
 <?xml version='1.0' encoding='UTF-8'?>
 <resources>
+  <string name="kiwi">Kiwi</string>
   <string name="menu_zim_manager">Get Content</string>
   <string name="menu_help">Help</string>
   <string name="menu_home">Home</string>
@@ -184,4 +185,15 @@
   <string name="shortcut_disabled_message">Shortcut not available</string>
   <string name="new_tab_shortcut_label">New tab</string>
   <string name="get_content_shortcut_label">Get content</string>
+  <string name="get_started">Get started</string>
+  <string name="human_kind_knowledge">Human kind\'s knowledge, on your phone.</string>
+  <string name="welcome_to_the_family">Welcome to the family</string>
+  <string name="get_internet_content_message">Wherever you go, get internet content without internet access.</string>
+  <string name="save_books_offline">Save books offline</string>
+  <string name="download_books_message">Download books and read wherever you are.</string>
+  <string name="find_something_to_read">Find something to read</string>
+  <string name="stack_exchange">Stack exchange</string>
+  <string name="ted">TED</string>
+  <string name="wikivoyage">Wikivoyage</string>
+  <string name="wikipedia">Wikipedia</string>
 </resources>

app/src/main/res/values/styles.xml

@@ -58,6 +58,7 @@
   <style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
     <item name="spinBars">true</item>
   </style>
+
   <style name="SearchViewStyle" parent="Widget.AppCompat.SearchView" />
 
   <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
@@ -82,6 +83,7 @@
     <item name="buttonBarNegativeButtonStyle">@style/NegativeButtonStyle</item>
     <item name="buttonBarPositiveButtonStyle">@style/PositiveButtonStyle</item>
   </style>
+
   <style name="NegativeButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
     <item name="android:textColor">@color/accent</item>
   </style>
@@ -89,5 +91,9 @@
   <style name="PositiveButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
     <item name="android:textColor">@color/accent</item>
   </style>
+
+  <style name="WhiteButton" parent="Base.TextAppearance.AppCompat.Button">
+    <item name="backgroundTint">@android:color/white</item>
+  </style>
 </resources>
 

build.gradle

@@ -14,13 +14,15 @@ buildscript {
 }
 
 ext {
-    supportLibraryVersion = '27.0.2'
+  supportLibraryVersion = '27.1.1'
     rxJavaVersion = '2.1.9'
     rxAndroidVersion = '2.0.2'
     okHttpVersion = '3.9.1'
     retrofitVersion = '2.3.0'
     javaxAnnotationVersion = '1.3.2'
     daggerVersion = '2.15'
+  inkPageIndicatorVersion = '1.3.0'
+  constraintLayoutVersion = '1.1.0'
 }
 
 allprojects {