gitgiggety 59c7dd622b Fix links and styling of File Info tabs (#1622)
* Refactor HTML of movie and performer details panels

Refactor HTML of the movie and performer details panels so that the
items are contained in a single list (`<dl/>`). This allows using a grid
layout which means that the styling is easier to get right for multiple
form factors, fixing issues where "values" would overlap the "labels"
(for instance on my phone performers "Measurements" almost overlaps the
actual value, while there is a lot of space for the value itself).

This refactor also allows reusing the `TextField` and `URLField`
components as they don't have any styling related classes anymore (i.e.:
the `col-` classes are gone). Which means they can be used in more dense
places, like the SceneFileInfoPanel, as well. As the width of the label
/ value doesn't rely on the viewport size anymore (as happened due to
the `col-xl` usage, but for example the scene sidebar being small, and
16% being to small).

* Rebuild SceneFileInfoPanel

Completely rebuild the SceneFileInfoPanel to make use of the `TextField`
and `URLField` components. Using these components means that the URLs
automatically get `target="_blank" rel="noopener noreferrer"`.
Furhermore this should also improve the styling a bit, as described in
the previous commit.

* Rebuild ImageFileInfoPanel

Completely rebuild the ImageFileInfoPanel to make use of `TextField` and
`URLField` components. Furthermore it should resolve some small styling
issues.

* Rebuild GalleryFileInfoPanel

Rebuild the GalleryFileInfoPanel to make use of `TextField` and
`URLField` components. Using these components means that for example the
URLs automatically get `target="blank" rel="noopener noreferrer"`.

Also adds the url property as 1. at the moment it is nowhere accessible,
and 2. scenes also has it in this panel.

* Truncate links on the file info tabs at latest opportunity

On the File Info tabs links always have the link destination as text for
the link as well. But these texts can be long and without whitespace.
This means that the default applied `word-wrap: break-word` doesn't
really work as URLs (and paths) don't contain spaces that ofter. So
apply `word-break: break-all` instead so that the text will be as long
as possible and just cut off in the middle, instead of only at
whitespace. This thus means that the fully available width will be used
to display the URL.
2021-08-10 14:39:09 +10:00
2020-04-03 08:46:23 +11:00
2021-08-10 14:07:01 +10:00
2021-08-10 14:07:01 +10:00
2021-06-23 08:29:10 +10:00
2020-04-29 12:13:08 +10:00
2019-02-10 08:54:32 -08:00
2020-09-17 19:57:18 +10:00
2021-02-24 11:26:48 +11:00
2021-06-16 14:53:32 +10:00
2021-05-16 17:21:11 +10:00
2020-09-17 19:57:18 +10:00

Stash

Build Status Go Report Card Discord

https://stashapp.cc

Stash is a locally hosted web-based app written in Go which organizes and serves your porn.

  • It can gather information about videos in your collection from the internet, and is extensible through the use of community-built plugins for a large number of content producers.
  • It supports a wide variety of both video and image formats.
  • You can tag videos and find them later.
  • It provides statistics about performers, tags, studios and other things.

You can watch a SFW demo video to see it in action.

For further information you can read the in-app manual.

Installing stash

via Docker

Follow this README.md in the docker directory.

Pre-Compiled Binaries

The Stash server runs on macOS, Windows, and Linux. Download the latest release here.

Run the executable (double click the exe on windows or run ./stash-osx / ./stash-linux from the terminal on macOS / Linux) and navigate to either https://localhost:9999 or http://localhost:9999 to get started.

Note for Windows users: Running the app might present a security prompt since the binary isn't yet signed. Bypass this by clicking "more info" and then the "run anyway" button.

FFMPEG

If stash is unable to find or download FFMPEG then download it yourself from the link for your platform:

The ffmpeg(.exe) and ffprobe(.exe) files should be placed in ~/.stash on macOS / Linux or C:\Users\YourUsername\.stash on Windows.

Usage

Quickstart Guide

  1. Download and install Stash and its dependencies
  2. Run Stash. It will prompt you for some configuration options and a directory to index (you can also do this step afterward)
  3. After configuration, launch your web browser and navigate to the URL shown within the Stash app.

Note that Stash does not currently retrieve and organize information about your entire library automatically. You will need to help it along through the use of scrapers. The Stash community has developed scrapers for many popular data sources which can be downloaded and installed from this repository.

