website_sale_product.xml

<?xml version="1.0" encoding="utf-8"?>
<odoo>

    <template id="product_details_inherit" inherit_id="website_sale.product">
        <xpath expr="." position="inside">
            <!-- Google AdSense script -->
            <!--            <script async="async" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-6346256437579351"-->
            <!--            crossorigin="anonymous"></script>-->
            <script async="async" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" crossorigin="anonymous"></script>
            <!-- responsive_ad -->


        </xpath>
        <xpath expr="//h1[@t-field='product.name']" position="replace">
            <h1>Arctic Explorer</h1>
            <script>
                (adsbygoogle = window.adsbygoogle || []).push({});
            </script>
        </xpath>
        <xpath expr="//div[@id='o_product_terms_and_share']" position="attributes">
            <attribute name="class">d-none</attribute>
        </xpath>
        <xpath expr="//p[@t-field='product.description_sale']" position="replace"/>
        <xpath expr="//form" position="replace">
            <form id="fal_ai_data" t-if="product._is_add_to_cart_possible()" action="/submit-request" method="POST"
                  enctype="multipart/form-data">
                <div class="form-group">
                    <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"
                           t-nocache="The csrf token must always be up to date."/>
                    <div class="row">
                        <div class="col">
                            <span class="title custom-file-label">Upload Image</span>
                            <input type="file" class="custom-file-input" id="image-input" name="avatar"
                                   accept=".png, .jpg, .jpeg"/>
                            <span class="text-danger" id="invalid-feedback" style="display:none;">Please select an
                                image.
                            </span>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <span class="title">Prompt</span>
                            <textarea class="product_prompt_id form-control" name="prompt" id="prompt_input"
                                      t-att-value="product.prompt" required="True"/>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-4">
                            <span class="title">Style</span>
                            <select class="style_id form-control" name="style">
                                <t t-foreach="product._fields['style'].selection" t-as="option">
                                    <option t-att-value="option[0]">
                                        <t t-esc="option[1]"/>
                                    </option>
                                </t>
                            </select>

                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <span class="title">Negative Prompt</span>
                            <textarea class="product_negative_prompt_id form-control" name="negative_prompt"
                                      t-att-value="product.negative_prompt" required="True"/>
                        </div>
                    </div>
                    <div class="row" id="expandable-section" style="display: none;">
                        <!-- Content of the expandable section goes here -->

                        <div class="row second_row" style="margin-top:12px;">
                            <input type="hidden" t-att-value="product.id" name="product_id"/>
                            <input type="hidden" t-att-value="product.is_fal_ai" name="is_fal_ai"/>

                            <div class="col">
                                <span class="title">Number of Inference<br/>Steps (<span
                                        id="inference_steps_value">0</span>)
                                </span>
                                <span>
                                    <input type="range" class="form-range" min="1" max="100" step="1"
                                           id="inference_range"
                                           t-att-value="product.style" name="inference_range"/>
                                </span>

                            </div>

                            <div class="col">
                                <span class="title">Guidance<br/>Scale (<span
                                        id="guidance_scale_value">0</span>)
                                </span>
                                <input type="range" class="form-range" min="0.1" max="10" step="0.1" id="guidance_scale"
                                       t-att-value="product.guidance_scale" name="guidance_scale"/>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-4">
                                <span class="title">Controlnet Selection</span>
                                <select class="style_id form-control" name="controlnet_selection">
                                    <t t-foreach="product._fields['controlnet_selection'].selection" t-as="option">
                                        <option t-att-value="option[0]">
                                            <t t-esc="option[1]"/>
                                        </option>
                                    </t>
                                </select>
                            </div>
                            <div class="col">
                                <span class="title">Seed
                                </span>
                                <div class="row">
                                    <div class="col">
                                        <input type="text" name="seed" id="random_number" placeholder="random"/>
                                    </div>
                                    <div class="col">
                                        <span id="generate_button">
                                            <i class="fa fa-refresh" aria-hidden="true"></i>
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col">
                                <span class="title">Controlnet Conditioning
                                    Scale (<span id="controlnet_scale_value">0</span>)
                                </span>
                                <input type="range" class="form-range" min="0.1" max="10" step="0.1"
                                       id="controlnet_conditioning_scale" name="controlnet_scale"
                                       t-att-value="product.controlnet_conditioning_scale"/>

                            </div>
                            <div class="col">
                                <span class="title">Ip Adapter<br/>Scale (<span
                                        id="ip_adapter_scale_value">0</span>)
                                </span>
                                <input type="range" class="form-range" min="0.1" max="10" step="0.1"
                                       id="ip_adapter_slider"
                                       t-att-value="product.ip_adapter_scale" name="ip_adapter_scale"/>
                            </div>

                            <div class="col">
                                <span class="title">Identity Controlnet
                                    Conditioning Scale (<span id="identity_controlnet_conditioning_scale_value">0</span>)
                                </span>
                                <input type="range" class="form-range" min="0.1" max="10" step="0.1"
                                       id="identity_controlnet_conditioning_slider" name="identity_conditioning_slider"
                                       t-att-value="product.identity_controlnet_conditioning_scale"/>

                            </div>
                        </div>
                        <span>
                            <span class="form-label">Enhance Face Region</span>
                            <input
                                    type="checkbox"
                                    class="form-check-input"
                                    t-att-checked="product.enhance_face_region"
                                    t-on-change="onChange"
                                    name="enhance_face_region"
                            />
                        </span>

                    </div>
                    <button type="button" class="btn btn-link" id="toggle-expandable-section">Advance Section</button>

                    <div class="mb-0 py-2 col-12 s_website_form_submit s_website_form_no_submit_options">
                        <div style="width: 200px;" class="s_website_form_label"/>
                        <button role="button" class="btn btn-primary float-end" id="submit_fa_ai"
                                href="/submit-request">Generate Image
                            <span class="fa fa-chevron-right"/>
                        </button>
                        <span id="s_website_form_result"></span>
                    </div>

                </div>
                <div class="ad_container" style="display:none;">
<!--                    <ins class="adsbygoogle"-->
<!--                         style="display:block; background-color:red;"-->
<!--                         data-ad-client="ca-pub-6346256437579351"-->
<!--                         data-ad-format="auto"-->
<!--                         data-adtest="on"-->
<!--                         data-full-width-responsive="true">-->
<!--                    </ins>-->
                    <h2>Sample Ad</h2>
                    <p>This is a sample advertisement.</p>
                    <img src="https://via.placeholder.com/300x250" alt="Sample Ad Image"/>
                </div>

                <div id="loading" class="text-center" style="display: none;">
                    <img src="/alex_website_sale/static/src/img/loading.gif" alt="Loading..."/>
                    <p>Loading...</p>
                </div>

            </form>


        </xpath>


    </template>


</odoo>