Git Product home page Git Product logo

leon-kfd / dashboard Goto Github PK

View Code? Open in Web Editor NEW
922.0 7.0 114.0 202.47 MB

Custom your personal browser start page from some configurable components.

Home Page: https://doc.howdz.xyz

License: MIT License

JavaScript 2.69% HTML 0.51% Vue 77.00% SCSS 2.14% TypeScript 17.30% Shell 0.02% CSS 0.34%
vue vite typescript dashboard chrome-extension service-worker browser-start-page chrome edge-extension component

dashboard's Introduction

Howdz

Howdz Dashboard

基于Vue3, Typescript, Vite的一个完全自定义配置的浏览器起始页

Document

Website

Feature

  • 💫 提供基于文档流的响应布局或Fixed模式固定任意位置的两种布局模式
  • 响应式设计,编辑模式下拖拽组件更改其大小和位置
  • 🍭 组件可自由添加或删除,并且组件的样式功能都是可配置的
  • 🍌 数据可使用密钥JSON文件导出以实现数据同步功能
  • 🎉 预设多种主题,初始进入可任意选择
  • 🏳️‍🌈 支持本地壁纸随机壁纸,随机壁纸支持收藏个人壁纸库
  • 🌟 可配置动态壁纸背景,选用官方提供或自行添加网络视频路径即可
  • 📋 可配置多标签页模式,允许添加切换多个隔离的页面
  • 🍦 可配置组件交互行为,设置点击组件弹出另一个组件等交互操作
  • 🎲 预览模式, 支持用于分享用的数据隔离模式
  • 🌐 支持语言切换,当前支持简体中文英文

Screenshot

Materials

Empty - 占位

占位区块组件,支持一些简单配置与自定义文本

Clock - 时钟

简单的时钟组件

Day - 自定义日期

Clock的升级版,更强大的定义各种日期格式,使用Dayjs的 formatter格式化占位符 语法进行自定义。另外若最小单位是秒的,请更改组件刷新频率为1s。

Verse - 随机古诗

随机古诗组件,API 来源于`https://www.jinrishici.com/`, 可配置定时刷新

