i need a modfication in this js script

Technical Details

Forum version : #phpBB3
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari, Other
Who the problem concerns : All members
Forum link : http://alla-omar.mo-rpg.com

Description of problem

i want it to do the same act but with window to insert the img url


the code

Code:

$(function() {
  if ($.sceditor) {
    $.sceditor.command.set('tbl', {
 
      exec : function() {
        this.insert('[tbl=',']');
      },
 
      txtExec : function() {
        this.insert('[tbl=',']');
      },
 
      tooltip : 'خلفية الموضوع'
 
    });
 
    toolbar += ',tbl';
  }
 
  for (var a = $('.post .content'), i = 0, j = a.length; i < j; i++) {
    if (/\[tbl=.*?\]/i.test(a[i].innerHTML)) {
      a[i].innerHTML = a[i].innerHTML.replace(/\[tbl=(.*?)\]/i, function(M, $1) {
        a[i].style.backgroundImage = 'url(' + $1 + ')';
        return '';
      });
    }
  }
});

up

Can you explain your issue in more detail here? And where did you get this script?

SarkZKalie wrote:Can you explain your issue in more detail here? And where did you get this script?

there is no issue i just want a modification in the script

the script was made here in the help forum by ange the job of it is to make a background to the topic by the choice of the member

https://help.forumotion.com/t144461-help-me-with-this-java-scripte#987269

so instead of writing the url of the image and then click on the button 


i want a window to show and pste the url of the img in it

Hey @alla13,
you can adapte this code: [AddOn] Criar botão no editor com lista de comandos by @Daemon.

Change your code to:

Code:

$(function() {
  if (!$.sceditor) return;
 
  $.sceditor.command.set('cmd', {
 
  dropDown : function(editor, caller, callback) {
 
    var content = $(
    '<div>' +
    '  <div>' +
    '    <label>URL</label>' +
    '    <input type="text" placeholder="bg image" id="cmdValue" value="" />' +
    '  </div>' +
    '  <div>' +
    '    <input type="button" class="button" value="ok!">' +
    '  </div>' +
    '</div>'
    );
            content.find('.button').click(function(e) {
                callback(content.find('select').val());
                editor.closeDropDown(true);
            });
            editor.createDropDown(caller, "cmd", content);
  },
  // WYSIWYG MODE
  exec : function(caller) {
  var editor = this;
      $.sceditor.command.get('cmd').dropDown(editor, caller, function(cmd) {
        var before = '[tbl]', title = $('#cmdValue').val();
        if(title !== '') {
          before = '[tbl=' + title + ']';
            editor.wysiwygEditorInsertHtml(before);
        }
      });
  },
  // SOURCE MODE
  txtExec : function(caller) {
  var editor = this;
      $.sceditor.command.get('cmd').dropDown(editor, caller, function(cmd) {
        var title = $('#cmdValue').val();
        if(title) {
            editor.insertText('[tbl=' + title + ']');
        } else {
            editor.insertText('[tbl=' + title + ']');
        }
      });
  }, tooltip: "خلفية الموضوع"});
 
    for (var a = $('.post .content'), i = 0, j = a.length; i < j; i++) {
    if (/\[tbl=.*?\]/i.test(a[i].innerHTML)) {
      a[i].innerHTML = a[i].innerHTML.replace(/\[tbl=(.*?)\]/i, function(M, $1) {
        a[i].style.backgroundImage = 'url(' + $1 + ')';
        return '';
      });
    }
  }
 
  toolbar = toolbar.replace(/image/,'cmd,image');
 
  $('head').append(
  '<style type="text/css">' +
  '.sceditor-button-cmd div {' +
  '  background:url(https://cdn2.iconfinder.com/data/icons/circle-icons-1/64/image-16.png) !important}' +
  '  .sceditor-cmd {' +
  '  width:auto;' +
  '  height:auto;' +
  '  overflow-y:auto;' +
  '}' +
  '.sceditor-cmd select {' +
  '  margin: 0 0 .75em;' +
  '}' +
  '</style>'
  );
});

best regards,

thank you @pedxz
the code is working
topic solved