Skip to content

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
evandor committed Nov 7, 2024
1 parent 6a219ee commit f4e81c7
Show file tree
Hide file tree
Showing 10 changed files with 185 additions and 117 deletions.
5 changes: 5 additions & 0 deletions src/app/models/AppFeatures.ts
Original file line number Diff line number Diff line change
Expand Up @@ -181,6 +181,11 @@ export class AppFeatures {
'Analyse tab contents and use the distraction-free Reading Mode if applicable',
'library_books', '', ['bex']),

new Feature(FeatureIdent.HTML_SNIPPETS, FeatureType.EXPERIMENTAL,
'HTML Snippets',
'Drag and drop Text and Images to the sidebar to create Website Snippets',
'text_snippet', '', ['bex']),

]

getFeature(f: FeatureIdent): Feature | undefined {
Expand Down
3 changes: 2 additions & 1 deletion src/app/models/FeatureIdent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,8 @@ export enum FeatureIdent {
RESEARCH_SESSIONS="RESEARCH_SESSIONS",
DYNAMIC_TABSET="DYNAMIC_TABSET",
GALLERY="GALLERY",
READING_MODE="READING_MODE"
READING_MODE="READING_MODE",
HTML_SNIPPETS="HTML_SNIPPETS"
}

export enum FeatureType {
Expand Down
67 changes: 53 additions & 14 deletions src/components/SidePanelFooter.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,15 @@
 
</div>
<div v-else class="col text-right">

<span>
<input
class="q-ma-none q-pa-none"
v-if="useFeaturesStore().hasFeature(FeatureIdent.HTML_SNIPPETS) && useContentStore().currentTabUrl"
v-model="ignored"
style="border:1px dotted grey;border-radius:3px;max-width:30px;max-height:20px"
@drop="drop($event)"/>
<q-tooltip class="tooltip_small">Drag and drop text or images from your current tab</q-tooltip>
</span>
<span>
<q-btn icon="o_settings" v-if="showSettingsButton()"
class="q-my-xs q-px-xs q-mr-none"
Expand Down Expand Up @@ -131,16 +139,16 @@
<q-tooltip :delay="2000" anchor="center left" self="center right"
class="tooltip-small">Tabsets as full-page app</q-tooltip>
</q-icon>
<!-- <q-menu :offset="[0, 7]" fit>-->
<!-- <q-list dense style="min-width: 200px;min-height:50px">-->
<!-- <q-item clickable v-close-popup>-->
<!-- <q-item-section @click="openExtensionTab()">Tabsets as full-page app</q-item-section>-->
<!-- </q-item>-->
<!-- <q-item clickable v-close-popup>-->
<!-- <q-item-section @click="openPwaUrl()">Tabsets Online Access</q-item-section>-->
<!-- </q-item>-->
<!-- </q-list>-->
<!-- </q-menu>-->
<!-- <q-menu :offset="[0, 7]" fit>-->
<!-- <q-list dense style="min-width: 200px;min-height:50px">-->
<!-- <q-item clickable v-close-popup>-->
<!-- <q-item-section @click="openExtensionTab()">Tabsets as full-page app</q-item-section>-->
<!-- </q-item>-->
<!-- <q-item clickable v-close-popup>-->
<!-- <q-item-section @click="openPwaUrl()">Tabsets Online Access</q-item-section>-->
<!-- </q-item>-->
<!-- </q-list>-->
<!-- </q-menu>-->
</span>
<q-btn v-else-if="useFeaturesStore().hasFeature(FeatureIdent.STANDALONE_APP)"
icon="o_open_in_new"
Expand Down Expand Up @@ -168,7 +176,7 @@ import {useUtils} from "src/core/services/Utils";
import {useWindowsStore} from "src/windows/stores/windowsStore";
import {useSuggestionsStore} from "src/suggestions/stores/suggestionsStore";
import _ from "lodash";
import {SuggestionState} from "src/suggestions/models/Suggestion";
import {Suggestion, SuggestionState} from "src/suggestions/models/Suggestion";
import SuggestionDialog from "src/suggestions/dialogues/SuggestionDialog.vue";
import {Tabset} from "src/tabsets/models/Tabset";
import {ToastType} from "src/core/models/Toast";
Expand All @@ -186,6 +194,11 @@ import {useTabsetsStore} from "src/tabsets/stores/tabsetsStore";
import {useFeaturesStore} from "src/features/stores/featuresStore";
import {SidePanelViews} from "src/models/SidePanelViews";
import {TabAndTabsetId} from "src/tabsets/models/TabAndTabsetId";
import {useCommandExecutor} from "src/core/services/CommandExecutor";
import {AddTabToTabsetCommand} from "src/tabsets/commands/AddTabToTabsetCommand";
import {Tab, TabSnippet} from "src/tabsets/models/Tab";
import BrowserApi from "src/app/BrowserApi";
import {useContentStore} from "src/content/stores/contentStore";
const {handleSuccess, handleError} = useNotificationHandler()
Expand All @@ -206,6 +219,7 @@ const doShowSuggestionButton = ref(false)
const transitionGraceTime = ref(false)
const showWindowTable = ref(false)
const showStatsTable = ref(false)
const ignored = ref('')
const showLogin = ref(false)
const randomKey = ref<string>(uid())
const progressValue = ref<number>(0.0)
Expand Down Expand Up @@ -242,15 +256,15 @@ watchEffect(() => {
showSuggestionButton.value =
doShowSuggestionButton.value ||
(useUiStore().sidePanelActiveViewIs(SidePanelViews.MAIN) &&
_.findIndex(suggestions, (s:Suggestion) => {
_.findIndex(suggestions, (s: Suggestion) => {
return s.state === SuggestionState.NEW ||
(s.state === SuggestionState.NOTIFICATION && !useFeaturesStore().hasFeature(FeatureIdent.NOTIFICATIONS))
}) >= 0)
showSuggestionIcon.value =
!doShowSuggestionButton.value &&
useUiStore().sidePanelActiveViewIs(SidePanelViews.MAIN) &&
_.findIndex(suggestions, (s:Suggestion) => {
_.findIndex(suggestions, (s: Suggestion) => {
return s.state === SuggestionState.DECISION_DELAYED
}) >= 0
})
Expand Down Expand Up @@ -481,6 +495,31 @@ const additionalActionWasClicked = (event: any) => {
const offsetBottom = () => ($q.platform.is.capacitor || $q.platform.is.cordova) ? 'margin-bottom:20px;' : ''
const openPwaUrl = () => NavigationService.openOrCreateTab([process.env.TABSETS_PWA_URL || 'https://www.skysail.io'])
const showSettingsButton = () => route?.path !== '/sidepanel/welcome' || useAuthStore().isAuthenticated
const drop = (evt: any) => {
evt.preventDefault()
var text = evt.dataTransfer.getData('text')
var html = evt.dataTransfer.getData('text/html')
const currentTabUrl = useContentStore().currentTabUrl
console.log("===>", evt, text, html, currentTabUrl)
if (currentTabUrl) {
const existing: Tab | undefined = useTabsetsStore().tabForUrlInSelectedTabset(currentTabUrl!)
if (existing) {
existing.snippets.push(new TabSnippet(text, html))
existing.title = "Snippet ("+existing.snippets.length+")"
const currentTabset = useTabsetsStore().getCurrentTabset
if (currentTabset) {
useTabsetsStore().saveTabset(currentTabset)
}
} else {
const tab = new Tab(uid(), BrowserApi.createChromeTabObject("Snippet", currentTabUrl!))
tab.snippets.push(new TabSnippet(text, html))
tab.description = text
useCommandExecutor().executeFromUi(new AddTabToTabsetCommand(tab))
}
}
}
</script>

<style>
Expand Down
99 changes: 74 additions & 25 deletions src/pages/SidePanelCollectionsPage.vue
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,8 @@

<div class="col-12 q-my-lg">
<q-list>
<q-item clickable v-for="c in projects" @click="selectCollection(c as Tabset)">
<q-item clickable v-for="c in tabsets"
@click="selectCollection(c as Tabset)">
<q-item-section>
<q-item-label>
<q-icon name="o_featured_play_list" class="q-mr-xs q-mb-xs"/>
Expand All @@ -28,6 +29,25 @@
</q-item>
</q-list>
</div>

<div>
<Draggable v-if="treeData"
class="mtl-tree q-pl-md" v-model="treeData" treeLine :tree-line-offset="0">
<template #default="{ node, stat }">
<OpenIcon
v-if="stat.children.length"
:open="stat.open"
class="mtl-mr"
@click.native="stat.open = !stat.open"
/>
<span class="mtl-ml cursor-pointer" @click="handleTreeClick(node, level)">
<q-icon v-if="node.level == 0" name="o_tab" color="warning" class="q-mx-sm" />
<q-icon v-else name="o_folder" color="warning" class="q-mx-sm" />
{{ node.text }}</span>
</template>
</Draggable>
</div>

</div>


Expand All @@ -42,7 +62,6 @@
<script lang="ts" setup>
import {onMounted, onUnmounted, ref, watchEffect} from "vue";
import {useUtils} from "src/core/services/Utils";
import {useUiStore} from "src/ui/stores/uiStore";
import Analytics from "src/core/utils/google-analytics";
import {useI18n} from 'vue-i18n'
Expand All @@ -51,25 +70,21 @@ import _ from "lodash"
import {useTabsetsStore} from "src/tabsets/stores/tabsetsStore";
import {SelectTabsetCommand} from "src/tabsets/commands/SelectTabset";
import {useCommandExecutor} from "src/core/services/CommandExecutor";
import {ExecutionFailureResult, ExecutionResult} from "src/core/domain/ExecutionResult";
import {ExecutionResult} from "src/core/domain/ExecutionResult";
import {useRouter} from "vue-router";
import FirstToolbarHelper2 from "pages/sidepanel/helper/FirstToolbarHelper2.vue";
import SidePanelCollectionPageToolbar from "pages/sidepanel/helper/SidePanelCollectionPageToolbar.vue";
import SidePanelCollectionsPageToolbar from "pages/sidepanel/helper/SidePanelCollectionsPageToolbar.vue";
import {useFeaturesStore} from "src/features/stores/featuresStore";
import {FeatureIdent} from "src/app/models/FeatureIdent";
import {useSpacesStore} from "src/spaces/stores/spacesStore";
import {Draggable, OpenIcon} from "@he-tree/vue";
import '@he-tree/vue/style/default.css'
const {t} = useI18n({locale: navigator.language, useScope: "global"})
const {inBexMode} = useUtils()
const router = useRouter()
const uiStore = useUiStore()
const view = ref('projects')
const tabsets = ref<Tabset[]>([])
const projects = ref<Tabset[]>([])
const project = ref('')
const treeData = ref<object[]>()
function updateOnlineStatus(e: any) {
const {type} = e
Expand All @@ -89,8 +104,26 @@ onUnmounted(() => {
// window.removeEventListener('keypress', checkKeystroke);
})
function treeNodeFromNote(n: Tabset, level = 0): object {
console.log("treeNodeFromNote", treeNodeFromNote)
return {
text: n.name,
id: n.id,
level,
url: chrome.runtime.getURL(`/www/index.html#/mainpanel/notes/${n.id}`),
children: _.map(n.folders, (f: Tabset) => {
return treeNodeFromNote(f, level + 1)
})
}
}
watchEffect(async () => {
projects.value = [...useTabsetsStore().tabsets.values()]
if (tabsets.value && tabsets.value.length > 0) {
console.log("tabsets.value", tabsets.value)
treeData.value = _.map(tabsets.value, (f: Tabset) => {
return treeNodeFromNote(f)
})
}
})
const getTabsetOrder =
Expand All @@ -103,17 +136,25 @@ const getTabsetOrder =
}
]
function determineTabsets() {
return _.sortBy(
_.filter([...useTabsetsStore().tabsets.values()] as Tabset[],
(ts: Tabset) => ts.status !== TabsetStatus.DELETED
&& ts.status !== TabsetStatus.HIDDEN &&
ts.status !== TabsetStatus.ARCHIVED),
getTabsetOrder, ["asc"]);
}
watchEffect(() => {
tabsets.value = determineTabsets()
watchEffect(async () => {
if (useFeaturesStore().hasFeature(FeatureIdent.SPACES)) {
const currentSpace = useSpacesStore().space
console.log("currentspace", currentSpace)
tabsets.value = _.sortBy(
_.filter([...useTabsetsStore().tabsets.values()] as Tabset[], (ts: Tabset) => {
if (currentSpace) {
if (ts.spaces.indexOf(currentSpace.id) < 0) {
return false
}
}
return ts.status !== TabsetStatus.DELETED &&
ts.status !== TabsetStatus.HIDDEN &&
ts.status !== TabsetStatus.ARCHIVED
}),
getTabsetOrder, ["asc"])
} else {
tabsets.value = [...useTabsetsStore().tabsets.values()]
}
})
const selectCollection = (c: Tabset) => {
Expand All @@ -126,6 +167,14 @@ const selectCollection = (c: Tabset) => {
}
})
}
const handleTreeClick = (node: any, level:number) => {
console.log("clicked", node, level)
if (level == 0) {
selectCollection(node as Tabset)
}
}
</script>

<style lang="scss">
Expand Down
25 changes: 0 additions & 25 deletions src/pages/SidePanelPage2.vue
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,6 @@

<StartingHint v-if="showStartingHint()"/>

<!-- {{ useContentStore().currentTabUrl}} {{ useContentStore().currentTabStorage}}-->
<!-- <hr>-->
<!-- {{ td() }}-->
</div>

<!-- place QPageSticky at end of page -->
Expand Down Expand Up @@ -92,7 +89,6 @@ import TabsetService from "src/tabsets/services/TabsetService";
import Analytics from "src/core/utils/google-analytics";
import {useAuthStore} from "stores/authStore";
import {useSuggestionsStore} from "src/suggestions/stores/suggestionsStore";
import {TITLE_IDENT} from "boot/constants";
import AppService from "src/app/AppService";
import {useI18n} from 'vue-i18n'
import {useTabsetsStore} from "src/tabsets/stores/tabsetsStore";
Expand All @@ -101,8 +97,6 @@ import {useFeaturesStore} from "src/features/stores/featuresStore";
import SidePanelPageTabList from "src/tabsets/layouts/SidePanelPageTabList.vue";
import {useWindowsStore} from "src/windows/stores/windowsStore";
import StartingHint from "pages/widgets/StartingHint.vue";
import {useActionHandlers} from "src/tabsets/actionHandling/ActionHandlers";
import {ActionHandlerButtonClickedHolder} from "src/tabsets/actionHandling/model/ActionHandlerButtonClickedHolder";
import SidePanelNotesView from "src/notes/views/sidepanel/SidePanelNotesView.vue";
import SidePanelFoldersView from "src/tabsets/views/sidepanel/SidePanelFoldersView.vue";
import FirstToolbarHelper2 from "pages/sidepanel/helper/FirstToolbarHelper2.vue";
Expand Down Expand Up @@ -339,20 +333,6 @@ function checkKeystroke(e: KeyboardEvent) {
}
}
const toolbarTitle = (tabsets: Tabset[]): string => {
if (useFeaturesStore().hasFeature(FeatureIdent.SPACES)) {
const spaceName = useSpacesStore().space ? useSpacesStore().space.label : t('no_space_selected')
return tabsets.length > 6 ?
spaceName + ' (' + tabsets.length.toString() + ')' :
spaceName
}
const title: string = LocalStorage.getItem(TITLE_IDENT) || ('My Tabsets' + stageIdentifier())
return tabsets.length > 6 ? title + ' (' + tabsets.length.toString() + ')' : title
}
const stageIdentifier = () => process.env.TABSETS_STAGE !== 'PRD' ? ' (' + process.env.TABSETS_STAGE + ')' : ''
const tabsetForTabList = (tabset: Tabset) => {
if (tabset.folderActive) {
const af = useTabsetService().findFolder(tabset.folders, tabset.folderActive)
Expand All @@ -363,11 +343,6 @@ const tabsetForTabList = (tabset: Tabset) => {
return tabset
}
const handleButtonClicked = async (tabset: Tabset, args: ActionHandlerButtonClickedHolder, folder?: Tabset) => {
console.log(`button clicked: tsId=${tabset.id}, folderId=${folder?.id}, args=...`)
await useActionHandlers(undefined).handleClick(tabset, currentChromeTab.value!, args, folder)
}
const showStartingHint = () => !useUiStore().appLoading && useTabsetsStore().allTabsCount === 0
Expand Down
12 changes: 6 additions & 6 deletions src/pages/sidepanel/SidePanelPageContextMenu.vue
Original file line number Diff line number Diff line change
Expand Up @@ -74,12 +74,12 @@
label="Show Gallery"/>
</template>

<ContextMenuItem v-if="useTabsetsStore().tabsets.size > 6"
v-close-popup
@was-clicked="focus(tabset)"
icon="filter_center_focus"
color="accent"
label="Focus on tabset"/>
<!-- <ContextMenuItem v-if="useTabsetsStore().tabsets.size > 6"-->
<!-- v-close-popup-->
<!-- @was-clicked="focus(tabset)"-->
<!-- icon="filter_center_focus"-->
<!-- color="accent"-->
<!-- label="Focus on tabset"/>-->

<!-- <template v-if="tabset.status === TabsetStatus.DEFAULT && useTabsetsStore().tabsets.size > 4">-->
<!-- <ContextMenuItem v-close-popup-->
Expand Down
Loading

0 comments on commit f4e81c7

Please sign in to comment.