Search - 搜索栏
  • 支持添加自定义搜索引擎
  • 按 Tab 键快速切换搜索引擎
  • 支持关键词联想
  • Collection - 键盘收藏夹

    键盘收藏夹,设置网站后按相应按键自动跳转,网站 Icon 自动获取

    Iframe - 外部网站

    设置嵌入Iframe,最新版浏览器只支持同协议(当前网站为 https)的Iframe

    TodoList - 备忘清单

    可同时设置不同日期,点击上方日期展开日期选择器

    Weather - 天气

    天气组件,支持通过 IP 自动获取城市也可手动输入,后续考虑添加读取 GPS

    CountDown - 倒计时

    支持天、小时、分钟三种单位的设置倒计时事件

    JuejinList - 掘金热门

    显示最新热门列表,支持配置自动刷新

    WeiboList - 微博热搜

    显示最新微博热搜列表,支持配置自动刷新

    GithubTrending - Github 趋势

    显示当天Github Trending列表,支持配置自动刷新

    ZhihuList - 知乎热榜

    显示当前知乎热榜,支持配置自动刷新

    Editor - Markdown编辑器

    基于Milkdown实现,支持按需加载各种插件包括:

  • Tooltip: 在选择文本后会在其上方出现工具栏可快速切换格式
  • Slash: 斜线命令,输入“/”后会弹出快速选择工具栏
  • Clipboard: 为编辑器添加复制粘贴Markdown格式功能
  • History: 增加历史记录功能,使用Ctrl+ZCtrl+Y
  • Prism: 为代码块增加高亮功能
  • MovieLine - 电影经典台词

    随机一句电影经典台词,并展示其电影海报作为背景,支持动态设置各种显示

    Bookmark - 书签

    书签管理器,当前文件夹只支持一级目录。

  • 添加时输入网址可自动获取网站ICON与标题
  • 图标样式、大小、背景色都可自定义,图标可缓存为Base64
  • 支持从Chrome内核的浏览器导出的书签HTML文件导入
  • More

    License

    All for MIT

    Copyright (c) 2024 Leon.D

    dashboard's People

    Contributors

    dsource avatar leon-kfd avatar zalj avatar

    Stargazers

     avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

    Watchers

     avatar  avatar  avatar  avatar  avatar  avatar  avatar

    dashboard's Issues

    Wrong date for the TODO

    image

    The TODO is one day behind the actual date. The clock is right below. Hope there is a place we can manually set the date.

    Update, when I create a new TODO, this time the date is correct but the weekday on top is wrong:
    image

    12th is Wednesday not Tuesday.

    关于中英文空格的问题

    Hi,无论如何先感谢做出这个项目。

    有一个关于命名的建议,目前的命名为 Howdz起始页Howdz起始页 之间是没有空格的,参考中英文排版指南中的说明,中英文之间应尽量添加上空格,即 Howdz 起始页。一方面符合排版规范,另一方面也让字符的显示更和谐一些,能突出 Howdz 本身。

    感谢阅读:)

    建议增加壁纸随机图片的间隔刷新

    现在使用随机壁纸功能的时候,每一次打开新的标签页,都会获取新的壁纸。在网络环境一般的时候,每次都要一到两秒才能把壁纸刷出来,体验有点差。希望可以增加一个配置时间,每隔多长时间才会去刷新一次壁纸。

    Notice: Search组件ICON路径更改

    2021-11-12
    最新更新中更改了Search组件的ICON路径,若出现图标加载异常情况,请删除Search组件重新添加即可。

    TODO:书签导航面板组件

    demo

    当前提供了一个键盘导航栏组件,需另外提供一个普通的导航收藏夹(书签),并适配手机端页面。

    • 多级结构,可以创建文件夹
    • 图标可以自动获取(现有api),文字图标兜底
    • 自定义背景色、图标圆角、图标大小(textBaseSize)
    • 可以考虑实现从Chrome导出书签的html文件中读取书签。

    TODO: 新增点击文本弹出物料的模式

    准备新增一种模式,物料默认不需展示。当点击某个文本或按钮的时候才弹出。例如:TodoList物料,可以在界面上只显示一个Todo文本,在点击后才弹出真正的TodoList面板。
    类似Momentum的这种展示,面板的展示可以自己配置位置(Toolips)。

    TODO: 物料组件-文本编辑器

    新增一个类似文本编辑器的物料,可以让用户快速记录一些文本信息。初步可能选用Quill Editor。因为当前所有用户数据都是保存到Localstorage,容量不大(5M),所以编辑器中用户的图片如何保存是一个问题。

    TODO: 支持网络字体配置

    当前字体选择器只会读取用户系统的部分字体,后面规划支持网络字体,初步应该选用Google字体的**镜像。因为中文字体文件一般比较大,所以字体需要进入service worker缓存。

    TODO: 合并基础配置与组件配置同一面板

    可能很多用户一开始并不理解基础配置(组件位置、大小、背景图, .etc)与组件配置(组件特有的设置)两个的区别,规划将两者合并在一起,左侧面板显示基础配置、右侧面板显示组件配置,添加组件也一样在添加的时候可以同时配置好组件的相关信息,不用添加后在改。

    要求:英语和谷歌支持

    我非常喜欢这个扩展。 但它不支持英语。 以及搜索栏中没有谷歌搜索。 提供英语和谷歌支持将是我的谦卑要求。 我不知道如何进行扩展,否则我会尝试这样做。 感谢您制作了这个惊人的扩展。 顺便说一句,我不懂中文,我只是用谷歌翻译。

    请求增加在当前页面打开网页的选项

    作为new tab,我觉得在打开我想要的网页之后,它就没必要存在了,但是现在(起码我周五使用的时候还是)所有新打开的网页都是后台新tab,希望能够增加选项,让用户决定新页面是在当前tab打开还是后台打开

    TODO: 物料组件-日期

    • 当前只有一个时间物料组件,也要增加展示12时制还是24时制的配置
    • 准备再加一个日期物料,展示YYYY-MM-DD等自定义格式

    建议增加缓存/预设机制

    没有网络打开浏览器后,各种弹无法获取坐标数据,无法获取XX数据,并且背景无法加载,晃眼看不清,建议增加数据缓存机制,或者预设机制,至少保证背景图的正常。

    按键导航无法添加内网网址

    添加按键导航时,如果输入的是内网网址,点击确认后会一直转圈圈,无法添加。如果关闭网络再添加,就可以成功。是不是在联网状态下添加会通过第三方服务器获取网址图标?获取成功后才能添加?

    希望添加搜索框选择删除某条记录的功能

    当前版本中搜索框记录有一次全部清除历史记录的按钮,希望能添加一个单独删除某条记录的按钮,像百度首页搜索框的记录删除功能一样即可。

    搜索框记录在一定程度上会充当收藏夹/常用搜索的功能,因为一些一次性搜索记录挤占掉常用搜索记录的位置有些不妥,而且重复搜索历史记录中的关键词,记录的顺序并不会更新保持置顶,这种不是因为时间权重而是综合新出现于时间权重的排序方式会让记录被没有出现过的关键词挤占掉位置。

    TODO:增加标签页切换模式

    类似主流手机上的屏幕管理,每页展示各自的组件。

    当前实现要考虑:

    • 标签页管理模块(用户如何配置)
    • 用户数据config要改为数组(要考虑旧数据兼容)
    • 切换时考虑动画
    • 性能:初始进入只加载第一页的资源

    Without internet icon and images not showing. Also there is no way to add images from local storage.

    Everything is pretty good. I am enjoying it so much. however, whenever I open a new tab it takes some time to show the wallpaper. Also without the internet, the icon and wallpaper are of no use. It would be great if it store these image files in local storage then fetch them from there. Also if there is an option to load the local storage video or images as wallpaper it will be great. Maybe in the future, these functions will come. I am eagerly waiting

    TODO: 将VueDraggable改为VueGridLayout

    之前看到VueGridLayout已经有个beta版支持Vue3了,所以想将目前的Layout模式更改。

    • VueGridLayout可以使用户更方便的同时更改组件的位置与大小。当前更改组件的Size需要右键菜单进入编辑才能更改,而VueGridLayout可以直接拓展更改。当这样就要将之前的Size单位进行更改,不可以再支持px单位了。
    • Fixed模式继续保留,但只支持px单位。

    这种对代码更改比较多,要点时间调研研究。。。

    关于自定义引擎

    Quicker_20211016_191334
    请问怎么更换搜索引擎,我看b站视频一下子就切换到更换搜索引擎的页面,但我就找不到入口,根本没法上拉,也没看到选项

    搜索引擎Bing无法直接调用

    开发者您好。
    在用版本1.2.4,浏览器Chrome for Mac。近期使用过程中发现搜索引擎Bing的调用似乎出现了问题。
    具体表现为在搜索栏使用Bing国际版和/国内版输入内容后不能直接搜索内容而是跳出了Bing的空白页,需要再次键入搜索内容。
    用百度的话似乎不会出现这个情况。
    感谢您的开发的扩展程序,一直以来都很喜欢。
    祝好。

    Recommend Projects

    • React photo React

      A declarative, efficient, and flexible JavaScript library for building user interfaces.

    • Vue.js photo Vue.js

      🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

    • Typescript photo Typescript

      TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

    • TensorFlow photo TensorFlow

      An Open Source Machine Learning Framework for Everyone

    • Django photo Django

      The Web framework for perfectionists with deadlines.

    • D3 photo D3

      Bring data to life with SVG, Canvas and HTML. 📊📈🎉

    Recommend Topics

    • javascript

      JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

    • web

      Some thing interesting about web. New door for the world.

    • server

      A server is a program made to process requests and deliver data to clients.

    • Machine learning

      Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

    • Game

      Some thing interesting about game, make everyone happy.

    Recommend Org

    • Facebook photo Facebook

      We are working to build community through open source technology. NB: members must have two-factor auth.

    • Microsoft photo Microsoft

      Open source projects and samples from Microsoft.

    • Google photo Google

      Google ❤️ Open Source for everyone.

    • D3 photo D3

      Data-Driven Documents codes.