static/kelmu.editor.js
function() {

      var data = window.kelmu.data[id];
      var elemData = data.definitions['step' + data.stepNumber][data.subStepNumber][data.selectedElementNumber];

      editor.find('.kelmu-editor-pane').remove();

      var lineEditor = $('<div></div>').addClass('kelmu-line-editor').addClass('kelmu-editor-pane');
      lineEditor.appendTo(editor);

      lineEditor.append($('<h4>Line</h4>').css('margin', '15px 0px'));

      idCounter += 1;

      // Set the current values
      addComponent('Width:', lineEditor, 'kelmu-line-width', elemData.width, 'text', true);
      addComponent('Color:', lineEditor, 'kelmu-line-color', elemData.line, 'text');
      addComponent('With sound:', lineEditor, 'kelmu-line-sound-option', elemData.soundOption, 'text');

      // Save the modified properties
      var saveLine = function() {
        elemData.width = lineEditor.find('.kelmu-line-width').val() || window.kelmu.defaults.line.width;
        elemData.line = lineEditor.find('.kelmu-line-color').val() || window.kelmu.defaults.line.line;
        elemData.soundOption = lineEditor.find('.kelmu-line-sound-option').val() || window.kelmu.defaults.line.soundOption;
        window.kelmu.data[id].actions.update();
        updateView(true, true);
        notifyModifications();
      };

      lineEditor.find('input').keyup(saveLine);

      var buttonContainer = $('<div></div>').appendTo(lineEditor);

      createRemoveButton().appendTo(buttonContainer);

      // Save the modified properties
      $('<button></button>').text('Make default').addClass('btn').appendTo(buttonContainer).click(function(e) {
        e.preventDefault();
        window.kelmu.defaults.line.width = lineEditor.find('.kelmu-line-width').val() || lineDefaults.width;
        window.kelmu.defaults.line.line = lineEditor.find('.kelmu-line-color').val() || lineDefaults.line;
        window.kelmu.defaults.line.soundOption = lineEditor.find('.kelmu-line-sound-option').val() || lineDefaults.soundOption;
      });

    }
function() {

      var data = window.kelmu.data[id];
      var elemData = data.definitions['step' + data.stepNumber][data.subStepNumber][data.selectedElementNumber];

      editor.find('.kelmu-editor-pane').remove();

      var lineEditor = $('<div></div>').addClass('kelmu-line-editor').addClass('kelmu-editor-pane');
      lineEditor.appendTo(editor);

      lineEditor.append($('<h4>Line</h4>').css('margin', '15px 0px'));

      idCounter += 1;

      // Set the current values
      addComponent('Width:', lineEditor, 'kelmu-line-width', elemData.width, 'text', true);
      addComponent('Color:', lineEditor, 'kelmu-line-color', elemData.line, 'text');
      addComponent('With sound:', lineEditor, 'kelmu-line-sound-option', elemData.soundOption, 'text');

      // Save the modified properties
      var saveLine = function() {
        elemData.width = lineEditor.find('.kelmu-line-width').val() || window.kelmu.defaults.line.width;
        elemData.line = lineEditor.find('.kelmu-line-color').val() || window.kelmu.defaults.line.line;
        elemData.soundOption = lineEditor.find('.kelmu-line-sound-option').val() || window.kelmu.defaults.line.soundOption;
        window.kelmu.data[id].actions.update();
        updateView(true, true);
        notifyModifications();
      };

      lineEditor.find('input').keyup(saveLine);

      var buttonContainer = $('<div></div>').appendTo(lineEditor);

      createRemoveButton().appendTo(buttonContainer);

      // Save the modified properties
      $('<button></button>').text('Make default').addClass('btn').appendTo(buttonContainer).click(function(e) {
        e.preventDefault();
        window.kelmu.defaults.line.width = lineEditor.find('.kelmu-line-width').val() || lineDefaults.width;
        window.kelmu.defaults.line.line = lineEditor.find('.kelmu-line-color').val() || lineDefaults.line;
        window.kelmu.defaults.line.soundOption = lineEditor.find('.kelmu-line-sound-option').val() || lineDefaults.soundOption;
      });

    }
function ( ) { var data = window . kelmu . data [ id ] ; var elemData = data . definitions [ 'step' + data . stepNumber ] [ data . subStepNumber ] [ data . selectedElementNumber ] ; editor . find ( '.kelmu-editor-pane' ) . remove ( ) ; var lineEditor = $ ( '<div></div>' ) . addClass ( 'kelmu-line-editor' ) . addClass ( 'kelmu-editor-pane' ) ; lineEditor . appendTo ( editor ) ; lineEditor . append ( $ ( '<h4>Line</h4>' ) . css ( 'margin' , '15px 0px' ) ) ; idCounter += 1 ; // Set the current values addComponent ( 'Width:' , lineEditor , 'kelmu-line-width' , elemData . width , 'text' , true ) ; addComponent ( 'Color:' , lineEditor , 'kelmu-line-color' , elemData . line , 'text' ) ; addComponent ( 'With sound:' , lineEditor , 'kelmu-line-sound-option' , elemData . soundOption , 'text' ) ; // Save the modified properties var saveLine = function ( ) { elemData . width = lineEditor . find ( '.kelmu-line-width' ) . val ( ) || window . kelmu . defaults . line . width ; elemData . line = lineEditor . find ( '.kelmu-line-color' ) . val ( ) || window . kelmu . defaults . line . line ; elemData . soundOption = lineEditor . find ( '.kelmu-line-sound-option' ) . val ( ) || window . kelmu . defaults . line . soundOption ; window . kelmu . data [ id ] . actions . update ( ) ; updateView ( true , true ) ; notifyModifications ( ) ; } ; lineEditor . find ( 'input' ) . keyup ( saveLine ) ; var buttonContainer = $ ( '<div></div>' ) . appendTo ( lineEditor ) ; createRemoveButton ( ) . appendTo ( buttonContainer ) ; // Save the modified properties $ ( '<button></button>' ) . text ( 'Make default' ) . addClass ( 'btn' ) . appendTo ( buttonContainer ) . click ( function ( e ) { e . preventDefault ( ) ; window . kelmu . defaults . line . width = lineEditor . find ( '.kelmu-line-width' ) . val ( ) || lineDefaults . width ; window . kelmu . defaults . line . line = lineEditor . find ( '.kelmu-line-color' ) . val ( ) || lineDefaults . line ; window . kelmu . defaults . line . soundOption = lineEditor . find ( '.kelmu-line-sound-option' ) . val ( ) || lineDefaults . soundOption ; } ) ; }
Creates the action editor pane for the selected line.
Creates the action editor pane for the selected line .