Fix #545: Low fi onboarding part 1

app/src/main/AndroidManifest.xml

@@ -4,7 +4,6 @@
 
   <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
   <uses-permission android:name="android.permission.INTERNET" />
-
   <!-- TODO(#56): Reenable landscape support. -->
   <application
     android:name=".application.OppiaApplication"
@@ -26,6 +25,10 @@
       android:name=".mydownloads.MyDownloadsActivity"
       android:screenOrientation="portrait"
       android:theme="@style/OppiaThemeWithoutActionBar" />
+    <activity
+      android:name=".onboarding.OnboardingActivity"
+      android:screenOrientation="portrait"
+      android:theme="@style/OppiaThemeWithoutActionBar" />
     <activity
       android:name=".player.exploration.ExplorationActivity"
       android:screenOrientation="portrait"
@@ -46,8 +49,8 @@
       android:theme="@style/OppiaThemeWithoutActionBar" />
     <activity
       android:name=".profile.ProfileActivity"
-      android:theme="@style/OppiaThemeWithoutActionBar"
-      android:screenOrientation="portrait" />
+      android:screenOrientation="portrait"
+      android:theme="@style/OppiaThemeWithoutActionBar" />
     <activity
       android:name=".settings.profile.ProfileEditActivity"
       android:screenOrientation="portrait" />
@@ -81,8 +84,10 @@
       android:name=".story.testing.StoryFragmentTestActivity"
       android:theme="@style/OppiaThemeWithoutActionBar" />
     <activity android:name=".testing.BindableAdapterTestActivity" />
+    <activity android:name=".testing.ConceptCardFragmentTestActivity" />
     <activity android:name=".testing.ContentCardTestActivity" />
     <activity android:name=".testing.ContinuePlayingFragmentTestActivity" />
+    <activity android:name=".testing.ExplorationInjectionActivity" />
     <activity android:name=".testing.ExplorationTestActivity" />
     <activity android:name=".testing.HtmlParserTestActivity" />
     <activity android:name=".testing.InputInteractionViewTestActivity" />
@@ -92,8 +97,6 @@
     <activity
       android:name=".testing.TopicTestActivityForStory"
       android:theme="@style/OppiaThemeWithoutActionBar" />
-    <activity android:name=".testing.ExplorationInjectionActivity" />
-    <activity android:name=".testing.ConceptCardFragmentTestActivity" />
     <activity
       android:name=".topic.questionplayer.QuestionPlayerActivity"
       android:screenOrientation="portrait" />

app/src/main/java/org/oppia/app/activity/ActivityComponent.kt

@@ -6,6 +6,7 @@ import dagger.Subcomponent
 import org.oppia.app.fragment.FragmentComponent
 import org.oppia.app.home.HomeActivity
 import org.oppia.app.home.continueplaying.ContinuePlayingActivity
+import org.oppia.app.onboarding.OnboardingActivity
 import org.oppia.app.mydownloads.MyDownloadsActivity
 import org.oppia.app.player.exploration.ExplorationActivity
 import org.oppia.app.profile.AddProfileActivity
@@ -62,6 +63,7 @@ interface ActivityComponent {
   fun inject(homeActivity: HomeActivity)
   fun inject(htmlParserTestActivity: HtmlParserTestActivity)
   fun inject(myDownloadsActivity: MyDownloadsActivity)
+  fun inject(onboardingActivity: OnboardingActivity)
   fun inject(pinPasswordActivity: PinPasswordActivity)
   fun inject(profileActivity: ProfileActivity)
   fun inject(questionPlayerActivity: QuestionPlayerActivity)

app/src/main/java/org/oppia/app/fragment/FragmentComponent.kt

@@ -5,6 +5,7 @@ import dagger.BindsInstance
 import dagger.Subcomponent
 import org.oppia.app.home.HomeFragment
 import org.oppia.app.home.continueplaying.ContinuePlayingFragment
+import org.oppia.app.onboarding.OnboardingFragment
 import org.oppia.app.mydownloads.DownloadsTabFragment
 import org.oppia.app.mydownloads.MyDownloadsFragment
 import org.oppia.app.mydownloads.UpdatesTabFragment
@@ -50,6 +51,7 @@ interface FragmentComponent {
   fun inject(explorationFragment: ExplorationFragment)
   fun inject(homeFragment: HomeFragment)
   fun inject(myDownloadsFragment: MyDownloadsFragment)
+  fun inject(onboardingFragment: OnboardingFragment)
   fun inject(profileChooserFragment: ProfileChooserFragment)
   fun inject(questionPlayerFragment: QuestionPlayerFragment)
   fun inject(resetPinDialogFragment: ResetPinDialogFragment)

app/src/main/java/org/oppia/app/onboarding/OnboadingSlideViewModel.kt

@@ -0,0 +1,48 @@
+package org.oppia.app.onboarding
+
+import android.content.Context
+import androidx.databinding.ObservableField
+import androidx.lifecycle.ViewModel
+import org.oppia.app.R
+import org.oppia.app.viewmodel.ObservableViewModel
+
+/** [ViewModel] for slide in onboarding flow. */
+class OnboardingSlideViewModel(val context: Context, val index: Int) : ObservableViewModel() {
+  val slideImage = ObservableField<Int>(R.drawable.ic_onboarding_0)
+  val title = ObservableField<String>(context.resources.getString(R.string.slide_0_title))
+  val description = ObservableField<String>(context.resources.getString(R.string.slide_0_description))
+
+  init {
+    slideChanged(index)
+  }
+
+  private fun slideChanged(index: Int) {
+    when (index) {
+      0 -> {
+        slideImage.set(R.drawable.ic_onboarding_0)
+        title.set(context.resources.getString(R.string.slide_0_title))
+        description.set(context.resources.getString(R.string.slide_0_description))
+      }
+      1 -> {
+        slideImage.set(R.drawable.ic_onboarding_1)
+        title.set(context.resources.getString(R.string.slide_1_title))
+        description.set(context.resources.getString(R.string.slide_1_description))
+      }
+      2 -> {
+        slideImage.set(R.drawable.ic_onboarding_2)
+        title.set(context.resources.getString(R.string.slide_2_title))
+        description.set(context.resources.getString(R.string.slide_2_description))
+      }
+      3 -> {
+        slideImage.set(R.drawable.ic_onboarding_3)
+        title.set(context.resources.getString(R.string.slide_3_title))
+        description.set(context.resources.getString(R.string.slide_3_description))
+      }
+      else -> {
+        slideImage.set(R.drawable.ic_onboarding_0)
+        title.set(context.resources.getString(R.string.slide_3_title))
+        description.set(context.resources.getString(R.string.slide_3_description))
+      }
+    }
+  }
+}

app/src/main/java/org/oppia/app/onboarding/OnboadingViewModel.kt

@@ -0,0 +1,15 @@
+package org.oppia.app.onboarding
+
+import androidx.databinding.ObservableField
+import androidx.lifecycle.ViewModel
+import org.oppia.app.viewmodel.ObservableViewModel
+import javax.inject.Inject
+
+/** [ViewModel] for [OnboardingFragment]. */
+class OnboardingViewModel @Inject constructor() : ObservableViewModel() {
+  val slideNumber = ObservableField<Int>(0)
+
+  fun slideChanged(index: Int) {
+    slideNumber.set(index)
+  }
+}

app/src/main/java/org/oppia/app/onboarding/OnboardingActivity.kt

@@ -0,0 +1,22 @@
+package org.oppia.app.onboarding
+
+import android.os.Bundle
+import org.oppia.app.activity.InjectableAppCompatActivity
+import org.oppia.app.profile.ProfileActivity
+import javax.inject.Inject
+
+/** Activity to contain the onbaording flow for learners. */
+class OnboardingActivity : InjectableAppCompatActivity(), RouteToProfileListener {
+  @Inject lateinit var onboardingActivityPresenter: OnboardingActivityPresenter
+
+  override fun onCreate(savedInstanceState: Bundle?) {
+    super.onCreate(savedInstanceState)
+    activityComponent.inject(this)
+    onboardingActivityPresenter.handleOnCreate()
+  }
+
+  override fun routeToProfile() {
+    startActivity(ProfileActivity.createProfileActivityIntent(this))
+    finish()
+  }
+}

app/src/main/java/org/oppia/app/onboarding/OnboardingActivityPresenter.kt

@@ -0,0 +1,24 @@
+package org.oppia.app.onboarding
+
+import androidx.appcompat.app.AppCompatActivity
+import org.oppia.app.R
+import org.oppia.app.activity.ActivityScope
+import javax.inject.Inject
+
+/** The presenter for [OnboardingActivity]. */
+@ActivityScope
+class OnboardingActivityPresenter @Inject constructor(private val activity: AppCompatActivity) {
+  fun handleOnCreate() {
+    activity.setContentView(R.layout.onboarding_activity)
+    if (getOnboardingFragment() == null) {
+      activity.supportFragmentManager.beginTransaction().add(
+        R.id.onboarding_fragment_placeholder,
+        OnboardingFragment()
+      ).commitNow()
+    }
+  }
+
+  private fun getOnboardingFragment(): OnboardingFragment? {
+    return activity.supportFragmentManager.findFragmentById(R.id.onboarding_fragment_placeholder) as OnboardingFragment?
+  }
+}

app/src/main/java/org/oppia/app/onboarding/OnboardingFragment.kt

@@ -0,0 +1,23 @@
+package org.oppia.app.onboarding
+
+import android.content.Context
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import org.oppia.app.fragment.InjectableFragment
+import javax.inject.Inject
+
+/** Fragment that contains an onboarding flow of the app. */
+class OnboardingFragment : InjectableFragment() {
+  @Inject lateinit var onboardingFragmentPresenter: OnboardingFragmentPresenter
+
+  override fun onAttach(context: Context) {
+    super.onAttach(context)
+    fragmentComponent.inject(this)
+  }
+
+  override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
+    return onboardingFragmentPresenter.handleCreateView(inflater, container)
+  }
+}

app/src/main/java/org/oppia/app/onboarding/OnboardingFragmentPresenter.kt

@@ -0,0 +1,68 @@
+package org.oppia.app.onboarding
+
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.appcompat.app.AppCompatActivity
+import androidx.fragment.app.Fragment
+import androidx.viewpager.widget.ViewPager
+import kotlinx.android.synthetic.main.onboarding_fragment.view.*
+import org.oppia.app.databinding.OnboardingFragmentBinding
+import org.oppia.app.fragment.FragmentScope
+import org.oppia.app.viewmodel.ViewModelProvider
+import javax.inject.Inject
+
+/** The presenter for [OnboardingFragment]. */
+@FragmentScope
+class OnboardingFragmentPresenter @Inject constructor(
+  activity: AppCompatActivity,
+  private val fragment: Fragment,
+  private val viewModelProvider: ViewModelProvider<OnboardingViewModel>
+) {
+  private lateinit var onboardingPagerAdapter: OnboardingPagerAdapter
+  private val routeToProfileListener = activity as RouteToProfileListener
+  private lateinit var binding: OnboardingFragmentBinding
+  private lateinit var slidesViewPager: ViewPager
+  fun handleCreateView(inflater: LayoutInflater, container: ViewGroup?): View? {
+    binding = OnboardingFragmentBinding.inflate(inflater, container, /* attachToRoot= */ false)
+    // NB: Both the view model and lifecycle owner must be set in order to correctly bind LiveData elements to
+    // data-bound view models.
+    binding.let {
+      it.lifecycleOwner = fragment
+      it.presenter = this
+      it.viewModel = getOnboardingViewModel()
+    }
+    slidesViewPager = binding.root.onboarding_slide_view_pager as ViewPager
+    setUpViewPager(slidesViewPager)
+    return binding.root
+  }
+
+  private fun setUpViewPager(viewPager: ViewPager) {
+    onboardingPagerAdapter = OnboardingPagerAdapter(fragment.requireContext())
+    viewPager.adapter = onboardingPagerAdapter
+    viewPager.addOnPageChangeListener(object : ViewPager.OnPageChangeListener {
+      override fun onPageScrollStateChanged(state: Int) {
+      }
+
+      override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) {
+      }
+
+      override fun onPageSelected(position: Int) {
+        getOnboardingViewModel().slideChanged(position)
+      }
+    })
+  }
+
+  fun clickOnGetStarted() {
+    routeToProfileListener.routeToProfile()
+  }
+
+  fun clickOnSkip() {
+    getOnboardingViewModel().slideChanged(3)
+    slidesViewPager.currentItem = 3
+  }
+
+  private fun getOnboardingViewModel(): OnboardingViewModel {
+    return viewModelProvider.getForFragment(fragment, OnboardingViewModel::class.java)
+  }
+}

app/src/main/java/org/oppia/app/onboarding/OnboardingPagerAdapter.kt

@@ -0,0 +1,32 @@
+package org.oppia.app.onboarding
+
+import android.content.Context
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.constraintlayout.widget.ConstraintLayout
+import androidx.viewpager.widget.PagerAdapter
+import org.oppia.app.databinding.OnboardingSlideBinding
+
+/** Adapter to control the slide details in onboarding flow. */
+class OnboardingPagerAdapter(val context: Context) : PagerAdapter() {
+  override fun instantiateItem(container: ViewGroup, position: Int): Any {
+    val binding = OnboardingSlideBinding.inflate(LayoutInflater.from(context), container, false)
+    val onboardingSlideViewModel = OnboardingSlideViewModel(context, position)
+    binding.viewModel = onboardingSlideViewModel
+    container.addView(binding.root)
+    return binding.root
+  }
+
+  override fun getCount(): Int {
+    return 4
+  }
+
+  override fun isViewFromObject(view: View, `object`: Any): Boolean {
+    return view == `object`
+  }
+
+  override fun destroyItem(container: ViewGroup, position: Int, `object`: Any) {
+    container.removeView(`object` as ConstraintLayout)
+  }
+}

app/src/main/java/org/oppia/app/onboarding/RouteToProfileListener.kt

@@ -0,0 +1,6 @@
+package org.oppia.app.onboarding
+
+/** Listener for when an activity should route to [ProfileActivity]. */
+interface RouteToProfileListener {
+  fun routeToProfile()
+}

app/src/main/java/org/oppia/app/profile/ProfileActivity.kt

@@ -1,5 +1,7 @@
 package org.oppia.app.profile
 
+import android.content.Context
+import android.content.Intent
 import android.os.Bundle
 import kotlinx.coroutines.ExperimentalCoroutinesApi
 import org.oppia.app.activity.InjectableAppCompatActivity
@@ -16,4 +18,11 @@ class ProfileActivity : InjectableAppCompatActivity() {
     activityComponent.inject(this)
     profileActivityPresenter.handleOnCreate()
   }
+
+  companion object {
+    /** Returns a new [Intent] to route to [ProfileActivity]. */
+    fun createProfileActivityIntent(context: Context): Intent {
+      return Intent(context, ProfileActivity::class.java)
+    }
+  }
 }

app/src/main/java/org/oppia/app/splash/SplashActivity.kt

@@ -5,6 +5,7 @@ import android.os.Bundle
 import android.view.WindowManager
 import androidx.appcompat.app.AppCompatActivity
 import org.oppia.app.R
+import org.oppia.app.onboarding.OnboardingActivity
 import org.oppia.app.profile.ProfileActivity
 
 /** An activity that shows a temporary loading page until the app is fully loaded then navigates to [ProfileActivity]. */
@@ -15,7 +16,7 @@ class SplashActivity : AppCompatActivity() {
     setContentView(R.layout.splash_activity)
 
     window.setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
-    val intent = Intent(this@SplashActivity, ProfileActivity::class.java)
+    val intent = Intent(this@SplashActivity, OnboardingActivity::class.java)
     startActivity(intent)
     finish()
   }