Giter VIP home page Giter VIP logo

plash's Introduction

Plash

Make any website your Mac desktop wallpaper




Plash enables you to have a highly dynamic desktop wallpaper. You could display your favorite news site, Facebook feed, or a random beautiful scenery photo. The use-cases are limitless. You could even set an animated GIF as wallpaper. You can even add multiple websites and easily switch between them.

Use-cases

Share your use-case

Features

  • Show a remote or local website
  • Interact with the website (“Browsing Mode”)
  • Automatically reload the website at a custom interval
  • Add multiple websites
  • Show the website on a different display
  • Invert website colors (fake dark mode)
  • Add custom CSS and JavaScript to the website
  • Lower the opacity
  • Transparent background
  • Automatically deactivate while on battery
  • Audio is muted
  • Single image will be aspect-filled to your screen
  • Hide menu bar icon
  • Shortcuts support
  • Scriptable
  • Share extension

Download

Requires macOS 14 or later.

Older versions

Non-App Store version

A special version for users that cannot access the App Store. It won't receive automatic updates. I will update it here once a year.

Download (2.15.0 · macOS 14+)

Tips

Browsing mode

You can interact with the website by enabling “Browsing Mode”. When in this mode, you can right-click to be able to go back/forward, reload, and zoom in the page contents (the zoom level is saved). You can also pinch to magnify. This is different from zooming the page contents in that it will zoom in to a specific part of the page instead of just enlarging everything.

Plash injects a CSS class named plash-is-browsing-mode on the <html> element while browsing mode is active. You could use this class to customize the website for browsing mode.

If clicking a link opens it in a new window, you can hold the Option key while clicking the link to open it in the main Plash window.

Zoom in website

To zoom in the website, activate “Browsing Mode”, right-click the website, and then select “Zoom In”.

URL placeholders for screen width and height

Use [[screenWidth]] and [[screenHeight]] in any URL and Plash will substitute the right values for you. For example, https://source.unsplash.com/random/[[screenWidth]]x[[screenHeight]]?puppy.

Scroll to position

You can scroll a website to a specific position each time it is loaded by putting the following in the website's “JavaScript” field. Adjust the “500” to how far down it should scroll.

window.scrollTo(0, 500);

You can also scroll to a specific element matching a CSS selector:

document.querySelector('.title')?.scrollIntoView();

Make the website occupy only half the screen

You can use the “CSS” field in the website settings to adjust the padding of the website:

:root {
    margin-left: 50% !important;
}

Detect Plash

Plash injects a CSS class named is-plash-app on the <html> element. You could use this class to customize your website for Plash. For example, if your website has instructions on how to use it in Plash, you could hide those when it's running in Plash.

Screenshots

Scripting

You can control Plash using anything that supports opening a URL with a custom scheme.

For example, to reload the current website, run this terminal command:

$ open -g plash:reload

Share extension

Plash comes bundled with a share extension. You can, for example, use it to quickly add a website you have open in Safari to Plash.

Tools

Commands

add

Add a website to Plash.

You can optionally specify a title. If no title is given, a title will be automatically fetched from the website.

$ open -g 'plash:add?url=https://sindresorhus.com/plash&title=Plash%20website'

Don't forget to correctly encode query parameters.

Note: Local file URLs are not supported.

reload

Reload the current website.

$ open -g plash:reload

next

Switch to the next website in the list.

$ open -g plash:next

previous

Switch to the previous website in the list.

$ open -g plash:previous

random

Switch to a random website in the list.

It will never show the same website twice in a row, unless you only have a single website.

$ open -g plash:random

toggle-browsing-mode

Toggle browsing mode.

$ open -g plash:toggle-browsing-mode

Examples

Node.js

import {execFileSync} from 'node:child_process';

execFileSync('open', ['--background', 'plash:reload']);

Swift

import Cocoa

let command = "plash:reload"

let configuration = NSWorkspace.OpenConfiguration()
configuration.activates = false
NSWorkspace.shared.open(URL(string: command)!, configuration: configuration)

AppleScript

do shell script "open --background 'plash:reload'"

Python

import subprocess

subprocess.run(['open', '--background', 'plash:reload'])

FAQ

The app does not show up in the menu bar

