Page History
Note | ||
---|---|---|
| ||
In order to be able to play the training videos, please make sure toaccept recommended settings under the Cookie settings option, at the bottom of the page. |
HTML |
---|
<script> $( document ).ready(function() { // Training Videos Vimeo video IDs var videoIDs = [ 636935865, //asset catalog entry 636939181, //catalog 636940575, //consumables w expdate 636941153, //consum wo expdate 636941730, //nonconsum 636942907, //transaction assignees 636943358, //checkout 636944162, //checkin 636944755, //reconcil 636945284, //setupsheets 638968696, //Request items using asset tags 638970242, //Asset properties 638587091, //Properties of consumables with expiration date 638587814, //Properties of non-consumables and consumables without expiration date 638588414, //Asset maintenance and repair 638588977 //Inventory reports ]; var videoTokens = [ "c6d153983a", //asset catalog entry "613c09991c", //catalog "881ea3d58e", //consumables w expdate "2fdf994f5a", //consum wo expdate "fa8c5953b7", //nonconsum "adc094fa5e", //transaction assignees "d5da94b3ed", //checkout "a2ec3954cb", //checkin "bcd424d65b", //reconcil "9d49138166", //setupsheets "d6778a8b2c", //Request items using asset tags "f0ce5d616e", //Asset properties "1a9f5f51a7", //Properties of consumables with expiration date "6b4e8a0996", //Properties of non-consumables and consumables without expiration date "3bafba3c3a", //Asset maintenance and repair "65df89e15a" //Inventory reports ]; // Time box template var timeBoxTemplate = function(videoNum, videoID) { return '<div class=\"timeBox\" id="video_'+ videoID +'">' + '<div class=\"titleHolder\">' + '<div class=\"videoNumberHolder\">' + '<div class=\"videoNumber\">' + videoNum + '</div>' + '</div>' + '<div class=\"videoTitle\">' + "" + '</div>' + '</div>' + '<div class=\"thumbnail\"><img src=""></div>' + '</div>'; }; for (var i=0; i<videoIDs.length; i++) { var timeBox = timeBoxTemplate(i+1, videoIDs[i]); // To start from 1 not from 0 $(timeBox).appendTo('.timeline'); } // Load first video $('.videoScreen iframe').attr('src', 'https://player.vimeo.com/video/' + videoIDs[0] + '?h=' + videoTokens[0]); // Get data from vimeo $.each(videoIDs, function (i, videoID) { $.ajax({ method: "GET", url: "https://api.vimeo.com/videos/" + videoID + '?access_token=0e76ec72e4cc1a5111ac16023a2d0456', success: function(data) { var timeBox = $('#video_'+videoID); timeBox.find('.videoTitle').text(data.name); timeBox.find('.thumbnail img').attr('src', data.pictures.sizes[3].link_with_play_button); } }); }); $('.timeBox:first-child').addClass('active'); // Show current embedded video and set timebox to active $('.timeBox').on('click', function() { var $this = $(this); var index = $this.index(); $('.timeBox').removeClass('active'); $this.addClass('active'); var id = $this.children('.videoID').val(); $('.videoScreen iframe').attr('src', 'https://player.vimeo.com/video/' + videoIDs[index] + '?h=' + videoTokens[index]); }); }); </script> <div class="trainingVideosContainer"> <div class="videosMainHolder"> <div class="timelineHolder"> <div class="timeline"> </div> </div> <div class="videoHolder"> <div class="videoScreenHolder"> <div class="videoScreen"> <iframe src="" width="640" height="400" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe> </div> </div> </div> </div> </div> |
Note | ||
---|---|---|
| ||
In order to be able to play the training videos, please make sure to accept recommended settings under the Cookie settings option of the page. If you do not see the videos, go to Cookies Settings at the bottom of the page and allow all Cookies. For more details, click here. |
Overview
Content Tools