Shoplive 숏폼 에디터 SDK 연동 가이드

// ① Swift Package Manager
dependencies: [
    .package(url: "https://github.com/shoplive/shortform-editor-ios", .upToNextMajor(from: "1.8.12")),
    .package(url: "https://github.com/shoplive/common-ios",           .upToNextMajor(from: "1.8.12")),
]
// 타깃에 ShopLiveShortformEditorSDK · ShopliveFilterSDK 를 함께 추가합니다.

// ② CocoaPods — Podfile
// pod 'ShopLiveShortformEditorSDK', '1.8.12'   # ShopliveFilterSDK 포함
// pod 'ShopliveSDKCommon',          '1.8.12'

// ③ import
import ShopliveSDKCommon
import ShopLiveShortformEditorSDK

dependencies {
    implementation("cloud.shoplive:shoplive-video-editor:1.8.14")   // 에디터
    implementation("cloud.shoplive:shoplive-common:1.8.14")         // 공통 (accessKey · 인증)
    implementation("cloud.shoplive:shoplive-network:1.8.14")        // 네트워크
    implementation("cloud.shoplive:shoplive-filter:1.8.14")         // 필터 (편집기 필수)

    // 재생 엔진 — 아래 둘 중 <b>하나만</b> 선언하세요 (엔진 버전은 SDK 버전과 별개 체계)
    implementation("cloud.shoplive:shoplive-media3:1.10.1.3")       // media3 (기본) — minSdk 23
    // implementation("cloud.shoplive:shoplive-exoplayer:2.19.1.20")    // ExoPlayer (레거시) — minSdk 19
}

android {
    defaultConfig { multiDexEnabled = true }

    // 네이티브 인코딩 라이브러리 포함 → 용량이 중요하면 ABI 분할 권장
    bundle { abi { enableSplit = true } }
}

<!-- Info.plist — 없으면 앱이 크래시합니다 -->
<key>NSPhotoLibraryUsageDescription</key>
<string>숏폼으로 만들 영상을 선택하기 위해 사진 접근이 필요합니다.</string>
<key>NSCameraUsageDescription</key>
<string>숏폼을 촬영하기 위해 카메라 접근이 필요합니다.</string>
<key>NSMicrophoneUsageDescription</key>
<string>영상 소리를 녹음하기 위해 마이크 접근이 필요합니다.</string>

// 갤러리 선택은 PickVisualMedia(사진 선택기)를 쓰므로 저장소 권한이 필요 없습니다.
// 촬영 기능을 함께 붙일 때만 AndroidManifest.xml 에 추가:
// <uses-permission android:name="android.permission.CAMERA" />
// <uses-permission android:name="android.permission.RECORD_AUDIO" />

// 1) 앱 시작 시 1회
ShopLiveCommon.setAccessKey(accessKey: "발급받은_ACCESS_KEY")
ShopLiveCommon.setAuthToken(authToken: myJwtFromServer)

// 2) "숏폼 올리기" 버튼에서 — 선택·편집·커버·업로드까지 한 번에
ShopLiveShortformEditor.shared
    .setDelegate(delegate: self)
    .start(self)

// 1) 앱 시작 시 1회 (Application.onCreate)
ShopLiveCommon.setAccessKey("발급받은_ACCESS_KEY")
ShopLiveCommon.setAuthToken(myJwtFromServer)

// 2) "숏폼 올리기" 버튼에서 — 선택·편집·커버·업로드까지 한 번에
ShopLiveShortformEditor(this)          // this = ComponentActivity
    .setHandler(myHandler)
    .start()

@IBAction func createShorts() {
    ShopLiveShortformEditor.shared
        .setPermissionHandler(self)        // 선택 — 부록 참고
        .setDelegate(delegate: self)
        .start(self)                       // 현재 ViewController 위에 띄움
}

// 앱이 강제로 닫아야 할 때
ShopLiveShortformEditor.shared.close()

fun createShorts() {
    ShopLiveShortformEditor(this)          // this = ComponentActivity
        .setHandler(myHandler)
        .start()
}

extension MyViewController: ShopLiveShortformEditorDelegate {

