Skip to Content
This question has been flagged
1 Reply
5234 Views
Avatar
paidy kumar

xml code

<template>

<div>

<button class = "btn btn-primary" id = "button_id" t-attf-style = "width: 193px; height: 50px;" > Add Attribute </button> 
<video id = "video" width = "720" hight = "560" autoplay = "autoplay" muted = "muted" >

</div>

</template>


javascript code:

odoo.define ( 'opencv_attendance.face_detection_video' , function (require) { 
"use strict" ;
events: { 
    "click .btn-primary" : "startVideo" , 
},
const video = document.getElementById ( "video" ) 

function startVideo () { 
alert ( "function block is executing" ) 
navigator.getUserMedia ({ 
video: {}}, 
stream => video.srcObject = stream, 
err => console. error (err)) 
} 
});
Avatar
Discard
Avatar
Cybrosys Techno Solutions Pvt.Ltd
Best Answer

Hi,
You have to either select your template as template of the JS widget or you have to code inside $(document).ready() inside the xml to get it working.And one more important thing is, you have to

        <template id="assets_frontend" name="Frontend Theme"
                  inherit_id="web.assets_frontend">
            <xpath expr=".">
                <script type="text/javascript"
                        src="/your_module/static/src/js/your file.js"
                />
            </xpath>
        </template>

for front end and below for back end

        <template id="assets_backend" name="Backend Theme"
                  inherit_id="web.assets_backend">
            <xpath expr=".">
                <link rel="stylesheet"
                      href="/multicolor_backend_theme/static/src/scss/theme_style.scss"/>
                <script type="text/javascript"
                        src="/multicolor_backend_theme/static/src/js/login_page.js"
                />
            </xpath>
        </template>

Regards

Avatar
Discard
paidy kumar
Author

hi cybrosys its not working i have done all the things what you have mentioned

my js file

odoo.define('opencv_attendance.face_detection_video', function(require) {

"use strict";

$(document).ready(function(){

$("#button_id").click(function(){

//$("#button_id").on('click', startVideo);

const video=document.getElementById("video")

alert("function block is executing")

navigator.getUserMedia({

video:{}},

stream => video.srcObject = stream,

err => console.error(err))

});

});

});

xml template:

<template id="opencv_template">

<div>

<body>

<button class = "btn btn-primary" id = "button_id" t-attf-style = "width: 193px; height: 50px;"> Start Recognition </button>

<video id="video" width="720" hight="560" autoplay="autoplay" muted="muted">

</video>

</body>

</div>

</template>

assets.xml

<template id="assets_frontend" name="Frontend Theme"

inherit_id="web.assets_frontend">

<xpath expr=".">

<script type="text / javascript"

src="/opencv_attendance/static/src/js/face_detection_video.js"

/>

</xpath>

</template>