From 894558d8c8e788d4eedffda76f0c010e8ce22a53 Mon Sep 17 00:00:00 2001
From: christophe-g <christophe.geiser@e-smile.org>
Date: Sat, 11 Jun 2016 12:08:34 +0200
Subject: [PATCH 1/4] first go at readonly

---
 demo/index.html          | 15 ++++++++++++++
 paper-dropdown-menu.html | 45 ++++++++++++++++++++++++++++++----------
 2 files changed, 49 insertions(+), 11 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index 4bb258e..768aea7 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -91,6 +91,21 @@ <h4>You can pre-select a value using the <i>selected</i> attribute</h4>
       </template>
     </demo-snippet>
 
+    <h4>Or can allow multiple selection with <i>multi</i> attribute</h4>
+    <demo-snippet class="centered-demo">
+      <template>
+        <paper-dropdown-menu label="Dinosaurs">
+          <paper-listbox class="dropdown-content" multi selected="1">
+            <paper-item>allosaurus</paper-item>
+            <paper-item>brontosaurus</paper-item>
+            <paper-item>carcharodontosaurus</paper-item>
+            <paper-item>diplodocus</paper-item>
+          </paper-listbox>
+        </paper-dropdown-menu>
+
+      </template>
+    </demo-snippet>
+
     <h4>You can change the direction in which the menu opens</h4>
     <demo-snippet class="centered-demo">
       <template>
diff --git a/paper-dropdown-menu.html b/paper-dropdown-menu.html
index d3c5c67..238bf5d 100644
--- a/paper-dropdown-menu.html
+++ b/paper-dropdown-menu.html
@@ -91,7 +91,7 @@
       vertical-align="[[verticalAlign]]"
       horizontal-align="[[horizontalAlign]]"
       vertical-offset="[[_computeMenuVerticalOffset(noLabelFloat)]]"
-      disabled="[[disabled]]"
+      disabled="[[_checkDisabled(disabled, readonly)]]"
       no-animations="[[noAnimations]]"
       on-iron-select="_onIronSelect"
       on-iron-deselect="_onIronDeselect"
@@ -185,7 +185,7 @@
            * The error message to display when invalid.
            */
           errorMessage: {
-              type: String
+            type: String
           },
 
           /**
@@ -242,6 +242,15 @@
           verticalAlign: {
             type: String,
             value: 'top'
+          },
+
+          /**
+           * If you're using PaperInputBehavior to implement your own paper-input-like
+           * element, bind this to the `<input is="iron-input">`'s `readonly` property.
+           */
+          readonly: {
+            type: Boolean,
+            value: false
           }
         },
 
