@extends('shopify-app::layouts.default')

@section('styles')
    <link href="{{ mix('/css/app.css') }}" rel="stylesheet" type="text/css" media="screen">
@endsection

@section('content')
    <div class="page" data-controller="ContentTools">
        <a href="\">back</a>
        <h2>Content Tools</h2>
        <div class="tool">
            <h3>Copy product editorial content</h3>
            <div>
                <label>Source product (Matnr, no leading zeros)</label><br>
                <input name="source_product" type="text">
            </div>
            <br>
            <div>
                <label>Destination product(s) (Matnr, comma separated: 32323,23233,23112)</label><br>
                <textarea name="target_products"></textarea>
            </div>
            <br>
            <button data-action="copy-contents">Copy contents</button> <span data-role="message"></span>
            <div class="info">* WARNING: target products existing content will be overwritten</div>
        </div>
    </div>
@endsection

@section('scripts')
    @parent

    <script type="text/javascript">
        var AppBridge = window['app-bridge'];
        var actions = AppBridge.actions;
        var TitleBar = actions.TitleBar;
        var Button = actions.Button;
        var Redirect = actions.Redirect;
        var titleBarOptions = {
            title: 'Content Tools',
        };
        var myTitleBar = TitleBar.create(app, titleBarOptions);
    </script>
    <script src="/js/app.js"></script>
@endsection