JAVASCRIPT   155

item.js

Guest on 26th July 2021 04:43:31 PM

  1. var id_increment = 0;
  2. var modules = [];
  3. var active_module = null;
  4. var sliderHandle = null;
  5.  
  6. $(document).ready(function()
  7. {      
  8.         toggleScrollListeners(true);
  9.         toggleEditItemListeners(true);
  10.         toggleButtonListeners(true);
  11.         igniteDragging();
  12.         igniteCKEditor();
  13.         igniteSlider();
  14.        
  15.        
  16.         initModules();
  17.         fitPreviewImages();
  18. });
  19.  
  20.  
  21. function initModules()
  22. {
  23.         $('.module').each(function()
  24.         {
  25.                 if($(this).hasClass('module_text'))
  26.                 {
  27.                         modules[$(this).attr('module_id')] = new_module_text($(this).attr('module_id'), $(this).parent());
  28.                         modules[$(this).attr('module_id')].text = $(this).html();
  29.                 }
  30.                
  31.                 if($(this).hasClass('module_image'))
  32.                 {
  33.                         modules[$(this).attr('module_id')] = new_module_image($(this).attr('module_id'), $(this).parent());
  34.                         modules[$(this).attr('module_id')].filename = $(this).find('img').attr('fname');
  35.                 }
  36.                
  37.                 if($(this).hasClass('module_2col_image'))
  38.                 {
  39.                         modules[$(this).attr('module_id')] = new_module_2col_image($(this).attr('module_id'), $(this).parent());
  40.                         modules[$(this).attr('module_id')].filename = $(this).find('img').attr('fname');
  41.                 }
  42.                
  43.                 if($(this).hasClass('module_bulletpoint'))
  44.                 {
  45.                         modules[$(this).attr('module_id')] = new_module_bulletpoint($(this).attr('module_id'), $(this).parent());
  46.                 }
  47.                
  48.                 if($(this).hasClass('module_video'))
  49.                 {
  50.                         modules[$(this).attr('module_id')] = new_module_video($(this).attr('module_id'), $(this).parent());
  51.                 }
  52.                
  53.                 if($(this).hasClass('module_html'))
  54.                 {
  55.                         modules[$(this).attr('module_id')] = new_module_html($(this).attr('module_id'), $(this).parent());
  56.                         modules[$(this).attr('module_id')].html_code = $('#module_html_container_' + $(this).attr('module_html_id')).val();
  57.                 }
  58.                
  59.                 if($(this).hasClass('module_headline'))
  60.                 {
  61.                         modules[$(this).attr('module_id')] = new_module_headline($(this).attr('module_id'), $(this).parent());
  62.                 }
  63.                
  64.                 if($(this).hasClass('module_download'))
  65.                 {
  66.                         modules[$(this).attr('module_id')] = new_module_download($(this).attr('module_id'), $(this).parent());
  67.                 }
  68.                
  69.                 if($(this).hasClass('module_store'))
  70.                 {
  71.                         modules[$(this).attr('module_id')] = new_module_store($(this).attr('module_id'), $(this).parent());
  72.                 }
  73.                
  74.                 if(id_increment <= parseInt($(this).attr('module_id')) +1)
  75.                         id_increment = parseInt($(this).attr('module_id')) +1;
  76.                
  77.                 modules[$(this).attr('module_id')].init();
  78.         });
  79.  
  80.         resize_col($('#col_left'));
  81.         resize_col($('#col_right'));
  82. }
  83.  
  84. function toggleButtonListeners(toggle)
  85. {
  86.         if(toggle)
  87.         {
  88.                 $('.item_save').click(function()
  89.                 {
  90.                         saveItem();
  91.                 });
  92.                
  93.                 $('.item_cancel').click(function()
  94.                 {
  95.                         window.location.href = rootUrl + 'entities/item/items';
  96.                 });
  97.                
  98.                 $('.item_detail_type_switch').on('click', function()
  99.                 {
  100.                         $('.item_detail_type_switch').removeClass('item_detail_type_active');
  101.                         $(this).addClass('item_detail_type_active');
  102.                         toggleDetailType(parseInt($('.item_detail_type_switch.item_detail_type_active').attr('detail_type')));
  103.                 });
  104.         }
  105.         else
  106.         {
  107.                 $('.item_save').unbind('click');
  108.                 $('.item_cancel').unbind('click');
  109.         }
  110. }
  111.  
  112.  
  113.  
  114. function toggleDetailType(detail_type)
  115. {
  116.         switch(detail_type)
  117.         {
  118.                 case 0: // IMAGE
  119.                         $('#item_detail_slider').hide();
  120.                         $('#item_detail_html').hide();
  121.                         $('#item_detailimg').show();
  122.                         $('#item_detailimg_credits').show();
  123.                         break;
  124.                        
  125.                 case 1: // HTML
  126.                         $('#item_detail_slider').hide();
  127.                         $('#item_detailimg').hide();
  128.                         $('#item_detailimg_credits').hide();
  129.                         $('#item_detail_html').show();
  130.                         break;
  131.                        
  132.                 case 2: // SLIDER
  133.                         $('#item_detailimg').hide();
  134.                         $('#item_detailimg_credits').hide();
  135.                         $('#item_detail_html').hide();
  136.                         $('#item_detail_slider').show();
  137.                         break;
  138.         }
  139. }
  140.  
  141.  
  142. function saveItem()
  143. {
  144.         var related_items = [];
  145.         $('.item_rel_item').each(function()
  146.         {
  147.                 related_items.push($(this).attr('item_id'));
  148.         });
  149.        
  150.         var related_tags = [];
  151.         $('#item_rel_tags span').each(function()
  152.         {
  153.                 related_tags.push([$(this).attr('metatag_id'), $(this).attr('url'), $(this).attr('url') == 'null' ? 'null' : $(this).text()]);
  154.         });
  155.        
  156.         var mods = [];
  157.         for(var i = 0 ; i < id_increment ; i++)
  158.         {
  159.                 if(modules[i] !== undefined)
  160.                 {
  161.                         mods.push(modules[i].getSaveData());
  162.                 }
  163.         }
  164.        
  165.         var gallery_items = [];
  166.         $('#gallery').find('.gallery_item').each(function()
  167.         {
  168.                 gallery_items.push({'filename': $(this).attr('filename'), 'credits': br2nl($(this).find('div').html())});
  169.         });
  170.        
  171.         var i = 0;
  172.         var slider_items = [];
  173.         $('#item_detail_slider_content').find('.slider_item_real').each(function()
  174.         {
  175.                 slider_items.push(
  176.                 {
  177.                         'fname': $(this).attr('filename'),
  178.                         'position': i++,
  179.                         'link_item_id': $(this).attr('link_to_item'),
  180.                         'credits': $(this).find('.slider_credits').html(),
  181.                         'overlay_text': $(this).find('.slider_text').html(),
  182.                 });
  183.         });
  184.        
  185.         $.ajax(
  186.         {
  187.                 url: rootUrl + 'entities/Item/save_item',
  188.                 data: {
  189.                         id: $('#item_container').attr('item_id'),
  190.                         name: $('#item_headline').html(),
  191.                         detail_img: $('#item_detailimg img').attr('filename'),
  192.                         detail_html: $('#item_detail_html_content').html(),
  193.                         header: $('#item_header').html(),
  194.                         related_items: related_items,
  195.                         related_metatags: related_tags,
  196.                         modules: mods,
  197.                         gallery_items: gallery_items,
  198.                         detail_img_credits: $('#item_detailimg_credits').html(),
  199.                         detail_type: $('.item_detail_type_switch.item_detail_type_active').attr('detail_type'),
  200.                         detail_html_mobile: $('#item_detail_html_content_mobile').html(),
  201.                         detail_slider_interval: parseInt($('#item_detail_slider_content').attr('slider_interval')),
  202.                         detail_slider_items: slider_items,
  203.                 },
  204.                 method: 'POST',
  205.                 success: function(data)
  206.                 {
  207.                         var ret = $.parseJSON(data);
  208.                        
  209.                         if(ret.success)
  210.                         {
  211.                                 alert('Save successful!');
  212.                                 //window.location.href = rootUrl + 'entities/item/items';
  213.                         }
  214.                         else
  215.                         {
  216.                                 alert('Error while saving');
  217.                         }
  218.                 }
  219.         });    
  220. }
  221.  
  222.  
  223. function igniteCKEditor()
  224. {
  225.         $('#module_text_editor').ckeditor();   
  226.         $('#module_bulletpoint_editor').ckeditor();
  227. }
  228.  
  229.  
  230. function igniteDragging()
  231. {
  232.         $('#module_container li').draggable(
  233.         {
  234.                 helper: 'clone'
  235.         });
  236.        
  237.        
  238.         $( ".col" ).droppable(
  239.         {
  240.                 accept: '#module_container li',
  241.                 drop: function( event, ui )
  242.                 {
  243.                         new_module(ui.draggable.attr('type'), $(this));
  244.             }
  245.     });
  246.        
  247.        
  248.         $('.module').draggable(
  249.         {
  250.                 cursor: 'mode',
  251.                 grid: [10,10],
  252.                 drag: function(event, ui)
  253.                 {
  254.                         ui.position.left = 0;
  255.                         ui.position.top = Math.max(0, ui.position.top);
  256.                         if(ui.position.top + ui.helper.height() > ui.helper.parent().height())
  257.                                 ui.helper.parent().height(ui.position.top + ui.helper.height());
  258.                 },
  259.         });
  260. }
  261.  
  262.  
  263. function new_module(module_type, parent)
  264. {
  265.         var new_module = null;
  266.        
  267.         switch(module_type)
  268.         {
  269.                 case 'text':
  270.                         modules[id_increment] = new_module_text(id_increment, parent);
  271.                         break;
  272.                 case 'image':
  273.                         modules[id_increment] = new_module_image(id_increment, parent);
  274.                         setTimeout(function()
  275.                         {
  276.                                 resize_col(parent);
  277.                         }, 200);
  278.                         break;
  279.                 case '2col_image':
  280.                         modules[id_increment] = new_module_2col_image(id_increment, parent);
  281.                         setTimeout(function()
  282.                         {
  283.                                 resize_col(parent);
  284.                         }, 200);
  285.                         break;                 
  286.                        
  287.                 case 'bulletpoint':
  288.                         modules[id_increment] = new_module_bulletpoint(id_increment, parent);
  289.                         break;
  290.                 case 'video':
  291.                         modules[id_increment] = new_module_video(id_increment, parent);
  292.                         setTimeout(function()
  293.                         {
  294.                                 resize_col(parent);
  295.                         }, 200);
  296.                         break;
  297.                 case 'html':
  298.                         modules[id_increment] = new_module_html(id_increment, parent);
  299.                         modules[id_increment].html_code = '';
  300.                         break; 
  301.                 case 'headline':
  302.                         modules[id_increment] = new_module_headline(id_increment, parent);
  303.                         break;
  304.                 case 'download':
  305.                         modules[id_increment] = new_module_download(id_increment, parent);
  306.                         break;
  307.                        
  308.                 case 'store':
  309.                         modules[id_increment] = new_module_store(id_increment, parent);
  310.                         break;                 
  311.         }
  312.        
  313.         parent.append(modules[id_increment].getPrototypeHTML());
  314.         modules[id_increment].init();
  315.         resize_col(parent);
  316.        
  317.         id_increment++;
  318. }
  319.  
  320.  
  321. function toggleScrollListeners(toggle)
  322. {
  323.         if(toggle)
  324.         {
  325.                 $('#content').scroll(function()
  326.                 {
  327.                         $('#control_container').css({'top': $('#content').scrollTop() + 100});
  328.                 });
  329.         }
  330.         else
  331.         {
  332.                 $('#content').unbind('scroll');
  333.         }
  334. }
  335.  
  336. function nl2br(str, is_xhtml)
  337. {  
  338.     var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';    
  339.     return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1'+ breakTag +'$2');
  340. }
  341.  
  342. function br2nl(str)
  343. {
  344.     return str.replace(/<br>/g, "\r");
  345. };
  346.  
  347.  
  348. function resize_col($col)
  349. {
  350.         var min_height = 0;
  351.         $col.find('.module').each(function()
  352.         {
  353.                 if(min_height < parseInt($(this).height()) + $(this).position().top + 2)
  354.                         min_height = parseInt($(this).height()) + $(this).position().top + 2
  355.         });
  356.        
  357.         if(min_height == 0)
  358.                 min_height = 40;
  359.        
  360.         $col.css({'min-height': min_height});
  361.         return min_height;
  362. }
  363.  
  364.  
  365. function toggleEditItemListeners(toggle)
  366. {
  367.         if(toggle)
  368.         {
  369.                
  370.                 /********************************************************************************************
  371.                  * HEADLINE
  372.                  *********************************************************************************************/
  373.                 $('#item_headline').dblclick(function()
  374.                 {
  375.                         popup_edit_text($(this));
  376.                 });
  377.                
  378.                 /********************************************************************************************
  379.                  * DETAIL HTML
  380.                  *********************************************************************************************/
  381.                 $('#item_detail_html').dblclick(function()
  382.                 {
  383.                         popup_edit_html($('#item_detail_html_content'));
  384.                 });
  385.                
  386.                 /********************************************************************************************
  387.                  * DETAIL PHOTOCREDITS
  388.                  *********************************************************************************************/
  389.                 $('#item_detailimg_credits').dblclick(function()
  390.                 {
  391.                         popup_edit_text($(this));
  392.                 });
  393.                
  394.                 /********************************************************************************************
  395.                  * HEADER
  396.                  *********************************************************************************************/
  397.                 $('#item_header').dblclick(function()
  398.                 {
  399.                         popup_edit_header($(this));
  400.                 });
  401.                
  402.                
  403.                 /********************************************************************************************
  404.                  * DETAILIMAGE
  405.                  *********************************************************************************************/
  406.                 $('#item_detailimg img').dblclick(function()
  407.                 {
  408.                         if($(this).attr('filename') == '' || $(this).attr('filename') == 'image_upload_placeholder.png' )
  409.                                 $(this).parent().find('input').click();
  410.                         else
  411.                         {
  412.                                 $('#detail_img_dialog').dialog(
  413.                                 {
  414.                                         modal: true,
  415.                                         buttons: [
  416.                                         {
  417.                                                 text: 'Delete',
  418.                                                 click: function()
  419.                                                 {
  420.                                                         $('#item_detailimg img').attr('src', rootUrl + 'items/uploads/detailimg/image_upload_placeholder.png');
  421.                                                         $('#item_detailimg img').attr('filename', 'image_upload_placeholder.png');
  422.                                                         $( this ).dialog( "close" );
  423.                                                 }
  424.                                         },
  425.                                         {
  426.                                                 text: 'Upload new',
  427.                                                 click: function()
  428.                                                 {
  429.                                                         $( this ).dialog( "close" );
  430.                                                         $('#item_detailimg img').parent().find('input').click();
  431.                                                 }
  432.                                         }
  433.                                         ],
  434.                                 });
  435.                         }
  436.                 });
  437.                
  438.                 $('#item_detailimg input').change(function()
  439.                 {
  440.                         var uploadpath = $(this).attr('uploadpath');
  441.                         var xhr = new XMLHttpRequest();        
  442.                         var fd = new FormData;
  443.                         var files = this.files;
  444.                        
  445.                         fd.append('data', files[0]);
  446.                         fd.append('filename', files[0].name);
  447.                         fd.append('uploadpath', uploadpath);
  448.                        
  449.                         xhr.addEventListener('load', function(e)
  450.                         {
  451.                                 var ret = $.parseJSON(this.responseText);
  452.                                
  453.                                 if(ret.success)
  454.                                 {
  455.                                         $('#item_detailimg img').attr('src', rootUrl + $('#item_detailimg input').attr('uploadpath') + '/' + ret.filename);
  456.                                         $('#item_detailimg img').attr('filename', ret.filename);
  457.                                 }
  458.                                 else
  459.                                 {
  460.                                         alert('Error while uploading');
  461.                                 }
  462.                     });
  463.                        
  464.                         xhr.open('post', rootUrl + 'entities/Item/upload_image');
  465.                         xhr.send(fd);
  466.                 });
  467.  
  468.                 /********************************************************************************************
  469.                  * RELATED TAGS
  470.                  *********************************************************************************************/
  471.                 $('#item_rel_tags').dblclick(function()
  472.                 {
  473.                         popup_edit_rel_tags();
  474.                 });    
  475.  
  476.                
  477.                 /********************************************************************************************
  478.                  * RELATED ITEMS
  479.                  *********************************************************************************************/
  480.                 $('#item_rel_items').dblclick(function()
  481.                 {
  482.                         popup_edit_rel_items();
  483.                 });
  484.                
  485.                
  486.                 /********************************************************************************************
  487.                  * GALLERY
  488.                  *********************************************************************************************/
  489.                 $('#gallery').dblclick(function()
  490.                 {
  491.                         popup_gallery();
  492.                 });
  493.                
  494.                 /********************************************************************************************
  495.                  * GALLERY
  496.                  *********************************************************************************************/
  497.                 $('#item_detail_slider_overlay').dblclick(function()
  498.                 {
  499.                         popup_slider();
  500.                 });
  501.                
  502.         }
  503.         else
  504.         {
  505.                 $('#item_header').unbind('dblclick');
  506.                 $('#item_detailimg img').unbind('dblclick');
  507.                 $('#item_headline').unbind('dblclick');
  508.                 $('#item_rel_tags').unbind('dblclick');
  509.         }
  510. }
  511.  
  512.  
  513. function popup_edit_html(text_element)
  514. {
  515.         $('#popup_edit_html').find('.popup_cancel_button').unbind('click');
  516.         $('#popup_edit_html').find('.popup_save_button').unbind('click');
  517.  
  518.         $('#popup_edit_html').find('.popup_edit_container.desktop textarea').val($('#item_detail_html_content').html());
  519.         $('#popup_edit_html').find('.popup_edit_container.mobile textarea').val($('#item_detail_html_content_mobile').html());
  520.         $('#popup_edit_html').show();
  521.        
  522.         $('#popup_edit_html').find('.popup_save_button').click(function()
  523.         {
  524.                 $('#item_detail_html_content').html($('#popup_edit_html').find('.popup_edit_container.desktop textarea').val());
  525.                 $('#item_detail_html_content_mobile').html($('#popup_edit_html').find('.popup_edit_container.mobile textarea').val());
  526.                 $('#popup_edit_html').hide();
  527.         });
  528.        
  529.         $('#popup_edit_html').find('.popup_cancel_button').click(function()
  530.         {
  531.                 $('#popup_edit_html').hide();
  532.         });
  533. }
  534.  
  535.  
  536. function popup_edit_text(text_element)
  537. {
  538.         $('#popup_edit_text').find('.popup_cancel_button').unbind('click');
  539.         $('#popup_edit_text').find('.popup_save_button').unbind('click');
  540.  
  541.         $('#popup_edit_text').find('textarea').val(text_element.text());
  542.         $('#popup_edit_text').show();
  543.        
  544.         $('#popup_edit_text').find('.popup_save_button').click(function()
  545.         {
  546.                 text_element.html(nl2br($('#popup_edit_text').find('textarea').val(), false));
  547.                 $('#popup_edit_text').hide();
  548.         });
  549.        
  550.         $('#popup_edit_text').find('.popup_cancel_button').click(function()
  551.         {
  552.                 $('#popup_edit_text').hide();
  553.         });
  554. }
  555.  
  556. function popup_edit_header(element)
  557. {
  558.         var html = "";
  559.         $('#item_header span').each(function()
  560.         {
  561.                 if(html != '')
  562.                         html += '\n';
  563.                 html += $(this).html();
  564.         });
  565.  
  566.         $('#popup_edit_text').find('textarea').val(html);
  567.        
  568.         $('#popup_edit_text').find('.popup_cancel_button').unbind('click');
  569.         $('#popup_edit_text').find('.popup_save_button').unbind('click');
  570.        
  571.         $('#popup_edit_text').show();
  572.        
  573.         $('#popup_edit_text').find('.popup_save_button').click(function()
  574.         {
  575.                 if($('#popup_edit_text').find('textarea').val() != '')
  576.                 var lines = $('#popup_edit_text').find('textarea').val().split('\n');
  577.                 var html = '';
  578.                 if(lines !== undefined)
  579.                 {
  580.                         for(var i = 0; i < lines.length ; i++)
  581.                         {
  582.                                 html += '<span style="padding-right: ' + lines[i].length + 'px;">' + lines[i] + '</span>';
  583.                                 if(i != lines.length - 1)
  584.                                 {
  585.                                         html += '<br/>';
  586.                                 }
  587.                         }
  588.                 }
  589.                
  590.                 $('#popup_edit_text').hide();
  591.                 element.html(html);
  592.         });
  593.        
  594.         $('#popup_edit_text').find('.popup_cancel_button').click(function()
  595.         {
  596.                 $('#popup_edit_text').hide();
  597.         });    
  598. }
  599.  
  600. /*********************************************************************************************************************************************************************
  601.  * RELATED TAGS
  602.  **********************************************************************************************************************************************************************/
  603. function popup_edit_rel_tags()
  604. {
  605.         toggleRelatedMetatagsListeners(false);
  606.         toggleRelatedMetatagSubListeners(false);
  607.        
  608.         $('#related_tags_selected').empty();
  609.         $('#related_tags_metatags span').show();
  610.         $('#item_rel_tags span').each(function()
  611.         {
  612.                 $('#related_tags_selected').append('<span metatag_id="' + $(this).attr('metatag_id') + '" url="' + $(this).attr('url') + '">' + $(this).text() + '</span>');
  613.                 $('.related_tags_metatags span[metatag_id="' + $(this).attr('metatag_id') + '"]').hide();
  614.         });
  615.        
  616.         toggleRelatedMetatagsListeners(true);
  617.         toggleRelatedMetatagSubListeners(true);
  618.        
  619.         $('#popup_related_tags').show();
  620.        
  621.        
  622. }
  623.  
  624. function toggleRelatedMetatagsListeners(toggle)
  625. {
  626.         if(toggle)
  627.         {
  628.                 $('#external_tag_add').on('click', function()
  629.                 {
  630.                         $('#related_tags_selected').append('<span metatag_id="null" url="' + $('#external_tag_url').val() + '">' + $('#external_tag_text').val() + '</span>');
  631.                         toggleRelatedMetatagSubListeners(false);
  632.                         toggleRelatedMetatagSubListeners(true);
  633.                 });
  634.                
  635.                 $('#related_tags_category').change(function()
  636.                 {
  637.                         $(this).parent().find('.related_tags_metatags').hide();
  638.                         $(this).parent().find('.related_tags_metatags[category_id="' + $(this).val() + '"]').show();
  639.                 });
  640.                
  641.                 $('.related_tags_metatags span').on('click', function()
  642.                 {
  643.                         //$(this).clone(false).appendTo($('#related_tags_selected'));
  644.                         $('#related_tags_selected').append('<span metatag_id="' + $(this).attr('metatag_id') + '" url="null">' + $(this).text() + '</span>');
  645.                         $(this).hide();
  646.                         toggleRelatedMetatagSubListeners(false);
  647.                         toggleRelatedMetatagSubListeners(true);
  648.                 });
  649.  
  650.                 $('#popup_related_tags').find('.popup_save_button').click(function()
  651.                 {
  652.                         $('#item_rel_tags').empty();
  653.                         $('#related_tags_selected span').each(function()
  654.                         {
  655.                                 $('#item_rel_tags').append('<span metatag_id="' + $(this).attr('metatag_id') + '" url="' + $(this).attr('url') + '">' + $(this).text() + '</span>');
  656.                         });
  657.                         $('#popup_related_tags').hide();
  658.                 });
  659.                
  660.                 $('#popup_related_tags').find('.popup_cancel_button').click(function()
  661.                 {
  662.                         $('#popup_related_tags').hide();
  663.                 });    
  664.         }
  665.         else
  666.         {
  667.                 $('#external_tag_add').off('click');
  668.                 $('#related_tags_category').unbind('change');
  669.                 $('.related_tags_metatags span').off('click');
  670.                 $('#popup_related_tags').find('.popup_cancel_button').unbind('click');
  671.                 $('#popup_related_tags').find('.popup_save_button').unbind('click');
  672.         }
  673. }
  674.  
  675. function toggleRelatedMetatagSubListeners(toggle)
  676. {
  677.         if(toggle)
  678.         {
  679.                 $('#related_tags_selected span').on('click', function()
  680.                 {
  681.                         $('.related_tags_metatags span[metatag_id="' + $(this).attr('metatag_id') + '"]').show();
  682.                         $(this).remove();
  683.                 });            
  684.         }
  685.         else
  686.         {
  687.                 $('#related_tags_selected span').off('click');
  688.         }
  689. }
  690.  
  691.  
  692. /*********************************************************************************************************************************************************************
  693.  * RELATED ITEMS
  694.  **********************************************************************************************************************************************************************/
  695. function popup_edit_rel_items()
  696. {
  697.         toggleRelatedItemsListener(false);
  698.        
  699.         $('#related_items_selected').empty();
  700.         $('.item_rel_item').each(function()
  701.         {
  702.                 $('#related_items_selected').append('<span item_id="' + $(this).attr('item_id') + '" filename="' + $(this).find('img').attr('filename') + '">' + $(this).find('.item_rel_item_name').text() + '</span>')
  703.         });
  704.        
  705.         toggleRelatedItemsListener(true);
  706.         $('#popup_related_items').show();
  707. }
  708.  
  709. function toggleRelatedItemsListener(toggle)
  710. {
  711.         if(toggle)
  712.         {
  713.                 $('#popup_related_items').find('.popup_save_button').click(function()
  714.                 {
  715.                         $('#item_rel_items').empty();
  716.                         $('#related_items_selected span').each(function()
  717.                         {
  718.                                 $('#item_rel_items').append('<div class="item_rel_item" item_id="' + $(this).attr('item_id') + '"><img src="' + rootUrl + 'items/uploads/detailimg/' + $(this).attr('filename') + '" /><div class="item_rel_item_name unselectable">' + $(this).text() + '</div></div>');
  719.                         });
  720.                         fitPreviewImages();
  721.                         $('#popup_related_items').hide();
  722.                 });
  723.                
  724.                 $('#popup_related_items').find('.popup_cancel_button').click(function()
  725.                 {
  726.                         $('#popup_related_items').hide();
  727.                 });
  728.                
  729.                 $('#related_items_category').change(function()
  730.                 {
  731.                         $('#popup_related_items').find('.related_items_metatags').hide();
  732.                         $('#popup_related_items').find('.related_items_metatags[category_id="' + $(this).val() + '"]').show();
  733.                 });
  734.                
  735.                 $('#popup_related_items span').click(function()
  736.                 {
  737.                         if($(this).parent().hasClass('related_items_metatags'))
  738.                         {
  739.                                 $(this).clone(true).appendTo($('#related_items_tags_selected'));
  740.                                 $(this).hide();
  741.                         }
  742.                         else
  743.                         {
  744.                                 $('.related_items_metatags span[metatag_id="' + $(this).attr('metatag_id') + '"]').show();
  745.                                 $(this).remove();
  746.                         }
  747.                        
  748.                         var metatags = [];
  749.                         $('#related_items_tags_selected span').each(function()
  750.                         {
  751.                                 metatags.push($(this).attr('metatag_id'));
  752.                         });
  753.                        
  754.                         $.ajax(
  755.                         {
  756.                                 url: rootUrl + 'entities/Item/getItemsPerMetatags',
  757.                                 data: {'metatags': metatags},
  758.                                 method: 'POST',
  759.                                 success: function(data)
  760.                                 {
  761.                                         var ret = $.parseJSON(data);
  762.                                         if(ret.success)
  763.                                         {
  764.                                                 $('#related_items_itemlist').empty();
  765.                                                 for(var i = 0 ; i < ret.items.length ; i++)
  766.                                                 {
  767.                                                         var style = "";
  768.                                                         if($('#related_items_selected span[item_id="' + ret.items[i].id + '"]').length != 0)
  769.                                                                 style = 'style="display: none;"';
  770.                                                                
  771.                                                         $('#related_items_itemlist').append('<span ' + style + '  item_id="' + ret.items[i].id + '" filename="' + ret.items[i].detailimg + '">' + ret.items[i].name + '</span>');
  772.                                                 }
  773.                                                
  774.                                                 $('#related_items_itemlist span, #related_items_selected span').unbind('click');
  775.                                                 $('#related_items_itemlist span, #related_items_selected span').click(function()
  776.                                                 {
  777.                                                         if($(this).parent().attr('id') == 'related_items_itemlist')
  778.                                                         {
  779.                                                                 console.log('select');
  780.                                                                 $(this).clone(true).appendTo('#related_items_selected');
  781.                                                                 $(this).hide();
  782.                                                         }
  783.                                                         else
  784.                                                         {
  785.                                                                 $('#related_items_itemlist span[item_id="' + $(this).attr('item_id') + '"]').show();
  786.                                                                 $('#related_items_selected span[item_id="' + $(this).attr('item_id') + '"]').remove();
  787.                                                         }
  788.                                                 });
  789.                                         }
  790.                                         else
  791.                                         {
  792.                                                 alert('Error while retrieving items');
  793.                                         }
  794.                                 }
  795.                         });    
  796.                 });            
  797.         }
  798.         else
  799.         {
  800.                 $('#popup_related_items span').unbind('click')
  801.                 $('#related_items_category').unbind('change');
  802.                 $('#popup_related_items').find('.popup_cancel_button').unbind('click');
  803.                 $('#popup_related_items').find('.popup_save_button').unbind('click');
  804.         }
  805. }
  806.  
  807.  
  808. /*********************************************************************************************************************************************************************
  809.  * GALLERY
  810.  **********************************************************************************************************************************************************************/
  811. function popup_gallery()
  812. {
  813.         toggleGalleryListener(false);
  814.        
  815.         $('#gallery_items').empty();
  816.         $('#gallery').find('.gallery_item').each(function()
  817.         {
  818.                 $('#gallery_items').append('<div class="gallery_item" filename="' + $(this).attr('filename') + '"><img src="' + rootUrl + 'items/uploads/gallery/' + $(this).attr('filename') + '" /><textarea>' + br2nl($(this).find('div').html()) + '</textarea></div>');
  819.         });
  820.        
  821.         $('#gallery_items').find('.gallery_item img').dblclick(function()
  822.         {
  823.                 $(this).parent().remove();
  824.         });
  825.        
  826.         $('#gallery_items').sortable();
  827.        
  828.         toggleGalleryListener(true);
  829.         $('#popup_gallery').show();
  830. }
  831.  
  832. function toggleGalleryListener(toggle)
  833. {
  834.         if(toggle)
  835.         {
  836.                 $('#gallery_upload_button').click(function()
  837.                 {
  838.                         $('#gallery_upload_input').click();
  839.                 });
  840.                
  841.                 $('#gallery_upload_input').change(function()
  842.                 {
  843.                         var uploadpath = 'items/uploads/gallery';
  844.                         var xhr = new XMLHttpRequest();        
  845.                         var fd = new FormData;
  846.                         var files = this.files;
  847.                        
  848.                         fd.append('data', files[0]);
  849.                         fd.append('filename', files[0].name);
  850.                         fd.append('uploadpath', uploadpath);
  851.                        
  852.                         xhr.addEventListener('load', function(e)
  853.                         {
  854.                                 var ret = $.parseJSON(this.responseText);
  855.                                
  856.                                 if(ret.success)
  857.                                 {
  858.                                         html = '<div class="gallery_item" filename="' + ret.filename + '"><img src="' + rootUrl + 'items/uploads/gallery/' + ret.filename + '" /><textarea></textarea></div>';
  859.                                         $('#gallery_items').append(html);
  860.                                        
  861.                                         $('#gallery_items').find('.gallery_item').unbind('dblclick');
  862.                                         $('#gallery_items').find('.gallery_item').dblclick(function()
  863.                                         {
  864.                                                 $(this).remove();
  865.                                         });
  866.                                        
  867.                                         $('#gallery_items').sortable();
  868.                                 }
  869.                                 else
  870.                                 {
  871.                                         alert('Error while uploading');
  872.                                 }
  873.                     });
  874.                        
  875.                         xhr.open('post', rootUrl + 'entities/Item/upload_image');
  876.                         xhr.send(fd);
  877.                        
  878.                 });
  879.                
  880.                 $('#popup_gallery').find('.popup_cancel_button').click(function()
  881.                 {
  882.                         $('#popup_gallery').hide();
  883.                 });
  884.                
  885.                 $('#popup_gallery').find('.popup_save_button').click(function()
  886.                 {
  887.                         $('#gallery').empty();
  888.                         $('#gallery_items').find('.gallery_item').each(function()
  889.                         {
  890.                                 $('#gallery').append('<div class="gallery_item" filename="' + $(this).attr('filename') + '"><img src="' + rootUrl + 'items/uploads/gallery/' + $(this).attr('filename') + '" /><div>' + nl2br($(this).find('textarea').val()) + '</div></div>');
  891.                         });
  892.                         fitPreviewImages();
  893.                         $('#popup_gallery').hide();
  894.                 });
  895.         }
  896.         else
  897.         {
  898.                 $('#gallery_upload_input').unbind('change');
  899.                 $('#gallery_upload_button').unbind('click');
  900.                 $('#popup_gallery').find('.popup_cancel_button').unbind('click');
  901.                 $('#popup_gallery').find('.popup_save_button').unbind('click');
  902.         }
  903. }
  904.  
  905.  
  906.  
  907. /*********************************************************************************************************************************************************************
  908.  * SLIDER
  909.  **********************************************************************************************************************************************************************/
  910. function popup_slider()
  911. {
  912.         toggleSliderListener(false);
  913.        
  914.         $('#slider_items').empty();
  915.         $('#item_detail_slider_content').find('.slider_item_real').each(function()
  916.         {
  917.                 var clone = $('.slideritem_dummy').clone();
  918.                 clone.addClass('slider_item');
  919.                 clone.removeClass('slideritem_dummy');
  920.                 clone.attr('filename', $(this).attr('filename'));
  921.                 clone.children('img').attr('src', rootUrl + 'items/uploads/slider/' + $(this).attr('filename'));
  922.                 clone.find('select').val($(this).attr('link_to_item'));
  923.                 clone.find('.slider_item_credits').val(br2nl($(this).find('.slider_credits').html()));
  924.                
  925.                 var html = "";
  926.                 $(this).find('.slider_text span').each(function()
  927.                 {
  928.                         if(html != '')
  929.                                 html += '\n';
  930.                         html += $(this).html();
  931.                 });
  932.                
  933.                 clone.find('.slider_item_text').val(html);
  934.                
  935.                 $('#slider_items').append(clone);
  936.         });
  937.        
  938.         igniteCombobox();
  939.        
  940.         $('#slider_items').find('.delete').click(function()
  941.         {
  942.                 $(this).parent().parent().remove();
  943.         });
  944.        
  945.         $('#slider_interval').val(parseInt($('#item_detail_slider_content').attr('slider_interval')));
  946.        
  947.         $('#slider_items').sortable(
  948.         {
  949.                 'handle': ".move",             
  950.         });
  951.        
  952.         toggleSliderListener(true);
  953.         $('#popup_slider').show();
  954. }
  955.  
  956. function toggleSliderListener(toggle)
  957. {
  958.         if(toggle)
  959.         {
  960.                 $('#slider_upload_button').click(function()
  961.                 {
  962.                         $('#slider_upload_input').click();
  963.                 });
  964.                
  965.                 $('#slider_upload_input').change(function()
  966.                 {
  967.                         var uploadpath = 'items/uploads/slider';
  968.                         var xhr = new XMLHttpRequest();        
  969.                         var fd = new FormData;
  970.                         var files = this.files;
  971.                        
  972.                         fd.append('data', files[0]);
  973.                         fd.append('filename', files[0].name);
  974.                         fd.append('uploadpath', uploadpath);
  975.                        
  976.                         xhr.addEventListener('load', function(e)
  977.                         {
  978.                                 var ret = $.parseJSON(this.responseText);
  979.                                
  980.                                 if(ret.success)
  981.                                 {
  982.                                         var clone = $('.slideritem_dummy').clone();
  983.                                         clone.addClass('slider_item');
  984.                                         clone.removeClass('slideritem_dummy');
  985.                                         clone.attr('filename', ret.filename);
  986.                                         clone.children('img').attr('src', rootUrl + 'items/uploads/slider/' + ret.filename);
  987.                                        
  988.                                         $('#slider_items').append(clone);
  989.                                        
  990.                                         $('#slider_items').find('.delete').unbind('click');
  991.                                         $('#slider_items').find('.delete').click(function()
  992.                                         {
  993.                                                 $(this).parent().parent().remove();
  994.                                         });
  995.                                        
  996.                                         $('#slider_items').sortable();
  997.                                 }
  998.                                 else
  999.                                 {
  1000.                                         alert('Error while uploading');
  1001.                                 }
  1002.                     });
  1003.                        
  1004.                         xhr.open('post', rootUrl + 'entities/Item/upload_image');
  1005.                         xhr.send(fd);
  1006.                 });
  1007.                
  1008.                 $('#popup_slider').find('.popup_cancel_button').click(function()
  1009.                 {
  1010.                         $('#popup_slider').hide();
  1011.                 });
  1012.                
  1013.                 $('#popup_slider').find('.popup_save_button').click(function()
  1014.                 {
  1015.                         $('#item_detail_slider_content').empty();
  1016.                         var i = 0;
  1017.                         $('#slider_items').find('.slider_item').each(function()
  1018.                         {
  1019.                                 var sliderhtml = '<div class="slider_item_real" filename="' + $(this).attr('filename') + '" link_to_item="' + $(this).find('select').val() + '" style="left: ' + (i * 900) +'px;" >';
  1020.                                 sliderhtml += '<img src="' + rootUrl + 'items/uploads/slider/' + $(this).attr('filename') + '" />';
  1021.                                 sliderhtml += '<div class="slider_credits">' + nl2br($(this).find('.slider_item_credits').val()) + '</div>';
  1022.                                
  1023.                                 var lines = $(this).find('.slider_item_text').val().split('\n');
  1024.                                 var html = '';
  1025.                                 if(lines !== undefined)
  1026.                                 {
  1027.                                         for(var j = 0; j < lines.length ; j++)
  1028.                                         {
  1029.                                                 html += '<span style="padding-right: ' + lines[j].length + 'px;">' + lines[j] + '</span>';
  1030.                                                 if(j != lines.length - 1)
  1031.                                                 {
  1032.                                                         html += '<br/>';
  1033.                                                 }
  1034.                                         }
  1035.                                 }
  1036.                                 sliderhtml += '<div class="slider_text">' + html + '</div>';
  1037.                                 sliderhtml += '</div>';
  1038.                                
  1039.                                 $('#item_detail_slider_content').append(sliderhtml);
  1040.                                 i++;
  1041.                         });
  1042.                        
  1043.                        
  1044.                        
  1045.                        
  1046.                         $('#item_detail_slider_content').attr('slider_interval', $('#slider_interval').val());
  1047.                        
  1048.                         igniteSlider();
  1049.                        
  1050.                         $('#popup_slider').hide();
  1051.                 });
  1052.         }
  1053.         else
  1054.         {
  1055.                 $('#slider_upload_input').unbind('change');
  1056.                 $('#slider_upload_button').unbind('click');
  1057.                 $('#popup_slider').find('.popup_cancel_button').unbind('click');
  1058.                 $('#popup_slider').find('.popup_save_button').unbind('click');
  1059.         }
  1060. }
  1061.  
  1062.  
  1063. function igniteSlider()
  1064. {
  1065.         imagesLoaded($('#item_detail_slider_content'), function()
  1066.         {
  1067.                 clearInterval(sliderHandle);
  1068.                 var maxheight = 0;
  1069.                 $('#item_detail_slider_content').find('.slider_item_real').each(function()
  1070.                 {
  1071.                         if(parseInt($(this).height()) > maxheight)
  1072.                                 maxheight = parseInt($(this).height());
  1073.                 });
  1074.                 $('#item_detail_slider_content').height(maxheight == 0 ? 16 : maxheight);
  1075.                
  1076.                 if($('#item_detail_slider_content').attr('slider_interval') > 0)
  1077.                 {
  1078.                         sliderHandle = setInterval(function()
  1079.                         {
  1080.                                 $('.slider_item_real').animate({'left': '-=900'}, function()
  1081.                                 {
  1082.                                         $('.slider_item_real').each(function()
  1083.                                         {
  1084.                                                 if(parseInt($(this).css('left')) < 0)
  1085.                                                 {
  1086.                                                         $(this).css({'left': 900 * ($('.slider_item_real').length - 1)});
  1087.                                                 }
  1088.                                         })
  1089.                                 });
  1090.                                
  1091.                         }, $('#item_detail_slider_content').attr('slider_interval') * 1000);
  1092.                 }
  1093.         });
  1094. }
  1095.  
  1096.  
  1097.  
  1098.  
  1099. function igniteCombobox()
  1100. {
  1101.  
  1102.        
  1103.         $('.combobox_dummy').scombobox({
  1104.             fullMatch: true
  1105.             // when fullMatch is true
  1106.             // then highligh is also true by default
  1107.         });
  1108. }
  1109.  
  1110.  
  1111. function fitPreviewImages()
  1112. {
  1113.         /*$('#gallery .gallery_item img, #item_rel_items .item_rel_item img').each(function()
  1114.         {
  1115.                 fitImage($(this), $(this).get(0).naturalWidth, $(this).get(0).naturalHeight, $(this).parent().width(), $(this).parent().height());
  1116.         });*/
  1117.        
  1118. }
  1119.  
  1120.  
  1121. function fitImage(image, iWidth, iHeight, wWidth, wHeight)
  1122. {
  1123.         var new_height = 0;
  1124.         var new_width = 0;
  1125.        
  1126.         var ratio = iWidth / iHeight;
  1127.  
  1128.         if(wWidth > wHeight)
  1129.         {
  1130.                 new_height = wHeight;
  1131.                 new_width = parseInt(wHeight * ratio);
  1132.                 if(new_width < wWidth)
  1133.                 {
  1134.                         new_width = wWidth;
  1135.                         new_height = parseInt(wWidth / ratio);
  1136.                         left = 0;
  1137.                         top = (parseInt((new_height-wHeight) /-2));
  1138.                 }
  1139.                 else
  1140.                 {
  1141.                         top = 0;
  1142.                         left = parseInt((new_width - wWidth) / -2);            
  1143.                 }
  1144.         }
  1145.         else
  1146.         {
  1147.                 new_width = wWidth;
  1148.                 new_height = parseInt(wWidth / ratio);
  1149.                 if(new_height < wHeight)
  1150.                 {
  1151.                         new_height = wHeight;
  1152.                         new_width = parseInt(wHeight * ratio);
  1153.                         top = 0;
  1154.                         left = parseInt((new_width - wWidth) / -2);
  1155.                 }
  1156.                 else
  1157.                 {
  1158.                         left = 0;
  1159.                         top = parseInt((new_height - wHeight) / -2);   
  1160.                 }
  1161.         }
  1162.  
  1163.         image.css({'width' : new_width, 'height': new_height, 'left': left, 'top': top});      
  1164. }
  1165.  
  1166.  
  1167. $.widget( "custom.combobox", {
  1168.     _create: function() {
  1169.       this.wrapper = $( "<span>" )
  1170.         .addClass( "custom-combobox" )
  1171.         .insertAfter( this.element );
  1172.  
  1173.       this.element.hide();
  1174.       this._createAutocomplete();
  1175.       this._createShowAllButton();
  1176.     },
  1177.  
  1178.     _createAutocomplete: function() {
  1179.       var selected = this.element.children( ":selected" ),
  1180.         value = selected.val() ? selected.text() : "";
  1181.  
  1182.       this.input = $( "<input>" )
  1183.         .appendTo( this.wrapper )
  1184.         .val( value )
  1185.         .attr( "title", "" )
  1186.         .addClass( "custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left" )
  1187.         .autocomplete({
  1188.           delay: 0,
  1189.           minLength: 0,
  1190.           source: $.proxy( this, "_source" ),
  1191.           appendTo: '#popup_slider',
  1192.         })
  1193.         .tooltip({
  1194.           classes: {
  1195.             "ui-tooltip": "ui-state-highlight"
  1196.           }
  1197.         });
  1198.  
  1199.       this._on( this.input, {
  1200.         autocompleteselect: function( event, ui ) {
  1201.           ui.item.option.selected = true;
  1202.           this._trigger( "select", event, {
  1203.             item: ui.item.option
  1204.           });
  1205.         },
  1206.  
  1207.         autocompletechange: "_removeIfInvalid"
  1208.       });
  1209.     },
  1210.  
  1211.     _createShowAllButton: function() {
  1212.       var input = this.input,
  1213.         wasOpen = false;
  1214.  
  1215.       $( "<a>" )
  1216.         .attr( "tabIndex", -1 )
  1217.         .attr( "title", "Show All Items" )
  1218.         .tooltip()
  1219.         .appendTo( this.wrapper )
  1220.         .button({
  1221.           icons: {
  1222.             primary: "ui-icon-triangle-1-s"
  1223.           },
  1224.           text: false
  1225.         })
  1226.         .removeClass( "ui-corner-all" )
  1227.         .addClass( "custom-combobox-toggle ui-corner-right" )
  1228.         .on( "mousedown", function() {
  1229.           wasOpen = input.autocomplete( "widget" ).is( ":visible" );
  1230.         })
  1231.         .on( "click", function() {
  1232.           input.trigger( "focus" );
  1233.  
  1234.           // Close if already visible
  1235.           if ( wasOpen ) {
  1236.             return;
  1237.           }
  1238.  
  1239.           // Pass empty string as value to search for, displaying all results
  1240.           input.autocomplete( "search", "" );
  1241.         });
  1242.     },
  1243.  
  1244.     _source: function( request, response ) {
  1245.       var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
  1246.       response( this.element.children( "option" ).map(function() {
  1247.         var text = $( this ).text();
  1248.         if ( this.value && ( !request.term || matcher.test(text) ) )
  1249.           return {
  1250.             label: text,
  1251.             value: text,
  1252.             option: this
  1253.           };
  1254.       }) );
  1255.     },
  1256.  
  1257.     _removeIfInvalid: function( event, ui ) {
  1258.  
  1259.       // Selected an item, nothing to do
  1260.       if ( ui.item ) {
  1261.         return;
  1262.       }
  1263.  
  1264.       // Search for a match (case-insensitive)
  1265.       var value = this.input.val(),
  1266.         valueLowerCase = value.toLowerCase(),
  1267.         valid = false;
  1268.       this.element.children( "option" ).each(function() {
  1269.         if ( $( this ).text().toLowerCase() === valueLowerCase ) {
  1270.           this.selected = valid = true;
  1271.           return false;
  1272.         }
  1273.       });
  1274.  
  1275.       // Found a match, nothing to do
  1276.       if ( valid ) {
  1277.         return;
  1278.       }
  1279.  
  1280.       // Remove invalid value
  1281.       this.input
  1282.         .val( "" )
  1283.         .attr( "title", value + " didn't match any item" )
  1284.         .tooltip( "open" );
  1285.       this.element.val( "" );
  1286.       this._delay(function() {
  1287.         this.input.tooltip( "close" ).attr( "title", "" );
  1288.       }, 2500 );
  1289.       this.input.autocomplete( "instance" ).term = "";
  1290.     },
  1291.  
  1292.     _destroy: function() {
  1293.       this.wrapper.remove();
  1294.       this.element.show();
  1295.     }
  1296.   });

