@jaeyeonee/capacitor-ios-webview 0.0.3 → 0.0.5

package/CustomWebview.podspec

@@ -3,7 +3,7 @@ require 'json'
 package = JSON.parse(File.read(File.join(__dir__, 'package.json')))
 
 Pod::Spec.new do |s|
-  s.name = 'CapacitorIosCustomWebView'
+  s.name = 'JaeyeoneeCapacitorIosWebview'
   s.version = package['version']
   s.summary = package['description']
   s.license = package['license']

package/README.md

@@ -24,12 +24,12 @@ npx cap sync
 ### open(...)
 
 ```typescript
-open(options: { url: string; closeButtonText?: string; }) => Promise<void>
+open(options: { url: string; closeButtonText?: string; closeWarningText?: string; toolbarPosition?: 'top' | 'bottom'; }) => Promise<void>
 ```
 
-| Param         | Type                                                    |
-| ------------- | ------------------------------------------------------- |
-| **`options`** | <code>{ url: string; closeButtonText?: string; }</code> |
+| Param         | Type                                                                                                                    |
+| ------------- | ----------------------------------------------------------------------------------------------------------------------- |
+| **`options`** | <code>{ url: string; closeButtonText?: string; closeWarningText?: string; toolbarPosition?: 'top' \| 'bottom'; }</code> |
 
 --------------------
 

package/dist/docs.json

