daily pastebin goal
74%
SHARE
TWEET

Untitled

a guest May 16th, 2018 101 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. define([
  2.     'modules/test/testItemOverlay/views/DragAndDropInputsView',
  3.     'modules/test/testItemOverlay/views/DragAndDropIntoTextView',
  4.     'modules/test/testItemOverlay/views/AlternativesInputsView',
  5.     'modules/test/testItemOverlay/views/CodeTestInputsView',
  6.     'modules/test/testItemOverlay/views/MultimediaInputView',
  7.     'coms/AppParams',
  8.     'coms/JUIOverlay',
  9.     'libs/jquery.alterclass',
  10.     'utils/FormUtils'
  11. ], function(
  12.         DragandDropInputsView,
  13.         DragandDropIntoTextView,
  14.         AlternativesInputsView,
  15.         CodeTestInputsView,
  16.         MultimediaInputView,
  17.         AppParams,
  18.         JUIOverlay,
  19.         jquery_alterclass,
  20.         FormUtils
  21.         ) {
  22.     return Backbone.View.extend({
  23.         el: '#test_item_overlay',
  24.         widget: null,
  25.         dragDropInputs: null,
  26.         alternativesInputs: null,
  27.         multimediaInputs: null,
  28.         modelId: null,
  29.         modelDatas : [],
  30.         form: {
  31.             el: '#item_form',
  32.             $el: $('#item_form')
  33.         },
  34.  
  35.         /**
  36.          *
  37.          */
  38.         initialize: function() {
  39.  
  40.             var self = this;
  41.  
  42.             self.opts = AppParams.getOpts('TestItemOverlay');
  43.             JUIOverlay.init(self.$el, {cssClass: 'test-item-overlay', scrollParent: null}); // let CtvTestOverlay control de overflow event;
  44.             self.widget = self.$el.dialog('widget');
  45.  
  46.             self.alternativesInputs = new AlternativesInputsView();
  47.             self.codeTestInputs = new CodeTestInputsView();
  48.             self.dragDropInputs = new DragandDropInputsView();
  49.             self.multimediaInputs = new MultimediaInputView();
  50.             self.dragDropIntoTextInputs = new DragandDropIntoTextView();
  51.             self.$el.on('dialogclose', function() {
  52.                 self.reset();
  53.             });
  54.  
  55.         },
  56.  
  57.         /**
  58.          *
  59.          */
  60.         events: {
  61.             'submit #item_form': function(e) {
  62.                 e.preventDefault();
  63.  
  64.                 var self = this,
  65.                     $itemAlternatives = $(e.currentTarget).find('.item-input-alternative');
  66.  
  67.                 self.validateInfo() && self.validateContent().done(function () {
  68.  
  69.                     if (self.form.$el.data('state') !== 'submitting' && $itemAlternatives.length != 0) {
  70.  
  71.                         var itemAlternativesCount = $itemAlternatives.find('.alternative-check:checked').length;
  72.  
  73.                         if (itemAlternativesCount === 0 || itemAlternativesCount > 1) {
  74.  
  75.                             var $itemWithoutAlternatives  = $('.js-item-without-alternatives'),
  76.                                 $itemWithManyAlternatives = $('.js-item-with-many-alternatives');
  77.  
  78.                             $('.js-item-alternatives').hide();
  79.  
  80.                             $('.js-item-alternatives-msg').show();
  81.                             $('.js-item-form-submit').prop("disabled", true );
  82.  
  83.                             self.form.$el.data('state', 'submitting');
  84.  
  85.                             if (itemAlternativesCount === 0) {
  86.                                 $itemWithoutAlternatives.show();
  87.                             } else {
  88.                                 $itemWithManyAlternatives.show();
  89.                             }
  90.  
  91.                             return false;
  92.                         }
  93.                     }
  94.  
  95.                     self.$('.is-redactor').redactor('sync');
  96.                     self.form.$el.addClass('loading');
  97.                     $.ajax({
  98.  
  99.                         url: AppParams.getAppUrl('items', self.modelId),
  100.                         type: self.modelId ? 'PUT' : 'POST',
  101.                         data: self.form.$el.serializeArray().concat(self.modelDatas),
  102.                         dataType: 'json'
  103.  
  104.                     }).done(function(model) {
  105.  
  106.                         showMsg !== undefined && showMsg(self.opts.i18n.itemSaveSuccess);
  107.  
  108.                         self.modelId = model.id;
  109.                         self.$el.dialog('close');
  110.                         self.trigger('testItem:saved', model);
  111.  
  112.                     }).fail(function(xhr) {
  113.  
  114.                         showError(xhr.responseText);
  115.                         console.log(xhr);
  116.  
  117.                     }).always(function() {
  118.                         self.form.$el.removeClass('loading');
  119.                         self.resetItemAlternativesWarnings();
  120.                     });
  121.  
  122.                 });
  123.             },
  124.  
  125.             'change #itemResponseTypeSelect': function(e) {
  126.                 var selValue = $(e.currentTarget).val(), type;
  127.                 $("#content_activity").hide();
  128.                 $("#content_question").show();
  129.                 $('#radio-content').addClass('hidden');
  130.                 $('#content-normal').removeClass('hidden');
  131.                 $('#content-multimedia').addClass('hidden');
  132.                 if (selValue == 1 || selValue == 2) {
  133.                     type = 'alternative';
  134.                 } else if (selValue == 3) {
  135.                     type = 'free';
  136.                 } else if (selValue == 4) {
  137.                     type = 'exact';
  138.                 } else if (selValue == 5) {
  139.                     type = 'upload';
  140.                 } else if (6 <= selValue && selValue <= 9) {
  141.                     type = 'code';
  142.                 } else if (selValue == 10) {
  143.                     type = 'dragdrop';
  144.                     $("#content_activity").show();
  145.                     $("#content_question").hide();
  146.                 } else if(selValue == 11) {
  147.                     type = 'multimedia';
  148.                     $('#radio-content').removeClass('hidden');
  149.                     $('#content-normal').addClass('hidden');
  150.                     $('#content-multimedia').removeClass('hidden');
  151.                 }
  152.                
  153.                 this.renderInputs(type);
  154.             },
  155.             'click #btn-add-element': function(e) {
  156.  
  157.                 var self = this;
  158.                 e.preventDefault();
  159.                 var valComboBox = $('#element-item').find(':selected').text();
  160.                 var idCombobox = $('#element-item').find(':selected').val();
  161.                 $.ajax({
  162.  
  163.                     url: AppParams.getAppUrl('elements'),
  164.                     data: {elementId: idCombobox},
  165.                     dataType: 'json'
  166.  
  167.                 }).done( function(model){
  168.  
  169.                     var audioUrl = model.audio_url;
  170.                     var imageUrl = model.img_url;
  171.                     alert(audioUrl);
  172.                     var stringHtml = valComboBox+ "<audio autoplay><source src='[URL_BASE]/"+audioUrl+"' /></audio>";
  173.                     var imgHtml = "<div id='imgEnunciateContainer'>"+valComboBox+"<img id='imgEnunciate' class='hidden' src='[URL_BASE]/"+imageUrl+"'></div>";
  174.                     alert(imgHtml);
  175.                     self.$el.find('#Item_content').redactor(self.opts.redactor).redactor('set',imgHtml);
  176.  
  177.                 }).error(function(error){
  178.  
  179.                     console.log(error);
  180.  
  181.                 });
  182.                
  183.             },
  184.             'change #typeAnswer': function(e) {
  185.                 var self = this;
  186.                 var selValue = $(e.currentTarget).val();
  187.                 if(selValue == 1) {
  188.                     self.$el.find('#itemMultimediaWrapper').removeClass('hidden');
  189.                     self.$el.find('#itemAnswerInputWrapper').hide();
  190.                 } else if(selValue == 0) {
  191.                     self.$el.find('#itemMultimediaWrapper').addClass('hidden');
  192.                     self.$el.find('#itemAnswerInputWrapper').show();
  193.                 }
  194.             },
  195.             'click .toggle-form-container': 'toggleFormContainer',
  196.  
  197.             'click .js-cancel-submit': function () {
  198.                 this.resetItemAlternativesWarnings();
  199.             },
  200.             'click #Item_custom_settings_is_sorting_1:checked':function(evt){
  201.                     $("#content_activity").show();
  202.                     $("#content_question").hide();
  203.                     $(".contentQuestionContainer").show();
  204.                     $(".contentQuestionMatchingContainer").hide();
  205.                     $(".dragdropListContainer").hide();
  206.                     $("#excludedTermsContainer").hide();
  207.                     $("#infoIntoTextContainer").hide();
  208.                     //$("#infoIntoTextContainer").show();
  209.                     $("#containerExcludedInfotext").hide();                    
  210.                     $("#checkIsHorizontalContainer").hide();
  211.                     $("#checkIsHorizontal").prop("checked",false);
  212.                    
  213.                
  214.             },
  215.             'click #Item_custom_settings_is_sorting_0:checked':function(evt){
  216.                     $("#content_activity").show();
  217.                     $("#content_question").hide();
  218.                     $(".contentQuestionContainer").hide();
  219.                     $(".contentQuestionMatchingContainer").show();
  220.                     $(".dragdropListContainer").show();
  221.                     $("#excludedTermsContainer").show();
  222.                     $("#containerExcludedInfotext").show();
  223.                     $("#infoIntoTextContainer").hide();
  224.                     //$(".dragdropListIntoTextContainer").hide();
  225.                     $("#checkIsHorizontalContainer").show();
  226.                     $("#checkIsHorizontal").prop("checked",true);
  227.                
  228.  
  229.                    
  230.             },
  231.             'keyup #sentenceTextArea':function (evt) {
  232.                 var self = this;
  233.  
  234.                 var texto = $(evt.target).val();
  235.                 self.setPreview(texto);  
  236.             },
  237.             'keyup .responseTerm':function (evt) {
  238.                 var self = this;              
  239.                 var texto = $("#sentenceTextArea").val();
  240.                 self.setPreview(texto);  
  241.             }
  242.                
  243.  
  244.         },
  245.  
  246.         toggleFormContainer : function () {
  247.             $('.toggle-form-container').toggleClass('toggled');
  248.             $('.form-section').toggleClass('collapse');
  249.         },
  250.  
  251.         showFormContainer : function () {
  252.             $('.toggle-form-container').removeClass('toggled');
  253.             $('.form-section').removeClass('collapse');
  254.         },
  255.  
  256.         hideFormContainer : function () {
  257.             $('.toggle-form-container').addClass('toggled');
  258.             $('.form-section').addClass('collapse');
  259.         },
  260.  
  261.         resetItemAlternativesWarnings : function () {
  262.             $('.js-item-alternatives-msg').hide().find('.js-item-alternatives').hide();
  263.             $('.js-item-form-submit').prop( "disabled", false);
  264.             this.form.$el.data('state',null);
  265.  
  266.             return this;
  267.         },
  268.  
  269.         open: function(opts) {
  270.             var self = this, i18n = self.opts.i18n;
  271.             self.modelId = opts.modelId;
  272.             self.$el.dialog('open').dialog('option', 'title', i18n[(self.modelId ? 'update' : 'create') + 'Item']);
  273.             if (self.modelId) {
  274.  
  275.                 self.form.$el.addClass('loading');
  276.                 $.ajax({
  277.                     url: AppParams.getAppUrl('items'),
  278.                     data: {id: self.modelId},
  279.                     dataType: 'json'
  280.                 }).done(function(data) {
  281.                     FormUtils.setValues(data.item, 'Item', self.form.$el);
  282.                     data.itemParameter[0] !== undefined && FormUtils.setValues(data.itemParameter[0], 'ItemParameter', self.form.$el);
  283.                     if(data.gradingScale.type == 1){
  284.                         self.$el.find('.js-weighting').removeClass("hidden")
  285.                     }
  286.                     self.alternativesInputs.render(data.itemAlternatives);
  287.                     self.codeTestInputs.render(data.itemCodeTests);
  288.                     if(data.itemTerms.length > 0){
  289.                         if(data.itemTerms[0].type == "1"){ // sentence                            
  290.                              data.itemTerms.map(function(terms, ind){                            
  291.                                 terms.link = JSON.parse(terms.link)[0];
  292.                             });
  293.                             self.dragDropIntoTextInputs.render(data.itemTerms);
  294.                             //self.dragDropInputs.render();
  295.                         }else{ // matching
  296.                            
  297.                             self.dragDropInputs.render(data.itemTerms);
  298.                             //self.dragDropIntoTextInputs.render();
  299.  
  300.                         }
  301.                     }
  302.                    
  303.                     self.codeTestInputs.renderCodeEditor();
  304.  
  305.                     self.resetItemAlternativesWarnings().initTextEditors();
  306.                     data.item.response_type != 3 && self.hideFormContainer();
  307.  
  308.                 }).always(function() {
  309.                     self.form.$el.removeClass('loading');
  310.                 });
  311.  
  312.             } else {
  313.                 self.alternativesInputs.render();
  314.                 self.codeTestInputs.render();
  315.                 self.dragDropInputs.render();
  316.                 self.multimediaInputs.render();
  317.                 self.dragDropIntoTextInputs.render();
  318.                 self.renderInputs('alternative');
  319.                 self.modelDatas = opts.modelDatas;
  320.                 self.initTextEditors();
  321.  
  322.             }
  323.  
  324.         },
  325.  
  326.         initTextEditors : function () {
  327.             var self = this;
  328.             ['#Item_content','#Item_tip','#Item_detailed_answer'].forEach(function (el) {
  329.                 self.initTextEditor($(el));
  330.             });
  331.         },
  332.  
  333.         renderInputs: function(type) {
  334.             this.$('.item-edit-panel-content').alterClass('item-input-*', 'item-input-' + type);
  335.             type == 'code' && this.codeTestInputs.renderCodeEditor();
  336.         },
  337.  
  338.         reset: function() {
  339.  
  340.             this.$('.is-redactor').removeClass('is-redactor').redactor('destroy');
  341.             $('#latex_dialog').dialog('close');
  342.             FormUtils.reset(this.form.$el);
  343.             this.resetItemAlternativesWarnings().showFormContainer();
  344.         },
  345.  
  346.         validateInfo: function() {
  347.             var itemContent = $('#Item_content');
  348.  
  349.             if (itemContent.hasClass('is-redactor') && itemContent.redactor('get').length > 0 && $('#Item_title').val().length >= 0) {
  350.                 return true;
  351.             }
  352.  
  353.             showError(this.opts.i18n.invalidItemContent);
  354.  
  355.             return false;
  356.         },
  357.  
  358.         validateContent: function() {
  359.             var self = this;
  360.  
  361.             self.form.$el.addClass('loading');
  362.  
  363.             return $.post(AppParams.getAppUrl('itemValidation'), self.form.$el.serializeArray()).fail(function(xhr) {
  364.                 showError(xhr.responseText);
  365.             }).always(function() {
  366.                 self.form.$el.removeClass('loading');
  367.             });
  368.         },
  369.  
  370.         initTextEditor: function(selector) {
  371.             selector.addClass('is-redactor').redactor(this.opts.redactor).redactor('set',selector.val());
  372.         },
  373.         setPreview:function (value) {
  374.            
  375.             var texto = value;
  376.             var matches = [];
  377.             //var result = texto.replace(/(\[\[(\w+)\]\])/igm,
  378.             var result = texto.replace(/(\[\[(\d+)\]\])/igm,
  379.               function(m, p1,p2,p3){
  380.                     matches.push({"match":p1,"p":p2});
  381.                     var parent = $("#dragdropIntoTextList").children(":nth-child("+p2+")");
  382.                     var code = $(".into-text-group").eq(p2 - 1).val();
  383.                     var input = $(parent).find("input[class='responseTerm']");
  384.                     var response = $(input).val();
  385.                     if(response === undefined) response = ' --Sin elección definida--';
  386.                     //return '<span style="color:red">'+response+'</span>';
  387.                     return '</div>'+
  388.                         '<div class="into-text-drop color-code-'+code+
  389.                         '" data-group="'+code+'" code_color="color-'+code+
  390.                         '" style="color:red"><ul class="sort2 into-text-drop-ul color-code-'+code+
  391.                         '" data-group="'+code+'" code_color="color-'+code+
  392.                         '" style="color:red">'+response+'</ul></div>'
  393.                         +'<div class="into-text-fragment">';
  394.               });
  395.             $("#sentenceTextAreaPreview").html('<div class="into-text-fragment">'+result+'</div>');
  396.         }
  397.     });
  398. });
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top