diff options
7 files changed, 134 insertions, 12 deletions
diff --git a/chrome/browser/media_router_resources.grdp b/chrome/browser/media_router_resources.grdp index a64467b..dfde42e 100644 --- a/chrome/browser/media_router_resources.grdp +++ b/chrome/browser/media_router_resources.grdp @@ -3,6 +3,7 @@ <!-- General --> <include name="IDR_MEDIA_ROUTER_DATA_JS" file="resources\media_router\media_router_data.js" type="BINDATA" /> <include name="IDR_MEDIA_ROUTER_HTML" file="resources\media_router\media_router.html" type="BINDATA" /> + <include name="IRD_MEDIA_ROUTER_COMMON_CSS" file="resources\media_router\media_router_common.css" type="BINDATA" /> <!-- Polymer --> <include name="IDR_CAST_MODE_PICKER_HTML" file="resources\media_router\elements\cast_mode_picker\cast_mode_picker.html" type="BINDATA" /> @@ -19,6 +20,9 @@ <include name="IDR_MEDIA_ROUTER_SINK_CSS" file="resources\media_router\elements\media_router_sink\media_router_sink.css" type="BINDATA" /> <include name="IDR_MEDIA_ROUTER_SINK_PICKER_HTML" file="resources\media_router\elements\media_router_sink_picker\media_router_sink_picker.html" type="BINDATA" /> <include name="IDR_MEDIA_ROUTER_SINK_PICKER_JS" file="resources\media_router\elements\media_router_sink_picker\media_router_sink_picker.js" type="BINDATA" /> + <include name="IDR_ROUTE_DETAILS_HTML" file="resources\media_router\elements\route_details\route_details.html" type="BINDATA" /> + <include name="IDR_ROUTE_DETAILS_CSS" file="resources\media_router\elements\route_details\route_details.css" type="BINDATA" /> + <include name="IDR_ROUTE_DETAILS_JS" file="resources\media_router\elements\route_details\route_details.js" type="BINDATA" /> <!-- Icons --> <include name="IDR_MEDIA_ROUTER_CHROMECAST_ICON" file="resources\media_router\elements\icon\chromecast-icon.png" type="BINDATA" /> diff --git a/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.css b/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.css index aa12ec1..d64aa79 100644 --- a/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.css +++ b/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.css @@ -2,18 +2,6 @@ * Use of this source code is governed by a BSD-style license that can be * found in the LICENSE file. */ -button { - border: 1px solid rgb(193, 193, 195); - color: rgb(44, 44, 44); - cursor: pointer; - font-size: 0.875em; - font-weight: bold; - height: 32px; - overflow: hidden; - text-align: center; - width: 100%; -} - .button-secondary { background: linear-gradient(to top, rgb(254, 254, 254), rgb(222, 222, 222)); } diff --git a/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.html b/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.html index 625137d..b85df39 100644 --- a/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.html +++ b/chrome/browser/resources/media_router/elements/issue_banner/issue_banner.html @@ -1,6 +1,7 @@ <link rel="import" href="chrome://resources/polymer/polymer/polymer.html"> <polymer-element name="issue-banner"> <template> + <link rel="stylesheet" href="../../media_router_common.css"> <link rel="stylesheet" href="issue_banner.css"> <template if="{{issue.isBlocking}}"> <div class="blocking-issue-header"> diff --git a/chrome/browser/resources/media_router/elements/route_details/route_details.css b/chrome/browser/resources/media_router/elements/route_details/route_details.css new file mode 100644 index 0000000..b80ef24 --- /dev/null +++ b/chrome/browser/resources/media_router/elements/route_details/route_details.css @@ -0,0 +1,43 @@ +/* Copyright 2015 The Chromium Authors. All rights reserved. + * Use of this source code is governed by a BSD-style license that can be + * found in the LICENSE file. */ + +#back-to-devices { + -webkit-padding-start: 10px; + color: rgb(20, 86, 218); + font-weight: bold; + line-height: 2em; +} + +#back-to-devices:hover { + cursor: pointer; + text-decoration: underline; +} + +button { + background: linear-gradient(to top, rgb(254, 254, 254), rgb(222, 222, 222)); +} + +.device-name { + font-weight: bold; +} + +hr { + margin: 0; +} + +.route { + -webkit-padding-start: 10px; + line-height: 1.125em; +} + +.route-status { + color: rgb(125, 125, 125); + margin: 8px 0; +} + +.route-title { + font-weight: bold; + margin: 8px 0; + overflow: hidden; +} 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 new file mode 100644 index 0000000..0541987 --- /dev/null +++ b/chrome/browser/resources/media_router/elements/route_details/route_details.html @@ -0,0 +1,28 @@ +<link rel="import" href="chrome://resources/polymer/polymer/polymer.html"> +<polymer-element name="route-details"> +<template> + <link rel="stylesheet" href="../../media_router_common.css"> + <link rel="stylesheet" href="route_details.css"> + <div> + <div id="back-to-devices" on-click="{{back}}"> + <span i18n-content="backToSinkPicker"></span> + </div> + <hr> + <div class="route"> + <div class="route-title"> + {{route.title}} + </div> + <div class="route-status"> + <span i18n-content="castingActivityStatus"></span> + <span class="device-name">{{sink.name}}</span> + </div> + </div> + </div> + <div> + <button class="button" on-click="{{closeRoute}}" + i18n-content="stopCastingButton"> + </button> + </div> +</template> +<script src="route_details.js"></script> +</polymer-element> diff --git a/chrome/browser/resources/media_router/elements/route_details/route_details.js b/chrome/browser/resources/media_router/elements/route_details/route_details.js new file mode 100644 index 0000000..5303208 --- /dev/null +++ b/chrome/browser/resources/media_router/elements/route_details/route_details.js @@ -0,0 +1,43 @@ +// Copyright 2015 The Chromium Authors. All rights reserved. +// Use of this source code is governed by a BSD-style license that can be +// found in the LICENSE file. + +// This Polymer element shows information from media that is currently cast +// to a device. It is assumed that the passed in route and sink correspond +// with each other. +Polymer('route-details', { + publish: { + /** + * The route to show. + * + * @attribute route + * @type {media_router.Route} + * @default null + */ + route: null, + + /** + * The sink to show. + * + * @attribute sink + * @type {media_router.Sink} + * @default null + */ + sink: null, + }, + + /** + * Fires a back-click event. This is called when the back link is clicked. + */ + back: function() { + this.fire('back-click'); + }, + + /** + * Fires a close-route-click event. This is called when the button to close + * the current route is clicked. + */ + closeRoute: function() { + this.fire('close-route-click', {route: this.route}); + }, +}); diff --git a/chrome/browser/resources/media_router/media_router_common.css b/chrome/browser/resources/media_router/media_router_common.css new file mode 100644 index 0000000..0059740 --- /dev/null +++ b/chrome/browser/resources/media_router/media_router_common.css @@ -0,0 +1,15 @@ +/* Copyright 2015 The Chromium Authors. All rights reserved. + * Use of this source code is governed by a BSD-style license that can be + * found in the LICENSE file. */ + +button { + border: 1px solid rgb(193, 193, 195); + color: rgb(44, 44, 44); + cursor: pointer; + font-size: 1em; + font-weight: bold; + height: 32px; + overflow: hidden; + text-align: center; + width: 100%; +} |