Raw Paste

'); }); $('#gallery_items').find('.gallery_item img').dblclick(function() { $(this).parent().remove(); }); $('#gallery_items').sortable(); toggleGalleryListener(true); $('#popup_gallery').show(); } function toggleGalleryListener(toggle) { if(toggle) { $('#gallery_upload_button').click(function() { $('#gallery_upload_input').click(); }); $('#gallery_upload_input').change(function() { var uploadpath = 'items/uploads/gallery'; var xhr = new XMLHttpRequest(); var fd = new FormData; var files = this.files; fd.append('data', files[0]); fd.append('filename', files[0].name); fd.append('uploadpath', uploadpath); xhr.addEventListener('load', function(e) { var ret = $.parseJSON(this.responseText); if(ret.success) { html = ''; $('#gallery_items').append(html); $('#gallery_items').find('.gallery_item').unbind('dblclick'); $('#gallery_items').find('.gallery_item').dblclick(function() { $(this).remove(); }); $('#gallery_items').sortable(); } else { alert('Error while uploading'); } }); xhr.open('post', rootUrl + 'entities/Item/upload_image'); xhr.send(fd); }); $('#popup_gallery').find('.popup_cancel_button').click(function() { $('#popup_gallery').hide(); }); $('#popup_gallery').find('.popup_save_button').click(function() { $('#gallery').empty(); $('#gallery_items').find('.gallery_item').each(function() { $('#gallery').append(''); }); fitPreviewImages(); $('#popup_gallery').hide(); }); } else { $('#gallery_upload_input').unbind('change'); $('#gallery_upload_button').unbind('click'); $('#popup_gallery').find('.popup_cancel_button').unbind('click'); $('#popup_gallery').find('.popup_save_button').unbind('click'); } } /********************************************************************************************************************************************************************* * SLIDER **********************************************************************************************************************************************************************/ function popup_slider() { toggleSliderListener(false); $('#slider_items').empty(); $('#item_detail_slider_content').find('.slider_item_real').each(function() { var clone = $('.slideritem_dummy').clone(); clone.addClass('slider_item'); clone.removeClass('slideritem_dummy'); clone.attr('filename', $(this).attr('filename')); clone.children('img').attr('src', rootUrl + 'items/uploads/slider/' + $(this).attr('filename')); clone.find('select').val($(this).attr('link_to_item')); clone.find('.slider_item_credits').val(br2nl($(this).find('.slider_credits').html())); var html = ""; $(this).find('.slider_text span').each(function() { if(html != '') html += '\n'; html += $(this).html(); }); clone.find('.slider_item_text').val(html); $('#slider_items').append(clone); }); igniteCombobox(); $('#slider_items').find('.delete').click(function() { $(this).parent().parent().remove(); }); $('#slider_interval').val(parseInt($('#item_detail_slider_content').attr('slider_interval'))); $('#slider_items').sortable( { 'handle': ".move", }); toggleSliderListener(true); $('#popup_slider').show(); } function toggleSliderListener(toggle) { if(toggle) { $('#slider_upload_button').click(function() { $('#slider_upload_input').click(); }); $('#slider_upload_input').change(function() { var uploadpath = 'items/uploads/slider'; var xhr = new XMLHttpRequest(); var fd = new FormData; var files = this.files; fd.append('data', files[0]); fd.append('filename', files[0].name); fd.append('uploadpath', uploadpath); xhr.addEventListener('load', function(e) { var ret = $.parseJSON(this.responseText); if(ret.success) { var clone = $('.slideritem_dummy').clone(); clone.addClass('slider_item'); clone.removeClass('slideritem_dummy'); clone.attr('filename', ret.filename); clone.children('img').attr('src', rootUrl + 'items/uploads/slider/' + ret.filename); $('#slider_items').append(clone); $('#slider_items').find('.delete').unbind('click'); $('#slider_items').find('.delete').click(function() { $(this).parent().parent().remove(); }); $('#slider_items').sortable(); } else { alert('Error while uploading'); } }); xhr.open('post', rootUrl + 'entities/Item/upload_image'); xhr.send(fd); }); $('#popup_slider').find('.popup_cancel_button').click(function() { $('#popup_slider').hide(); }); $('#popup_slider').find('.popup_save_button').click(function() { $('#item_detail_slider_content').empty(); var i = 0; $('#slider_items').find('.slider_item').each(function() { var sliderhtml = '
'; sliderhtml += ''; sliderhtml += '
' + nl2br($(this).find('.slider_item_credits').val()) + '
'; var lines = $(this).find('.slider_item_text').val().split('\n'); var html = ''; if(lines !== undefined) { for(var j = 0; j < lines.length ; j++) { html += '' + lines[j] + ''; if(j != lines.length - 1) { html += '
'; } } } sliderhtml += '
' + html + '
'; sliderhtml += '
'; $('#item_detail_slider_content').append(sliderhtml); i++; }); $('#item_detail_slider_content').attr('slider_interval', $('#slider_interval').val()); igniteSlider(); $('#popup_slider').hide(); }); } else { $('#slider_upload_input').unbind('change'); $('#slider_upload_button').unbind('click'); $('#popup_slider').find('.popup_cancel_button').unbind('click'); $('#popup_slider').find('.popup_save_button').unbind('click'); } } function igniteSlider() { imagesLoaded($('#item_detail_slider_content'), function() { clearInterval(sliderHandle); var maxheight = 0; $('#item_detail_slider_content').find('.slider_item_real').each(function() { if(parseInt($(this).height()) > maxheight) maxheight = parseInt($(this).height()); }); $('#item_detail_slider_content').height(maxheight == 0 ? 16 : maxheight); if($('#item_detail_slider_content').attr('slider_interval') > 0) { sliderHandle = setInterval(function() { $('.slider_item_real').animate({'left': '-=900'}, function() { $('.slider_item_real').each(function() { if(parseInt($(this).css('left')) < 0) { $(this).css({'left': 900 * ($('.slider_item_real').length - 1)}); } }) }); }, $('#item_detail_slider_content').attr('slider_interval') * 1000); } }); } function igniteCombobox() { $('.combobox_dummy').scombobox({ fullMatch: true // when fullMatch is true // then highligh is also true by default }); } function fitPreviewImages() { /*$('#gallery .gallery_item img, #item_rel_items .item_rel_item img').each(function() { fitImage($(this), $(this).get(0).naturalWidth, $(this).get(0).naturalHeight, $(this).parent().width(), $(this).parent().height()); });*/ } function fitImage(image, iWidth, iHeight, wWidth, wHeight) { var new_height = 0; var new_width = 0; var ratio = iWidth / iHeight; if(wWidth > wHeight) { new_height = wHeight; new_width = parseInt(wHeight * ratio); if(new_width < wWidth) { new_width = wWidth; new_height = parseInt(wWidth / ratio); left = 0; top = (parseInt((new_height-wHeight) /-2)); } else { top = 0; left = parseInt((new_width - wWidth) / -2); } } else { new_width = wWidth; new_height = parseInt(wWidth / ratio); if(new_height < wHeight) { new_height = wHeight; new_width = parseInt(wHeight * ratio); top = 0; left = parseInt((new_width - wWidth) / -2); } else { left = 0; top = parseInt((new_height - wHeight) / -2); } } image.css({'width' : new_width, 'height': new_height, 'left': left, 'top': top}); } $.widget( "custom.combobox", { _create: function() { this.wrapper = $( "" ) .addClass( "custom-combobox" ) .insertAfter( this.element ); this.element.hide(); this._createAutocomplete(); this._createShowAllButton(); }, _createAutocomplete: function() { var selected = this.element.children( ":selected" ), value = selected.val() ? selected.text() : ""; this.input = $( "" ) .appendTo( this.wrapper ) .val( value ) .attr( "title", "" ) .addClass( "custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left" ) .autocomplete({ delay: 0, minLength: 0, source: $.proxy( this, "_source" ), appendTo: '#popup_slider', }) .tooltip({ classes: { "ui-tooltip": "ui-state-highlight" } }); this._on( this.input, { autocompleteselect: function( event, ui ) { ui.item.option.selected = true; this._trigger( "select", event, { item: ui.item.option }); }, autocompletechange: "_removeIfInvalid" }); }, _createShowAllButton: function() { var input = this.input, wasOpen = false; $( "" ) .attr( "tabIndex", -1 ) .attr( "title", "Show All Items" ) .tooltip() .appendTo( this.wrapper ) .button({ icons: { primary: "ui-icon-triangle-1-s" }, text: false }) .removeClass( "ui-corner-all" ) .addClass( "custom-combobox-toggle ui-corner-right" ) .on( "mousedown", function() { wasOpen = input.autocomplete( "widget" ).is( ":visible" ); }) .on( "click", function() { input.trigger( "focus" ); // Close if already visible if ( wasOpen ) { return; } // Pass empty string as value to search for, displaying all results input.autocomplete( "search", "" ); }); }, _source: function( request, response ) { var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" ); response( this.element.children( "option" ).map(function() { var text = $( this ).text(); if ( this.value && ( !request.term || matcher.test(text) ) ) return { label: text, value: text, option: this }; }) ); }, _removeIfInvalid: function( event, ui ) { // Selected an item, nothing to do if ( ui.item ) { return; } // Search for a match (case-insensitive) var value = this.input.val(), valueLowerCase = value.toLowerCase(), valid = false; this.element.children( "option" ).each(function() { if ( $( this ).text().toLowerCase() === valueLowerCase ) { this.selected = valid = true; return false; } }); // Found a match, nothing to do if ( valid ) { return; } // Remove invalid value this.input .val( "" ) .attr( "title", value + " didn't match any item" ) .tooltip( "open" ); this.element.val( "" ); this._delay(function() { this.input.tooltip( "close" ).attr( "title", "" ); }, 2500 ); this.input.autocomplete( "instance" ).term = ""; }, _destroy: function() { this.wrapper.remove(); this.element.show(); } });

Login or Register to edit or fork this paste. It's free.