Web Inspector: Elements: Styles: add icons for various CSS rule types
[WebKit-https.git] / Source / WebInspectorUI / UserInterface / Views / ResourceCollectionContentView.js
1 /*
2  * Copyright (C) 2017 Apple Inc. All rights reserved.
3  *
4  * Redistribution and use in source and binary forms, with or without
5  * modification, are permitted provided that the following conditions
6  * are met:
7  * 1. Redistributions of source code must retain the above copyright
8  *    notice, this list of conditions and the following disclaimer.
9  * 2. Redistributions in binary form must reproduce the above copyright
10  *    notice, this list of conditions and the following disclaimer in the
11  *    documentation and/or other materials provided with the distribution.
12  *
13  * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
14  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
15  * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
16  * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
17  * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
18  * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
19  * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
20  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
21  * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
22  * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
23  * THE POSSIBILITY OF SUCH DAMAGE.
24  */
25
26 WI.ResourceCollectionContentView = class ResourceCollectionContentView extends WI.CollectionContentView
27 {
28     constructor(collection)
29     {
30         console.assert(collection instanceof WI.ResourceCollection);
31
32         let contentViewConstructor = null;
33         if (collection.resourceType === WI.Resource.Type.Image)
34             contentViewConstructor = WI.ImageResourceContentView;
35
36         super(collection, contentViewConstructor);
37
38         if (collection.resourceType === WI.Resource.Type.Image) {
39             this._showGridButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-grid", WI.UIString("Show Grid"), WI.UIString("Hide Grid"), "Images/NavigationItemCheckers.svg", 13, 13);
40             this._showGridButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._handleShowGridButtonClicked, this);
41             this._showGridButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
42             this._showGridButtonNavigationItem.activated = !!WI.settings.showImageGrid.value;
43
44             let allItem = new WI.ScopeBarItem("all", WI.UIString("All"));
45
46             let items = [allItem];
47             this._scopeBarItemTypeMap = {};
48
49             let addItem = (key, label) => {
50                 let item = new WI.ScopeBarItem(key, label);
51                 items.push(item);
52                 this._scopeBarItemTypeMap[key] = item;
53             };
54             addItem("bmp", WI.UIString("BMP"));
55             addItem("gif", WI.UIString("GIF"));
56             addItem("ico", WI.UIString("ICO"));
57             addItem("jp2", WI.UIString("JP2"));
58             addItem("jpg", WI.UIString("JPEG"));
59             addItem("pdf", WI.UIString("PDF"));
60             addItem("png", WI.UIString("PNG"));
61             addItem("svg", WI.UIString("SVG"));
62             addItem("tiff", WI.UIString("TIFF"));
63             addItem("webp", WI.UIString("WebP"));
64             addItem("xbm", WI.UIString("XBM"));
65
66             const shouldGroupNonExclusiveItems = true;
67             this._imageTypeScopeBar = new WI.ScopeBar("resource-collection-image-type-scope-bar", items, allItem, shouldGroupNonExclusiveItems);
68             this._imageTypeScopeBar.addEventListener(WI.ScopeBar.Event.SelectionChanged, this._handleImageTypeSelectionChanged, this);
69         }
70     }
71
72     // Public
73
74     get navigationItems()
75     {
76         let navigationItems = [];
77         if (this._imageTypeScopeBar)
78             navigationItems.push(this._imageTypeScopeBar);
79         if (this._showGridButtonNavigationItem)
80             navigationItems.push(this._showGridButtonNavigationItem);
81         navigationItems = navigationItems.concat(super.navigationItems);
82         return navigationItems;
83     }
84
85     // Protected
86
87     attached()
88     {
89         super.attached();
90
91         WI.settings.showImageGrid.addEventListener(WI.Setting.Event.Changed, this._handleShowImageGridSettingChanged, this);
92     }
93
94     detached()
95     {
96         WI.settings.showImageGrid.removeEventListener(null, null, this);
97
98         super.detached();
99     }
100
101     contentViewAdded(contentView)
102     {
103         console.assert(contentView instanceof WI.ResourceContentView);
104
105         let resource = contentView.representedObject;
106         console.assert(resource instanceof WI.Resource);
107
108         this._updateImageTypeScopeBar();
109
110         contentView.addEventListener(WI.ResourceContentView.Event.ContentError, this._handleContentError, this);
111         contentView.element.title = WI.displayNameForURL(resource.url, resource.urlComponents);
112     }
113
114     contentViewRemoved(contentView)
115     {
116         this._updateImageTypeScopeBar();
117     }
118
119     // Private
120
121     _updateImageTypeScopeBar()
122     {
123         let extensions = new Set;
124         let visibleExtensions = 0;
125
126         for (let resource of this.representedObject)
127             extensions.add(WI.fileExtensionForMIMEType(resource.mimeType));
128
129         for (let [key, item] of Object.entries(this._scopeBarItemTypeMap)) {
130             let hidden = !extensions.has(key);
131             item.hidden = hidden;
132             if (hidden && item.selected)
133                 item.selected = false;
134
135             if (!item.hidden)
136                 ++visibleExtensions;
137         }
138
139         this._imageTypeScopeBar.hidden = visibleExtensions <= 1;
140         this.dispatchEventToListeners(WI.ContentView.Event.NavigationItemsDidChange);
141     }
142
143     _handleShowGridButtonClicked(event)
144     {
145         WI.settings.showImageGrid.value = !this._showGridButtonNavigationItem.activated;
146     }
147
148     _handleImageTypeSelectionChanged()
149     {
150         let selectedTypes = this._imageTypeScopeBar.selectedItems.map((item) => item.id);
151         let allTypesAllowed = selectedTypes.length === 1 && selectedTypes[0] === "all";
152         for (let view of this.subviews) {
153             let hidden = !allTypesAllowed;
154             if (hidden && view instanceof WI.ResourceContentView)
155                 hidden = !selectedTypes.includes(WI.fileExtensionForMIMEType(view.representedObject.mimeType));
156             view.element.hidden = hidden;
157         }
158     }
159
160     _handleShowImageGridSettingChanged(event)
161     {
162         let activated = WI.settings.showImageGrid.value;
163         this._showGridButtonNavigationItem.activated = activated;
164     }
165
166     _handleContentError(event)
167     {
168         if (event && event.target)
169             this.removeContentViewForItem(event.target.representedObject);
170     }
171 };