Ray Slakinski
33c3790fe3
Each is named in the toolbar's menu rather than hidden behind one button
that says "page": reaching Settings here should be no harder than in a
browser. Admin appears only for an admin, because the server sends that
page to admins alone and a link for anyone else leads to a refusal.
Settings, the directory, Popular and OPML are dialogs the page opens by
name rather than routes of their own, so they are reached by calling them
once it has loaded -- prefsModal(), opmlModal(), selectFeed(':directory').
Asking a moment after the load avoids racing the page wiring them up. The
admin page is a real route and just loads. Asking for the screen already
showing runs the script without reloading, or the page would reload to sit
exactly where it already was.
This is a decision as much as a change, and worth writing down: the goal
was never a native app with no web view in it. These screens are
form-heavy, rarely opened, admin-gated in places, and they work. Rewriting
them would have been the largest part of the job for the smallest return.
The test opens the menu, chooses Settings, and looks for the page's own
dialog, so a menu that opens the page but not the thing asked for fails
rather than passing. It also found that the menu had no accessibility
label, which it should have had anyway.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
355 lines
16 KiB
Swift
355 lines
16 KiB
Swift
import SwiftUI
|
|
import UIKit
|
|
import WebKit
|
|
|
|
/// The app, very nearly: ipx's own page, full screen.
|
|
///
|
|
/// What it adds is the bridge to the host's player, a way to say which server, and a line of
|
|
/// honesty when something is wrong.
|
|
final class WebViewController: UIViewController, WKNavigationDelegate {
|
|
private var webView: WKWebView!
|
|
private var cookies: CookieBridge!
|
|
private var api: API!
|
|
private var playback: Playback!
|
|
|
|
/// The web view's cookie store is what authenticates everything else, and its Playback is
|
|
/// the one the lock screen drives, so the native interface borrows both rather than making
|
|
/// a second of either.
|
|
var cookieBridge: CookieBridge { cookies }
|
|
var player: Playback { playback }
|
|
private var bridge: Bridge!
|
|
|
|
private let banner = UIView()
|
|
private let bannerText = UILabel()
|
|
private var checkedBridge = false
|
|
/// The page sits below the banner when there is one, and at the top when there is not. Two
|
|
/// constraints rather than an overlay: the banner covered the page's own toolbar, and ipx
|
|
/// lays that out itself, so there is nothing to scroll out of the way.
|
|
private var pageBelowBanner: NSLayoutConstraint!
|
|
private var pageAtTop: NSLayoutConstraint!
|
|
|
|
override func viewDidLoad() {
|
|
super.viewDidLoad()
|
|
view.backgroundColor = .black
|
|
|
|
let cfg = WKWebViewConfiguration()
|
|
// The persistent store, so a sign-in through Cloudflare Access survives a relaunch --
|
|
// and so there are cookies for the player to use at all.
|
|
cfg.websiteDataStore = .default()
|
|
cfg.allowsInlineMediaPlayback = true
|
|
// Video still plays in the page, and it should not need a second tap to start.
|
|
cfg.mediaTypesRequiringUserActionForPlayback = []
|
|
|
|
webView = WKWebView(frame: .zero, configuration: cfg)
|
|
webView.navigationDelegate = self
|
|
webView.allowsBackForwardNavigationGestures = false
|
|
webView.scrollView.contentInsetAdjustmentBehavior = .never
|
|
webView.translatesAutoresizingMaskIntoConstraints = false
|
|
view.addSubview(webView)
|
|
pageAtTop = webView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor)
|
|
NSLayoutConstraint.activate([
|
|
pageAtTop,
|
|
webView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
|
|
webView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
|
|
webView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
|
|
])
|
|
|
|
cookies = CookieBridge(store: cfg.websiteDataStore.httpCookieStore)
|
|
api = API()
|
|
playback = Playback(cookies: cookies, api: api)
|
|
bridge = Bridge(webView: webView, playback: playback)
|
|
bridge.onReady = { [weak self] _ in
|
|
self?.checkedBridge = true
|
|
self?.setBanner(nil)
|
|
}
|
|
cfg.userContentController.add(bridge, name: Bridge.handlerName)
|
|
Zoom.install(into: cfg.userContentController)
|
|
|
|
setUpBanner()
|
|
|
|
if ServerSettings.isConfigured { load() }
|
|
}
|
|
|
|
// MARK: - how big the page is drawn
|
|
|
|
/// The page is sized for a phone and for a browser window, and on a Mac -- where the window
|
|
/// is often two thousand points across -- it reads small. Scaling it here rather than asking
|
|
/// ipx to carry a text size: the page is right everywhere else, and this is the one place
|
|
/// that is wrong.
|
|
enum Zoom {
|
|
private static let key = "ipx.zoom"
|
|
static let steps: [Double] = [1.0, 1.15, 1.25, 1.4, 1.6, 1.8, 2.0]
|
|
|
|
/// A Mac starts bigger; a phone and an iPad are already right.
|
|
static var normal: Double {
|
|
#if targetEnvironment(macCatalyst)
|
|
return 1.25
|
|
#else
|
|
return 1.0
|
|
#endif
|
|
}
|
|
|
|
static var current: Double {
|
|
get {
|
|
let v = UserDefaults.standard.double(forKey: key)
|
|
return steps.contains(v) ? v : normal
|
|
}
|
|
set { UserDefaults.standard.set(newValue, forKey: key) }
|
|
}
|
|
|
|
/// pageZoom alone spilled the page off the screen: ipx's body is `height:100dvh`, and
|
|
/// WebKit measures dvh against the unzoomed window, so the page laid itself out at the
|
|
/// window's full size and was then scaled up. A percentage of the root resolves against
|
|
/// a box that does know about zoom, which is the whole of the fix.
|
|
/// CSS zoom, not WKWebView.pageZoom. pageZoom scales what is drawn but leaves the
|
|
/// layout box the size of the window, so ipx's full-height page -- body is 100dvh --
|
|
/// laid itself out at the window's height and then got scaled past the bottom of it.
|
|
/// CSS zoom is part of layout, so the page measures itself correctly; body's own width
|
|
/// and height are divided back out because its containing block is not zoomed.
|
|
static func script(_ zoom: Double) -> String {
|
|
// No width. A percentage resolves against the containing block in the zoomed
|
|
// element's own units, so 100% is already the full width -- dividing it again left
|
|
// the page filling four fifths of the window and then three fifths as the zoom went
|
|
// up. A block fills its container by itself. dvh is the exception: viewport units do
|
|
// not know about zoom, so the height does have to be divided back out.
|
|
let css = zoom == 1 ? "" : "body{zoom:\(zoom);height:calc(100dvh/\(zoom))!important}"
|
|
return "(function(){var id='ipx-zoom';var s=document.getElementById(id);"
|
|
+ "if(!s){s=document.createElement('style');s.id=id;"
|
|
+ "(document.head||document.documentElement).appendChild(s)}"
|
|
+ "s.textContent=\(css.debugDescription)})()"
|
|
}
|
|
|
|
/// The page's own player bar, hidden. It is still what the play buttons drive -- they
|
|
/// post to the host either way -- but the bar itself is ours now.
|
|
static let hidePageBar = "(function(){var s=document.createElement('style');"
|
|
+ "s.textContent='#player{display:none!important}';"
|
|
+ "(document.head||document.documentElement).appendChild(s)})()"
|
|
|
|
static func install(into controller: WKUserContentController) {
|
|
controller.addUserScript(WKUserScript(source: hidePageBar,
|
|
injectionTime: .atDocumentEnd,
|
|
forMainFrameOnly: true))
|
|
controller.addUserScript(WKUserScript(source: script(current),
|
|
injectionTime: .atDocumentEnd,
|
|
forMainFrameOnly: true))
|
|
}
|
|
}
|
|
|
|
override var keyCommands: [UIKeyCommand]? {
|
|
// The page's own shortcuts are single keys and ignore a modifier, so these do not collide.
|
|
[
|
|
UIKeyCommand(title: "Bigger", action: #selector(zoomIn), input: "+", modifierFlags: .command),
|
|
UIKeyCommand(title: "Bigger", action: #selector(zoomIn), input: "=", modifierFlags: .command),
|
|
UIKeyCommand(title: "Smaller", action: #selector(zoomOut), input: "-", modifierFlags: .command),
|
|
UIKeyCommand(title: "Actual Size", action: #selector(zoomReset), input: "0", modifierFlags: .command),
|
|
]
|
|
}
|
|
|
|
@objc private func zoomIn() { step(+1) }
|
|
@objc private func zoomOut() { step(-1) }
|
|
@objc private func zoomReset() { apply(Zoom.normal) }
|
|
|
|
private func step(_ by: Int) {
|
|
let steps = Zoom.steps
|
|
let at = steps.firstIndex(of: Zoom.current) ?? 0
|
|
apply(steps[min(steps.count - 1, max(0, at + by))])
|
|
}
|
|
|
|
private func apply(_ zoom: Double) {
|
|
Zoom.current = zoom
|
|
webView.evaluateJavaScript(Zoom.script(zoom))
|
|
}
|
|
|
|
// MARK: - which server
|
|
|
|
/// Shake to change it. There is nowhere on screen to put a button -- the page fills it, and
|
|
/// this is a setting touched about once -- so the way back is a gesture and the banner.
|
|
override var canBecomeFirstResponder: Bool { true }
|
|
override func viewDidAppear(_ animated: Bool) {
|
|
super.viewDidAppear(animated)
|
|
becomeFirstResponder()
|
|
// Not from viewDidLoad: presenting before the view is in a window gets you a blank screen
|
|
// and no error, which is exactly what it did.
|
|
if !ServerSettings.isConfigured && presentedViewController == nil {
|
|
showSetup(animated: animated)
|
|
}
|
|
}
|
|
override func motionEnded(_ motion: UIEvent.EventSubtype, with event: UIEvent?) {
|
|
if motion == .motionShake && presentedViewController == nil { showSetup(animated: true) }
|
|
}
|
|
|
|
@objc private func showSetup() { showSetup(animated: true) }
|
|
|
|
private func showSetup(animated: Bool) {
|
|
let setup = ServerSetupViewController(first: !ServerSettings.isConfigured)
|
|
setup.onSave = { [weak self] _ in
|
|
self?.dismiss(animated: true)
|
|
self?.setBanner(nil)
|
|
self?.playback.stop()
|
|
self?.load()
|
|
}
|
|
let nav = UINavigationController(rootViewController: setup)
|
|
// A first run has nothing behind it, so it cannot be swiped away unanswered.
|
|
nav.isModalInPresentation = !ServerSettings.isConfigured
|
|
present(nav, animated: animated)
|
|
}
|
|
|
|
private func load() {
|
|
guard let base = ServerSettings.base else { return showSetup(animated: true) }
|
|
// Sync first: the page is fetched with the cookies too, and without them the first
|
|
// request is a redirect to a sign-in that is not actually needed.
|
|
cookies.sync { [weak self] in
|
|
DispatchQueue.main.async { self?.webView.load(URLRequest(url: base)) }
|
|
}
|
|
}
|
|
|
|
// MARK: - the screens that stay in the page
|
|
|
|
/// The parts of ipx that were never going to be rewritten. They are form-heavy, rarely
|
|
/// opened, admin-gated in places, and they already work; rewriting them would be the largest
|
|
/// part of the job for the smallest return. Settings, the directory and OPML are dialogs the
|
|
/// page opens by name rather than routes, so they are reached by calling them.
|
|
enum Screen {
|
|
case settings, directory, popular, opml, admin, page
|
|
|
|
var path: String { self == .admin ? "/admin" : "/" }
|
|
|
|
/// Run once the page has loaded. Nil for a screen that is a route of its own.
|
|
var script: String? {
|
|
switch self {
|
|
case .settings: return "prefsModal()"
|
|
case .opml: return "opmlModal()"
|
|
case .directory: return "selectFeed(':directory')"
|
|
case .popular: return "selectFeed(':popular')"
|
|
case .admin, .page: return nil
|
|
}
|
|
}
|
|
}
|
|
|
|
private var pending: Screen?
|
|
|
|
func open(_ screen: Screen) {
|
|
pending = screen
|
|
guard let url = ServerSettings.url(screen.path) else { return showSetup(animated: true) }
|
|
// Already on the right page: just run the script, or the whole thing reloads to sit
|
|
// exactly where it already was.
|
|
if webView.url?.path == url.path, webView.url != nil {
|
|
runPending()
|
|
} else {
|
|
cookies.sync { [weak self] in
|
|
DispatchQueue.main.async { self?.webView.load(URLRequest(url: url)) }
|
|
}
|
|
}
|
|
}
|
|
|
|
private func runPending() {
|
|
guard let screen = pending else { return }
|
|
pending = nil
|
|
guard let script = screen.script else { return }
|
|
// The page wires its dialogs at load; asking a moment later avoids racing that.
|
|
DispatchQueue.main.asyncAfter(deadline: .now() + 0.4) { [weak self] in
|
|
self?.webView.evaluateJavaScript(script) { _, error in
|
|
if let error { NSLog("ipx: %@ -> %@", script, error.localizedDescription) }
|
|
}
|
|
}
|
|
}
|
|
|
|
// MARK: - navigation
|
|
|
|
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
|
|
runPending()
|
|
|
|
// The bridge announces itself on load. A server whose page predates it never will, and the
|
|
// app would otherwise look identical while playing nothing in the background.
|
|
checkedBridge = false
|
|
DispatchQueue.main.asyncAfter(deadline: .now() + 2) { [weak self] in
|
|
guard let self, !self.checkedBridge else { return }
|
|
self.webView.evaluateJavaScript("!!(window.ipxNative)") { got, _ in
|
|
if (got as? Bool) != true {
|
|
self.setBanner("This server's page has no native bridge. Playback stays in the app; "
|
|
+ "background and car playback are off.")
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
func webView(_ webView: WKWebView, didFail navigation: WKNavigation!, withError error: Error) {
|
|
showFailure(error)
|
|
}
|
|
|
|
func webView(_ webView: WKWebView, didFailProvisionalNavigation navigation: WKNavigation!, withError error: Error) {
|
|
showFailure(error)
|
|
}
|
|
|
|
private func showFailure(_ error: Error) {
|
|
// -999 is a load cancelled because another started, which is not a failure to report.
|
|
if (error as NSError).code == NSURLErrorCancelled { return }
|
|
let host = ServerSettings.base?.host ?? "the server"
|
|
setBanner("Cannot reach \(host): \(error.localizedDescription)")
|
|
}
|
|
|
|
// MARK: - the banner
|
|
|
|
private func setUpBanner() {
|
|
banner.backgroundColor = UIColor(red: 0.55, green: 0.12, blue: 0.12, alpha: 1)
|
|
banner.isHidden = true
|
|
banner.translatesAutoresizingMaskIntoConstraints = false
|
|
|
|
bannerText.numberOfLines = 0
|
|
bannerText.font = .preferredFont(forTextStyle: .footnote)
|
|
bannerText.textColor = .white
|
|
|
|
let change = UIButton(type: .system)
|
|
change.setTitle("Server", for: .normal)
|
|
change.titleLabel?.font = .preferredFont(forTextStyle: .footnote)
|
|
change.tintColor = .white
|
|
change.setContentHuggingPriority(.required, for: .horizontal)
|
|
// Without this the label takes the whole row and the button truncates to an ellipsis,
|
|
// which is not a thing anyone will tap.
|
|
change.setContentCompressionResistancePriority(.required, for: .horizontal)
|
|
change.addTarget(self, action: #selector(showSetup as () -> Void), for: .touchUpInside)
|
|
|
|
let dismiss = UIButton(type: .system)
|
|
dismiss.setImage(UIImage(systemName: "xmark"), for: .normal)
|
|
dismiss.tintColor = .white
|
|
dismiss.accessibilityLabel = "Hide this message"
|
|
dismiss.setContentHuggingPriority(.required, for: .horizontal)
|
|
dismiss.setContentCompressionResistancePriority(.required, for: .horizontal)
|
|
dismiss.addTarget(self, action: #selector(hideBanner), for: .touchUpInside)
|
|
|
|
let row = UIStackView(arrangedSubviews: [bannerText, change, dismiss])
|
|
row.spacing = 12
|
|
row.alignment = .center
|
|
row.isLayoutMarginsRelativeArrangement = true
|
|
row.layoutMargins = .init(top: 8, left: 12, bottom: 8, right: 12)
|
|
row.translatesAutoresizingMaskIntoConstraints = false
|
|
banner.addSubview(row)
|
|
|
|
view.addSubview(banner)
|
|
pageBelowBanner = webView.topAnchor.constraint(equalTo: banner.bottomAnchor)
|
|
NSLayoutConstraint.activate([
|
|
banner.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
|
|
banner.leadingAnchor.constraint(equalTo: view.leadingAnchor),
|
|
banner.trailingAnchor.constraint(equalTo: view.trailingAnchor),
|
|
row.topAnchor.constraint(equalTo: banner.topAnchor),
|
|
row.bottomAnchor.constraint(equalTo: banner.bottomAnchor),
|
|
row.leadingAnchor.constraint(equalTo: banner.leadingAnchor),
|
|
row.trailingAnchor.constraint(equalTo: banner.trailingAnchor),
|
|
])
|
|
}
|
|
|
|
/// Dismissed by hand. It says something true, but it says it once -- a permanent stripe
|
|
/// across a page that otherwise works is worse than the thing it is warning about.
|
|
@objc private func hideBanner() { setBanner(nil) }
|
|
|
|
private func setBanner(_ text: String?) {
|
|
bannerText.text = text
|
|
banner.isHidden = text == nil
|
|
pageAtTop.isActive = text == nil
|
|
pageBelowBanner.isActive = text != nil
|
|
view.layoutIfNeeded()
|
|
}
|
|
|
|
override var preferredStatusBarStyle: UIStatusBarStyle { .lightContent }
|
|
}
|