    func onShopLiveShortformEditorUploadSuccess(result: ShopliveEditorResultData?) {
        // 업로드 완료 — result.shortsId 로 방금 만든 숏폼을 재생할 수 있습니다
        guard let shortsId = result?.shortsId else { return }
        myFeed.insertNewShorts(shortsId)
    }

    func onShopLiveShortformEditorVideoConvertSuccess(videoPath: String) {
        // 인코딩이 끝난 로컬 파일 경로 (업로드 전 단계)
    }

    func onShopLiveShortformEditorCoverImageSuccess(image: UIImage?) {
        // 사용자가 고른 커버 이미지
    }

    func onShopLiveShortformEditorClosed() {
        // 사용자가 도중에 닫음 — 필요하면 "임시저장" 안내
    }

    func onShopLiveShortformEditorError(error: ShopLiveCommonError) {
        log("editor error \(error.codes) \(error.message ?? "")")
    }

    func onShopLiveShortformEditorOnEvent(name: String, payload: [String : Any]?) {
        analytics.log(name)                // 버튼 단위 행동 로그
    }
}

val myHandler = object : ShopLiveShortformEditorHandler() {

    override fun onSuccess(activity: ComponentActivity) {
        // 업로드 완료 — 목록을 새로고침하거나 내 숏폼 탭으로 이동
        activity.finish()
        myFeed.refresh()
    }

    override fun onCancel() {
        // 사용자가 도중에 닫음
    }

    override fun onError(context: Context, error: ShopLiveCommonError) {
        log("editor error ${error.code} ${error.message}")
    }

    override fun onEvent(context: Context, command: String, payload: Map<String, Any?>) {
        analytics.log(command)             // 버튼 단위 행동 로그
    }
}

ShopLiveShortformEditor(this)
    .setShortformUploaderData(
        ShopLiveShortformUploaderData(
            tags = listOf("봄신상"),
            products = listOf(
                ShopLiveShortformUploaderProductData(
                    customerProductId = "P-1001",
                    sku = "SKU-1001"
                )
            ),
            ui = ShopLiveShortformUploaderUiData(
                hashTag = true,
                videoChange = false,
                rating = false
            )
        )
    )
    .setHandler(myHandler)
    .start()

// iOS 는 업로더를 단독 컴포넌트로 열어 초기값을 주입합니다.
// (전체 플로우 ShopLiveShortformEditor 에는 주입 지점이 없습니다)
ShopLiveShortformUploader.shared
    .setDelegate(self)
    .setUploaderData(ShopLiveShortformUploaderData(
        ui: ShopLiveUgcUploaderUiData(hashTag: true, videoChange: false, rating: false),
        tags: ["봄신상"],
        products: [ShopLiveConversionProductData(sku: "SKU-1001", customProductId: "P-1001")]
    ))
    .build { uploaderVC in
        uploaderVC.modalPresentationStyle = .fullScreen
        self.present(uploaderVC, animated: true)
    }
let visible = ShopLiveShortFormEditorVisibleContent(
    isDescriptionVisible: true,
    isTagsVisible: true
)

let config = ShopLiveShortformEditorConfiguration(
    videoCropOption: ShopLiveShortFormEditorAspectRatio(width: 9, height: 16, isFixed: true),
    visibleContents: nil,
    videoOutputOption: ShopLiveShortformEditorVideoOuputOption(
        videoOutputQuality: .high,
        videoOutputResoltuion: ._720
    ),
    mediaPickerVideoDurationOption: ShopLiveMediaPickerVideoDurationOption(
        minVideoDuration: 3,                 // 초
        maxVideoDuration: 60 * 5,
        invalidDurationToastMessage: "3초~5분 영상만 올릴 수 있어요"
    ),
    videoUploadOption: nil,
    minVideoDuration: 3,                     // 편집 결과물 길이 (초)
    maxVideoDuration: 60
)

ShopLiveShortformEditor.shared
    .setConfiguration(config)
    .setDelegate(delegate: self)
    .start(self)

ShopLiveShortformEditor(this)
    .setVideoEditorData(
        ShopLiveVideoEditorData(
            minVideoDuration = 3_000,        // 밀리초
            maxVideoDuration = 60_000,
            aspectRatio = ShopLiveShortformEditorAspectRatio(
                width = 9, height = 16, isFixed = true
            ),
            outputVideoQuality = ShopLiveVideoEditorVideoQuality.HIGH,
            outputResolution = ShopLiveVideoEditorResolution.RESOLUTION_720
        )
    )
    .setHandler(myHandler)
    .start()

