Course info: info tab UI #406

ivan-magda · 2018-11-09T17:35:33Z

Задача: #APPS-2060

Описание:
Вкладка для страницы "о курсе", как в макете.

TODO:

Цвет иконок должен быть #535366
Проверить шрифты

Vertical spacing: - Between inner elements 20 - Between blocks 40

Stepic/CourseInfoTabInfoInstructorSkeletonView.swift

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoIntroVideoBlockView.swift

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoInstructorView.swift

kvld · 2018-11-14T15:29:57Z

Stepic/Modules/CourseInfoTab/View/CourseInfoTabInfoView.swift

+        }
+    }
+
+    private func getBlockIcon(_ block: CourseInfoTabInfoBlock) -> UIImage? {


Еще раз: смысла в существовании CourseInfoTabInfoBlock отдельно от CourseInfoTabInfoView мало. Почему бы не перенести CourseInfoTabInfoBlock в CourseInfoTabInfoView.Block и не сделать поля title и icon в енуме?
В любом случае, два метода которые возвращают два разных элемента кортежа – очень странно.

kvld · 2018-11-14T15:32:45Z

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoBlockView.swift

+    }
+}
+
+final class CourseInfoTabInfoBlockView: UIView {


Только сейчас наконец-то понял, что это на самом деле header у блоков. Давай назовем его соответствующим образом.

kvld · 2018-11-14T15:34:05Z

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoBlockView.swift

+        fatalError("init(coder:) has not been implemented")
+    }
+
+    func configure(viewModel: CourseInfoTabInfoBlockViewModelProtocol) {


Не нужно это здесь, и соответственно никаких протоколов тоже не нужно. Просто так же открываем поля icon: UIImage? и title: String? и на уровне выше (там где это шапка блока) их задаем.

kvld · 2018-11-14T15:35:19Z

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoInstructorsBlockView.swift

+    }
+
+    func configure(viewModel: CourseInfoTabInfoInstructorsBlockViewModel) {
+        self.headerView.configure(viewModel: viewModel)


В блоке с инструкторами иконка и тайтл фиксированные, нет необходимости их прокидывать откуда-то.

kvld · 2018-11-14T15:39:50Z

Stepic/Modules/CourseInfoTab/ViewModel/CourseInfoTabInfoViewModel.swift

+    let description: String
+}
+
+struct CourseInfoTabInfoInstructorsBlockViewModel: CourseInfoTabInfoBlockViewModelProtocol {


Здесь не нужны протоколы (см. обсуждение в configure) как и отдельные вьюмодели для блоков.

Rename CourseInfoTabInfoBlockSkeletonView.swift -> CourseInfoTabInfoHeaderSkeletonView.swift

Rename CourseInfoTabInfoHeaderSkeletonView.swift -> CourseInfoTabInfoHeaderBlockSkeletonView.swift

Rename CourseInfoTabInfoHeaderView.swift -> CourseInfoTabInfoHeaderBlockView.swift

kvld · 2018-11-27T12:06:05Z

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoInstructorView.swift

+            self.loadImage(url: self.avatarImageURL)
+        }
+    }
+
    private let appearance: Appearance

    private lazy var imageView: UIImageView = {


Кстати, у нас есть вьюшка CourseCoverImageView, которая может в плейсхолдеры и loadImage с Nuke. Давай ее реюзнем здесь тоже?

Да, хорошая идея. Может нам в будущем стоит сделать свою imageView c блэк джеком или переименовать CourseCoverImageView, как что-нибудь более обощенное.

Да, переименовать было бы неплохо, она теперь используется много где. Пока поживем с таким названием

kvld

Я сейчас быстро сам поправлю и вмерджу, но замечания все равно прочитай :)

kvld · 2018-11-27T12:12:59Z

Stepic/CourseInfoTabInfoHeaderBlockSkeletonView.swift

