Non-Local Join for Media Router and Presentation API

chrome/browser/resources/media_router/elements/route_details/route_details.html

Index: chrome/browser/resources/media_router/elements/route_details/route_details.html
diff --git a/chrome/browser/resources/media_router/elements/route_details/route_details.html b/chrome/browser/resources/media_router/elements/route_details/route_details.html
index 33ab8e62524b00f67ab3d15e66038dfdfd61a18c..f028c99aa1bb885575b536fd38c8750b68e560f5 100644
--- a/chrome/browser/resources/media_router/elements/route_details/route_details.html
+++ b/chrome/browser/resources/media_router/elements/route_details/route_details.html
@@ -14,10 +14,17 @@
     <extensionview id="custom-controller"
         hidden$="[[isCustomControllerHidden_]]">
     </extensionview>
-    <paper-button raised id="close-route-button" class="button"
-        on-click="closeRoute_">
-      <span>[[stopCastingButtonText_]]</span>
-    </paper-button>
+    <div class="layout horizontal end-justified">
+      <paper-button raised class="flex self-stretch route-button button"
+          hidden$="[[!route.canJoin]]"

[imcheng, 2015/12/01 23:45:06]

instead of using hidden attribute, consider using conditional template:
https://www.polymer-project.org/1.0/docs/devguide/templates.html#dom-if

[matt.boetger, 2015/12/03 01:19:20]

I put this in, but the unit tests seemed to not properly re-render the html when
the route was changed - so I couldn't properly test it.  At least it is
consistent with the route-information tag using the hidden$ attribute.

+          on-click="joinRoute_">
+        <span>[[joinButtonText_]]</span>
+      </paper-button>
+      <paper-button raised class="flex self-stretch route-button button"
+          on-click="closeRoute_">
+        <span>[[stopCastingButtonText_]]</span>
+      </paper-button>
+    <div>
   </template>
 <script src="route_details.js"></script>
 </dom-module>