[Pharo] Personal fitness tracker web app.
MainNavigationBarComponent
Changed files
src/MyFitnessTracker/MFTMainNavbarComponent.class.st
@@ -1,91 +0,0 @@
1
Removed:
Class {
2
Removed:
#name : #MFTMainNavbarComponent,
3
Removed:
#superclass : #SBSComponent,
4
Removed:
#instVars : [
5
Removed:
'mainTabs',
6
Removed:
'activeTab'
7
Removed:
],
8
Removed:
#category : #'MyFitnessTracker-Components'
9
Removed:
}
10
Removed:
11
Removed:
{ #category : #hooks }
12
Removed:
MFTMainNavbarComponent >> children [
13
Removed:
14
Removed:
^ mainTabs
15
Removed:
]
16
Removed:
17
Removed:
{ #category : #initialization }
18
Removed:
MFTMainNavbarComponent >> initialize [
19
Removed:
20
Removed:
super initialize.
21
Removed:
mainTabs := {
22
Removed:
MFTWorkoutsListTab placeholder.
23
Removed:
MFTWeightsListTab new.
24
Removed:
MFTLearnTab new.
25
Removed:
MFTProfileTab new }.
26
Removed:
activeTab := mainTabs first
27
Removed:
]
28
Removed:
29
Removed:
{ #category : #rendering }
30
Removed:
MFTMainNavbarComponent >> renderContentOn: html [
31
Removed:
32
Removed:
| bar |
33
Removed:
bar := html navigationBar.
34
Removed:
bar
35
Removed:
beLight;
36
Removed:
expandLarge.
37
Removed:
bar background beLight.
38
Removed:
bar
39
Removed:
class: 'p-3 mb-3';
40
Removed:
with: [ self renderNavigationBarItemsOn: html ].
41
Removed:
html render: activeTab
42
Removed:
]
43
Removed:
44
Removed:
{ #category : #rendering }
45
Removed:
MFTMainNavbarComponent >> renderLoginOn: html [
46
Removed:
47
Removed:
^ MFTLoginAndRegisterComponent new renderContentOn: html
48
Removed:
]
49
Removed:
50
Removed:
{ #category : #rendering }
51
Removed:
MFTMainNavbarComponent >> renderNavigationBarItemsOn: html [
52
Removed:
53
Removed:
html navigationBarBrand: 'MyFitnessTracker'.
54
Removed:
"The toggler that is only visible when reducing the width of screen"
55
Removed:
html navigationBarToggler
56
Removed:
beButtonType;
57
Removed:
collapse;
58
Removed:
dataTarget: '#navbarCollapsed';
59
Removed:
with: [ html navigationBarTogglerIcon ].
60
Removed:
html navigationBarCollapse collapse
61
Removed:
id: 'navbarCollapsed';
62
Removed:
with: [
63
Removed:
html navigationBarNavigation: [
64
Removed:
mainTabs do: [ :tab | self renderTab: tab on: html ].
65
Removed:
html navigationItem dropdown with: [
66
Removed:
html navigationLink
67
Removed:
dropdownToggle;
68
Removed:
dataToggle: 'dropdown';
69
Removed:
with: 'Learn'.
70
Removed:
html dropdownMenu
71
Removed:
attributeAt: 'aria-labelledby' put: 'navbarDropdown';
72
Removed:
with: [
73
Removed:
html dropdownItem: 'Exercises'.
74
Removed:
html dropdownItem: 'Muscles'
75
Removed:
"html dropdownDivider.
76
Removed:
html dropdownItem: 'Something else here'" ] ] ].
77
Removed:
html div
78
Removed:
class: 'ms-auto';
79
Removed:
with: [ html render: MFTLoginAndRegisterComponent new ] ]
80
Removed:
]
81
Removed:
82
Removed:
{ #category : #rendering }
83
Removed:
MFTMainNavbarComponent >> renderTab: tab on: html [
84
Removed:
85
Removed:
html navigationItem
86
Removed:
beActiveIf: [ activeTab = tab ];
87
Removed:
with: [
88
Removed:
html navigationLink
89
Removed:
callback: [ activeTab := tab ];
90
Removed:
with: tab title ]
91
Removed:
]
src/MyFitnessTracker/MFTMainNavigationbarComponent.class.st
@@ -0,0 +1,93 @@
1
Added:
Class {
2
Added:
#name : #MFTMainNavigationbarComponent,
3
Added:
#superclass : #SBSComponent,
4
Added:
#instVars : [
5
Added:
'mainTabs',
6
Added:
'activeTab'
7
Added:
],
8
Added:
#category : #'MyFitnessTracker-Components'
9
Added:
}
10
Added:
11
Added:
{ #category : #hooks }
12
Added:
MFTMainNavigationbarComponent >> children [
13
Added:
14
Added:
^ mainTabs
15
Added:
]
16
Added:
17
Added:
{ #category : #initialization }
18
Added:
MFTMainNavigationbarComponent >> initialize [
19
Added:
20
Added:
super initialize.
21
Added:
mainTabs := {
22
Added:
(self session user
23
Added:
ifNil: [ MFTPublicHomepage new ]
24
Added:
ifNotNil: [ MFTUserHomepage new ]).
25
Added:
MFTWorkoutsListTab placeholder.
26
Added:
MFTWeightsListTab new.
27
Added:
MFTLearnTab new.
28
Added:
MFTProfileTab new }.
29
Added:
activeTab := mainTabs first
30
Added:
]
31
Added:
32
Added:
{ #category : #rendering }
33
Added:
MFTMainNavigationbarComponent >> renderContentOn: html [
34
Added:
35
Added:
html navigationBar
36
Added:
beLight;
37
Added:
lightBackground;
38
Added:
expandLarge;
39
Added:
marginBottom: 3;
40
Added:
paddingLeftAndRight: 3;
41
Added:
class: 'sticky-top';
42
Added:
with: [ self renderNavigationBarItemsOn: html ].
43
Added:
html render: activeTab
44
Added:
]
45
Added:
46
Added:
{ #category : #rendering }
47
Added:
MFTMainNavigationbarComponent >> renderLoginOn: html [
48
Added:
49
Added:
^ MFTLoginAndRegisterComponent new renderContentOn: html
50
Added:
]
51
Added:
52
Added:
{ #category : #rendering }
53
Added:
MFTMainNavigationbarComponent >> renderNavigationBarItemsOn: html [
54
Added:
55
Added:
html navigationBarBrand: 'MyFitnessTracker'.
56
Added:
"The toggler that is only visible when reducing the width of screen"
57
Added:
html navigationBarToggler
58
Added:
beButtonType;
59
Added:
collapse;
60
Added:
dataTarget: '#navbarCollapsed';
61
Added:
with: [ html navigationBarTogglerIcon ].
62
Added:
html navigationBarCollapse collapse
63
Added:
id: 'navbarCollapsed';
64
Added:
with: [
65
Added:
html navigationBarNavigation: [
66
Added:
mainTabs do: [ :tab | self renderTab: tab on: html ].
67
Added:
html navigationItem dropdown with: [
68
Added:
html navigationLink
69
Added:
dropdownToggle;
70
Added:
dataToggle: 'dropdown';
71
Added:
with: 'Learn'.
72
Added:
html dropdownMenu
73
Added:
attributeAt: 'aria-labelledby' put: 'navbarDropdown';
74
Added:
with: [
75
Added:
html dropdownItem: 'Exercises'.
76
Added:
html dropdownItem: 'Muscles'
77
Added:
"html dropdownDivider.
78
Added:
html dropdownItem: 'Something else here'" ] ] ].
79
Added:
html div
80
Added:
class: 'ms-auto';
81
Added:
with: [ html render: MFTLoginAndRegisterComponent new ] ]
82
Added:
]
83
Added:
84
Added:
{ #category : #rendering }
85
Added:
MFTMainNavigationbarComponent >> renderTab: tab on: html [
86
Added:
87
Added:
html navigationItem
88
Added:
beActiveIf: [ activeTab = tab ];
89
Added:
with: [
90
Added:
html navigationLink
91
Added:
callback: [ activeTab := tab ];
92
Added:
with: tab title asCapitalizedPhrase ]
93
Added:
]