The simplest way to tag a large number of files is by using the Tagger which uses filename keywords to help identify the file and pull in scene and performer information from our stash-box database. Note that this data source is not comprehensive and you may need to use the scrapers to identify some of your media.

CLI

Stash runs as a command-line app and local web server. There are some command-line options available, which you can see by running stash --help.

For example, to run stash locally on port 80 run it like this (OSX / Linux) stash --host 127.0.0.1 --port 80

SSL (HTTPS)

Stash can run over HTTPS with some additional work. First you must generate a SSL certificate and key combo. Here is an example using openssl:

openssl req -x509 -newkey rsa:4096 -sha256 -days 7300 -nodes -keyout stash.key -out stash.crt -extensions san -config <(echo "[req]"; echo distinguished_name=req; echo "[san]"; echo subjectAltName=DNS:stash.server,IP:127.0.0.1) -subj /CN=stash.server

This command would need customizing for your environment. This link might be useful.

Once you have a certificate and key file name them stash.crt and stash.key and place them in the ~/.stash directory. Stash detects these and starts up using HTTPS rather than HTTP.

Customization

Themes and CSS Customization

There is a directory of community-created themes on our Wiki, along with instructions on how to install them.

You can also make Stash interface fit your desired style with Custom CSS snippets and CSS Tweaks.

Support (FAQ)

Answers to other Frequently Asked Questions can be found on our Wiki

For issues not addressed there, there are a few options.

  • Read the Wiki
  • Check the in-app documentation (also available here
  • Join the Discord server, where the community can offer support.

Compiling From Source Code

Pre-requisites

  • Go
  • Revive - Configurable linter
    • Go Install: go get github.com/mgechev/revive
  • Packr2 - Static asset bundler
  • Yarn - Yarn package manager
    • Run yarn install --frozen-lockfile in the stash/ui/v2.5 folder (before running make generate for first time).

NOTE: You may need to run the go get commands outside the project directory to avoid modifying the projects module file.

Environment

macOS

TODO

Windows

  1. Download and install Go for Windows
  2. Download and install MingW
  3. Search for "advanced system settings" and open the system properties dialog.
    1. Click the Environment Variables button
    2. Add GO111MODULE=on
    3. Under system variables find the Path. Edit and add C:\Program Files\mingw-w64\*\mingw64\bin (replace * with the correct path).

NOTE: The make command in Windows will be mingw32-make with MingW.

Commands

  • make generate - Generate Go and UI GraphQL files
  • make build - Builds the binary (make sure to build the UI as well... see below)
  • make pre-ui - Installs the UI dependencies. Only needs to be run once before building the UI for the first time, or if the dependencies are updated
  • make fmt-ui - Formats the UI source code.
  • make ui - Builds the frontend and the packr2 files
  • make packr - Generate packr2 files (sub-target of ui. Use to regenerate packr2 files without rebuilding UI)
  • make vet - Run go vet
  • make lint - Run the linter
  • make fmt - Run go fmt
  • make fmt-check - Ensure changed files are formatted correctly
  • make it - Run the unit and integration tests
  • make validate - Run all of the tests and checks required to submit a PR
  • make ui-start - Runs the UI in development mode. Requires a running stash server to connect to. Stash port can be changed from the default of 9999 with environment variable REACT_APP_PLATFORM_PORT.

Building a release

  1. Run make generate to create generated files
  2. Run make ui to compile the frontend
  3. Run make build to build the executable for your current platform

Cross compiling

This project uses a modification of the CI-GoReleaser docker container to create an environment where the app can be cross-compiled. This process is kicked off by CI via the scripts/cross-compile.sh script. Run the following command to open a bash shell to the container to poke around:

docker run --rm --mount type=bind,source="$(pwd)",target=/stash -w /stash -i -t stashappdev/compiler:latest /bin/bash

Profiling

Stash can be profiled using the --cpuprofile <output profile filename> command line flag.

The resulting file can then be used with pprof as follows:

go tool pprof <path to binary> <path to profile filename>

With graphviz installed and in the path, a call graph can be generated with:

go tool pprof -svg <path to binary> <path to profile filename> > <output svg file>

Description
Languages
Go 56.8%
TypeScript 40.1%
SCSS 2.5%
Makefile 0.2%
Dockerfile 0.1%