@@ -7,12 +7,12 @@
     "methods": [
       {
         "name": "open",
-        "signature": "(options: { url: string; closeButtonText?: string; }) => Promise<void>",
+        "signature": "(options: { url: string; closeButtonText?: string; closeWarningText?: string; toolbarPosition?: 'top' | 'bottom'; }) => Promise<void>",
         "parameters": [
           {
             "name": "options",
             "docs": "",
-            "type": "{ url: string; closeButtonText?: string | undefined; }"
+            "type": "{ url: string; closeButtonText?: string | undefined; closeWarningText?: string | undefined; toolbarPosition?: 'top' | 'bottom' | undefined; }"
           }
         ],
         "returns": "Promise<void>",

package/dist/esm/definitions.d.ts

@@ -2,6 +2,8 @@ export interface CustomWebViewPlugin {
     open(options: {
         url: string;
         closeButtonText?: string;
+        closeWarningText?: string;
+        toolbarPosition?: 'top' | 'bottom';
     }): Promise<void>;
     close(): Promise<void>;
 }

package/dist/esm/definitions.js.map

@@ -1 +1 @@
-{"version":3,"file":"definitions.js","sourceRoot":"","sources":["../../src/definitions.ts"],"names":[],"mappings":"","sourcesContent":["export interface CustomWebViewPlugin {\n  open(options: { url: string, closeButtonText?: string }): Promise<void>;\n\n  close(): Promise<void>;\n}\n"]}
+{"version":3,"file":"definitions.js","sourceRoot":"","sources":["../../src/definitions.ts"],"names":[],"mappings":"","sourcesContent":["export interface CustomWebViewPlugin {\n  open(options: { url: string; closeButtonText?: string; closeWarningText?: string; toolbarPosition?: 'top'|'bottom' }): Promise<void>;\n\n  close(): Promise<void>;\n}\n"]}

package/ios/Sources/CustomWebViewPlugin/CustomWebView.swift

@@ -1,16 +1,24 @@
 import UIKit
 import WebKit
 
-final class CustomWebViewController: UIViewController, UIGestureRecognizerDelegate, WKNavigationDelegate {
+final class CustomWebViewController: UIViewController, WKNavigationDelegate {
 
     private let url: URL
-    private let closeButtonText: String
+    private let closeButtonText: String?
+    private let closeWarningText: String
     private let webView = WKWebView()
     private var backButton: UIButton!
+    private let toolbarPosition: ToolbarPosition
+    private let toolbarHeight: CGFloat = 48
 
-    init(url: URL, closeButtonText: String? = nil) {
+    // gradient view
+    private let gradientView = UIView()
+
+    init(url: URL, closeButtonText: String? = nil, closeWarningText: String? = nil, toolbarPosition: ToolbarPosition = .top) {
         self.url = url
-        self.closeButtonText = closeButtonText ?? "Close"
+        self.closeButtonText = closeButtonText
+        self.closeWarningText = closeWarningText ?? "Tap again to close the WebView."
+        self.toolbarPosition = toolbarPosition
         super.init(nibName: nil, bundle: nil)
     }
 
@@ -24,12 +32,16 @@ final class CustomWebViewController: UIViewController, UIGestureRecognizerDelega
 
         setupHeader()
         setupWebView()
+        setupGradient()
         load()
     }
 
+    // MARK: - Header
+
+    private let header = UIView()
+
     private func setupHeader() {
-        let header = UIView()
-        header.backgroundColor = .white
+        header.backgroundColor = UIColor.systemBackground.withAlphaComponent(0.95)
         header.translatesAutoresizingMaskIntoConstraints = false
         view.addSubview(header)
 
@@ -41,27 +53,45 @@ final class CustomWebViewController: UIViewController, UIGestureRecognizerDelega
         self.backButton = back
 
         let close = UIButton(type: .system)
-        close.setTitle(closeButtonText, for: .normal)
+        if let text = closeButtonText, !text.isEmpty {
+            close.setTitle(text, for: .normal)
+        } else {
+            close.setImage(UIImage(systemName: "xmark"), for: .normal)
+        }
         close.addTarget(self, action: #selector(closeTapped), for: .touchUpInside)
         close.translatesAutoresizingMaskIntoConstraints = false
         header.addSubview(close)
 
         NSLayoutConstraint.activate([
-            header.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
-            header.leadingAnchor.constraint(equalTo: view.leadingAnchor),
-            header.trailingAnchor.constraint(equalTo: view.trailingAnchor),
-            header.heightAnchor.constraint(equalToConstant: 48),
-
             back.leadingAnchor.constraint(equalTo: header.leadingAnchor, constant: 8),
             back.centerYAnchor.constraint(equalTo: header.centerYAnchor),
             back.widthAnchor.constraint(equalToConstant: 44),
             back.heightAnchor.constraint(equalToConstant: 44),
 
-            close.leadingAnchor.constraint(equalTo: back.trailingAnchor, constant: 4),
-            close.centerYAnchor.constraint(equalTo: header.centerYAnchor)
+            close.trailingAnchor.constraint(equalTo: header.trailingAnchor, constant: -8),
+            close.centerYAnchor.constraint(equalTo: header.centerYAnchor),
+            close.widthAnchor.constraint(equalToConstant: 44),
+            close.heightAnchor.constraint(equalToConstant: 44)
+        ])
+
+        if toolbarPosition == .top {
+            NSLayoutConstraint.activate([
+                header.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor)
+            ])
+        } else {
+            NSLayoutConstraint.activate([
+                header.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -8)
+            ])
+        }
+
+        NSLayoutConstraint.activate([
+            header.leadingAnchor.constraint(equalTo: view.leadingAnchor),
+            header.trailingAnchor.constraint(equalTo: view.trailingAnchor),
+            header.heightAnchor.constraint(equalToConstant: toolbarHeight)
         ])
     }
 
+    // MARK: - WebView
 
     private func setupWebView() {
         webView.translatesAutoresizingMaskIntoConstraints = false
@@ -69,14 +99,65 @@ final class CustomWebViewController: UIViewController, UIGestureRecognizerDelega
         webView.navigationDelegate = self
         view.addSubview(webView)
 
+        if toolbarPosition == .top {
+            NSLayoutConstraint.activate([
+                webView.topAnchor.constraint(equalTo: header.bottomAnchor),
+                webView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
+            ])
+        } else {
+            NSLayoutConstraint.activate([
+                webView.topAnchor.constraint(equalTo: view.topAnchor),
+                webView.bottomAnchor.constraint(equalTo: header.topAnchor)
+            ])
+        }
+
         NSLayoutConstraint.activate([
-            webView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 48),
             webView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
-            webView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
-            webView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
+            webView.trailingAnchor.constraint(equalTo: view.trailingAnchor)
         ])
     }
 
+    // MARK: - Gradient Shadow
+    private func setupGradient() {
+        gradientView.translatesAutoresizingMaskIntoConstraints = false
+        view.addSubview(gradientView)
+
+        let gradientLayer = CAGradientLayer()
+        gradientLayer.colors = [
+            UIColor.black.withAlphaComponent(0.05).cgColor,
+            UIColor.clear.cgColor
+        ]
+        gradientLayer.cornerRadius = 0
+
+        let gradientHeight: CGFloat = 6
+
+        if toolbarPosition == .top {
+            gradientView.layer.addSublayer(gradientLayer)
+            NSLayoutConstraint.activate([
+                gradientView.topAnchor.constraint(equalTo: header.bottomAnchor),
+                gradientView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
+                gradientView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
+                gradientView.heightAnchor.constraint(equalToConstant: gradientHeight)
+            ])
+            gradientLayer.startPoint = CGPoint(x: 0, y: 0)
+            gradientLayer.endPoint = CGPoint(x: 0, y: 1)
+        } else {
+            gradientView.layer.addSublayer(gradientLayer)
+            NSLayoutConstraint.activate([
+                gradientView.bottomAnchor.constraint(equalTo: header.topAnchor),
+                gradientView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
+                gradientView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
+                gradientView.heightAnchor.constraint(equalToConstant: gradientHeight)
+            ])
+            gradientLayer.startPoint = CGPoint(x: 0, y: 1)
+            gradientLayer.endPoint = CGPoint(x: 0, y: 0)
+        }
+
+        gradientView.layoutIfNeeded()
+        gradientLayer.frame = gradientView.bounds
+    }
+
+    // MARK: - Load URL
     private func load() {
         webView.load(URLRequest(url: url))
     }
@@ -85,11 +166,9 @@ final class CustomWebViewController: UIViewController, UIGestureRecognizerDelega
         dismiss(animated: true)
     }
 
-    
-    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
-    }
-
+    // MARK: - Toast
     private var toastView: UIView?
