Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(14)

Unified Diff: chrome/browser/resources/media_router/elements/media_router_container/media_router_container.html

Issue 1834573002: [Media Router WebUI] Handle header height changes. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/browser/resources/media_router/elements/media_router_container/media_router_container.html
diff --git a/chrome/browser/resources/media_router/elements/media_router_container/media_router_container.html b/chrome/browser/resources/media_router/elements/media_router_container/media_router_container.html
index 4a0cd6ccac92cc55dbe5f490b99a0524d7be724b..3f0b684f5bd880cf6b1caa514011da6244ce4114 100644
--- a/chrome/browser/resources/media_router/elements/media_router_container/media_router_container.html
+++ b/chrome/browser/resources/media_router/elements/media_router_container/media_router_container.html
@@ -60,144 +60,83 @@
tooltip="[[computeHeaderTooltip_(currentView_, headerTextTooltip)]]"
on-back-click="showSinkList_">
</media-router-header>
- <template is="dom-if" if="[[!computeCastModeListHidden_(currentView_)]]">
- <paper-menu id="cast-mode-list">
- <template is="dom-repeat" id="defaultCastModeList"
- items="[[computeDefaultCastModeList_(castModeList)]]">
- <paper-item on-click="onCastModeClick_">
- <iron-icon class="cast-mode-icon"
- icon="[[computeCastModeIcon_(item)]]">
- </iron-icon>
- <div><span>[[item.host]]</span></div>
- </paper-item>
- </template>
- <div id="share-screen-text"
- hidden$="[[computeShareScreenSubheadingHidden_(castModeList)]]">
- <span>[[shareYourScreenSubheadingText_]]</span>
- </div>
- <template is="dom-repeat" id="nonDefaultCastModeList"
- items="[[computeNonDefaultCastModeList_(castModeList)]]">
- <paper-item on-click="onCastModeClick_">
- <iron-icon class="cast-mode-icon"
- icon="[[computeCastModeIcon_(item)]]">
- </iron-icon>
- <div><span>[[item.description]]</span></div>
- </paper-item>
- </template>
- </paper-menu>
- </template>
- <template is="dom-if"
- if="[[!computeRouteDetailsHidden_(currentView_, issue)]]">
- <route-details id="route-details" route="[[currentRoute_]]"
- on-close-route-click="onCloseRouteClick_">
- </route-details>
- </template>
- <div id="sink-list-view"
- hidden$="[[computeSinkListViewHidden_(currentView_, issue)]]">
- <div id="device-missing"
- hidden$="[[computeDeviceMissingHidden_(sinksToShow_)]]">
- <paper-spinner id="searching-devices-spinner" active
- hidden$="[[computeSpinnerHidden_(justOpened_)]]">
- </paper-spinner>
- <a href="[[deviceMissingUrl]]" target="_blank"
- hidden$="[[!computeSpinnerHidden_(justOpened_)]]">
- [[deviceMissingText_]]
- </a>
- </div>
- <paper-menu id="sink-list"
- hidden$="[[computeSinkListHidden_(sinksToShow_, isUserSearching_)]]">
- <template is="dom-repeat" id="sinkList" items="[[sinksToShow_]]">
- <paper-item on-click="onSinkClick_">
- <div class="sink-content">
- <div>
- <iron-icon icon="[[computeSinkIcon_(item)]]"
- hidden$="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.id)]]"
- class$="[[computeSinkIconClass_(item.id, sinkToRouteMap_)]]">
- </iron-icon>
- <template is="dom-if"
- if="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.id)]]">
- <paper-spinner class="sink-icon" active>
- </paper-spinner>
- </template>
- </div>
- <div>
- <div class="sink-text">
- <span dir="auto" class="sink-name" title="[[item.name]]">
- [[item.name]]
- </span>
- <template is="dom-if"
- if="[[!computeSinkDomainHidden_(item)]]">
- <span class="sink-domain" title="[[item.domain]]">
- [[item.domain]]
- </span>
- </template>
- </div>
- <template is="dom-if"
- if="[[!computeSinkSubtextHidden_(item, sinkToRouteMap_)]]">
- <div class="sink-text sink-subtext">
- <span>[[computeSinkSubtext_(item, sinkToRouteMap_)]]</span>
- </div>
- </template>
- </div>
- </div>
- </paper-item>
- </template>
- </paper-menu>
- <div id="sink-search" class$="[[computeSinkSearchClass_(currentView_)]]">
- <div class="sink-content">
- <div>
- <paper-icon-button id="sink-search-icon" icon="search"
- on-click="searchButtonClick_">
- </paper-icon-button>
- </div>
- <div id="search-input-container">
- <paper-input id="sink-search-input" label="[[searchInputLabel_]]"
- no-label-float value="{{searchInputText_}}">
- </paper-input>
+ <div id="content">
+ <template is="dom-if" if="[[!computeCastModeListHidden_(currentView_)]]">
+ <paper-menu id="cast-mode-list">
+ <template is="dom-repeat" id="defaultCastModeList"
+ items="[[computeDefaultCastModeList_(castModeList)]]">
+ <paper-item on-click="onCastModeClick_">
+ <iron-icon class="cast-mode-icon"
+ icon="[[computeCastModeIcon_(item)]]">
+ </iron-icon>
+ <div><span>[[item.host]]</span></div>
+ </paper-item>
+ </template>
+ <div id="share-screen-text"
+ hidden$="[[computeShareScreenSubheadingHidden_(castModeList)]]">
+ <span>[[shareYourScreenSubheadingText_]]</span>
</div>
+ <template is="dom-repeat" id="nonDefaultCastModeList"
+ items="[[computeNonDefaultCastModeList_(castModeList)]]">
+ <paper-item on-click="onCastModeClick_">
+ <iron-icon class="cast-mode-icon"
+ icon="[[computeCastModeIcon_(item)]]">
+ </iron-icon>
+ <div><span>[[item.description]]</span></div>
+ </paper-item>
+ </template>
+ </paper-menu>
+ </template>
+ <template is="dom-if"
+ if="[[!computeRouteDetailsHidden_(currentView_, issue)]]">
+ <route-details id="route-details" route="[[currentRoute_]]"
+ on-close-route-click="onCloseRouteClick_">
+ </route-details>
+ </template>
+ <div id="sink-list-view"
+ hidden$="[[computeSinkListViewHidden_(currentView_, issue)]]">
+ <div id="device-missing"
+ hidden$="[[computeDeviceMissingHidden_(sinksToShow_)]]">
+ <paper-spinner id="searching-devices-spinner" active
+ hidden$="[[computeSpinnerHidden_(justOpened_)]]">
+ </paper-spinner>
+ <a href="[[deviceMissingUrl]]" target="_blank"
+ hidden$="[[!computeSpinnerHidden_(justOpened_)]]">
+ [[deviceMissingText_]]
+ </a>
</div>
- </div>
- <template is="dom-if" if="[[isUserSearching_]]">
- <div id="no-search-matches"
- hidden$="[[computeNoMatchesHidden_(searchResultsToShow_, isUserSearching_)]]">
- <span>[[searchNoMatchesText_]]</span>
- </div>
- <paper-menu id="search-results" selected="0"
- hidden$="[[computeSearchResultsHidden_(isUserSearching_, searchResultsToShow_)]]">
- <template is="dom-repeat" id="searchResults"
- items="[[searchResultsToShow_]]">
- <paper-item class="search-item" on-click="onSinkClick_">
+ <paper-menu id="sink-list"
+ hidden$="[[computeSinkListHidden_(sinksToShow_, isUserSearching_)]]">
+ <template is="dom-repeat" id="sinkList" items="[[sinksToShow_]]">
+ <paper-item on-click="onSinkClick_">
<div class="sink-content">
<div>
- <iron-icon icon="[[computeSinkIcon_(item.sinkItem)]]"
- hidden$="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.sinkItem.id)]]"
- class$="[[computeSinkIconClass_(item.sinkItem.id, sinkToRouteMap_)]]">
+ <iron-icon icon="[[computeSinkIcon_(item)]]"
+ hidden$="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.id)]]"
+ class$="[[computeSinkIconClass_(item.id, sinkToRouteMap_)]]">
</iron-icon>
<template is="dom-if"
- if="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.sinkItem.id)]]">
+ if="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.id)]]">
<paper-spinner class="sink-icon" active>
</paper-spinner>
</template>
</div>
<div>
<div class="sink-text">
- <media-router-search-highlighter class="sink-name"
- data="[[computeSinkMatchingText_(item)]]"
- title="[[item.sinkItem.name]]">
- </media-router-search-highlighter>
+ <span dir="auto" class="sink-name" title="[[item.name]]">
+ [[item.name]]
+ </span>
<template is="dom-if"
- if="[[!computeSinkDomainHidden_(item.sinkItem)]]">
- <span class="sink-domain" title="[[item.sinkItem.domain]]">
- [[item.sinkItem.domain]]
+ if="[[!computeSinkDomainHidden_(item)]]">
+ <span class="sink-domain" title="[[item.domain]]">
+ [[item.domain]]
</span>
</template>
</div>
<template is="dom-if"
- if="[[!computeSinkSubtextHidden_(item.sinkItem, sinkToRouteMap_)]]">
+ if="[[!computeSinkSubtextHidden_(item, sinkToRouteMap_)]]">
<div class="sink-text sink-subtext">
- <span>
- [[computeSinkSubtext_(item.sinkItem, sinkToRouteMap_)]]
- </span>
+ <span>[[computeSinkSubtext_(item, sinkToRouteMap_)]]</span>
</div>
</template>
</div>
@@ -205,15 +144,78 @@
</paper-item>
</template>
</paper-menu>
+ <div id="sink-search" class$="[[computeSinkSearchClass_(currentView_)]]">
+ <div class="sink-content">
+ <div>
+ <paper-icon-button id="sink-search-icon" icon="search"
+ on-click="searchButtonClick_">
+ </paper-icon-button>
+ </div>
+ <div id="search-input-container">
+ <paper-input id="sink-search-input" label="[[searchInputLabel_]]"
+ no-label-float value="{{searchInputText_}}">
+ </paper-input>
+ </div>
+ </div>
+ </div>
+ <template is="dom-if" if="[[isUserSearching_]]">
+ <div id="no-search-matches"
+ hidden$="[[computeNoMatchesHidden_(searchResultsToShow_, isUserSearching_)]]">
+ <span>[[searchNoMatchesText_]]</span>
+ </div>
+ <paper-menu id="search-results" selected="0"
+ hidden$="[[computeSearchResultsHidden_(isUserSearching_, searchResultsToShow_)]]">
+ <template is="dom-repeat" id="searchResults"
+ items="[[searchResultsToShow_]]">
+ <paper-item class="search-item" on-click="onSinkClick_">
+ <div class="sink-content">
+ <div>
+ <iron-icon icon="[[computeSinkIcon_(item.sinkItem)]]"
+ hidden$="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.sinkItem.id)]]"
+ class$="[[computeSinkIconClass_(item.sinkItem.id, sinkToRouteMap_)]]">
+ </iron-icon>
+ <template is="dom-if"
+ if="[[computeSinkIsLaunching_(currentLaunchingSinkId_, item.sinkItem.id)]]">
+ <paper-spinner class="sink-icon" active>
+ </paper-spinner>
+ </template>
+ </div>
+ <div>
+ <div class="sink-text">
+ <media-router-search-highlighter class="sink-name"
+ data="[[computeSinkMatchingText_(item)]]"
+ title="[[item.sinkItem.name]]">
+ </media-router-search-highlighter>
+ <template is="dom-if"
+ if="[[!computeSinkDomainHidden_(item.sinkItem)]]">
+ <span class="sink-domain" title="[[item.sinkItem.domain]]">
+ [[item.sinkItem.domain]]
+ </span>
+ </template>
+ </div>
+ <template is="dom-if"
+ if="[[!computeSinkSubtextHidden_(item.sinkItem, sinkToRouteMap_)]]">
+ <div class="sink-text sink-subtext">
+ <span>
+ [[computeSinkSubtext_(item.sinkItem, sinkToRouteMap_)]]
+ </span>
+ </div>
+ </template>
+ </div>
+ </div>
+ </paper-item>
+ </template>
+ </paper-menu>
+ </template>
+ </div>
+ <template is="dom-if"
+ if="[[computeIssueBannerShown_(currentView_, issue)]]">
+ <issue-banner id="issue-banner" issue="[[issue]]"
+ class$="[[computeIssueBannerClass_(issue)]]"
+ on-issue-action-click="showSinkList_">
+ </issue-banner>
</template>
</div>
- <template is="dom-if"
- if="[[computeIssueBannerShown_(currentView_, issue)]]">
- <issue-banner id="issue-banner" issue="[[issue]]"
- class$="[[computeIssueBannerClass_(issue)]]"
- on-issue-action-click="showSinkList_">
- </issue-banner>
- </template>
</template>
<script src="media_router_container.js"></script>
</dom-module>

Powered by Google App Engine
This is Rietveld 408576698