Как отобразить ссылку для встраивания Twitter в Summernote - PullRequest
0 голосов
/ 17 июня 2020

Я пытаюсь вставить встроенную ссылку в summernote на самом деле он должен показывать предварительный просмотр встроенной ссылки, но это не работает, и я застрял ... вот плагин ссылки, который я настроил. Это создание диалога с полями и даже получение входных данных.

     $.extend($.summernote.plugins, {
            'tweet-btn': function(context) {
                var self = this,
                    ui = $.summernote.ui,
                    $editor = context.layoutInfo.editor,
                    // options = context.options,
                    // listUrl,
                    dialogTitle;

                // if (options.EmbedTweet !== undefined) {
                //     listUrl = options.EmbedTweet.listUrl;
                //     dialogTitle = options.EmbedTweet.title;
                // }
                if (dialogTitle === undefined) {
                    dialogTitle = 'Embed Tweet';
                }

                context.memo('button.tweet-btn', function () {
                    return ui.button({
                        contents: '<i class="fa fa-twitter"/i>',
                        tooltip: dialogTitle,
                        click: function () {
                            self.show();
                        }
                    }).render();
                });

                this.loadList = function() {
                    return $.Deferred(function(deferred) {
                      // alert('here2');
                        if (self.data === undefined ) {
                          alert();
                            // $.get(listUrl, function(data) {
                            //     self.data = data;
                            //     $.each(data, function(key, value) {
                            //         var url = value[0],
                            //             label = value[1];
                            //         $('.note-link-list').append($('<option>', {
                            //             value: url,
                            //             text : label
                            //         }));
                            //         deferred.resolve();
                            //     });
                            // })
                        } else {
                          // alert('here1');
                            deferred.resolve();
                        }
                    });
                }

                this.initialize = function () {
                    var $container =  $editor;
                    var body_prototype = '\
                      <div class="form-group note-form-group">\
                        <label class="note-form-label">Enter Embeded Link</label>\
                        <input class="note-link-text form-control note-form-control  note-input embed-tweet-field" type="text" />\
                      </div>';

                    var buttonClass = 'btn btn-success tweet-save-btn';
                    var footer = '<button type="submit" href="#" class="' + buttonClass + '" disabled >Save</button>';

                    this.$dialog = ui.dialog({
                        title: dialogTitle,
                        body: body_prototype,
                        footer: footer
                    }).render().appendTo($container);

                    this.$linkText = self.$dialog.find('.note-link-text');
                    // this.$linkList = self.$dialog.find('.note-link-list');
                    this.$linkBtn = self.$dialog.find('.tweet-save-btn');

                    $('.embed-tweet-field').on('keyup',function(event) {
                      if ($(this).val() == '') {
                      $('.tweet-save-btn').attr('disabled', true);
                      }
                      else{
                      $('.tweet-save-btn').attr('disabled', false);
                      }

                    });
                };

                this.show = function () {
                    var tweetData = context.invoke('editor.getLinkInfo');
                    context.invoke('editor.saveRange');
                    context.triggerEvent('dialog.shown');
                    this.loadList().then(function() {
                        self.showLinkDialog(tweetData).then(function (tweetData) {
                          console.log(tweetData.text);

                            context.invoke('editor.insertText', tweetData);


                        }).fail(function () {
                            context.invoke('editor.restoreRange');
                        });
                    });

                };

                this.initButtonEvent = function(deferred, tweetData) {
                    // console.log($linkText.val());
                    self.$linkBtn.one('click', function(event) {
                        event.preventDefault();
                        // var linkUrl = self.$linkList.val();
                        deferred.resolve({
                            // range: tweetData.range,
                            text: self.$linkText.val(),
                            isNewWindow: false
                        });
                        ui.hideDialog(self.$dialog);
                    });
                };

                this.showLinkDialog = function (tweetData) {
                  // alert();
                    return $.Deferred(function (deferred) {
                        ui.onDialogShown(self.$dialog, function () {
                            // self.$linkText.val(tweetData.text);
                            // self.$linkList.val(tweetData.url);
                            self.initButtonEvent(deferred, tweetData);
                        });

                        ui.onDialogHidden(self.$dialog, function () {
                            self.$linkBtn.off('click');
                            if (deferred.state() === 'pending') {
                                deferred.reject();
                            }
                        });
                        ui.showDialog(self.$dialog);
                    });
                };
            }
        });
...