-final class CourseInfoTabInfoBlockSkeletonView: UIView {
-    let appearance: Appearance
+final class CourseInfoTabInfoHeaderBlockSkeletonView: UIView {
+    private let appearance: Appearance


На будущее: appearance необязательно делать приватным. Как минимум, это может понадобиться, если из родительской вьюшки захочется узнать какие-то параметры, связанные с геометрией.

kvld · 2018-11-27T12:14:36Z

Stepic/Modules/CourseInfoTab/View/Blocks/CourseInfoTabInfoTextBlockView.swift

    private let appearance: Appearance

-    private lazy var headerView = CourseInfoTabInfoBlockView()
+    lazy var headerView = CourseInfoTabInfoHeaderBlockView()


Только сейчас наконец-то понял, что это на самом деле header у блоков. Давай назовем его соответствующим образом.

Я про private

Вот из-за этого места https://github.com/StepicOrg/stepik-ios/pull/406/files#diff-c012f824e80b2efa946b50ccfcd50b8eR131

В PR с логикой переделано, https://github.com/StepicOrg/stepik-ios/pull/411/files#diff-417cd3690ed90cb5b10505f54d0bce66R150
Там можно будет сделать private

* Course info: info tab UI (#406) * Add image resources * Add course info localizable strings * Create course info text block view * Create course info instructors block view * Layout instructors * Better spacing * Update instructors description text color * Add intro tmp imageView * Round instructor avatar * Fix with spacing * Refactor rename course info type * Create CourseInfoSkeletonView file * Create new group CourseInfoTab * Create view and view model groups * Load avatar image * Remove image literal * Use constructors with no params * Create CourseInfoTabInfoViewDelegate * Change type of intro URL * Refactor extract configure with view model method * Create block views builder * Make intro video view * Refactor rename CourseInfoSkeletonView -> CourseInfoTabInfoSkeletonView * Remove unnecessary content insets * Tmp for skeleton * Add skeletons * Rearrange groups * Format code * Create view controller * Fix skeleton constraints * Simplify info block skeleton constraints * Fix course info block skeleton view setup * Refactor rename imageView -> iconImageView * Fix make concreate course info tab view lazy * Use configure(viewModel:) style * Remove viewModel from view's constructors * Refactor rename imageView -> previewImageView * Use main dark color * Remove JoinButton appearance struct * Refactor rename CourseInfoTabInfoBlockType -> CourseInfoTabInfoBlock * Use inner elements and blocks insets Vertical spacing: - Between inner elements 20 - Between blocks 40 * Update source files headers * Use stepik green color * Apply fixes for blocks * Fixes * Remove private(set) for lazy property * Refactor rename Rename CourseInfoTabInfoBlockSkeletonView.swift -> CourseInfoTabInfoHeaderSkeletonView.swift * Refactor rename Rename CourseInfoTabInfoHeaderSkeletonView.swift -> CourseInfoTabInfoHeaderBlockSkeletonView.swift * Refactor rename Rename CourseInfoTabInfoHeaderView.swift -> CourseInfoTabInfoHeaderBlockView.swift * Add author view with function * Use CourseCoverImageView as instructors avatar image view * Open appearance * Course info: container UI & header (#404) * Navigation bar * Navigation bar * Scroll view * blur * header * fix steps * fix extended edges * fix status bar * fix * fix color * fix scroll * Fix bounds * Minor fixes * Add .zero as default value to init * Minor fix * Course info: segmented control (#405) * segmented control view * Delegate * Course info: download button (#413) * Download button * Fix * Course info: modules UI (#415) * Navigation bar * Navigation bar * Scroll view * blur * header * fix steps * fix extended edges * fix status bar * fix * fix color * fix scroll * Fix bounds * Minor fixes * Add .zero as default value to init * Minor fix * Course info: segmented control (#405) * segmented control view * Delegate * Table header view (with strange behaviour) * Section header * Lesson * Minor fix * Minor fixes * Course info: info tab logic (#411) * Add image resources * Add course info localizable strings * Create course info text block view * Create course info instructors block view * Layout instructors * Better spacing * Update instructors description text color * Add intro tmp imageView * Round instructor avatar * Fix with spacing * Refactor rename course info type * Create CourseInfoSkeletonView file * Create new group CourseInfoTab * Create view and view model groups * Load avatar image * Remove image literal * Use constructors with no params * Create CourseInfoTabInfoViewDelegate * Change type of intro URL * Refactor extract configure with view model method * Create block views builder * Make intro video view * Refactor rename CourseInfoSkeletonView -> CourseInfoTabInfoSkeletonView * Remove unnecessary content insets * Tmp for skeleton * Add skeletons * Rearrange groups * Format code * Create view controller * Fix skeleton constraints * Simplify info block skeleton constraints * Fix course info block skeleton view setup * Refactor rename imageView -> iconImageView * Fix make concreate course info tab view lazy * Use configure(viewModel:) style * Remove viewModel from view's constructors * Refactor rename imageView -> previewImageView * Use main dark color * Remove JoinButton appearance struct * Refactor rename CourseInfoTabInfoBlockType -> CourseInfoTabInfoBlock * Use inner elements and blocks insets Vertical spacing: - Between inner elements 20 - Between blocks 40 * Update source files headers * Use stepik green color * Apply fixes for blocks * Fixes * Remove private(set) for lazy property * Refactor rename Rename CourseInfoTabInfoBlockSkeletonView.swift -> CourseInfoTabInfoHeaderSkeletonView.swift * Refactor rename Rename CourseInfoTabInfoHeaderSkeletonView.swift -> CourseInfoTabInfoHeaderBlockSkeletonView.swift * Refactor rename Rename CourseInfoTabInfoHeaderView.swift -> CourseInfoTabInfoHeaderBlockView.swift * Add author view with function * Make module * Show dummy info * Fetch instructors * Test course info header blocks resources * Add timeToComplete attribute to the Course entity * Pluralize time to complete * Add language attribute to the Course entity * Localize language * Add certificate details localizables * Add certificate threshold attributes to the Course entity * Format certificate details * Initial tests for CourseInfoTabInfoPresenter * Refactor rename * Use Nimble assertions * Use Quick * Set HTML text * Highlight author * Add authors attributes to the model * Show formatted author text * Trim text * Filter empty views * Handle course action Join course when not enrolled and continue learning from the last step when already enrolled. * Format certificate text * Update instructor's description label top offset when empty * Fix certificate titles * Set instructors description with HTML text * Optimize authors and instructors fetching * Provide intro video url and thumbnail * Handle click on thumbnail * Add thumbnail placeholer * Fix play view centering * Play intro video * Fix status bar on exit fullscreen * Use CourseCoverImageView as instructors avatar image view * Open appearance * Add fixes * Move CourseInfoTabInfoInputProtocol conformance to extension * Remove states from presenter * Refactor rename addAuthorView(author:) -> addAuthorView(authorName:) * Use actionButton prefix * Move hours from seconds formatting to FormatterHelper * Create CourseInfoTabInfoViewModelAdapter * Revert UIViewControllerBasedStatusBarAppearance change * Change status bar visibility * Update users fetching * Update instructor description top constraint * Move player to controller * Init player * Use weak self * Remove tests :( :( :( :( * Course info: container logic (#426) & syllabus (#438) * Merge UI * Correct intrinsic size for info tab * Segmented control & scrollview * Skeleton * Load course in container * Info tab * Video fixes * Fix instructors * 16:9 ratio for videos * Users service for provider * Fix status bar & header * Dynamic header height * Minor fixes * Fixes * NSLock -> DispatchSemaphore * Fix white background * Course info: syllabus content logic & downloads (#438) * module basic files * uipageviewcontroller instead of uiscrollview * syllabus * Downloading service * Routing to info/syllabus tab * show correct download state * handle download click * downloads 💩 * downloads interaction service * Fixes * remove unused * wrapped unit in view model * Sections deadlines * Layout fixes * Completion & failure events * Add enrolled state * Fix deep link & last step routers * Next & previous units service (#422) * NextLessonService * Fixes & tests * fixes * Present controller with lesson * Fixes for SDK 11 * Set build for current branch * Fix navigation bar issues * Personal deadlines * Fix after rename * Exam in syllabus * "More actions" alert & course sharing * Main action & drop course * Set version to 1.75 & increment build * Add tap proxy view for download buttons * Fix deadlines view * Next / previous lesson * Hide syllabus tab for adaptive courses * Personal deadlines tooltip * Make enabled-disabled visual state for cells * Remove "Downloads" from Settings * "Download all" logic * Fix new discussion layout (12 sdk) * Fix video quality (12 sdk) * Fix certificates layout (12 sdk) * Remove action button tab * Fix semaphore dispose crash * Update button state after remove * Set version to 1.76 & increment build * Fixed downloads * Force populate sections * Fix empty units download state error * Analytics & small fixes * Remove unused code * Fix iPad & landscape * Bump build * Fixes

ivan-magda added 29 commits November 2, 2018 16:43

Add image resources

20e25e5

Add course info localizable strings

3f45191

Create course info text block view

66a0614

Create course info instructors block view

6544a3a

Layout instructors

425ae2b

Better spacing

ab8351f

Update instructors description text color

dedfde7

Add intro tmp imageView

b118c4c

Round instructor avatar

3c875cb

Fix with spacing

f86fad4

Refactor rename course info type

4a0a952

Create CourseInfoSkeletonView file

d0d6102

Create new group CourseInfoTab

8251add

Create view and view model groups

0fc805d

Load avatar image

7169967

Remove image literal

cf8ab11

Use constructors with no params

87151af

Create CourseInfoTabInfoViewDelegate

4ad7299

Change type of intro URL

2e40a55

Refactor extract configure with view model method

d136489

Create block views builder

9feace0

Make intro video view

be4fcd1

Refactor rename CourseInfoSkeletonView -> CourseInfoTabInfoSkeletonView

2e66c40

Remove unnecessary content insets

a715c64

Tmp for skeleton

0852b65

Add skeletons

5dc5994

Rearrange groups

cfd588a

Format code

8860d06

Create view controller

f92cb49

ivan-magda added the main label Nov 9, 2018

ivan-magda added 6 commits November 13, 2018 17:17

Remove viewModel from view's constructors

30018f4

Refactor rename imageView -> previewImageView

618df9c

Use main dark color

d94ce35

Remove JoinButton appearance struct

2b7b3a7

Refactor rename CourseInfoTabInfoBlockType -> CourseInfoTabInfoBlock

4193d1e

Use inner elements and blocks insets

26cfd47

Vertical spacing: - Between inner elements 20 - Between blocks 40

ivan-magda changed the title ~~Course info: info tab~~ Course info: info tab UI Nov 14, 2018

ivan-magda added 2 commits November 14, 2018 11:53

Update source files headers

adfec40

Use stepik green color

f32ddd9

Ostrenkiy approved these changes Nov 14, 2018

View reviewed changes

Apply fixes for blocks

71fa449

kvld reviewed Nov 14, 2018

View reviewed changes

ivan-magda added 6 commits November 14, 2018 19:48

Fixes

e99b013

Remove private(set) for lazy property

b122586

Refactor rename

8421563

Rename CourseInfoTabInfoBlockSkeletonView.swift -> CourseInfoTabInfoHeaderSkeletonView.swift

Refactor rename

0ca6f22

Rename CourseInfoTabInfoHeaderSkeletonView.swift -> CourseInfoTabInfoHeaderBlockSkeletonView.swift

Refactor rename

2afb499

Rename CourseInfoTabInfoHeaderView.swift -> CourseInfoTabInfoHeaderBlockView.swift

Add author view with function

ce93fd1

kvld modified the milestones: 1.72, 1.73 Nov 15, 2018

kvld reviewed Nov 27, 2018

View reviewed changes

kvld suggested changes Nov 27, 2018

View reviewed changes

ivan-magda added 2 commits November 27, 2018 16:16

Use CourseCoverImageView as instructors avatar image view

24760f7

Open appearance

96547e2

kvld approved these changes Nov 28, 2018

View reviewed changes

ivan-magda merged commit 585d7a0 into feature/course-info Nov 29, 2018

ivan-magda deleted the feature/course-info-page branch November 29, 2018 08:25

kvld restored the feature/course-info-page branch December 6, 2018 13:44

kvld deleted the feature/course-info-page branch December 6, 2018 13:52

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Course info: info tab UI #406

Course info: info tab UI #406

ivan-magda commented Nov 9, 2018 •

edited

Loading

kvld Nov 14, 2018

kvld Nov 14, 2018

kvld Nov 14, 2018

kvld Nov 14, 2018

kvld Nov 14, 2018

kvld Nov 27, 2018

ivan-magda Nov 27, 2018

kvld Nov 27, 2018

kvld left a comment

kvld Nov 27, 2018

kvld Nov 27, 2018

ivan-magda Nov 27, 2018

kvld Nov 27, 2018

ivan-magda Nov 27, 2018

ivan-magda Nov 27, 2018

Course info: info tab UI #406

Course info: info tab UI #406

Conversation

ivan-magda commented Nov 9, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kvld left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ivan-magda commented Nov 9, 2018 •

edited

Loading