macOS hides menu bar apps when there is no space left in the menu bar. This is a common problem on MacBooks with a notch. Try quitting some menu bar apps to free up space. If this does not solve it, try quitting Bartender if you have it installed.

Can it automatically switch websites every 10 minutes?

Plash can be automated with the built-in Shortcuts app, for example, using the “Switch to Next Website” action. Shortcuts on macOS does not yet support automations, but for now, you can use the Shortery app.

Does it support multiple displays?

Support for multiple displays is currently limited to the ability to choose which display to show the website on. Support for setting a separate website for each display is planned.

However, I there is a workaround.

Why does Plash use so much memory?

Plash uses very little memory. Usually around 40 MB. However, the websites you display can take up a lot of memory, and sometimes even have a memory leaks.

The menu bar does not adapt to the Plash wallpaper

The menu bar adapts its color from the actual system wallpaper. Plash is not actually a wallpaper, but rather runs right above the wallpaper. So Plash cannot influence the menu bar color.

Can Plash block ads?

Not built-in, but you can block ads system-wide with a DNS ad-blocker.

How can I switch to a specific website with a keyboard shortcut?

Make a shortcut in the Shortcuts app that uses the “Set Current Website” action and then set a keyboard shortcut for the shortcut.

Can I contribute localizations?

I don't have any immediate plans to localize the app.

What does “Plash” mean?

Click here.

Built with

  • Defaults - Swifty and modern UserDefaults
  • KeyboardShortcuts - Add user-customizable global keyboard shortcuts to your macOS app

Links

plash's People

Contributors

colejd avatar gleich avatar khrj avatar lilfaen avatar pablopunk avatar pimlock avatar richienb avatar sindresorhus 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  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

plash's Issues

Add support for showing a local file

This is already partly implemented (see the TODOs):

// TODO: This requires some more work.
// - Need to save the security scoped bookmark in UserDefaults after the open panel so the file can be accessed on the next launch.
// - WKWebView has a bug where it can only load a local file once. We need to work around that.
// - See inline TODOs.
menu.addCallbackItem(
"Open File…",
key: "o",
keyModifiers: .option,
isHidden: true // TODO: Disabled until it's done.
) { _ in
NSApp.activate(ignoringOtherApps: true)
let panel = NSOpenPanel()
panel.canChooseDirectories = false
panel.canCreateDirectories = false
// Ensure it's above the window when in "Browsing Mode".
panel.level = .floating
// TODO: Limit file types to only what WKWebView supports? Where can we find out what it supports?
//panel.allowedFileTypes = []
if
let url = Defaults[.url],
url.isFileURL
{
panel.directoryURL = url.deletingLastPathComponent()
}
panel.begin {
if $0 == .OK {
Defaults[.url] = panel.url!
}
}
}

Static mode

Some people have commented that this is wasteful. The reality is that it depends. You can load resource hungry websites or you can load simple static websites. Simple static websites take up very little CPU time.

However, I had this idea for people that just needs to show a static website. Instead of keeping the web view running the whole time, Plash could load the website in the web view, capture a screenshot, and then set the screenshot as the desktop view instead of the web view. That way it would look just as it would before, but it would be a static view of the web site. The reload interval would take care of keeping it up to date.

This would be opt-in.

Thoughts?

What should such an option be called?

Fade in the web view

It would be nice to fade in the web view when the page has loaded. Right now, it just shows a gray background on the first start until the page loads.

// TODO: Add a callback to `loadURL` when it's done loading instead.
// TODO: Fade in the web view.
delay(seconds: 1) {
self.desktopWindow.contentView?.isHidden = false
}

Here are some fade utilities: https://github.com/sindresorhus/Gifski/blob/5602861e7cf1970dcf19442e546e70d74cc30d58/Gifski/util.swift#L1397-L1428

Scaled images for retina screens

Is it possible to or could you add the ability to scale images to fit the desktop area?

Take your Unsplash for example, a full resolution image is cropped as it's displayed full size. You have to use the lower res version of the screen to get it to fit and of course this is blurry.

Great app though 👍


Plash 1.0.0 (1) - com.sindresorhus.Plash
macOS 10.15.2
MacBookPro15,1

URL scheme support

