mirror of
https://github.com/Lissy93/dashy.git
synced 2024-11-28 13:43:05 +03:00
⏩ Rebased from master
This commit is contained in:
commit
eae8dc476c
19
.github/AUTHORS.txt
vendored
19
.github/AUTHORS.txt
vendored
@ -1,26 +1,27 @@
|
|||||||
Alicia <liss-bot@d0h.co> - 1 commits
|
Alicia <liss-bot@d0h.co> - 1 commits
|
||||||
Alicia <o> - 1 commits
|
|
||||||
Begin <support@begin.com> - 1 commits
|
Begin <support@begin.com> - 1 commits
|
||||||
DeepSource <o> - 1 commits
|
DeepSource <o> - 1 commits
|
||||||
Devin <uh> - 1 commits
|
Devin <uh> - 1 commits
|
||||||
FormatToday <616099456@qq.com> - 1 commits
|
FormatToday <616099456@qq.com> - 1 commits
|
||||||
Ryan <urne> - 1 commits
|
Ryan <urne> - 1 commits
|
||||||
deepsource-io[bot] <deepsource-io[bot]@users.noreply.github.com> - 1 commits
|
deepsource-io[bot] <deepsource-io[bot]@users.noreply.github.com> - 1 commits
|
||||||
|
liss-bot <87835202+liss-bot@users.noreply.github.com> - 1 commits
|
||||||
Dan <ilber> - 2 commits
|
Dan <ilber> - 2 commits
|
||||||
ᗪєνιη <υн> - 2 commits
|
ᗪєνιη <υн> - 2 commits
|
||||||
|
Alicia <o> - 3 commits
|
||||||
UrekD <urek.denis@gmail.com> - 3 commits
|
UrekD <urek.denis@gmail.com> - 3 commits
|
||||||
Niklas <abe> - 4 commits
|
Niklas <abe> - 4 commits
|
||||||
repo-visualizer <repo-visualizer@users.noreply.github.com> - 5 commits
|
|
||||||
snyk-bot <snyk-bot@snyk.io> - 5 commits
|
|
||||||
Erik <roo> - 6 commits
|
Erik <roo> - 6 commits
|
||||||
liss-bot <liss-bot@users.noreply.github.com> - 6 commits
|
liss-bot <liss-bot@users.noreply.github.com> - 6 commits
|
||||||
|
repo-visualizer <repo-visualizer@users.noreply.github.com> - 6 commits
|
||||||
|
snyk-bot <snyk-bot@snyk.io> - 8 commits
|
||||||
Alicia <yke> - 10 commits
|
Alicia <yke> - 10 commits
|
||||||
snyk-bot <snyk-bot@users.noreply.github.com> - 10 commits
|
snyk-bot <snyk-bot@users.noreply.github.com> - 13 commits
|
||||||
EVOTk <45015615+EVOTk@users.noreply.github.com> - 14 commits
|
EVOTk <45015615+EVOTk@users.noreply.github.com> - 14 commits
|
||||||
github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> - 16 commits
|
github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> - 16 commits
|
||||||
liss-bot <liss-bot@d0h.co> - 16 commits
|
liss-bot <liss-bot@d0h.co> - 17 commits
|
||||||
Alicia <yke> - 25 commits
|
Alicia <yke> - 25 commits
|
||||||
Lissy93 <gh@d0h.co> - 64 commits
|
Lissy93 <gh@d0h.co> - 67 commits
|
||||||
Lissy93 <Lissy93@users.noreply.github.com> - 169 commits
|
Lissy93 <Lissy93@users.noreply.github.com> - 172 commits
|
||||||
Alicia <yke> - 236 commits
|
Alicia <yke> - 242 commits
|
||||||
Alicia <yke> - 932 commits
|
Alicia <yke> - 954 commits
|
3
.github/close-label.yml
vendored
Normal file
3
.github/close-label.yml
vendored
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
🐛 Bug: ✅ Fixed
|
||||||
|
🦄 Feature Request: ✅ Implemented
|
||||||
|
🤷♂️ Question: ✅ Answered
|
13
.github/workflows/apply-done-label.yml
vendored
Normal file
13
.github/workflows/apply-done-label.yml
vendored
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
# When a PR is merged, any associated issues will have a Done label applied
|
||||||
|
# The label will depend on the issue type, see: ./github/close-label.yml
|
||||||
|
name: 💡 Apply Done Label
|
||||||
|
on:
|
||||||
|
pull_request:
|
||||||
|
types: [opened, merged, closed]
|
||||||
|
jobs:
|
||||||
|
triage:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- uses: logerfo/close-label@0.0.4
|
||||||
|
with:
|
||||||
|
repo-token: ${{ secrets.BOT_GITHUB_TOKEN }}
|
16
.github/workflows/check-merge-conflicts.yml
vendored
Normal file
16
.github/workflows/check-merge-conflicts.yml
vendored
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
# Detect and label pull requests that have merge conflicts
|
||||||
|
name: 🏗️ Check Merge Conflicts
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches:
|
||||||
|
- master
|
||||||
|
jobs:
|
||||||
|
check-conflicts:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- uses: mschilde/auto-label-merge-conflicts@master
|
||||||
|
with:
|
||||||
|
CONFLICT_LABEL_NAME: "🚫 Merge Conflicts"
|
||||||
|
GITHUB_TOKEN: ${{ secrets.BOT_GITHUB_TOKEN }}
|
||||||
|
MAX_RETRIES: 5
|
||||||
|
WAIT_MS: 5000
|
18
.github/workflows/label-top-issues.yml
vendored
Normal file
18
.github/workflows/label-top-issues.yml
vendored
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
# Applies the 'Top Issue' label to tickets with most user reactions
|
||||||
|
name: 🎯 Label Top Issues
|
||||||
|
on:
|
||||||
|
workflow_dispatch:
|
||||||
|
schedule:
|
||||||
|
- cron: '0 1 * * *' # Run at 01:00 each day
|
||||||
|
jobs:
|
||||||
|
labelTopIssues:
|
||||||
|
name: Label Top Issues
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- name: Label Issues
|
||||||
|
uses: adamzolyak/top-issues-action@master
|
||||||
|
env:
|
||||||
|
GITHUB_TOKEN: ${{ secrets.BOT_GITHUB_TOKEN }}
|
||||||
|
TOP_NUMBER_OF_ISSUES: 10
|
||||||
|
TOP_LABEL_NAME: "👍 Top 10 Issue!"
|
||||||
|
TOP_LABEL_COLOR: FBCA04
|
@ -539,13 +539,6 @@ Huge thanks to the sponsors helping to support Dashy's development!
|
|||||||
<br />
|
<br />
|
||||||
<sub><b>Robert Ernst</b></sub>
|
<sub><b>Robert Ernst</b></sub>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
|
||||||
<td align="center">
|
|
||||||
<a href="https://github.com/swcarlosrj">
|
|
||||||
<img src="https://avatars.githubusercontent.com/u/9881700?u=c92e4a0ccc0bff241e50582bce914b179b6d89b6&v=4" width="80;" alt="swcarlosrj"/>
|
|
||||||
<br />
|
|
||||||
<sub><b>Carlos Rufo</b></sub>
|
|
||||||
</a>
|
|
||||||
</td></tr>
|
</td></tr>
|
||||||
</table>
|
</table>
|
||||||
<!-- readme: sponsors -end -->
|
<!-- readme: sponsors -end -->
|
||||||
|
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 1.7 MiB After Width: | Height: | Size: 1.7 MiB |
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 70 KiB After Width: | Height: | Size: 67 KiB |
@ -10,13 +10,6 @@
|
|||||||
<br />
|
<br />
|
||||||
<sub><b>Robert Ernst</b></sub>
|
<sub><b>Robert Ernst</b></sub>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
|
||||||
<td align="center">
|
|
||||||
<a href="https://github.com/swcarlosrj">
|
|
||||||
<img src="https://avatars.githubusercontent.com/u/9881700?u=c92e4a0ccc0bff241e50582bce914b179b6d89b6&v=4" width="80;" alt="swcarlosrj"/>
|
|
||||||
<br />
|
|
||||||
<sub><b>Carlos Rufo</b></sub>
|
|
||||||
</a>
|
|
||||||
</td></tr>
|
</td></tr>
|
||||||
</table>
|
</table>
|
||||||
<!-- readme: sponsors -end -->
|
<!-- readme: sponsors -end -->
|
||||||
@ -53,21 +46,28 @@
|
|||||||
<sub><b>Snyk Bot</b></sub>
|
<sub><b>Snyk Bot</b></sub>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td>
|
||||||
|
<td align="center">
|
||||||
|
<a href="https://github.com/liss-bot">
|
||||||
|
<img src="https://avatars.githubusercontent.com/u/87835202?v=4" width="80;" alt="liss-bot"/>
|
||||||
|
<br />
|
||||||
|
<sub><b>Alicia Bot</b></sub>
|
||||||
|
</a>
|
||||||
|
</td>
|
||||||
<td align="center">
|
<td align="center">
|
||||||
<a href="https://github.com/UrekD">
|
<a href="https://github.com/UrekD">
|
||||||
<img src="https://avatars.githubusercontent.com/u/38784343?v=4" width="80;" alt="UrekD"/>
|
<img src="https://avatars.githubusercontent.com/u/38784343?v=4" width="80;" alt="UrekD"/>
|
||||||
<br />
|
<br />
|
||||||
<sub><b>UrekD</b></sub>
|
<sub><b>UrekD</b></sub>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td></tr>
|
||||||
|
<tr>
|
||||||
<td align="center">
|
<td align="center">
|
||||||
<a href="https://github.com/onedr0p">
|
<a href="https://github.com/onedr0p">
|
||||||
<img src="https://avatars.githubusercontent.com/u/213795?v=4" width="80;" alt="onedr0p"/>
|
<img src="https://avatars.githubusercontent.com/u/213795?v=4" width="80;" alt="onedr0p"/>
|
||||||
<br />
|
<br />
|
||||||
<sub><b>ᗪєνιη ᗷυнʟ</b></sub>
|
<sub><b>ᗪєνιη ᗷυнʟ</b></sub>
|
||||||
</a>
|
</a>
|
||||||
</td></tr>
|
</td>
|
||||||
<tr>
|
|
||||||
<td align="center">
|
<td align="center">
|
||||||
<a href="https://github.com/daentech">
|
<a href="https://github.com/daentech">
|
||||||
<img src="https://avatars.githubusercontent.com/u/358678?v=4" width="80;" alt="daentech"/>
|
<img src="https://avatars.githubusercontent.com/u/358678?v=4" width="80;" alt="daentech"/>
|
||||||
@ -75,13 +75,6 @@
|
|||||||
<sub><b>Dan Gilbert</b></sub>
|
<sub><b>Dan Gilbert</b></sub>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td>
|
||||||
<td align="center">
|
|
||||||
<a href="https://github.com/liss-bot">
|
|
||||||
<img src="https://avatars.githubusercontent.com/u/87835202?v=4" width="80;" alt="liss-bot"/>
|
|
||||||
<br />
|
|
||||||
<sub><b>Alicia Bot</b></sub>
|
|
||||||
</a>
|
|
||||||
</td>
|
|
||||||
<td align="center">
|
<td align="center">
|
||||||
<a href="https://github.com/BeginCI">
|
<a href="https://github.com/BeginCI">
|
||||||
<img src="https://avatars.githubusercontent.com/u/57495754?v=4" width="80;" alt="BeginCI"/>
|
<img src="https://avatars.githubusercontent.com/u/57495754?v=4" width="80;" alt="BeginCI"/>
|
||||||
|
@ -1,14 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<div :class="`collapsable ${checkSpanNum(cols, 'col')} ${checkSpanNum(rows, 'row')}`"
|
<div
|
||||||
|
:class="`collapsable ${checkSpanNum(cols, 'col')} ${checkSpanNum(rows, 'row')}`"
|
||||||
:style="`${color ? 'background: '+color : ''}; ${sanitizeCustomStyles(customStyles)};`"
|
:style="`${color ? 'background: '+color : ''}; ${sanitizeCustomStyles(customStyles)};`"
|
||||||
>
|
>
|
||||||
<input
|
<input
|
||||||
:id="`collapsible-${uniqueKey}`"
|
:id="`collapsible-${uniqueKey}`"
|
||||||
class="toggle"
|
class="toggle"
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
:checked="getCollapseState()"
|
:checked="getCollapseState()"
|
||||||
@change="collapseChanged"
|
@change="collapseChanged"
|
||||||
tabIndex="-1"
|
tabIndex="-1"
|
||||||
>
|
>
|
||||||
<label :for="`collapsible-${uniqueKey}`" class="lbl-toggle" tabindex="-1">
|
<label :for="`collapsible-${uniqueKey}`" class="lbl-toggle" tabindex="-1">
|
||||||
<Icon v-if="icon" :icon="icon" size="small" :url="title" class="section-icon" />
|
<Icon v-if="icon" :icon="icon" size="small" :url="title" class="section-icon" />
|
||||||
@ -30,14 +31,14 @@ import Icon from '@/components/LinkItems/ItemIcon.vue';
|
|||||||
export default {
|
export default {
|
||||||
name: 'CollapsableContainer',
|
name: 'CollapsableContainer',
|
||||||
props: {
|
props: {
|
||||||
uniqueKey: String,
|
uniqueKey: String, // Generated unique ID
|
||||||
title: String,
|
title: String, // The section title
|
||||||
icon: String,
|
icon: String, // An optional section icon
|
||||||
collapsed: Boolean,
|
collapsed: Boolean, // Optional override collapse state
|
||||||
cols: Number,
|
cols: Number, // Set section horizontal col span / width
|
||||||
rows: Number,
|
rows: Number, // Set section vertical row span / height
|
||||||
color: String,
|
color: String, // Optional color override
|
||||||
customStyles: String,
|
customStyles: String, // Optional custom stylings
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
Icon,
|
Icon,
|
||||||
@ -45,7 +46,7 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
/* Check that row & column span is valid, and not over the max */
|
/* Check that row & column span is valid, and not over the max */
|
||||||
checkSpanNum(span, classPrefix) {
|
checkSpanNum(span, classPrefix) {
|
||||||
const maxSpan = 4;
|
const maxSpan = 5;
|
||||||
let numSpan = /^\d*$/.test(span) ? parseInt(span, 10) : 1;
|
let numSpan = /^\d*$/.test(span) ? parseInt(span, 10) : 1;
|
||||||
numSpan = (numSpan > maxSpan) ? maxSpan : numSpan;
|
numSpan = (numSpan > maxSpan) ? maxSpan : numSpan;
|
||||||
return `${classPrefix}-${numSpan}`;
|
return `${classPrefix}-${numSpan}`;
|
||||||
@ -68,7 +69,9 @@ export default {
|
|||||||
}
|
}
|
||||||
return JSON.parse(localStorage[localStorageKeys.COLLAPSE_STATE]);
|
return JSON.parse(localStorage[localStorageKeys.COLLAPSE_STATE]);
|
||||||
},
|
},
|
||||||
|
/* If not specified by user, get last state from local storage */
|
||||||
getCollapseState() {
|
getCollapseState() {
|
||||||
|
if (this.collapsed !== undefined) return !this.collapsed;
|
||||||
const collapseStateObject = this.initialiseStorage();
|
const collapseStateObject = this.initialiseStorage();
|
||||||
let collapseState = !this.collapsed;
|
let collapseState = !this.collapsed;
|
||||||
if (collapseStateObject[this.uniqueKey] !== undefined) {
|
if (collapseStateObject[this.uniqueKey] !== undefined) {
|
||||||
@ -76,6 +79,7 @@ export default {
|
|||||||
}
|
}
|
||||||
return collapseState;
|
return collapseState;
|
||||||
},
|
},
|
||||||
|
/* When section collapsed, update local storage, to remember for next time */
|
||||||
setCollapseState(id, newState) {
|
setCollapseState(id, newState) {
|
||||||
// Get the current localstorage collapse state object
|
// Get the current localstorage collapse state object
|
||||||
const collapseState = JSON.parse(localStorage[localStorageKeys.COLLAPSE_STATE]);
|
const collapseState = JSON.parse(localStorage[localStorageKeys.COLLAPSE_STATE]);
|
||||||
@ -84,9 +88,12 @@ export default {
|
|||||||
// Stringify, and set the new object into local storage
|
// Stringify, and set the new object into local storage
|
||||||
localStorage.setItem(localStorageKeys.COLLAPSE_STATE, JSON.stringify(collapseState));
|
localStorage.setItem(localStorageKeys.COLLAPSE_STATE, JSON.stringify(collapseState));
|
||||||
},
|
},
|
||||||
|
/* Called when collapse state changes, trigger local storage update if needed */
|
||||||
collapseChanged(whatChanged) {
|
collapseChanged(whatChanged) {
|
||||||
this.initialiseStorage();
|
if (this.collapseState === undefined) { // Only run, if user hasn't manually set prop
|
||||||
this.setCollapseState(this.uniqueKey.toString(), whatChanged.srcElement.checked);
|
this.initialiseStorage();
|
||||||
|
this.setCollapseState(this.uniqueKey.toString(), whatChanged.srcElement.checked);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
@ -110,22 +117,26 @@ export default {
|
|||||||
&.row-2 { grid-row-start: span 2; }
|
&.row-2 { grid-row-start: span 2; }
|
||||||
&.row-3 { grid-row-start: span 3; }
|
&.row-3 { grid-row-start: span 3; }
|
||||||
&.row-4 { grid-row-start: span 4; }
|
&.row-4 { grid-row-start: span 4; }
|
||||||
|
&.row-5 { grid-row-start: span 5; }
|
||||||
|
|
||||||
grid-column-start: span 1;
|
grid-column-start: span 1;
|
||||||
@include tablet-up {
|
@include tablet-up {
|
||||||
&.col-2 { grid-column-start: span 2; }
|
&.col-2 { grid-column-start: span 2; }
|
||||||
&.col-3 { grid-column-start: span 2; }
|
&.col-3 { grid-column-start: span 2; }
|
||||||
&.col-4 { grid-column-start: span 2; }
|
&.col-4 { grid-column-start: span 2; }
|
||||||
|
&.col-5 { grid-column-start: span 2; }
|
||||||
}
|
}
|
||||||
@include laptop-up {
|
@include laptop-up {
|
||||||
&.col-2 { grid-column-start: span 2; }
|
&.col-2 { grid-column-start: span 2; }
|
||||||
&.col-3 { grid-column-start: span 3; }
|
&.col-3 { grid-column-start: span 3; }
|
||||||
&.col-4 { grid-column-start: span 3; }
|
&.col-4 { grid-column-start: span 3; }
|
||||||
|
&.col-5 { grid-column-start: span 3; }
|
||||||
}
|
}
|
||||||
@include monitor-up {
|
@include monitor-up {
|
||||||
&.col-2 { grid-column-start: span 2; }
|
&.col-2 { grid-column-start: span 2; }
|
||||||
&.col-3 { grid-column-start: span 3; }
|
&.col-3 { grid-column-start: span 3; }
|
||||||
&.col-4 { grid-column-start: span 4; }
|
&.col-4 { grid-column-start: span 4; }
|
||||||
|
&.col-5 { grid-column-start: span 5; }
|
||||||
}
|
}
|
||||||
|
|
||||||
.wrap-collabsible {
|
.wrap-collabsible {
|
||||||
@ -144,7 +155,7 @@ export default {
|
|||||||
border-radius: var(--curve-factor);
|
border-radius: var(--curve-factor);
|
||||||
transition: all 0.25s ease-out;
|
transition: all 0.25s ease-out;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
color: var(--item-group-heading-text-color); //var(--item-group-background);
|
color: var(--item-group-heading-text-color);
|
||||||
h3 {
|
h3 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
@ -1,48 +1,26 @@
|
|||||||
<template>
|
<template>
|
||||||
<form @submit.prevent="searchSubmitted">
|
<SearchBar
|
||||||
<div class="minimal-search-wrap">
|
ref="MinimalSearchBar"
|
||||||
<input
|
@user-is-searchin="userIsTypingSomething"
|
||||||
id="filter-tiles"
|
:active="true"
|
||||||
v-model="input"
|
:minimalSearch="true"
|
||||||
ref="filter"
|
/>
|
||||||
class="minimal-search"
|
|
||||||
:placeholder="$t('search.search-placeholder')"
|
|
||||||
v-on:input="userIsTypingSomething"
|
|
||||||
@keydown.esc="clearFilterInput"
|
|
||||||
/>
|
|
||||||
<p v-if="webSearchEnabled && input.length > 0" class="web-search-note">
|
|
||||||
{{ $t('search.enter-to-search-web') }}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<i v-if="input.length > 0"
|
|
||||||
class="clear-search"
|
|
||||||
:title="$t('search.clear-search-tooltip')"
|
|
||||||
@click="clearFilterInput">x</i>
|
|
||||||
</form>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import SearchBar from '@/components/Settings/SearchBar';
|
||||||
import router from '@/router';
|
|
||||||
import ArrowKeyNavigation from '@/utils/ArrowKeyNavigation';
|
|
||||||
import ErrorHandler from '@/utils/ErrorHandler';
|
|
||||||
import { getCustomKeyShortcuts } from '@/utils/ConfigHelpers';
|
|
||||||
import {
|
|
||||||
searchEngineUrls,
|
|
||||||
defaultSearchEngine,
|
|
||||||
defaultSearchOpeningMethod,
|
|
||||||
} from '@/utils/defaults';
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'MinimalSearch',
|
name: 'MinimalSearch',
|
||||||
|
components: {
|
||||||
|
SearchBar,
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
active: Boolean,
|
active: Boolean,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
input: '', // Users current search term
|
input: '', // Users current search term
|
||||||
akn: new ArrowKeyNavigation(), // Class that manages arrow key naviagtion
|
|
||||||
getCustomKeyShortcuts,
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -58,80 +36,9 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
/* Emmits users's search term up to parent */
|
/* Emmits users's search term up to parent */
|
||||||
userIsTypingSomething() {
|
userIsTypingSomething(searchValue) {
|
||||||
this.$emit('user-is-searchin', this.input);
|
this.input = searchValue;
|
||||||
},
|
this.$emit('user-is-searchin', searchValue);
|
||||||
/* Resets everything to initial state, when user is finished */
|
|
||||||
clearFilterInput() {
|
|
||||||
this.input = ''; // Clear input model
|
|
||||||
this.userIsTypingSomething(); // Emmit new empty value
|
|
||||||
document.activeElement.blur(); // Remove focus
|
|
||||||
this.akn.resetIndex(); // Reset current element index
|
|
||||||
},
|
|
||||||
/* Launches a given app when hotkey pressed */
|
|
||||||
handleHotKey(key) {
|
|
||||||
const usersHotKeys = this.getCustomKeyShortcuts();
|
|
||||||
usersHotKeys.forEach((hotkey) => {
|
|
||||||
if (hotkey.hotkey === parseInt(key, 10)) {
|
|
||||||
if (hotkey.url) window.open(hotkey.url, '_blank');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
/* Filter results as user types */
|
|
||||||
startFiltering(event) {
|
|
||||||
const currentElem = document.activeElement.id;
|
|
||||||
const { key, keyCode } = event;
|
|
||||||
/* If a modal is open, then do nothing */
|
|
||||||
if (!this.active) return;
|
|
||||||
if (/^[a-zA-Z]$/.test(key) && currentElem !== 'filter-tiles') {
|
|
||||||
/* Letter key pressed - start searching */
|
|
||||||
if (this.$refs.filter) this.$refs.filter.focus();
|
|
||||||
this.userIsTypingSomething();
|
|
||||||
} else if (/^[0-9]$/.test(key)) {
|
|
||||||
/* Number key pressed, check if user has a custom binding */
|
|
||||||
this.handleHotKey(key);
|
|
||||||
} else if (keyCode >= 37 && keyCode <= 40) {
|
|
||||||
/* Arrow key pressed - start navigation */
|
|
||||||
this.akn.arrowNavigation(keyCode);
|
|
||||||
} else if (keyCode === 27) {
|
|
||||||
/* Esc key pressed - reset form */
|
|
||||||
this.clearFilterInput();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
/* Open web search results in users desired method */
|
|
||||||
launchWebSearch(url, method) {
|
|
||||||
switch (method) {
|
|
||||||
case 'newtab':
|
|
||||||
window.open(url, '_blank');
|
|
||||||
break;
|
|
||||||
case 'sametab':
|
|
||||||
window.open(url, '_self');
|
|
||||||
break;
|
|
||||||
case 'workspace':
|
|
||||||
router.push({ name: 'workspace', query: { url } });
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
ErrorHandler(`Unknown opening method: ${method}`);
|
|
||||||
window.open(url, '_blank');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
/* If web search enabled, then launch search results when enter is pressed */
|
|
||||||
searchSubmitted() {
|
|
||||||
// Get search preferences from appConfig
|
|
||||||
const searchPrefs = this.appConfig.webSearch || {};
|
|
||||||
if (this.webSearchEnabled) { // Only proceed if user hasn't disabled web search
|
|
||||||
const openingMethod = searchPrefs.openingMethod || defaultSearchOpeningMethod;
|
|
||||||
// Get search engine, and make URL
|
|
||||||
const searchEngine = searchPrefs.searchEngine || defaultSearchEngine;
|
|
||||||
let searchUrl = searchEngineUrls[searchEngine];
|
|
||||||
if (!searchUrl) ErrorHandler(`Search engine not found - ${searchEngine}`);
|
|
||||||
if (searchEngine === 'custom' && searchPrefs.customSearchEngine) {
|
|
||||||
searchUrl = searchPrefs.customSearchEngine;
|
|
||||||
}
|
|
||||||
// Append users encoded query onto search URL, and launch
|
|
||||||
searchUrl += encodeURIComponent(this.input);
|
|
||||||
this.launchWebSearch(searchUrl, openingMethod);
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@ -142,61 +49,3 @@ export default {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
|
|
||||||
@import '@/styles/media-queries.scss';
|
|
||||||
|
|
||||||
form {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
.minimal-search-wrap {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
width: 100%;
|
|
||||||
p.web-search-note {
|
|
||||||
margin: 0;
|
|
||||||
color: var(--minimal-view-search-color);
|
|
||||||
opacity: var(--dimming-factor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
display: inline-block;
|
|
||||||
width: 80%;
|
|
||||||
max-width: 400px;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
padding: 0.5rem 1rem;
|
|
||||||
margin: 1rem auto;
|
|
||||||
outline: none;
|
|
||||||
border: 1px solid var(--outline-color);
|
|
||||||
border-radius: var(--curve-factor);
|
|
||||||
background: var(--minimal-view-search-background);
|
|
||||||
color: var(--minimal-view-search-color);
|
|
||||||
&:focus {
|
|
||||||
border-color: var(--minimal-view-search-color);
|
|
||||||
opacity: var(--dimming-factor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.clear-search {
|
|
||||||
color: var(--minimal-view-search-color);
|
|
||||||
padding: 0.15rem 0.5rem 0.2rem 0.5rem;
|
|
||||||
font-style: normal;
|
|
||||||
font-size: 1rem;
|
|
||||||
opacity: var(--dimming-factor);
|
|
||||||
border-radius: 50px;
|
|
||||||
cursor: pointer;
|
|
||||||
right: 0.5rem;
|
|
||||||
top: 1rem;
|
|
||||||
border: 1px solid var(--minimal-view-search-color);
|
|
||||||
font-size: 1rem;
|
|
||||||
margin: 0.5rem;
|
|
||||||
&:hover {
|
|
||||||
opacity: 1;
|
|
||||||
color: var(--minimal-view-search-background);
|
|
||||||
background: var(--minimal-view-search-color);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<form @submit.prevent="searchSubmitted">
|
<form @submit.prevent="searchSubmitted" :class="minimalSearch ? 'minimal' : 'normal'">
|
||||||
<label for="filter-tiles">{{ $t('search.search-label') }}</label>
|
<label for="filter-tiles">{{ $t('search.search-label') }}</label>
|
||||||
<div class="search-wrap">
|
<div class="search-wrap">
|
||||||
<input
|
<input
|
||||||
@ -35,6 +35,9 @@ import {
|
|||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'FilterTile',
|
name: 'FilterTile',
|
||||||
|
props: {
|
||||||
|
minimalSearch: Boolean, // If true, then keep it simple
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
input: '', // Users current search term
|
input: '', // Users current search term
|
||||||
@ -128,7 +131,10 @@ export default {
|
|||||||
const searchEngine = searchPrefs.searchEngine || defaultSearchEngine;
|
const searchEngine = searchPrefs.searchEngine || defaultSearchEngine;
|
||||||
// Use either search bang, or preffered search engine
|
// Use either search bang, or preffered search engine
|
||||||
const desiredSearchEngine = searchBang || searchEngine;
|
const desiredSearchEngine = searchBang || searchEngine;
|
||||||
let searchUrl = findUrlForSearchEngine(desiredSearchEngine, searchEngineUrls);
|
const isCustomSearch = (searchPrefs.searchEngine === 'custom' && searchPrefs.customSearchEngine);
|
||||||
|
let searchUrl = isCustomSearch
|
||||||
|
? searchPrefs.customSearchEngine
|
||||||
|
: findUrlForSearchEngine(desiredSearchEngine, searchEngineUrls);
|
||||||
if (searchUrl) { // Append search query to URL, and launch
|
if (searchUrl) { // Append search query to URL, and launch
|
||||||
searchUrl += encodeURIComponent(stripBangs(this.input, bangList));
|
searchUrl += encodeURIComponent(stripBangs(this.input, bangList));
|
||||||
this.launchWebSearch(searchUrl, openingMethod);
|
this.launchWebSearch(searchUrl, openingMethod);
|
||||||
@ -144,13 +150,7 @@ export default {
|
|||||||
|
|
||||||
@import '@/styles/media-queries.scss';
|
@import '@/styles/media-queries.scss';
|
||||||
|
|
||||||
section {
|
form.normal {
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
align-items: stretch;
|
|
||||||
background: linear-gradient(0deg, var(--background) 0%, var(--background-darker) 100%);
|
|
||||||
}
|
|
||||||
form {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border-radius: 0 0 var(--curve-factor-navbar) 0;
|
border-radius: 0 0 var(--curve-factor-navbar) 0;
|
||||||
@ -191,7 +191,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.clear-search {
|
.clear-search {
|
||||||
//position: absolute;
|
|
||||||
color: var(--settings-text-color);
|
color: var(--settings-text-color);
|
||||||
padding: 0 0.3rem 0.1rem 0.3rem;
|
padding: 0 0.3rem 0.1rem 0.3rem;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -202,7 +201,6 @@ export default {
|
|||||||
right: 0.5rem;
|
right: 0.5rem;
|
||||||
top: 1rem;
|
top: 1rem;
|
||||||
border: 1px solid var(--settings-text-color);
|
border: 1px solid var(--settings-text-color);
|
||||||
font-size: 1rem;
|
|
||||||
margin: 0.25rem;
|
margin: 0.25rem;
|
||||||
&:hover {
|
&:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
@ -212,13 +210,13 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@include tablet {
|
@include tablet {
|
||||||
form {
|
form.normal {
|
||||||
display: block;
|
display: block;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include phone {
|
@include phone {
|
||||||
form {
|
form.nomral {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -226,4 +224,56 @@ export default {
|
|||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
form.minimal {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
label { display: none; }
|
||||||
|
.search-wrap {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
p.web-search-note {
|
||||||
|
margin: 0;
|
||||||
|
color: var(--minimal-view-search-color);
|
||||||
|
opacity: var(--dimming-factor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
input {
|
||||||
|
display: inline-block;
|
||||||
|
width: 80%;
|
||||||
|
max-width: 400px;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
margin: 1rem auto;
|
||||||
|
outline: none;
|
||||||
|
border: 1px solid var(--outline-color);
|
||||||
|
border-radius: var(--curve-factor);
|
||||||
|
background: var(--minimal-view-search-background);
|
||||||
|
color: var(--minimal-view-search-color);
|
||||||
|
&:focus {
|
||||||
|
border-color: var(--minimal-view-search-color);
|
||||||
|
opacity: var(--dimming-factor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.clear-search {
|
||||||
|
color: var(--minimal-view-search-color);
|
||||||
|
padding: 0.15rem 0.5rem 0.2rem 0.5rem;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 1rem;
|
||||||
|
opacity: var(--dimming-factor);
|
||||||
|
border-radius: 50px;
|
||||||
|
cursor: pointer;
|
||||||
|
right: 0.5rem;
|
||||||
|
top: 1rem;
|
||||||
|
border: 1px solid var(--minimal-view-search-color);
|
||||||
|
margin: 0.5rem;
|
||||||
|
&:hover {
|
||||||
|
opacity: 1;
|
||||||
|
color: var(--minimal-view-search-background);
|
||||||
|
background: var(--minimal-view-search-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -24,7 +24,7 @@ const getDomainFromUrl = (url) => {
|
|||||||
*/
|
*/
|
||||||
const filterHelper = (compareStr, searchStr) => {
|
const filterHelper = (compareStr, searchStr) => {
|
||||||
if (!compareStr) return false;
|
if (!compareStr) return false;
|
||||||
const process = (input) => input.toString().toLowerCase().replace(/[^\w\s]/gi, '');
|
const process = (input) => input && input.toString().toLowerCase().replace(/[^\w\s]/gi, '');
|
||||||
return process(compareStr).includes(process(searchStr));
|
return process(compareStr).includes(process(searchStr));
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -37,6 +37,7 @@ const filterHelper = (compareStr, searchStr) => {
|
|||||||
* @returns A filtered array of tiles
|
* @returns A filtered array of tiles
|
||||||
*/
|
*/
|
||||||
export const searchTiles = (allTiles, searchTerm) => {
|
export const searchTiles = (allTiles, searchTerm) => {
|
||||||
|
if (!searchTerm) return allTiles; // If no search term, then return all
|
||||||
if (!allTiles) return []; // If no data, then skip
|
if (!allTiles) return []; // If no data, then skip
|
||||||
return allTiles.filter((tile) => {
|
return allTiles.filter((tile) => {
|
||||||
const {
|
const {
|
||||||
|
@ -9,7 +9,9 @@
|
|||||||
<router-link to="/">
|
<router-link to="/">
|
||||||
<h1>{{ pageInfo.title }}</h1>
|
<h1>{{ pageInfo.title }}</h1>
|
||||||
</router-link>
|
</router-link>
|
||||||
<MinimalSearch @user-is-searchin="(s) => { this.searchValue = s; }" :active="!modalOpen" />
|
<MinimalSearch
|
||||||
|
@user-is-searchin="(s) => { this.searchValue = s; }"
|
||||||
|
:active="!modalOpen" ref="filterComp" />
|
||||||
</div>
|
</div>
|
||||||
<div v-if="checkTheresData(sections)"
|
<div v-if="checkTheresData(sections)"
|
||||||
:class="`item-group-container ${!tabbedView ? 'showing-all' : ''}`">
|
:class="`item-group-container ${!tabbedView ? 'showing-all' : ''}`">
|
||||||
@ -87,7 +89,7 @@ export default {
|
|||||||
watch: {
|
watch: {
|
||||||
/* When the theme changes, then call the update method */
|
/* When the theme changes, then call the update method */
|
||||||
searchValue() {
|
searchValue() {
|
||||||
this.tabbedView = !(this.searchValue.length > 0);
|
this.tabbedView = !this.searchValue || this.searchValue.length === 0;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@ -116,7 +118,7 @@ export default {
|
|||||||
},
|
},
|
||||||
/* Clears input field, once a searched item is opened */
|
/* Clears input field, once a searched item is opened */
|
||||||
finishedSearching() {
|
finishedSearching() {
|
||||||
this.$refs.filterComp.clearFilterInput();
|
this.$refs.filterComp.clearMinFilterInput();
|
||||||
},
|
},
|
||||||
/* Extracts the site name from domain, used for the searching functionality */
|
/* Extracts the site name from domain, used for the searching functionality */
|
||||||
getDomainFromUrl(url) {
|
getDomainFromUrl(url) {
|
||||||
|
Loading…
Reference in New Issue
Block a user