Demo, issues, converting views to class-style (#32)

* Demo, issues, converting views to class-style. #00000
Neovici · May 13, 2019 · a2724a0 · a2724a0
1 parent 7a0d2f9
commit a2724a0
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 51 deletions.
diff --git a/demo/issues/x-dialog-container.html b/demo/issues/x-dialog-container.html
@@ -22,29 +22,25 @@ <h2>Dialog Title</h2>
 		</cosmoz-dialog>
 	</template>
 	<script>
-
-(function () {
-	'use strict';
-
-	Polymer({
-
-		is: 'x-dialog-container',
-
-		properties: {
-			containerProp: {
-				type: String
-			},
-			dialogOutProp: {
-				type: String
-			},
-		},
-
-		openDialog() {
-			this.$.xDialog.open();
-		},
-
-	});
-
-})();
-
-</script>
+		/*global Polymer*/
+		class XDialogContainer extends Polymer.Element {
+			static get is() {
+				return 'x-dialog-container';
+			}
+			static get properties() {
+				return {
+					containerProp: {
+						type: String
+					},
+					dialogOutProp: {
+						type: String
+					}
+				};
+			}
+			openDialog() {
+				this.$.xDialog.open();
+			}
+		}
+		customElements.define(XDialogContainer.is, XDialogContainer);
+	</script>
+</dom-module>
diff --git a/demo/issues/x-dialog-content.html b/demo/issues/x-dialog-content.html
@@ -8,33 +8,30 @@
 		</div>
 	</template>
 	<script>
+		/*global Polymer*/
+		class XDialogContent extends Polymer.Element {
+			static get is() {
+				return 'x-dialog-content';
+			}
 
-(function () {
-	'use strict';
-
-	Polymer({
-
-		is: 'x-dialog-content',
-
-		properties: {
+			static get properties() {
+				return {
 
-			inProp: {
-				type: String,
-			},
+					inProp: {
+						type: String,
+					},
 
-			outProp: {
-				type: String,
-				notify: true,
-				computed: '_computeOutProp(inProp)'
+					outProp: {
+						type: String,
+						notify: true,
+						computed: '_computeOutProp(inProp)'
+					}
+				};
+			}
+			_computeOutProp(inProp) {
+				return '[x-dialog-content(' + inProp + ')]';
 			}
-		},
-
-		_computeOutProp(inProp) {
-			return '[x-dialog-content(' + inProp + ')]';
 		}
-
-	});
-
-})();
-
-</script>
+		customElements.define(XDialogContent.is, XDialogContent);
+	</script>
+</dom-module>