It would be useful to be able to open a new URL in Plash programmatically.

I'm thinking:

open -g 'plash:add?url=https://sindresorhus.com/plash'

Or in AppleScript:

do shell script "open -g 'plash:add?url=https://sindresorhus.com/plash'"

I have an implementation for this for another app of mine I can reuse, so I just need to clean that up and add it to Plash.

Note: Document that it can also handle file URLs to local files.

Also plash:reload.

Wait time till showing page after reload

Useful if you don't wanna see the reload screen, just the content. So I could set it too 5 seconds after reload to make sure that the site has finished loading before displaying.

Improve error handling

Hi Sindre! This is awesome, and I've wanted to do something like this for a long time. Thanks for all your hard work!

Something I noticed when trying out the Unsplash random puppy API example is that it seems to occasionally return dead URLs. When that happens, this error is thrown:

Screen Shot 2020-01-09 at 11 27 01 AM

This also happens if any server Plash is periodically hitting suddenly goes down or a URL to somewhere that is obviously down is entered in the config. I think the latter may have also just led to a crash for me.

Would it be possible to do an initial check to see if a server is up when it's entered in the config and in the event that it becomes unavailable notify the user of an error via the menu bar icon? Meanwhile, Plash could keep testing for valid responses in the background while maintaining the current valid image.

I'd love to help out with this, but I'm afraid I have very minimal knowledge of Swift. I write JS for a living. 😅

Custom URL scheme

I would be cool to be able to make links like plash://open?url=http://sindresorhus.com and have it open directly in Plash. That would make it super easy to share URLs to use in Plash.

Presets

I want the ability to create presets and switch them through the menu.

We could put the ones we already have in the use-sases task #1

I'm just tired of changing the url and changing the Custom CSS text as well.

Keyboard text replacement not working

Describe the bug

Keyboard text replacement not working in the webview.

To reproduce

  1. Setup a text replacement in MacOS settings (i.e. tt -> tutu)
  2. Setup the url of webview to manifest.app
  3. Create a note
  4. Try to use the replacement -> not working

On Chrome, text replacement works.

Expected behavior

Text replacement works: tt should be tutu in the note

Info

  • macOS version: 10.15.2
  • Plash version: 1.4.0

Custom keyboard shortcuts

Set a custom keyboard shortcut for reloading and for pauses the application so it won't reload until you tell it too again

Share your use-case

transparent mode

is there away for me to embeded single PNG which solid picture but the rest is transparent so I will be able to put a logo over my current wallpaper?

show dev tools

For some reason css doesn't seem to work in my case. Not sure why (it works when I apply the same to my website in a browser).
I can't check why.
It would be great to add an option to show dev-tools or inspect when in "browsing mode".

Allow alert() and confirm() to shows up

Is your feature request related to a problem? Please describe.

JavaScript's confirm() and alert() does not appears.

Describe the solution you'd like

Popups shows up at the top of the screen.

Describe alternatives you've considered

In reflection.

Additional context

Example: use manifest.app and try to delete a note.

Website is reloading when unplug/plug charging cable

Describe the bug

The website reload when you unplug/plug charging cable to charge the MacBook.

To reproduce

Steps to reproduce the behavior:

  1. Load any website (e.g. huge loading website)
  2. Unplug/plug the charging cable
  3. Plug/unplug the charging cable
  4. You'll see the website is reloading

Expected behavior

The website does not reload

Info

  • macOS version: 10.15.2
  • Plash version: 1.3.0

Additional context

Preferences : Desactivate while on battery is OFF

MacBook Pro 2017

URL variables

I could be useful to expose some URL template variables.

The main problem I'm trying to solve is the tip in the readme:

Screenshot 2020-01-09 at 20 06 11

It requires the user to manually find their screen resolution and then subtract the menu bar height.

Instead, it could simply be:

https://source.unsplash.com/random/{screenWidth}x{screenHeight}?puppy

Thoughts? Any other template variables that could be helpful?

Stepper issue

If you manually type an integer into "Reload Interval" in the Preferences window the "Up" and "Down" buttons no longer works. This is most likely a SwiftUI bug.

Update: Can still be reproduced on macOS 11.

Welcome window

There's currently a temporary welcome window:

