From 2980d4f2c5e65a035f9f80044eed4dafc10cd177 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Oskar=20Wr=C3=B3bel?= <kontakt@oskarwrobel.pl>
Date: Thu, 6 Jul 2017 12:36:16 +0200
Subject: [PATCH 1/3] Added TextInputView#isReadOnly state.

---
 src/inputtext/inputtextview.js   | 11 ++++++++++-
 tests/inputtext/inputtextview.js | 10 ++++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/inputtext/inputtextview.js b/src/inputtext/inputtextview.js
index 9a5db88b..8107ad48 100644
--- a/src/inputtext/inputtextview.js
+++ b/src/inputtext/inputtextview.js
@@ -46,6 +46,14 @@ export default class InputTextView extends View {
 		 */
 		this.set( 'placeholder' );
 
+		/**
+		 * Controls whether the input view is in read-only mode.
+		 *
+		 * @observable
+		 * @member {Boolean} #isReadOnly
+		 */
+		this.set( 'isReadOnly', false );
+
 		const bind = this.bindTemplate;
 
 		this.template = new Template( {
@@ -57,7 +65,8 @@ export default class InputTextView extends View {
 					'ck-input-text'
 				],
 				id: bind.to( 'id' ),
-				placeholder: bind.to( 'placeholder' )
+				placeholder: bind.to( 'placeholder' ),
+				readonly: bind.to( 'isReadOnly' )
 			}
 		} );
 
diff --git a/tests/inputtext/inputtextview.js b/tests/inputtext/inputtextview.js
index d5cb1e75..3a988699 100644
--- a/tests/inputtext/inputtextview.js
+++ b/tests/inputtext/inputtextview.js
@@ -66,6 +66,16 @@ describe( 'InputTextView', () => {
 				expect( view.element.placeholder ).to.equal( 'baz' );
 			} );
 		} );
+
+		describe( 'isReadOnly', () => {
+			it( 'should react on view#isReadOnly', () => {
+				expect( view.element.readOnly ).to.false;
+
+				view.isReadOnly = true;
+
+				expect( view.element.readOnly ).to.true;
+			} );
+		} );
 	} );
 
 	describe( 'select()', () => {

From fceba0edeb90bbc971490a4e018ba90ed37480ae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Oskar=20Wr=C3=B3bel?= <kontakt@oskarwrobel.pl>
Date: Tue, 11 Jul 2017 08:28:23 +0200
Subject: [PATCH 2/3] Added isReadOnly state to the LabeledInputView.

---
 src/labeledinput/labeledinputview.js   |  9 +++++++++
 tests/labeledinput/labeledinputview.js | 10 ++++++++++
 2 files changed, 19 insertions(+)

diff --git a/src/labeledinput/labeledinputview.js b/src/labeledinput/labeledinputview.js
index 406a85b7..6cdc3190 100644
--- a/src/labeledinput/labeledinputview.js
+++ b/src/labeledinput/labeledinputview.js
@@ -46,6 +46,14 @@ export default class LabeledInputView extends View {
 		 */
 		this.set( 'value' );
 
+		/**
+		 * Controls whether the component is in read-only mode.
+		 *
+		 * @observable
+		 * @member {Boolean} #isReadOnly
+		 */
+		this.set( 'isReadOnly', false );
+
 		/**
 		 * The label view.
 		 *
@@ -99,6 +107,7 @@ export default class LabeledInputView extends View {
 
 		inputView.id = id;
 		inputView.bind( 'value' ).to( this );
+		inputView.bind( 'isReadOnly' ).to( this );
 
 		return inputView;
 	}
diff --git a/tests/labeledinput/labeledinputview.js b/tests/labeledinput/labeledinputview.js
index b063a6ad..0172b3a5 100644
--- a/tests/labeledinput/labeledinputview.js
+++ b/tests/labeledinput/labeledinputview.js
@@ -58,6 +58,16 @@ describe( 'LabeledInputView', () => {
 
 			expect( view.inputView.value ).to.equal( 'Lorem ipsum' );
 		} );
+
+		it( 'should bind view#isreadOnly to view.inputView#isReadOnly', () => {
+			view.isReadOnly = false;
+
+			expect( view.inputView.isReadOnly ).to.false;
+
+			view.isReadOnly = true;
+
+			expect( view.inputView.isReadOnly ).to.true;
+		} );
 	} );
 
 	describe( 'select()', () => {

From 623ee76a59b79eb537bb6d714c79d2bca22329fc Mon Sep 17 00:00:00 2001
From: Aleksander Nowodzinski <a.nowodzinski@cksource.com>
Date: Thu, 13 Jul 2017 11:43:00 +0200
Subject: [PATCH 3/3] Bound LabeledInputView's class to #isReadOnly attribute.

---
 src/labeledinput/labeledinputview.js   |  8 +++++++-
 tests/labeledinput/labeledinputview.js | 12 ++++++++++++
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/src/labeledinput/labeledinputview.js b/src/labeledinput/labeledinputview.js
index 6cdc3190..382e72cc 100644
--- a/src/labeledinput/labeledinputview.js
+++ b/src/labeledinput/labeledinputview.js
@@ -68,9 +68,15 @@ export default class LabeledInputView extends View {
 		 */
 		this.inputView = this._createInputView( InputView, id );
 
+		const bind = this.bindTemplate;
+
 		this.template = new Template( {
 			tag: 'div',
-
+			attributes: {
+				class: [
+					bind.if( 'isReadOnly', 'ck-disabled' )
+				]
+			},
 			children: [
 				this.labelView,
 				this.inputView
diff --git a/tests/labeledinput/labeledinputview.js b/tests/labeledinput/labeledinputview.js
index 0172b3a5..3a4af2ae 100644
--- a/tests/labeledinput/labeledinputview.js
+++ b/tests/labeledinput/labeledinputview.js
@@ -44,6 +44,18 @@ describe( 'LabeledInputView', () => {
 		it( 'should have input view', () => {
 			expect( view.template.children.get( 1 ) ).to.equal( view.inputView );
 		} );
+
+		describe( 'DOM bindings', () => {
+			describe( 'class', () => {
+				it( 'should react on view#isReadOnly', () => {
+					view.isReadOnly = false;
+					expect( view.element.classList.contains( 'ck-disabled' ) ).to.be.false;
+
+					view.isReadOnly = true;
+					expect( view.element.classList.contains( 'ck-disabled' ) ).to.be.true;
+				} );
+			} );
+		} );
 	} );
 
 	describe( 'binding', () => {