@@ -286,7 +295,9 @@
          * Show the dropdown content.
          */
         open: function() {
-          this.$.menuButton.open();
+          if (!this.readonly) {
+            this.$.menuButton.open();
+          }
         },
 
         /**
@@ -324,6 +335,16 @@
             this.open();
           }
         },
+        
+        /**
+         * Computed the disabled state for menu-button
+         *
+         * @param {disabled} 
+         * @param {readonly} 
+         */
+        _checkDisabled: function(disabled, readonly) {
+          return disabled || readonly;
+        },
 
         /**
          * Compute the label for the dropdown given a selected item.
@@ -332,15 +353,17 @@
          * optional `label` property.
          */
         _selectedItemChanged: function(selectedItem) {
-          var value = '';
-          if (!selectedItem) {
-            value = '';
-          } else {
-            value = selectedItem.label || selectedItem.textContent.trim();
+          if (!this.readonly) {
+            var value = '';
+            if (!selectedItem) {
+              value = '';
+            } else {
+              value = selectedItem.label || selectedItem.textContent.trim();
+            }
+
+            this._setValue(value);
+            this._setSelectedItemLabel(value);
           }
-
-          this._setValue(value);
-          this._setSelectedItemLabel(value);
         },
 
         /**

From 7775c0e61d2a274ffbaaa1a9e6aceb7ccb881ead Mon Sep 17 00:00:00 2001
From: christophe-g <christophe.geiser@e-smile.org>
Date: Sat, 11 Jun 2016 12:17:25 +0200
Subject: [PATCH 2/4] close menu when setting to readonly

---
 demo/index.html          | 17 +----------------
 paper-dropdown-menu.html |  9 ++++++++-
 2 files changed, 9 insertions(+), 17 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index 768aea7..dcff4df 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -91,22 +91,7 @@ <h4>You can pre-select a value using the <i>selected</i> attribute</h4>
       </template>
     </demo-snippet>
 
-    <h4>Or can allow multiple selection with <i>multi</i> attribute</h4>
-    <demo-snippet class="centered-demo">
-      <template>
-        <paper-dropdown-menu label="Dinosaurs">
-          <paper-listbox class="dropdown-content" multi selected="1">
-            <paper-item>allosaurus</paper-item>
-            <paper-item>brontosaurus</paper-item>
-            <paper-item>carcharodontosaurus</paper-item>
-            <paper-item>diplodocus</paper-item>
-          </paper-listbox>
-        </paper-dropdown-menu>
-
-      </template>
-    </demo-snippet>
-
-    <h4>You can change the direction in which the menu opens</h4>
+     <h4>You can change the direction in which the menu opens</h4>
     <demo-snippet class="centered-demo">
       <template>
         <paper-dropdown-menu label="Upwards and to the left!" vertical-align="bottom" horizontal-align="left">
diff --git a/paper-dropdown-menu.html b/paper-dropdown-menu.html
index 238bf5d..1e5cff0 100644
--- a/paper-dropdown-menu.html
+++ b/paper-dropdown-menu.html
@@ -250,7 +250,8 @@
            */
           readonly: {
             type: Boolean,
-            value: false
+            value: false,
+            observer: '_readonlyChanged'
           }
         },
 
@@ -398,6 +399,12 @@
           if (e) {
             e.setAttribute('aria-expanded', openState);
           }
+        },
+
+        _readonlyChanged: function(readonly) {
+          if (readonly) {
+            this.close();
+          }
         }
       });
     })();

From de05d31f1d09816b24174dbcb82c67ee8dd0c133 Mon Sep 17 00:00:00 2001
From: christophe-g <christophe.geiser@e-smile.org>
Date: Sat, 11 Jun 2016 12:32:30 +0200
Subject: [PATCH 3/4] allow _selectedItemChanged, otherwise the initial value
 is not set

---
 paper-dropdown-menu.html | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/paper-dropdown-menu.html b/paper-dropdown-menu.html
index 1e5cff0..219533c 100644
--- a/paper-dropdown-menu.html
+++ b/paper-dropdown-menu.html
@@ -354,17 +354,15 @@
          * optional `label` property.
          */
         _selectedItemChanged: function(selectedItem) {
-          if (!this.readonly) {
-            var value = '';
-            if (!selectedItem) {
-              value = '';
-            } else {
-              value = selectedItem.label || selectedItem.textContent.trim();
-            }
-
-            this._setValue(value);
-            this._setSelectedItemLabel(value);
+          var value = '';
+          if (!selectedItem) {
+            value = '';
+          } else {
+            value = selectedItem.label || selectedItem.textContent.trim();
           }
+
+          this._setValue(value);
+          this._setSelectedItemLabel(value);
         },
 
         /**

From 98b0a2167af9bd3e3e3fa75d78a9b6252083b34f Mon Sep 17 00:00:00 2001
From: christophe-g <christophe.geiser@e-smile.org>
Date: Wed, 13 Jul 2016 09:15:20 +0200
Subject: [PATCH 4/4] removed the default `false` value to allow observer not
 being called while instanciating the component - and improve performance

---
 paper-dropdown-menu.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/paper-dropdown-menu.html b/paper-dropdown-menu.html
index 219533c..db0cd42 100644
--- a/paper-dropdown-menu.html
+++ b/paper-dropdown-menu.html
@@ -250,7 +250,6 @@
            */
           readonly: {
             type: Boolean,
-            value: false,
             observer: '_readonlyChanged'
           }
         },