func showWelcomeScreenIfNeeded() {
guard App.isFirstLaunch else {
return
}
NSApp.activate(ignoringOtherApps: true)
NSAlert.showModal(
message: "Welcome to Plash!",
informativeText: "Plash lives in the menu bar (droplet icon). Click it and then select “Open URL…” to get started.\n\nIf you have any feedback, bug reports, or feature requests, kindly use the “Send Feedback” button in the Plash menu. We respond to all submissions and reported issues will be dealt with swiftly. It's preferable that you report bugs this way rather than as an App Store review, since the App Store will not allow us to contact you for more information."
)
}

But it would be nice to have a better looking welcome window made in SwiftUI.

Screensaver support

I made the app name intentionally generic so I would be able to at some point make it support being a screensaver too. This would open up a lot of creative use-cases.

However, this is far down on my priority list. But PRs are always welcome. 👍

Invert colors of a webpage

I would like to use a website like github or gitstalk but they both have a white background and my eyes will ligit die if I keep it like that. Please save my eyes and add a inverse mode or apply css similar to the dark reader chrome extension.

Allow logging into sites that use Basic Auth

I have an internal company dashboard/monitoring tool that would be perfect to have on the desktop, however it is behind HTTP Basic Auth. When I set it as the background I didn't see any prompts for the username/password and the background remained blank.

It would be great to either be prompted for the username/password or provide it when setting the URL. Possibly inputs hidden behind a "Requires Authentication" checkbox next to the URL field?

image

AppleScript support

Could be useful to programmatically control Plash. For example, download some image off the internet, wrap it in some HTML and load it. We could support loading a URL, local file, or a HTML string.

This is not something I plan to work on, but PR welcome if anyone needs this. Start a discussion here about scope and what actions and info should be supported before doing any code though.

If you decide to work on this, you're expected to also write docs, both API docs and a user guide.

Hide cookie notices & ad-blocking

Cookie notices and ads are annoying. WKWebView supports a content filter, so I think we can find some sources to feed it.

https://developer.apple.com/documentation/webkit/wkusercontentcontroller/2902756-add

For cookie notices, probably this: https://fanboy.co.nz/fanboy-cookiemonster.txt

For ads, there are a bunch here: https://filterlists.com

Could do something like this: sindresorhus/capture-website#98 (see ghostery/adblocker#9)

This is a huge amount of work and will not happen soon

Command+R to reload the page when in "Browsing Mode"

I think we need to set up a local or global event monitor and then have this in it:

if event.modifiers == .command, event.charactersIgnoringModifiers == "r" {
	webView.reload()
}

Also Command + and Command - to zoom in/out. And Command 0 to reset.


Maybe it would be better to just let the app have a menu bar in browsing mode. Then I could just add menu bar items. Like in Chrome.

Add aspect fill / fit option

When displaying an image, Plash resizes to fit the image within the boundaries of the screen while keeping the aspect ratio. If the source image isn't the same aspect ratio as the screen (minus the toolbar height), the left and right sides will be cropped in and you can see the original desktop underneath.

My request is that an aspect fill option is added. Plash could then be an arbitrary size and the image would be guaranteed to fill the whole thing.

Playlist

Users might want to show multiple URLs, one after the other. Kinda like a slideshow.

I imagine we would have a window where you could add multiple URLs and set how long each URL would be shown for. The user would also be able to choose if the playlist is shown in order or random. The user would also be able to set custom preferences like dark mode, etc, per URL.

I'm open to ideas on how this should work. And share your use-case if you need something like this.

Global Shortcut

At the moment I believe the only way to trigger Browsing Mode is to activate Plash from the menu bar and then select the mode or hit Command + B.

It would be great if we could trigger browsing mode from anywhere at any time through a global shortcut. I have Trello set as my desktop so half the time I'm viewing Plash I'm also interacting with it.

I've tried creating a solution to this using Better Touch Tool but had no luck.

Thanks.

Allow user to enable/disable click-to-scale

Currently there's a feature that lets the user click on the desktop to change the scaling. When I click on the desktop to defocus a window, this triggers that function of Plash; I absent-mindedly do this, so it happens a lot. My request is that the user is allowed to disable this feature, or barring that, require that Plash is focused in order to register the click.

