"samsung_featured_app.ts",
"samsung_featured_header.js",
"samsung_opentabs_app.js",
+ "samsung_bookmarks_app.js",
"samsung_watchlater_app.ts",
]
non_web_component_files = [
let featuredPageComponent = document.getElementsByTagName('SAMSUNG-FEATURED-APP');
let opentabsPageComponent = document.getElementsByTagName('SAMSUNG-OPENTABS-APP');
let watchLaterPageComponent = document.getElementsByTagName('SAMSUNG-WATCHLATER-APP');
+ let bookmarksPageComponent = document.getElementsByTagName('SAMSUNG-BOOKMARKS-APP');
if(loc == "featured" || loc == "")
{
featuredPageComponent[0].style.display = '';
watchLaterPageComponent[0].style.display = 'none';
opentabsPageComponent[0].style.display = 'none';
+ bookmarksPageComponent[0].style.display = 'none';
setSelectedTabs('buttonQuick');
}
else if(loc == "openedTabs")
featuredPageComponent[0].style.display = 'none';
watchLaterPageComponent[0].style.display = 'none';
opentabsPageComponent[0].style.display = '';
+ bookmarksPageComponent[0].style.display = 'none';
setSelectedTabs('buttonOpenedTabs');
}
+ else if(loc == "bookmarks")
+ {
+ featuredPageComponent[0].style.display = 'none';
+ opentabsPageComponent[0].style.display = 'none';
+ bookmarksPageComponent[0].style.display = '';
+ watchLaterPageComponent[0].style.display = 'none';
+ setSelectedTabs('buttonBookmarks');
+ }
else if(loc == "watchlater"){
featuredPageComponent[0].style.display = 'none';
opentabsPageComponent[0].style.display = 'none';
watchLaterPageComponent[0].style.display = '';
+ bookmarksPageComponent[0].style.display = 'none';
setSelectedTabs('buttonWatchLater');
}
--- /dev/null
+<style include="samsung-common samsung-opentabs-bookmarks shared-style cr-shared-style">
+ dialog [slot=body] {
+ white-space: pre-wrap;
+ }
+
+ .mostvisited.highContrast .button:hover {
+ background-image: url(chrome://resources/images/samsung/high_contrast/button_1_f.png) !important;
+ }
+
+ .mostvisited.highContrast .bookmarkGridItem:hover {
+ background-image: url(chrome://resources/images/samsung/high_contrast/bookmark_bg_f.png) !important;
+
+ img {
+ overflow: hidden !important;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
+
+ }
+ </style>
+
+ <div id="container" class="bookmark">
+ <div class="antiScrollWrapper">
+ <div id="bookmarkWrapper">
+ <div id="bookmarkButtons" class="bookmarksButtons">
+ <div id="" aria-label="Bookmark button" class="button removeAllButtons" tabindex="0" on-click = "onDeleteAllClicked_">
+ <div id="" on-click = "onDeleteAllClicked_" ></div>
+ <div id="" class="marquee buttonCaption" on-click = "onDeleteAllClicked_" style="text-overflow: ellipsis; direction: ltr;">Delete All</div>
+ </div>
+ </div>
+ <div id="watchingWatchLater" class="">Samsung Account shubham.garg@samsung.com</div>
+ <div id = 'thumbnailGrid' class = 'thumbnailGrid'>
+ <template is="dom-repeat" items="[[thumbnailOptions]]">
+ <div class="bookmarkGridItem" id="">
+ <div class="bookmarkItemThumbnail marquee_img">
+ <a class="bookmarkThumbnailLink" href="[[item.url]]" aria-label="[[item.title]]" type="{bookmarkType}" target="{source}">
+ <div class="bookmarkItemFavicon {bookmarkType}">
+ <div class="itemFaviconOpenTabs" >
+ <img src = "[[item.favicon_data]]" alt = " " on-error = "onErroInImageLoad_">
+ </div>
+ </div>
+ <div class="marquee bookmarkItemName description" aria-label="[[item.title]]">
+ [[item.title]]
+ </div>
+ </a>
+ <a>
+ <div class="itemEdit" aria-label="{removeDescAria} ' + lang.TV_SID_BUTTON + '" >
+ <div class="tooltipArrow"></div>
+ <div class="tooltipWrapper">
+ <div class="content description">
+ Edit
+ </div>
+ </div>
+ </div>
+ </a>
+ <a>
+ <div class="closeButton" id="[[item.device_id]]" aria-label="{removeDescAria} ' + lang.TV_SID_BUTTON + '" on-click="onDeleteOneClicked_">
+ <div class="tooltipArrow"></div>
+ <div class="tooltipWrapper">
+ <div class="content description">
+ Remove
+ </div>
+ </div>
+ </div>
+ </a>
+ </div>
+ </div>
+ </template>
+ </div>
+ </div>
+ </div>
+ <cr-lazy-render id="dialog">
+ <template>
+ <cr-dialog consume-keydown-event>
+ <div slot="title" id="title">Remove Selected</div>
+ <div slot="body" id="body">Are you sure you want to delete ?</div>
+ <div slot="button-container">
+ <cr-button class="cancel-button" on-click="onDialogCancelClick_">
+ Cancel
+ </cr-button>
+ <cr-button class="action-button" on-click="onDialogConfirmClick_">
+ Remove
+ </cr-button>
+ </div>
+ </cr-dialog>
+ </template>
+ </cr-lazy-render>
+ </div>
\ No newline at end of file
--- /dev/null
+import './samsung_common.css.js';
+import './samsung_opentabs_bookmarks.css.js';
+
+import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+import {getTemplate} from './samsung_bookmarks_app.html.js';
+import { SamsungDataServiceImpl } from './samsung_data_service.js';
+import {changeIsPopUpOpened} from 'chrome://resources/js/samsung/hybridnavigation.js';
+
+export class SBookmarksElement extends PolymerElement {
+ static get is() {
+ return 'samsung-bookmarks-app';
+ }
+
+ static get template() {
+ return getTemplate();
+ }
+
+ static get properties() {
+ return {
+ thumbnailOptions: {
+ type: Array,
+ },
+ };
+ }
+
+ thumbnailOptions = [] ;
+ grid ;
+ splices = [];
+
+ constructor () {
+ super();
+ this.deviceIdToBeRemoved="";
+ this.splices = [];
+ this.thumbnailOptions = [
+ {
+ "device_id" : '1',
+ "url": "https://www.google.com",
+ "title": "Google",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.google.com"
+ },
+ {
+ "device_id" : '2',
+ "url": "https://www.facebook.com",
+ "title": "Facebook",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.facebook.com"
+ },
+ {
+ "device_id" : '3',
+ "url": "https://www.yahoo.com",
+ "title": "Yahoo",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.yahoo.com"
+ },
+ {
+ "device_id" : '4',
+ "url": "https://www.youtube.com",
+ "title": "Youtube",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.youtube.com"
+ },
+ {
+ "device_id" : '5',
+ "url": "https://www.vimeo.com",
+ "title": "Vimeo",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://vimeo.com"
+ },
+ {
+ "device_id" : '6',
+ "url": "https://www.amazon.com",
+ "title": "Amazon",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.amazon.com"
+ },
+ {
+ "device_id" : '7',
+ "url": "https://www.msn.com",
+ "title": "MSN",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.msn.com"
+ },
+ {
+ "device_id" : '8',
+ "url": "https://edition.cnn.com/",
+ "title": "CNN",
+ "favicon_data": "hhttp://www.google.com/s2/favicons?domain=https://www.msnbc.com"
+ },
+ {
+ "device_id" : '9',
+ "url": "https://www.imdb.com/",
+ "title": "IMDB",
+ "favicon_data": "http://www.google.com/s2/favicons?domain=https://www.imdb.com"
+ }
+ ]
+
+ for (const item of this.thumbnailOptions) {
+ item.favicon_data = ("chrome://image/?"+item.favicon_data);
+ }
+
+ }
+
+ async connectedCallback() {
+ super.connectedCallback();
+ }
+
+ onDeleteAllClicked_(event){
+ console.log('onDeleteAllClicked_');
+ event.stopPropagation();
+ changeIsPopUpOpened("true");
+ this.$.dialog.get().showModal();
+ const diaglogButton = this.shadowRoot.querySelector('.action-button');
+ diaglogButton.focus();
+ console.log(this.thumbnailOptions);
+
+ let cancelButtonNode = document.querySelector('samsung-bookmarks-app')?.shadowRoot?.querySelector('.cancel-button');
+ if(cancelButtonNode && cancelButtonNode.style)
+ {
+ cancelButtonNode.style.marginRight = '10px';
+ }
+}
+
+onDialogConfirmClick_() {
+ console.log('onDialogConfirmClick_');
+ changeIsPopUpOpened("false");
+ const dialog = this.$.dialog.getIfExists();
+ const samsungDataService = SamsungDataServiceImpl.getInstance();
+ samsungDataService.removeDevice(this.deviceIdToBeRemoved);
+ this.thumbnailOptions = [];
+ dialog.close();
+}
+
+onDialogCancelClick_() {
+ console.log('onDialogCancelClick_');
+ changeIsPopUpOpened("false");
+ const dialog = this.$.dialog.getIfExists();
+ dialog.close();
+}
+
+ onErroInImageLoad_(event){
+ const img = event.target;
+ img.src = "chrome://resources/images/samsung/wb_logo_web_32.png";
+ }
+
+ onDeleteOneClicked_(event){
+ console.log('onDeleteOneClicked_');
+ this.deviceIdToBeRemoved = "";
+ event.stopPropagation();
+ const button = event.target;
+ const numberValue = button.getAttribute('id');
+ this.deviceIdToBeRemoved = numberValue;
+ console.log(this.deviceIdToBeRemoved);
+ this.splices = [];
+ let delIndex = [] ;
+ let removed = [];
+ this.thumbnailOptions.forEach((e,index)=>{
+ if(e.device_id == numberValue)
+ {
+ delIndex = e;
+ console.log(e);
+ removed = this.thumbnailOptions.splice(index,1);
+ }
+ });
+ this.splices.push(
+ {
+ index:delIndex,
+ removed: removed,
+ addedCount : 0,
+ object : this.thumbnailOptions,
+ type:'splice'
+ }
+ );
+ this.notifySplices('thumbnailOptions',this.splices);
+ }
+}
+
+window.customElements.define(SBookmarksElement.is, SBookmarksElement);
\ No newline at end of file
<samsung-featured-header > </samsung-featured-header>
<samsung-featured-app style ="display :none;"></samsung-featured-app>
<samsung-opentabs-app style="display: none;"></samsung-opentabs-app>
+ <samsung-bookmarks-app style="display: none;"></samsung-bookmarks-app>
<samsung-watchlater-app style="display: none;"></samsung-watchlater-app>
</body>
<style>
<script type="module" src="samsung_featured_header.js"></script>
<script type="module" src="samsung_featured_app.js"></script>
<script type="module" src="samsung_opentabs_app.js"></script>
+ <script type="module" src="samsung_bookmarks_app.js"></script>
<script type="module" src="samsung_watchlater_app.js"></script>
</html>
\ No newline at end of file
<!-- <div id = 'buttonMost' class = 'button' role="button" on-click="onMostVisitedClick_">
<div class = 'marquee buttonCaption' aria-hidden="true">Most Visited</div>
</div>
- <div class = 'tabSeperator'></div>
+ <div class = 'tabSeperator'></div> -->
<div id = 'buttonBookmarks' class = 'button' role="button" on-click="onBookmarkClick_">
<div class = 'marquee buttonCaption' aria-hidden="true">Bookmarks</div>
</div>
- <div class = 'tabSeperator'></div> -->
+ <div class = 'tabSeperator'></div>
<div id = 'buttonWatchLater' class = 'button' role="button" on-click="onWatchlaterClick_">
<div class = 'captionWatchLater'>
<div class = 'marquee buttonCaption' aria-hidden="true" >Watch later</div>
}
#buttonWrapper.headerList .button {
- width: calc(30% - 2px);
+ width: calc(25% - 2px);
}
#buttonWrapper .button.deselected:hover {
chrome::kPeopleSubPage);
break;
case IDC_SHOW_BOOKMARK_MANAGER:
+#if defined(SAMSUNG_MENU_TREE_UI)
+ NewTabWithURL(browser_, "chrome://featured/#bookmarks");
+#else
ShowBookmarkManager(browser_->GetBrowserForOpeningWebUi());
+#endif
break;
case IDC_SHOW_BOOKMARK_SIDE_PANEL:
SidePanelUI::GetSidePanelUIForBrowser(browser_)->Show(
function isFocusable(element) {
if(element.tagName == 'OPTION') alert('found')
const focusableTags = ['OPTION','A', 'CR-BUTTON', 'SELECT', 'CR-SLIDER', 'OPTION', 'CR-TOGGLE', 'INPUT'];
- const focusableClasses = ['closeButton', 'bookmarkGriditem', 'thumbnailGriditem', 'buttonCaption'];
+ const focusableClasses = ['closeButton', 'bookmarkGriditem', 'thumbnailGriditem', 'buttonCaption','itemEdit'];
const focusableRoles = ['tab'];
// const focusableIds = ['checkbox','labelWrapper', 'profile-row','icon'];
const focusableIds = ['checkbox','icon'];