diff --git a/app/scripts/components/CollectiondownloadComponent.js b/app/scripts/components/CollectiondownloadComponent.js
index 71e897ea0470be9e652b72b718d4dc453b9c564f..70c9186d44f7dce17c09f8043700d988388bb249 100644
--- a/app/scripts/components/CollectiondownloadComponent.js
+++ b/app/scripts/components/CollectiondownloadComponent.js
@@ -78,22 +78,7 @@ export default class CollectiondownloadComponent extends BaseComponent {
nav[data-action] {
flex: 0 0 auto;
}
- nav[data-action] button {
- -webkit-appearance: none;
- appearance: none;
- display: inline-block;
- padding: 0.5em 1em;
- border: 1px solid var(--color-border);
- border-radius: 3px;
- background-color: var(--color-content);
- line-height: 1;
- outline: none;
- cursor: pointer;
- }
- nav[data-action] button:hover {
- border-color: rgba(0,0,0,0.3);
- }
- nav[data-action] button[data-state="inactive"] {
+ nav[data-action] app-button[data-state="inactive"] {
display: none;
}
</style>
@@ -114,7 +99,7 @@ export default class CollectiondownloadComponent extends BaseComponent {
<p data-message>${state.message}</p>
</div>
<nav data-action>
- <!--<button data-action="" data-item-key="">Cancel</button>-->
+ <!--<app-button data-action="" data-item-key="">Cancel</app-button>-->
</nav>
</li>
`;
diff --git a/app/scripts/components/CollectioninstalledComponent.js b/app/scripts/components/CollectioninstalledComponent.js
index f4adc64562987ed9834dff44aeeb88d1083da13f..60de66cacb0361adb8b52332acdf9f135edf6dce 100644
--- a/app/scripts/components/CollectioninstalledComponent.js
+++ b/app/scripts/components/CollectioninstalledComponent.js
@@ -66,22 +66,7 @@ export default class CollectioninstalledComponent extends BaseComponent {
nav[data-action] {
flex: 0 0 auto;
}
- nav[data-action] button {
- -webkit-appearance: none;
- appearance: none;
- display: inline-block;
- padding: 0.5em 1em;
- border: 1px solid var(--color-border);
- border-radius: 3px;
- background-color: var(--color-content);
- line-height: 1;
- outline: none;
- cursor: pointer;
- }
- nav[data-action] button:hover {
- border-color: rgba(0,0,0,0.3);
- }
- nav[data-action] button[data-state="inactive"] {
+ nav[data-action] app-button[data-state="inactive"] {
display: none;
}
</style>
@@ -110,11 +95,11 @@ export default class CollectioninstalledComponent extends BaseComponent {
<h4 data-name>${file}</h4>
</div>
<nav data-action>
- <button data-action="ocsManager_openUrl" data-url="${fileUrl}">${openButtonText}</button>
- <button data-action="ocsManager_applyTheme"
+ <app-button data-action="ocsManager_applyTheme"
data-path="${filePath}" data-install-type="${state.installType}"
- data-state="${applyButtonState}">Apply</button>
- <button data-action="ocsManager_uninstall" data-item-key="${key}">Delete</button>
+ data-state="${applyButtonState}">Apply</app-button>
+ <app-button data-action="ocsManager_openUrl" data-url="${fileUrl}">${openButtonText}</app-button>
+ <app-button data-action="ocsManager_uninstall" data-item-key="${key}">Delete</app-button>
</nav>
</li>
`;
@@ -125,19 +110,31 @@ export default class CollectioninstalledComponent extends BaseComponent {
return listItemSet;
}
+ _disposableIndicator(target) {
+ const indicator = document.createElement('app-indicator');
+ target.appendChild(indicator);
+ indicator.start();
+ setTimeout(() => {
+ indicator.stop();
+ indicator.remove();
+ }, 3000);
+ }
+
_handleClick(event) {
- if (event.target.closest('button[data-action]')) {
- const target = event.target.closest('button[data-action]');
+ if (event.target.closest('app-button[data-action]')) {
+ const target = event.target.closest('app-button[data-action]');
switch (target.getAttribute('data-action')) {
- case 'ocsManager_openUrl':
- this.dispatch('ocsManager_openUrl', {url: target.getAttribute('data-url')});
- break;
case 'ocsManager_applyTheme':
+ this._disposableIndicator(target);
this.dispatch('ocsManager_applyTheme', {
path: target.getAttribute('data-path'),
installType: target.getAttribute('data-install-type')
});
break;
+ case 'ocsManager_openUrl':
+ this._disposableIndicator(target);
+ this.dispatch('ocsManager_openUrl', {url: target.getAttribute('data-url')});
+ break;
case 'ocsManager_uninstall':
this.dispatch('ocsManager_uninstall', {itemKey: target.getAttribute('data-item-key')});
target.closest('li').remove();
diff --git a/app/scripts/components/CollectionsidebarComponent.js b/app/scripts/components/CollectionsidebarComponent.js
index d135658ca49f809223f850f2be1a1678a5f1fbe5..7ad419911845761bac337743a273a19def7691da 100644
--- a/app/scripts/components/CollectionsidebarComponent.js
+++ b/app/scripts/components/CollectionsidebarComponent.js
@@ -74,28 +74,10 @@ export default class CollectionsidebarComponent extends BaseComponent {
text-overflow: ellipsis;
line-height: 1;
}
- nav[data-sidebar] ul li a span[data-count] {
+ nav[data-sidebar] ul li a app-badge {
flex: 0 0 auto;
- display: inline-block;
- padding: 3px 6px;
- border-radius: 10px;
- background-color: var(--color-active-secondary);
- font-size: 11px;
- line-height: 1;
- }
-
- nav[data-sidebar] ul li a[data-action="update"] span[data-count] {
- background-color: var(--color-warning);
- color: var(--color-content);
- }
- nav[data-sidebar] ul li a[data-action="update"] span[data-count="0"] {
- display: none;
- }
- nav[data-sidebar] ul li a[data-action="download"] span[data-count] {
- background-color: var(--color-information);
- color: var(--color-content);
}
- nav[data-sidebar] ul li a[data-action="download"] span[data-count="0"] {
+ nav[data-sidebar] ul li app-badge[data-count="0"] {
display: none;
}
</style>
@@ -105,13 +87,13 @@ export default class CollectionsidebarComponent extends BaseComponent {
<li>
<a href="#" data-action="update" data-state="inactive">
<span data-name>Update</span>
- <span data-count="0">0</span>
+ <app-badge data-count="0" data-emphasis="high"></app-badge>
</a>
</li>
<li>
<a href="#" data-action="download" data-state="active">
<span data-name>Download</span>
- <span data-count="0">0</span>
+ <app-badge data-count="0" data-emphasis="medium"></app-badge>
</a>
</li>
</ul>
@@ -158,7 +140,7 @@ export default class CollectionsidebarComponent extends BaseComponent {
<li>
<a href="#" data-action="installed" data-install-type="${category.installType}">
<span data-name>${category.name}</span>
- <span data-count="${category.count}">${category.count}</span>
+ <app-badge data-count="${category.count}"></app-badge>
</a>
</li>
`;
@@ -211,18 +193,16 @@ export default class CollectionsidebarComponent extends BaseComponent {
const menuItem = this.contentRoot.querySelector('a[data-action="update"]');
menuItem.setAttribute('data-state', state.count ? 'active' : 'inactive');
- const badge = menuItem.querySelector('span[data-count]');
+ const badge = menuItem.querySelector('app-badge');
badge.setAttribute('data-count', '' + state.count);
- badge.textContent = '' + state.count;
}
_viewHandler_ocsManager_metadataSet(state) {
const menuItem = this.contentRoot.querySelector('a[data-action="download"]');
//menuItem.setAttribute('data-state', state.count ? 'active' : 'inactive');
- const badge = menuItem.querySelector('span[data-count]');
+ const badge = menuItem.querySelector('app-badge');
badge.setAttribute('data-count', '' + state.count);
- badge.textContent = '' + state.count;
}
}
diff --git a/app/scripts/components/CollectionupdateComponent.js b/app/scripts/components/CollectionupdateComponent.js
index f38970838d27a9b7aca675ecc55b13e405cb6add..80ba3f6b78157b4d21931565d4395c2bbcfdcf6d 100644
--- a/app/scripts/components/CollectionupdateComponent.js
+++ b/app/scripts/components/CollectionupdateComponent.js
@@ -77,22 +77,7 @@ export default class CollectionupdateComponent extends BaseComponent {
nav[data-action] {
flex: 0 0 auto;
}
- nav[data-action] button {
- -webkit-appearance: none;
- appearance: none;
- display: inline-block;
- padding: 0.5em 1em;
- border: 1px solid var(--color-border);
- border-radius: 3px;
- background-color: var(--color-content);
- line-height: 1;
- outline: none;
- cursor: pointer;
- }
- nav[data-action] button:hover {
- border-color: rgba(0,0,0,0.3);
- }
- nav[data-action] button[data-state="inactive"] {
+ nav[data-action] app-button[data-state="inactive"] {
display: none;
}
</style>
@@ -117,7 +102,7 @@ export default class CollectionupdateComponent extends BaseComponent {
<p data-message></p>
</div>
<nav data-action>
- <button data-action="ocsManager_update" data-item-key="${key}" data-state="active">Update</button>
+ <app-button data-action="ocsManager_update" data-item-key="${key}" data-state="active">Update</app-button>
</nav>
</li>
`;
@@ -128,8 +113,8 @@ export default class CollectionupdateComponent extends BaseComponent {
}
_handleClick(event) {
- if (event.target.closest('button[data-action]')) {
- const target = event.target.closest('button[data-action]');
+ if (event.target.closest('app-button[data-action]')) {
+ const target = event.target.closest('app-button[data-action]');
switch (target.getAttribute('data-action')) {
case 'ocsManager_update':
this.dispatch('ocsManager_update', {itemKey: target.getAttribute('data-item-key')});
diff --git a/app/scripts/components/OmniboxComponent.js b/app/scripts/components/OmniboxComponent.js
index 66f42afb940b3c6415dcffb6718a72be01526705..63135f72ae171335be6918095bf57c5c91394300 100644
--- a/app/scripts/components/OmniboxComponent.js
+++ b/app/scripts/components/OmniboxComponent.js
@@ -125,27 +125,8 @@ export default class OmniboxComponent extends BaseComponent {
width: 50%;
padding: 5px;
}
- div[data-palette] nav ul li button {
- -webkit-appearance: none;
- appearance: none;
- display: inline-block;
+ div[data-palette] nav ul li app-button {
width: 100%;
- padding: 0.4em 0.2em;
- border: 1px solid var(--color-border);
- border-radius: 3px;
- background-color: var(--color-content);
- line-height: 1;
- outline: none;
- cursor: pointer;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- }
- div[data-palette] nav ul li button:hover {
- border-color: rgba(0,0,0,0.3);
- }
- div[data-palette] nav ul li button[data-action="webview_startPage"][data-url="${this.state.startPage}"] {
- border-color: var(--color-information);
}
div[data-overlay] {
@@ -170,19 +151,19 @@ export default class OmniboxComponent extends BaseComponent {
data-title="Open in Browser" data-icon="open_in_browser" data-size="small"></app-iconbutton>
</div>
</div>
- <app-indicator data-state="inactive"></app-indicator>
+ <app-indicator></app-indicator>
</div>
<div data-palette data-state="${state}" class="fade-in">
<h4><i class="material-icons md-small">home</i> Choose Startpage</h4>
<nav>
<ul>
- <li><button data-action="webview_startPage" data-url="https://www.opendesktop.org/">opendesktop.org</button></li>
- <li><button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/Gnome">gnome-look.org</button></li>
- <li><button data-action="webview_startPage" data-url="https://store.kde.org/">store.kde.org</button></li>
- <li><button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/XFCE">xfce-look.org</button></li>
- <li><button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/Window-Managers">box-look.org</button></li>
- <li><button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/Enlightenment">enlightenment-themes.org</button></li>
+ <li><app-button data-action="webview_startPage" data-url="https://www.opendesktop.org/">opendesktop.org</app-button></li>
+ <li><app-button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/Gnome">gnome-look.org</app-button></li>
+ <li><app-button data-action="webview_startPage" data-url="https://store.kde.org/">store.kde.org</app-button></li>
+ <li><app-button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/XFCE">xfce-look.org</app-button></li>
+ <li><app-button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/Window-Managers">box-look.org</app-button></li>
+ <li><app-button data-action="webview_startPage" data-url="https://www.opendesktop.org/s/Enlightenment">enlightenment-themes.org</app-button></li>
</ul>
</nav>
</div>
@@ -191,6 +172,16 @@ export default class OmniboxComponent extends BaseComponent {
`;
}
+ componentUpdatedCallback() {
+ if (this.contentRoot.querySelector('app-button[data-action="webview_startPage"][data-checked]')) {
+ this.contentRoot.querySelector('app-button[data-action="webview_startPage"][data-checked]').removeAttribute('data-checked');
+ }
+
+ if (this.contentRoot.querySelector(`app-button[data-action="webview_startPage"][data-url="${this.state.startPage}"]`)) {
+ this.contentRoot.querySelector(`app-button[data-action="webview_startPage"][data-url="${this.state.startPage}"]`).setAttribute('data-checked', 'data-checked');
+ }
+ }
+
open() {
this.contentRoot.querySelector('div[data-palette]').setAttribute('data-state', 'active');
this.contentRoot.querySelector('div[data-overlay]').setAttribute('data-state', 'active');
@@ -219,8 +210,8 @@ export default class OmniboxComponent extends BaseComponent {
if (event.target.closest('app-iconbutton[data-action]')) {
target = event.target.closest('app-iconbutton[data-action]');
}
- else if (event.target.closest('button[data-action]')) {
- target = event.target.closest('button[data-action]');
+ else if (event.target.closest('app-button[data-action]')) {
+ target = event.target.closest('app-button[data-action]');
}
else {
return;
@@ -238,7 +229,8 @@ export default class OmniboxComponent extends BaseComponent {
}
_viewHandler_webview_loading(state) {
- this.contentRoot.querySelector('app-indicator').setAttribute('data-state', state.isLoading ? 'active' : 'inactive');
+ const indicator = this.contentRoot.querySelector('app-indicator');
+ state.isLoading ? indicator.start() : indicator.stop();
}
_viewHandler_webview_page(state) {
diff --git a/app/scripts/components/ToolbarComponent.js b/app/scripts/components/ToolbarComponent.js
index d71bbbfc984d37d84fa472d48bf7564b8dddd0ec..5b99462777124f54e6ab379788b5d6c0c73011c1 100644
--- a/app/scripts/components/ToolbarComponent.js
+++ b/app/scripts/components/ToolbarComponent.js
@@ -79,30 +79,20 @@ export default class ToolbarComponent extends BaseComponent {
color: var(--color-text);
}
- nav[data-toolbar] ul li span[data-badge] {
+ nav[data-toolbar] ul li app-badge {
z-index: 1;
position: relative;
top: -36px;
left: 22px;
- display: inline-block;
- padding: 3px 6px;
- border-radius: 10px;
- background-color: var(--color-active-secondary);
- font-size: 11px;
- line-height: 1;
}
- nav[data-toolbar] ul li span[data-badge][data-count="0"] {
+ nav[data-toolbar] ul li app-badge[data-count="0"] {
display: none;
}
- nav[data-toolbar] ul li span[data-badge="update"] {
+ nav[data-toolbar] ul li app-badge[data-emphasis="high"] {
z-index: 2;
- background-color: var(--color-warning);
- color: var(--color-content);
}
- nav[data-toolbar] ul li span[data-badge="download"] {
+ nav[data-toolbar] ul li app-badge[data-emphasis="medium"] {
z-index: 3;
- background-color: var(--color-information);
- color: var(--color-content);
}
</style>
@@ -129,14 +119,15 @@ export default class ToolbarComponent extends BaseComponent {
<li>
<app-iconbutton data-action="ocsManager_collection"
data-title="My Collection" data-icon="folder"></app-iconbutton><br>
- <span data-badge="update" data-count="0">0</span>
- <span data-badge="download" data-count="0">0</span>
+ <app-badge data-count="0" data-emphasis="high"></app-badge>
+ <app-badge data-count="0" data-emphasis="medium"></app-badge>
</li>
<li data-omnibox><app-omnibox></app-omnibox></li>
<li>
<app-iconbutton data-action="menu_open"
data-title="Other Operations..." data-icon="more_vert"></app-iconbutton><br>
<app-menu data-width="250px" data-offset-x="-220px">
+ <a slot="menuitem" href="#" data-action="webview_appBugsPage">Report a Bug</a>
<a slot="menuitem" href="#" data-action="general_about">About This App</a>
</app-menu>
</li>
@@ -180,6 +171,10 @@ export default class ToolbarComponent extends BaseComponent {
case 'menu_open':
this.contentRoot.querySelector('app-menu').open();
break;
+ case 'webview_appBugsPage':
+ this.dispatch('webview_appBugsPage', {});
+ this.contentRoot.querySelector('app-menu').close();
+ break;
case 'general_about':
this.dispatch('general_about', {});
this.contentRoot.querySelector('app-menu').close();
@@ -202,15 +197,13 @@ export default class ToolbarComponent extends BaseComponent {
}
_viewHandler_ocsManager_updateAvailableItems(state) {
- const badge = this.contentRoot.querySelector('span[data-badge="update"]');
+ const badge = this.contentRoot.querySelector('app-badge[data-emphasis="high"]');
badge.setAttribute('data-count', '' + state.count);
- badge.textContent = state.count;
}
_viewHandler_ocsManager_metadataSet(state) {
- const badge = this.contentRoot.querySelector('span[data-badge="download"]');
+ const badge = this.contentRoot.querySelector('app-badge[data-emphasis="medium"]');
badge.setAttribute('data-count', '' + state.count);
- badge.textContent = state.count;
}
}
diff --git a/app/scripts/components/common/BadgeComponent.js b/app/scripts/components/common/BadgeComponent.js
new file mode 100644
index 0000000000000000000000000000000000000000..a3b1ea0162a02a5ab811b99a1f3c1f70b2379ebb
--- /dev/null
+++ b/app/scripts/components/common/BadgeComponent.js
@@ -0,0 +1,48 @@
+import BaseComponent from './BaseComponent.js';
+
+export default class BadgeComponent extends BaseComponent {
+
+ static get componentObservedAttributes() {
+ return ['data-count', 'data-emphasis'];
+ }
+
+ render() {
+ const count = this.getAttribute('data-count') || '0';
+ const emphasis = this.getAttribute('data-emphasis') || 'low';
+
+ return this.html`
+ <style>
+ ${this.sharedStyle}
+ </style>
+
+ <style>
+ :host {
+ display: inline-block;
+ }
+
+ span {
+ display: inline-block;
+ padding: 3px 6px;
+ border-radius: 10px;
+ font-size: 11px;
+ line-height: 1;
+ }
+ span[data-emphasis="low"] {
+ background-color: var(--color-active-secondary);
+ color: var(--color-text);
+ }
+ span[data-emphasis="medium"] {
+ background-color: var(--color-information);
+ color: var(--color-content);
+ }
+ span[data-emphasis="high"] {
+ background-color: var(--color-warning);
+ color: var(--color-content);
+ }
+ </style>
+
+ <span data-emphasis="${emphasis}">${count}</span>
+ `;
+ }
+
+}
diff --git a/app/scripts/components/common/ButtonComponent.js b/app/scripts/components/common/ButtonComponent.js
new file mode 100644
index 0000000000000000000000000000000000000000..27ff689f71a4f31d186aa7884581cf18a3dab19f
--- /dev/null
+++ b/app/scripts/components/common/ButtonComponent.js
@@ -0,0 +1,61 @@
+import BaseComponent from './BaseComponent.js';
+
+export default class ButtonComponent extends BaseComponent {
+
+ static get componentObservedAttributes() {
+ return ['data-title', 'data-state', 'data-checked'];
+ }
+
+ render() {
+ const title = this.getAttribute('data-title') || '';
+ const state = this.getAttribute('data-state') || 'active';
+
+ const disabled = (state === 'inactive') ? 'disabled' : '';
+ const checked = this.hasAttribute('data-checked') ? 'data-checked' : '';
+
+ return this.html`
+ <style>
+ ${this.sharedStyle}
+ </style>
+
+ <style>
+ :host {
+ display: inline-block;
+ line-height: 1;
+ }
+
+ button {
+ -webkit-appearance: none;
+ appearance: none;
+ display: inline-block;
+ width: inherit;
+ height: inherit;
+ padding: 0.5em 1em;
+ border: 1px solid var(--color-border);
+ border-radius: 3px;
+ background-color: var(--color-content);
+ outline: none;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
+ button:enabled {
+ cursor: pointer;
+ }
+ button:enabled:hover {
+ border-color: rgba(0,0,0,0.3);
+ }
+ button:disabled {
+ color: var(--color-text-secondary);
+ }
+ button[data-checked],
+ button[data-checked]:hover {
+ border-color: var(--color-information);
+ }
+ </style>
+
+ <button title="${title}" ?disabled=${disabled} ?data-checked=${checked}><slot></slot></button>
+ `;
+ }
+
+}
diff --git a/app/scripts/components/common/IconbuttonComponent.js b/app/scripts/components/common/IconbuttonComponent.js
index d454188cba5689808bdba2673c9b5f7b2c923a30..76a845b93defab27a30eb106ef4e7ec00fabb95e 100644
--- a/app/scripts/components/common/IconbuttonComponent.js
+++ b/app/scripts/components/common/IconbuttonComponent.js
@@ -3,7 +3,7 @@ import BaseComponent from './BaseComponent.js';
export default class IconbuttonComponent extends BaseComponent {
static get componentObservedAttributes() {
- return ['data-title', 'data-icon', 'data-size', 'data-color', 'data-state'];
+ return ['data-title', 'data-icon', 'data-size', 'data-color', 'data-state', 'data-checked'];
}
init() {
@@ -24,6 +24,7 @@ export default class IconbuttonComponent extends BaseComponent {
const state = this.getAttribute('data-state') || 'active';
const disabled = (state === 'inactive') ? 'disabled' : '';
+ const checked = this.hasAttribute('data-checked') ? 'data-checked' : '';
return this.html`
<style>
@@ -51,15 +52,21 @@ export default class IconbuttonComponent extends BaseComponent {
border-radius: 3px;
background-color: transparent;
outline: none;
- cursor: pointer;
transition: background-color 0.2s ease-out;
}
- button:hover {
+ button:enabled {
+ cursor: pointer;
+ }
+ button:enabled:hover {
background-color: var(--color-active);
}
+ button[data-checked],
+ button[data-checked]:hover {
+ background-color: var(--color-information-secondary);
+ }
</style>
- <button title="${title}" ?disabled=${disabled}>
+ <button title="${title}" ?disabled=${disabled} ?data-checked=${checked}>
<i class="material-icons md-${size} md-${color} md-${state}">${icon}</i>
</button>
`;
diff --git a/app/scripts/components/common/IndicatorComponent.js b/app/scripts/components/common/IndicatorComponent.js
index 28cf1595807d1acb5128d195482edceb0cb3cc0b..c098924bf9a7ca8c31ac5fd515f9661e415c5ac3 100644
--- a/app/scripts/components/common/IndicatorComponent.js
+++ b/app/scripts/components/common/IndicatorComponent.js
@@ -61,4 +61,16 @@ export default class IndicatorComponent extends BaseComponent {
`;
}
+ start() {
+ this.contentRoot.querySelector('div[data-container]').setAttribute('data-state', 'active');
+ this.contentRoot.querySelector('div[data-indicator]').setAttribute('data-state', 'active');
+ this.dispatch('indicator_start', {});
+ }
+
+ stop() {
+ this.contentRoot.querySelector('div[data-container]').setAttribute('data-state', 'inactive');
+ this.contentRoot.querySelector('div[data-indicator]').setAttribute('data-state', 'inactive');
+ this.dispatch('indicator_stop', {});
+ }
+
}
diff --git a/app/scripts/components/index.js b/app/scripts/components/index.js
index e05a4b201c4366d3a7627d03bc0dc675cb17aac7..318c00d9deabbbeb4de1069186de8eb20945e968 100644
--- a/app/scripts/components/index.js
+++ b/app/scripts/components/index.js
@@ -4,9 +4,15 @@ SwitchviewComponent.define('app-switchview');
import PageComponent from './common/PageComponent.js';
PageComponent.define('app-page');
+import ButtonComponent from './common/ButtonComponent.js';
+ButtonComponent.define('app-button');
+
import IconbuttonComponent from './common/IconbuttonComponent.js';
IconbuttonComponent.define('app-iconbutton');
+import BadgeComponent from './common/BadgeComponent.js';
+BadgeComponent.define('app-badge');
+
import IndicatorComponent from './common/IndicatorComponent.js';
IndicatorComponent.define('app-indicator');
diff --git a/app/scripts/handlers/WebviewHandler.js b/app/scripts/handlers/WebviewHandler.js
index 4011c563efe8dc7fdac62ed75ef8746e90e7c5b5..b0b2605273b2bbabffe3b11905fd58d12dff9b78 100644
--- a/app/scripts/handlers/WebviewHandler.js
+++ b/app/scripts/handlers/WebviewHandler.js
@@ -4,6 +4,8 @@ export default class WebviewHandler {
this._stateManager = stateManager;
this._ipcRenderer = ipcRenderer;
+ this._appPackage = this._ipcRenderer.sendSync('app', 'package');
+
this._partition = 'persist:opendesktop';
this._preload = './scripts/renderers/webview.js';
this._startPage = this._ipcRenderer.sendSync('store', 'startPage');
@@ -67,6 +69,10 @@ export default class WebviewHandler {
.add('webview_stop', () => {
this._webviewComponent.stop();
return false;
+ })
+ .add('webview_appBugsPage', () => {
+ this._webviewComponent.loadUrl(this._appPackage.bugs);
+ return false;
});
}
diff --git a/package-lock.json b/package-lock.json
index 0d18d9004192c1672e2b6228e6788976d43de33b..6be22c72392302e748a93a66e1bacc7a0b80d61c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "ocs-store",
- "version": "4.0.0",
+ "version": "4.0.1",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
diff --git a/package.json b/package.json
index 115efd34f3f565a80a5c3303905e3fdccb017f02..270066808331f50cf95a763c81826322db30d123 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "ocs-store",
"productName": "OCS-Store",
- "version": "4.0.0",
+ "version": "4.0.1",
"description": "Store Frontend and Management Application based on OpenCollaborationServices (OCS) of Opendesktop.org.",
"author": "Opendesktop.org",
"license": "GPL-3.0",
diff --git a/pkg/appimage/appimagebuild b/pkg/appimage/appimagebuild
index 10c0a6f69a6526b1831862aad46117d990f12a09..233ff46779b150b9f830f4072838c34faf8311f3 100755
--- a/pkg/appimage/appimagebuild
+++ b/pkg/appimage/appimagebuild
@@ -1,7 +1,7 @@
#!/bin/bash
PKGNAME='ocs-store'
-PKGVER='4.0.0'
+PKGVER='4.0.1'
PKGREL='1'
UPDINFO='zsync|http://dl.opendesktop.org/api/files/download/id/1532435039/as/latest/ocs-store-x86_64.AppImage.zsync'