// 필터·크롭만 남기고 속도·볼륨은 숨김
let visible = ShopLiveShortFormEditorVisibleContent(
    isDescriptionVisible: true,
    isTagsVisible: true,
    editOptions: [.filter, .crop]        // 기본값: [.filter, .playBackSpeed, .volume, .crop]
)

ShopLiveVideoEditorData(
    visibleActionButton = ShopLiveShortformEditorVisibleActionButton(
        isUsedFilterButton = true,
        isUsedCropButton = true,
        isUsedPlaybackSpeedButton = false,
        isUsedVolumeButton = false
    )
)

// 설명·해시태그 노출 여부 + 업로드 정책
let visible = ShopLiveShortFormEditorVisibleContent(
    isDescriptionVisible: true,
    isTagsVisible: false                 // 해시태그 입력 숨김
)

let upload = ShopLiveShortFormEditorVideoUploadOption(
    shortsStatus: .CLOSED,               // 업로드 직후 비공개 → 검수 후 공개
    isCreatedShortform: true
)

ShopLiveShortformEditor(this)
    .setShortformUploaderData(
        ShopLiveShortformUploaderData(
            ui = ShopLiveShortformUploaderUiData(hashTag = false)
        )
    )
    .setVideoEditorData(
        ShopLiveVideoEditorData(
            shortformStatus = ShopLiveShortformStatus.CLOSED   // 비공개로 업로드
        )
    )
    .setHandler(myHandler)
    .start()

ShopLiveShortformEditor(this)
    .setVideoEditorCustomize(
        ShopLiveVideoEditorCustomizeData(
            mainData = ShopLiveVideoEditorCustomizeMainData(
                titleTextSize = 16f,
                backButtonBackgroundRes = R.drawable.ic_my_back,
                closeButtonBackgroundRes = R.drawable.ic_my_close,
                confirmButtonTextColor = Color.WHITE,
                confirmButtonBackgroundRes = R.drawable.bg_my_button,
                trimColor = Color.parseColor("#245EFF"),
                trimHandleColor = Color.WHITE
            )
            // volumeData · cropData · filterData · playbackSpeedData 도 동일한 방식
        )
    )
    .setHandler(myHandler)
    .start()

// iOS 는 화면별 전역 config 싱글턴으로 아이콘·색을 교체합니다.
// 에디터를 띄우기 전에 한 번만 설정하면 됩니다.
ShopLiveShortformEditor.MediaPickerConfig.global.cellCornerRadius = 8
ShopLiveShortformEditor.EditorMainConfig.global.confirmButtonBackgroundColor = .systemPink
ShopLiveShortformEditor.EditorMainConfig.global.confirmButtonTextColor = .white
ShopLiveShortformEditor.EditorCropConfig.global.cropColor = .systemPink
// 이 밖에 EditorVolumeConfig · EditorSpeedConfig · EditorFilterConfig
// · EditorCoverPickerConfig 도 같은 방식으로 .global 에 접근합니다.

// iOS — 편집기 "화면"을 돌려주므로 앱이 직접 present 합니다
ShopliveVideoEditor.shared
    .setDelegate(self)
    .setConfiguration(ShopliveVideoEditorConfiguration(
        videoCropOption: ShopliveVideoEditorAspectRatio(width: 9, height: 16, isFixed: true),
        videoOutputOption: nil,
        videoTrimOption: ShopliveVideoEditorTrimOption(minVideoDuration: 3, maxVideoDuration: 60),
        visibleContents: nil,
        videoUploadOption: nil
    ))
    .build(data: ShopLiveVideoEditorData(videoUrl: pickedFileURL, isCreatedShortform: true)) { editorVC in
        editorVC.modalPresentationStyle = .fullScreen
        self.present(editorVC, animated: true)
    }

// 메모리 정리 — 편집기를 닫은 뒤
ShopliveVideoEditor.shared.cleanUpMemory()

