Giter VIP home page Giter VIP logo

gui's Introduction

The home page, showing a grid of project cards that you can click to edit the descriptions of

A graphical user interface for ortfo

time spent on project

Installation

Ubuntu / Debian

.deb archives will be available, starting with the next release.

Fedora / CentOS

.rpm archives will be available, starting with the next release.

Arch Linux / Manjaro

The AUR has 3 ortfo packages:

  • ortfo compiles from latest version
  • ortfo-bin pre-compiled binary of the latest version
  • ortfo-git compiles from the latest git commit

Slackware

.tgz archives will be available, starting with the next release.

AppImage

AppImages will be available, starting with the next release.

Compiled binaries

See releases

From source

Requirements

  • Go 1.18 or newer
  • pnpm (or another node package manager)
  • git
  • make (You could also run the commands specified in the build: section of Makefile instead of executing make, if you have problems installing it (especially on Windows))

Commands

# Clone the repository
git clone https://github.com/ortfo/gui ortfogui
# Go into the repository
cd ortfogui
# Install dependencies
pnpm install
go mod tidy
# Install tools
go download github.com/rakyll/statik
# Build the binary
make
# Make it executable
chmod +x ortfogui
# Run it!
./ortfogui

gui's People

Contributors

ewen-lbh avatar

gui's Issues

Handle abbreviations like footnotes

Since they need to be inserted at each occurence of the abbreviation's name, they shouldn't be entered in markdown editors. I would handle them like this:

In content blocks:

  • Strip tags before giving paragraph content to tiptap
  • Give all abbreviation definitions
  • When updating the value prop in , apply all abbreviations

And, outside of the content grid:

  • Add a list of inputs to define/edit/remove abbreviation definitions, just like footnotes (which also need to be implemented...)

Themes

The GUI only focuses on managing your database for now, but I actually want it to handle the whole process, up to site publishing.

So, to generate the site, some kind of templates need to exist.

But this becomes a little more tricky to do without knowledge of at least HTML & CSS.

The idea is to provide people with ortfo themes, that are HTML template files along assets like JS & CSS, and those that can't be bothered to learn HTML&CSS can just use themes.

  • People still want to control what shows up on e.g. about pages (all pages that aren't :work, :tag, :technology and :site), so markdown as a HTML preprocessor needs to be supported just as Pug is (shouldn't be hard)
  • People might stil want to tweak things like colors, fonts, so a 'Customize theme' section should be available somewhere, and would expose top-level (:root) CSS variables for people to change
  • They also still want to put e.g. their personal logo on the navbar (which won't be modifyable without programming, of course), so access to a 'Assets' section where user can select files to use with the theme is needed

Undo

Provide undo functionnality for operations on content blocks (moving, resizing, deleting, adding)

Create a windows installer

I can’t distribute the .exe as-is, as I need to run this to ensure loopback support from UWP contexts:

CheckNetIsolation.exe LoopbackExempt -a -n="Microsoft.Win32WebViewHost_cw5n1h2txyewy"

(see Accessing localhost on Windows on webview/webview’s README)

I should take advantage of this to also ask for a location to store configuration data

(and maybe separate portfolio-database/ and ui_state.json from settings.json)

Put language switchers on individual content blocks

That way, users can't think that different languages have independent layouts

With one global switch, it appears as though the two languages for the same work are completely independent, and users might be surprised when they see the layout edits they did in one language affect the other language(s).

Use suggestions for tags & techs

In editor, in fields for tags & technologies used, use suggestions (just like languages in settings) to suggest tags & technologies

Use scss for style blocks

Especially for <SearchableList>, anywhere where there's :focus and :hover, it's getting kinda messy without nesting. I tried not using a preprocessor.

Package ortfo for...

  • Debian (.deb)
  • Fedora (.rpm)
  • Arch (PKGBUILD)
  • Gentoo (.ebuild)
  • Stampede (.slp)
  • Slackware (.tgz)
  • nix
  • homebrew (needs significant popularity)
  • chocolatey
  • winget
  • snap
  • flatpak
  • appimage
  • Windows (.exe or .msi)
  • MacOS (.dmg)

And maybe some stores:

  • App Store (if I can)
  • Windows store

Theme tab

Could be used to customize components of the portfolio:

Shows individual components like content blocks (link, media, ...) and CSS/HTML code that can be modified on-the-fly to see modifications

CLI options for GUI

Used to:

  • Start in specific tab (--tab=TabName (no effect if ui_state.editingworkid is empty), --edit=EditingWorkID (also sets --tab=editor))
  • Start with specific settings (--settings=SettingsFile, --settings.Key=Value to override specific settings, --projects=ProjectsFolder as an alias to --settings.projectsfolder=ProjectsFolder)
  • Start with specific UI state (--state=UIStateFile, --state.Key=Value to override specific state values)
  • Get a setting / ui state (--setting.SettingKey, --state.UIStateKey)
  • Show version (--version)
  • Show info (--info, like --version but also shows build date, commit hash)
  • Launch update without launching GUI (--update) (Depends on #32)
  • Maybe hidden experimental settings could be toggled via CLI only
  • Start with specific window dimensions (--width, --height)
  • Maybe other stuff????

Self-update mechanism

Some go packages exist to self-update an app. Leverage them with Github Releases to provide an in-app update mechanism.

Prevent empty blocks

When creating a new media or link, copy over the source/url to other languages if their versions of that block have empty source/url. For paragraphs, maybe copy over the text of the paragraph if other versions are empty?

Rename

Allow changing the ID of a project, which:

  • renames the folder
  • updates all paths that reference that folder
  • (rebuilds the db)

Vim mode

Add a vim keyboard navigation mode

editor: Make "add a new block?" card floating at bottom

So that you don't have to scroll back up.

Make it set itself back into the page when its place appears (when scrolled down) — pretty much a postion: sticky, except that it should be animated.

Also, when not scrolled completely, the new block should be added above the bottommost visible block.

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.