Background out of alignment after waking from sleep

Not sure how wide spread this is, or if I'm an anomaly, but when my MacBook Pro wakes from sleep mode the background image is always slid down a bit like shown in the screenshot below. To fix this I need to restart Plash.

bg issue

Fade between images

When the image changes, it's a pretty jarring snap between the two. It'd be nice to have fading between them as an option.

Signing into OAuth apps closes the page

When trying to sign-in to an app that navigates to an OAuth interstitial, the closing of the login page closes the Plash page instead of navigating to the app being signed into.

Being able to sign into a Notion.so page or similar would be a great use case but seemingly doesn't work. I use the "Sign in with Google" option which is where the problem lies.


Plash 1.5.1 (8) - com.sindresorhus.Plash
macOS 10.15.4
MacBookPro16,1

Support Print Styles

Is your feature request related to a problem? Please describe.

Some sites have really nice print styles for certain pages. For example, they often hide the header and footer. This would make them cleaner to display on a desktop.

Describe the solution you'd like

A toggle in the app preferences to emulate print styles similar to the one in Chrome devtools.

Retain Scale and Scrolling Position After Reload

Is your feature request related to a problem? Please describe.

N/A

Describe the solution you'd like

an option to retain the scale factor and scrolling position after a reload. I use Plash to display sites like dribbble, it would be most useful to display only the content without the site navigations.

Multiple screen support

I intentionally left it out in the initial version as I don't use multiple screens myself, so I'm not exactly sure how it should optimally work. Please leave some feedback if you need multiple screen support.

Possible solutions:

  1. Add preference to display it on the second screen if connected.
  2. Add preference to display it on a selected screen if connect. Would be a dropdown to choose screen.

I'm open to other ideas.

After macOS waking up without internet connection, no website is shown

Describe the bug

I'm working on different setups where one has internet through WLAN and the other over LAN. When switching workplaces (opening/closing the lid) it seems Plash can not reload the web page or get back to the last state.

To reproduce

Steps to reproduce the behavior:

  1. Open any website
  2. Turn off w-lan
  3. Close the lid
  4. Open the lid
  5. red Plash icon
  6. no website

Expected behavior

Saving the last state and waiting for a new internet connection or use a service worker to save the site offline.

Screenshots

If applicable, add screenshots to help explain your problem.

Info

  • macOS version: 10.15.2
  • Plash version: latest (don't know where I can see this, mabye add the version and hash as read only menu item)

Additional context

Add any other context about the problem here.

Gap at top of screen when menu bar is hidden

Describe the bug

When the macOS menu bar is hidden, there is a gap at the top of the screen.

To reproduce

Enable "Automatically hide and show the menu bar" in System Preferences > General.

Expected behavior

Plash should fill the whole desktop if the menu bar is hidden.

Screenshots

Screen Shot 2020-05-12 at 1 35 10 AM

Info

  • macOS version: 10.15.4 (19E287)
  • Plash version: 1.4.0 (6)

Clickable links in non-browsing view

Even when not in browsing view. Someone in an App Review requested this. Not sure about the use-case for this. If you also want this. Tell me why.

Request:

I wish the links on the webpage were still active and would open in the default web browser.

My reply:

This might be possible, but it's probably non-trivial. To allow clicking links, we'll have to enable full website interaction. That means users will be able to not just click links, but also scroll, select text, etc, which is a suboptimal experience as it can cause unintended interactions when working with files on the desktop.

Another possible solution rather than enabling full interaction would be to get all the links of the website, get their bounding boxes, and then pass those to Plash and we can detect clicks on those locations ourselves. That might be the best option, actually.

Wallpaper is not full screen.

Describe the bug
Generated wallpaper is not covering the fullscreen
A clear and concise description of what the bug is.
Generated wallpaper is not covering the fullscreen
To reproduce
I've just toggled the top menubar from settings.

A clear and concise description of what you expected to happen.
wallpaper should be full screen.

If applicable, add screenshots to help explain your problem.
Screenshots
Screenshot 2020-09-24 at 7 01 59 PM
Screenshot 2020-09-24 at 7 06 52 PM

Info

  • macOS version: 10.15.6 (19G73)
  • Plash version: from commit a88a122

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.