// Android — SDK가 Activity 를 띄우고 결과를 핸들러로 돌려줍니다
ShopLiveVideoEditor(this)
    .setData(ShopLiveVideoEditorData(
        minVideoDuration = 3_000,
        maxVideoDuration = 60_000,
        isCreatedShortform = true
    ))
    .setHandler(object : ShopLiveVideoEditorHandler() {
        override fun onSuccess(
            videoEditorActivity: ComponentActivity,
            result: ShopLiveEditorResultData
        ) {
            // result.shortsId · localVideoUri · localCoverImageUri · duration …
            ShopLiveVideoEditor.close()
            uploadToMyServer(result.localVideoUri)
        }
        override fun onCancel() { /* 사용자가 닫음 */ }
        override fun onError(context: Context, error: ShopLiveCommonError) { log(error) }
    })
    .start(ShopLiveEditorLocalData(pickedUri))     // 카메라 결과면 ShopLiveEditorCameraData

ShopLiveCoverPicker(this)
    .setData(ShopLiveCoverPickerData(
        shortsId = "SHORTS_ID",
        aspectRatio = ShopLiveShortformEditorAspectRatio(9, 16, isFixed = true),
        visibleActionButton = ShopLiveCoverPickerVisibleActionButton(isUsedCropButton = true)
    ))
    .setHandler(object : ShopLiveCoverPickerHandler() {
        override fun onSuccess(
            coverPickerActivity: ComponentActivity,
            result: ShopLiveEditorResultData
        ) {
            ShopLiveCoverPicker.close()
            applyCover(result.localCoverImageUri)
        }
        override fun onCancel() { /* … */ }
    })
    .start(ShopLiveCoverPickerLocalData(localVideoUri))   // 또는 ShopLiveCoverPickerUrlData(remoteUrl)

// iOS 도 커버 선택기를 단독으로 열 수 있습니다 (화면을 돌려주므로 앱이 present)
ShopLiveCoverPicker.shared
    .setDelegate(self)
    .setConfiguration(ShopLiveCoverPickerConfiguration(
        cropOption: ShopLiveShortFormEditorAspectRatio(width: 9, height: 16, isFixed: true),
        visibleActionButton: ShopLiveCoverPickerVisibleActionButton(editOptions: [.crop])
    ))
    .build(data: ShopLiveCoverPickerData(videoUrl: localVideoURL, shortsId: shortsId)) { pickerVC in
        self.present(pickerVC, animated: true)
    }

// 닫은 뒤 메모리 정리
ShopLiveCoverPicker.shared.cleanUpMemory()

ShopLiveImageEditor(this)
    .setData(ShopLiveImageEditorData(
        isCreatedShortform = true,
        resolution = ShopLiveVideoEditorResolution.RESOLUTION_720,
        videoDuration = 10_000                 // 밀리초 — 이미지를 10초 영상으로
    ))
    .setHandler(object : ShopLiveImageEditorHandler() {
        override fun onSuccess(result: ShopLiveEditorResultData) { /* … */ }
        override fun onError(error: ShopLiveCommonError) { log(error) }
    })
    .start(ShopLiveEditorLocalData(pickedImageUri))

// iOS 에는 이미지 → 영상 변환 API 가 공개돼 있지 않습니다.

ShopLiveShortformEditor.shared
    .setPermissionHandler(self)
    .setDelegate(delegate: self)
    .start(self)

extension MyViewController: ShopLivePermissionHandler {
    func handlePhotoLibraryUsagePermission(status: PermissionStatus) {
        // 거부 상태면 "설정에서 사진 접근을 허용해 주세요" 안내를 앱이 띄움
    }
    func handleCameraPermission(status: PermissionStatus) { /* … */ }
    func handleMicroPhonePermission(status: PermissionStatus) { /* … */ }
    func handleMediaLibraryUsagePermission(status: PermissionStatus) { /* … */ }
}

// Android 는 사진 선택기(PickVisualMedia)를 쓰므로 저장소 권한 처리가 필요 없습니다.
// 촬영을 붙인 경우에만 앱이 CAMERA · RECORD_AUDIO 권한을 요청하고,
// 허용된 뒤 ShopLiveEditorCameraData 로 편집기를 시작하세요.