+    private var lastBackPressedAt: Date?
 
     private func showToast(_ message: String) {
         toastView?.removeFromSuperview()
@@ -121,10 +200,7 @@ final class CustomWebViewController: UIViewController, UIGestureRecognizerDelega
             label.trailingAnchor.constraint(equalTo: container.trailingAnchor, constant: -14),
 
             container.centerXAnchor.constraint(equalTo: view.centerXAnchor),
-            container.bottomAnchor.constraint(
-                equalTo: view.safeAreaLayoutGuide.bottomAnchor,
-                constant: -20
-            ),
+            container.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -20),
             container.widthAnchor.constraint(lessThanOrEqualToConstant: 320)
         ])
 
@@ -140,23 +216,20 @@ final class CustomWebViewController: UIViewController, UIGestureRecognizerDelega
             }
         }
     }
-    
-    private var lastBackPressedAt: Date?
-    
+
+    // MARK: - Back button
     @objc private func backTapped() {
         if webView.canGoBack {
-        webView.goBack()
-        return
+            webView.goBack()
+            return
         }
-        
+
         let now = Date()
-        
-        if let last = lastBackPressedAt,
-           now.timeIntervalSince(last) < 2 {
+        if let last = lastBackPressedAt, now.timeIntervalSince(last) < 2 {
             dismiss(animated: true)
         } else {
             lastBackPressedAt = now
-            showToast("한 번 더 누르면 웹뷰가 종료됩니다.")
+            showToast(closeWarningText)
         }
     }
 }

package/ios/Sources/CustomWebViewPlugin/CustomWebViewPlugin.swift

@@ -16,7 +16,10 @@ public class CustomWebViewPlugin: CAPPlugin, CAPBridgedPlugin {
 
     @objc func open(_ call: CAPPluginCall) {
         let urlString = call.getString("url") ?? ""
-        let closeButtonText = call.getString("closeButtonText") ?? ""
+        let closeButtonText = call.getString("closeButtonText")
+        let closeWarningText = call.getString("closeWarningText")
+        let positionString = call.getString("toolbarPosition") ?? "top"
+        let position: ToolbarPosition = positionString == "bottom" ? .bottom : .top
         guard let url = URL(string: urlString) else {
             call.reject("Invalid URL")
             return
@@ -24,7 +27,7 @@ public class CustomWebViewPlugin: CAPPlugin, CAPBridgedPlugin {
         
 
         DispatchQueue.main.async {
-            let vc = CustomWebViewController(url: url, closeButtonText: closeButtonText)
+            let vc = CustomWebViewController(url: url, closeButtonText: closeButtonText, closeWarningText: closeWarningText, toolbarPosition: position)
             vc.modalPresentationStyle = .fullScreen
             self.bridge?.viewController?.present(vc, animated: true)
             self.webVC = vc

package/ios/Sources/CustomWebViewPlugin/CustomWebViewTypes.swift

@@ -0,0 +1,6 @@
+import Foundation
+
+@objc public enum ToolbarPosition: Int {
+    case top
+    case bottom
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jaeyeonee/capacitor-ios-webview",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "Jaeyeonee / Capacitor IOS Webview",
   "main": "dist/plugin.cjs.js",
   "module": "dist/esm/index.js",