1 files changed, 125 insertions, 0 deletions
diff --git a/pharo-mooc/tiny-blog/src/TinyBlog-Components/TBAuthenticationComponent.class.st b/pharo-mooc/tiny-blog/src/TinyBlog-Components/TBAuthenticationComponent.class.st
new file mode 100644
index 0000000..b76cb6b
--- /dev/null
+++ b/pharo-mooc/tiny-blog/src/TinyBlog-Components/TBAuthenticationComponent.class.st
@@ -0,0 +1,125 @@
+Class {
+	#name : 'TBAuthenticationComponent',
+	#superclass : 'SBSComponent',
+	#instVars : [
+		'password',
+		'account',
+		'component'
+	],
+	#category : 'TinyBlog-Components',
+	#package : 'TinyBlog-Components'
+}
+
+{ #category : 'instance creation' }
+TBAuthenticationComponent class >> from: aComponent [
+	^ self new
+		component: aComponent;
+		yourself
+]
+
+{ #category : 'accessing' }
+TBAuthenticationComponent >> account [
+
+	^ account
+]
+
+{ #category : 'accessing' }
+TBAuthenticationComponent >> account: anObject [
+
+	account := anObject
+]
+
+{ #category : 'accessing' }
+TBAuthenticationComponent >> component [
+
+	^ component
+]
+
+{ #category : 'accessing' }
+TBAuthenticationComponent >> component: anObject [
+
+	component := anObject
+]
+
+{ #category : 'accessing' }
+TBAuthenticationComponent >> password [
+
+	^ password
+]
+
+{ #category : 'accessing' }
+TBAuthenticationComponent >> password: anObject [
+
+	password := anObject
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> renderAccountFieldOn: html [
+	html 
+		formGroup: [ html label with: 'Account'.
+			html textInput
+				formControl;
+				attributeAt: 'autofocus' put: 'true';
+				callback: [ :value | account := value ];
+				value: account ]
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> renderBodyOn: html [
+	html 
+		modalBody: [ 
+			html form: [ 
+				self renderAccountFieldOn: html.
+				self renderPasswordFieldOn: html.
+				html modalFooter: [ self renderButtonsOn: html ] ] ]
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> renderButtonsOn: html [
+	html formButton
+		beSecondary;
+		dataDismiss: 'modal';
+		value: 'Cancel'.
+	html formButton
+		"beSubmit;"
+		bePrimary;
+		callback: [ self validate ];
+		value: 'SignIn'
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> renderContentOn: html [
+	html modal 
+		id: 'myAuthDialog';
+		fade;
+		with: [ 
+			html modalDialog: [ 
+				html modalContent: [ 
+					self renderHeaderOn: html.
+					self renderBodyOn: html ] ] ]
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> renderHeaderOn: html [
+	html 
+		modalHeader: [ 
+			html modalCloseButton.
+			html modalTitle
+				level: 4;
+				with: 'Authentication' ]
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> renderPasswordFieldOn: html [
+	html 
+		formGroup: [ html label with: 'Password'.
+			html passwordInput
+				formControl;
+				callback: [ :value | password := value ];
+				value: password ]
+]
+
+{ #category : 'rendering' }
+TBAuthenticationComponent >> validate [
+	^ component tryConnectionWithLogin: self account andPassword: self password
+]