← Back to branch summary

~xibo-maintainers/xibo/tempel

« back to all changes in this revision

Viewing changes to web/theme/default/js/xibo-forms.js

  • Committer: Dan Garner
  • Date: 2018-05-21 14:58:11 UTC
  • mfrom: (644.1.8)
  • mto: (614.1.6)
  • mto: This revision was merged to the branch mainline in revision 648.
  • Revision ID: git-v1:e7961b0ebe68a0c0bc5dd7b3abca007138b2cadd
Merge branch 'bugfix/1.8.10-pack1' into feature/r-graph

Show diffs side-by-side

added added

removed removed

Lines of Context:
web/theme/default/js/xibo-forms.js
14
14
    var scale = $layout.attr('designer_scale');
15
15
    var regionWidth = $("#region_" + $layout.data().currentRegionId).attr("width");
16
16
    var regionHeight = $("#region_" + $layout.data().currentRegionId).attr("height");
17
 
    var applyContentsToIframe = function() {
18
 
        $("#cke_ta_text iframe").contents().find("head").append("" +
 
17
    var applyContentsToIframe = function(field) {
 
18
        //console.log('Applying iframe adjustments to ' + field);
 
19
        $("#cke_" + field + " iframe").contents().find("head").append("" +
19
20
            "<style>" +
20
21
            "body {" +
21
22
            "width: " + regionWidth + "px; " +
73
74
    // Bind to instance ready so that we can adjust some things about the editor.
74
75
    CKEDITOR.instances["ta_text"].on('instanceReady', function() {
75
76
        // Apply scaling to this editor instance
76
 
        applyContentsToIframe();
 
77
        applyContentsToIframe("ta_text");
77
78
 
78
79
        // Reapply the background style after switching to source view and back to the normal editing view
79
 
        CKEDITOR.instances["ta_text"].on('contentDom', applyContentsToIframe);
 
80
        CKEDITOR.instances["ta_text"].on('contentDom', function () { applyContentsToIframe("ta_text") });
80
81
 
81
82
        // Get the template data
82
83
        var data = CKEDITOR.instances["ta_text"].getData();
103
104
        CKEDITOR.replace("noDataMessage", CKEDITOR_DEFAULT_CONFIG);
104
105
        CKEDITOR.instances["noDataMessage"].on('instanceReady', function () {
105
106
            // Apply scaling to this editor instance
106
 
            applyContentsToIframe();
 
107
            applyContentsToIframe("noDataMessage");
107
108
 
108
109
            // Reapply the background style after switching to source view and back to the normal editing view
109
 
            CKEDITOR.instances["noDataMessage"].on('contentDom', applyContentsToIframe);
 
110
            CKEDITOR.instances["noDataMessage"].on('contentDom', function () { applyContentsToIframe("noDataMessage") });
110
111
 
111
112
            // Get the template data
112
113
            var data = CKEDITOR.instances["noDataMessage"].getData();
 
114
            if (data === "") {
 
115
                data = "<span style=\"font-size: 48px;\"><span style=\"color: " + color + ";\">" + translations.noDataMessage + "</span></span>";
 
116
            }
113
117
 
114
118
            // Handle initial template set up
115
 
            data = applyTemplateContentIfNecessary(data, extra);
116
119
            data = convertLibraryReferences(data);
117
120
 
118
121
            CKEDITOR.instances["noDataMessage"].setData(data);
156
159
    });
157
160
 
158
161
    // Do we have a media selector?
159
 
    $(".ckeditor_library_select").selectpicker({
160
 
        liveSearch: true
161
 
    }).on('changed.bs.select', function (e) {
162
 
        var select = $(e.target);
163
 
        var linkedTo = select.data().linkedTo;
164
 
        var value = $(e.target).find(":selected").data().imageUrl;
165
 
        
166
 
        if (value != "" && linkedTo != null) {
167
 
            if (CKEDITOR.instances[linkedTo] != undefined) {
168
 
                CKEDITOR.instances[linkedTo].insertHtml("<img src=\"" + value + "\" />");
169
 
            }
170
 
        }
171
 
    });
 
162
    var $selectPicker = $(".ckeditor_library_select");
 
163
    if ($selectPicker.length > 0) {
 
164
        $selectPicker.selectpicker({
 
165
            liveSearch: true
 
166
        })
 
167
            .ajaxSelectPicker({
 
168
                ajax: {
 
169
                    type: 'GET',
 
170
                    url: $selectPicker.data().searchUrl,
 
171
                    data: function () {
 
172
                        return {
 
173
                            media: '{{{q}}}',
 
174
                            type: 'image',
 
175
                            start: 0,
 
176
                            length: 50
 
177
                        };
 
178
                    }
 
179
                },
 
180
                preprocessData: function (data) {
 
181
                    var library = [];
 
182
                    if (data.hasOwnProperty('data')) {
 
183
                        $.each(data.data, function (index, element) {
 
184
                            library.push({
 
185
                                'value': element.mediaId,
 
186
                                'text': element.name,
 
187
                                'data': {
 
188
                                    'image-url': $selectPicker.data().imageUrl.replace(':id', element.mediaId)
 
189
                                },
 
190
                                'disabled': false
 
191
                            });
 
192
                        });
 
193
                    }
 
194
                    return library;
 
195
                },
 
196
                preserveSelected: false,
 
197
                emptyRequest: true
 
198
            })
 
199
            .on('changed.bs.select', function (e) {
 
200
                console.log(e);
 
201
                var select = $(e.target);
 
202
                var linkedTo = select.data().linkedTo;
 
203
                var value = $(e.target).find(":selected").data().imageUrl;
 
204
 
 
205
                if (value !== undefined && value !== "" && linkedTo != null) {
 
206
                    if (CKEDITOR.instances[linkedTo] != undefined) {
 
207
                        CKEDITOR.instances[linkedTo].insertHtml("<img src=\"" + value + "\" />");
 
208
                    }
 
209
                }
 
210
            });
 
211
    }
172
212
 
173
213
    // Turn the background colour into a picker
174
214
    $("#backgroundColor").colorpicker();