httpdocs/widget/script.js

0001 /* jshint browser: true */
0002 (function(window, document) {"use strict";  /* Wrap code in an IIFE */
0003
0004 var jQuery, $; // Localize jQuery variables
0005 //var opendesktopwigeturl = 'http://pling.local/';
0006 var opendesktopwigeturl = 'http://pling.cc/';
0007 //var opendesktopwigeturl = 'https://opendesktop.org/';
0008  let indicator = '<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>';
0009
0010 function loadScript(url, callback) {
0011   /* Load script from url and calls callback once it's loaded */
0012   var scriptTag = document.createElement('script');
0013   scriptTag.setAttribute("type", "text/javascript");
0014   scriptTag.setAttribute("src", url);
0015   if (typeof callback !== "undefined") {
0016     if (scriptTag.readyState) {
0017       /* For old versions of IE */
0018       scriptTag.onreadystatechange = function () {
0019         if (this.readyState === 'complete' || this.readyState === 'loaded') {
0020           callback();
0021         }
0022       };
0023     } else {
0024       scriptTag.onload = callback;
0025     }
0026   }
0027   (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(scriptTag);
0028 }
0029
0030
0031 function opendesktopFilterReviews(filterBtn){
0032     //init
0033     let reContainer = $('#opendesktopwidget-reviews');
0034     reContainer.find('.opendesktopwidget-reviews-rows').show();
0035
0036     let inactive =  reContainer.find('.opendesktopwidget-reviews-rows-inactive');
0037     let active = reContainer.find('.opendesktopwidget-reviews-rows-active');
0038     let up =  reContainer.find('.opendesktopwidget-reviews-rows-clsUpvotes');
0039     let down = reContainer.find('.opendesktopwidget-reviews-rows-clsDownvotes');
0040
0041     if($(filterBtn).attr('id')=='opendesktopwidget-reviews-filters-all'){
0042           inactive.show();
0043           active.show();
0044     } else  if($(filterBtn).attr('id')=='opendesktopwidget-reviews-filters-active'){
0045           inactive.hide();
0046           active.show();
0047     } else  if($(filterBtn).attr('id')=='opendesktopwidget-reviews-filters-likes'){
0048           up.show();
0049           down.hide();
0050           inactive.hide();
0051     } else if($(filterBtn).attr('id')=='opendesktopwidget-reviews-filters-hates'){
0052           up.hide();
0053           down.show();
0054           inactive.hide();
0055     }
0056     $('html, body').animate({
0057            scrollTop: reContainer.offset().top-150
0058        }, 1);
0059 }
0060
0061 function opendesktoptoggleDetail(thisrow){
0062                 let listcontainer = $('#opendesktopwidget-main');
0063                 let detailcontainer = $('#opendesktopwidget-main-detail-container');
0064
0065                 let detailpopup = '<div id="opendesktopwidget-main-detail-modal" class="modal-wrapper">'
0066                                             +'<div class="modal"><div class="modal-header">'
0067                                             +'<a class="close" data-opendesktop-dismiss="modal" href="#">×</a>'
0068                                             +'</div>'
0069                                             +'<div class="modal-body">'
0070                                             +'<div id="opendesktopwidget-main-detail-container"></div>'
0071                                             +'</div></div></div>';
0072
0073                 let modal = $('#opendesktopwidget-main-detail-modal');
0074                 if(detailcontainer.length==0){
0075                       listcontainer.parent().append($(detailpopup));
0076                       detailcontainer = $('#opendesktopwidget-main-detail-container');
0077                       modal.show();
0078                 }else{
0079                      modal.show();
0080                       detailcontainer.html('');
0081                 }
0082
0083                 $('a[data-opendesktop-dismiss]').on('click',function(){
0084                       $('#opendesktopwidget-main-detail-modal').hide();
0085                 });
0086
0087                 let projectid = $(thisrow).attr('data-project-id').trim();
0088                 let container  = $('<div class="opendesktopwidget-main-detail-container-body"></div>');
0089                 container.append(indicator);
0090                 detailcontainer.append(container);
0091                 let jsonp_url_projectdetail = opendesktopwigeturl+"embed/v1/project/"+projectid+"?&callback=?";
0092                 $.getJSON(jsonp_url_projectdetail, function(data) {
0093                     container.html(data.html);
0094
0095                     // images carousel
0096                     let imgs = $('#opendesktopwidget-main-detail-carousel').find('img');
0097                     if(imgs.length>1){
0098
0099                            let btnNext = $('<button class="gonext"><i class="fa fa-chevron-circle-right" aria-hidden="true"></i></button>');
0100                            btnNext.on('click',function(){
0101                                   $("#opendesktopwidget-main-detail-carousel").slick('slickNext');
0102                             });
0103
0104                            let btnPrev = $('<button class="goprev"><i class="fa fa-chevron-circle-left" aria-hidden="true"></i></button>');
0105                            btnPrev.on('click',function(){
0106                                   $("#opendesktopwidget-main-detail-carousel").slick('slickPrev');
0107                             });
0108
0109                             $('#opendesktopwidget-main-detail-carousel').slick({
0110                                     dots: true,
0111                                     arrows:false
0112                                 });
0113                             $('#opendesktopwidget-main-detail-carousel').append(btnPrev);
0114                             $('#opendesktopwidget-main-detail-carousel').append(btnNext);
0115                             /*
0116                             $('button.slick-next').on('click',function(){
0117                               console.log('------------test----------------');
0118
0119                                   $("#opendesktopwidget-main-detail-carousel").slick('slickNext');
0120                             });
0121                             $('button.slick-prev').on('click',function(){
0122                                   $("#opendesktopwidget-main-detail-carousel").slick('slickPrev');
0123                             });
0124                             */
0125
0126                     }
0127
0128                     // tabs onclick
0129                     let lis = container.find('#opendesktopwidget-content-tabs').find('li');
0130                     lis.each(function(index) {
0131                         $(this).on("click", function(){
0132                             $(this).addClass('active').siblings().removeClass('active');
0133                             let tabcontainerid = $(this).find('a').attr('data-wiget-target');
0134                             $(tabcontainerid).addClass('active').siblings().removeClass('active') ;
0135
0136                         });
0137                     });
0138
0139                     // project comments paging
0140                     let spans = container.find('.opendesktopwidgetcomments').find('ul.opendesktopwidgetpager').find('span');
0141                     spans.each(function(index) {
0142                         $(this).on("click", function(){
0143                             $(this).parent().addClass('active').siblings().removeClass('active');
0144
0145                            $(indicator).insertBefore(container.find('.opendesktopwidgetcomments').find('ul.opendesktopwidgetpager'));
0146                             let jsonp_url_nopage = opendesktopwigeturl+"embed/v1/comments/"+projectid+"?nopage=1&page="+$(this).html()+"&callback=?";
0147                             $.getJSON(jsonp_url_nopage, function(data) {
0148                                 container.find('i.fa-spinner').remove();
0149                                 let ct = container.find('#opendesktopwidget-main-container-comments');
0150                                 ct.html(data.html);
0151
0152                             });
0153
0154                         });
0155                     });
0156
0157                     // reviews filter
0158                     let reviewsfilters = container.find('#opendesktopwidget-reviews').find('.opendesktop-widget-reviews-filters-btn');
0159                     reviewsfilters.each(function(index){
0160                           $(this).on("click", function(){
0161                                 $(this).addClass('opendesktopwidget-reviews-activeRating').siblings().removeClass('opendesktopwidget-reviews-activeRating');
0162                                 opendesktopFilterReviews(this);
0163                           });
0164                     });
0165
0166
0167                 });
0168         }
0169
0170
0171
0172
0173 function main() {
0174
0175         /******* Load CSS *******/
0176
0177         let opendesktopwidgetcss_link = $("<link>", { rel: "stylesheet", type: "text/css", href: opendesktopwigeturl+"widget/style.css" });
0178         let fontawsomecss_link =$("<link>", { rel: "stylesheet", type: "text/css", href:"http://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" });
0179         let slick_link =$("<link>", { rel: "stylesheet", type: "text/css", href:"https://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css" });
0180         let slick_theme_link =$("<link>", { rel: "stylesheet", type: "text/css", href:"https://cdn.jsdelivr.net/jquery.slick/1.6.0/slick-theme.css" });
0181
0182         opendesktopwidgetcss_link.appendTo('head');
0183         fontawsomecss_link.appendTo('head');
0184         slick_link.appendTo('head');
0185         slick_theme_link.appendTo('head');
0186
0187         /******* Load HTML *******/
0188       let this_js_script = $('#opendesktopwiget');
0189       let memberid = this_js_script.attr('data-memberid');
0190       let countperpage = this_js_script.attr('data-countperpage');
0191       let catids = this_js_script.attr('data-catids');
0192       let query = '';
0193       if(countperpage){
0194            query = 'pagelimit='+countperpage+'&';
0195       }
0196       if(catids){
0197            query =query+'catids='+catids+'&';
0198       }
0199
0200        if (typeof memberid === "undefined" ) {
0201           alert('Please set data-memberid in your script.');
0202           return;
0203        }
0204
0205        $('#opendesktopwiget').after('<div id="opendesktop-widget-container">'+indicator+'</div>');
0206        let jsonp_url = opendesktopwigeturl+"embed/v1/member/"+memberid+"?"+query+"callback=?";
0207         $.getJSON(jsonp_url, function(data) {
0208               $('#opendesktop-widget-container').html(data.html);
0209               let spans = $('.opendesktopwidgetpager').find('span');
0210               spans.each(function(index) {
0211                   $(this).on("click", function(){
0212                       $(this).parent().addClass('active').siblings().removeClass('active');
0213                       $(indicator).insertBefore($('#opendesktop-widget-container').find('ul.opendesktopwidgetpager'));
0214                       let jsonp_url_nopage = opendesktopwigeturl+"embed/v1/member/"+memberid+"?"+query+"nopage=1&page="+$(this).html()+"&callback=?";
0215                       $.getJSON(jsonp_url_nopage, function(data) {
0216                           $('#opendesktop-widget-container').find('i.fa-spinner').remove();
0217                           $('#opendesktopwidget-main-container').html(data.html);
0218                           let rows =$('#opendesktop-widget-container').find('.opendesktopwidgetrow');
0219                                rows.each(function(index) {
0220                                    $(this).on("click", function(){
0221                                         opendesktoptoggleDetail(this);
0222                                    });
0223                                });
0224                       });
0225
0226                   });
0227               });
0228
0229               let rows =$('#opendesktop-widget-container').find('.opendesktopwidgetrow');
0230               rows.each(function(index) {
0231                   $(this).on("click", function(){
0232                         opendesktoptoggleDetail(this);
0233                   });
0234               });
0235
0236         });
0237 }
0238
0239 /* Load jQuery */
0240 loadScript("https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js", function() {
0241
0242       loadScript("https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/3.0.0/jquery-migrate.min.js", function() {
0243
0244
0245
0246
0247                 /* Restore $ and window.jQuery to their previous values and store the
0248                    new jQuery in our local jQuery variables. */
0249                   //$ = jQuery = window.jQuery.noConflict(false);
0250                   $ = jQuery = window.jQuery.noConflict();
0251
0252                 //$.noConflict();
0253                 //$.noConflict();
0254                 /* Load jQuery plugin and execute the main logic of our widget once the
0255                    plugin is loaded is loaded */
0256
0257                 loadScript("https://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js", function() {
0258
0259                   main();
0260                 });
0261
0262       });
0263 });
0264
0265 }(window, document)); /* end IIFE */