PluginProbe ʕ •ᴥ•ʔ
WPFront Scroll Top / 2.1
WPFront Scroll Top v2.1
1.5 1.6 1.6.1 1.6.2 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.1 2.1.1 2.2 3.0.0 3.0.1 trunk 1.0 1.0.1 1.1 1.1.1 1.2 1.3 1.4 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5
wpfront-scroll-top / js / options.js
wpfront-scroll-top / js Last commit date
element-plus.min.js 2 years ago options.js 2 years ago options.min.js 2 years ago vue.global.prod.js 2 years ago wpfront-scroll-top.js 2 years ago wpfront-scroll-top.min.js 2 years ago
options.js
226 lines
1 (function () {
2 'use strict'
3
4 let $ = jQuery;
5
6 let appData = { loading: true, error: '', nonce: '' };
7 let $app = null;
8
9 function postData(action, data) {
10 data = data || null;
11 return new Promise(function (resolve, reject) {
12 $.post(ajaxurl + '?action=' + action, { data: JSON.stringify(data), _ajax_nonce: appData.nonce })
13 .done(function(response){
14 if(response.success) {
15 resolve(response.data);
16 } else {
17 reject(response.data);
18 }
19 })
20 .fail(reject);
21 });
22 }
23
24 let timeoutID = 0;
25 function handleError(error) {
26 console.log(error);
27
28 if(typeof error !== 'string') {
29 if(error.statusText) {
30 error = error.statusText;
31 } else {
32 error = 'Error';
33 }
34 }
35
36 $app.error = error;
37 $app.loading = false;
38
39 clearTimeout(timeoutID);
40 timeoutID = setTimeout(() => $app.error = '', 5000);
41 }
42
43 let promiseData = postData('wpfront_scroll_top_get_data')
44 .then(result => {
45 appData.data = result.data;
46 appData.nonce = result.nonce;
47 });
48
49 let app = Vue.createApp({
50 data() {
51 return appData;
52 },
53 created(){
54 $(function () {
55 $('#scroll-top-content').find('.if-js-closed').removeClass('if-js-closed').addClass('closed');
56 postboxes.add_postbox_toggles('wpfront-scroll-top');
57 });
58 },
59 mounted() {
60 $app = this;
61 this.loading = false;
62 },
63 methods: {
64 submit() {
65 if(this.loading) {
66 return;
67 }
68
69 this.loading = true;
70 this.error = '';
71
72 postData('wpfront_scroll_top_submit_data', appData.data)
73 .then((url) => {
74 window.location.replace(url);
75 })
76 .catch(error => {
77 handleError(error);
78 });
79 }
80 }
81 });
82
83 app.use(ElementPlus);
84
85 let promiseComponents;
86
87 function loadComponents(version) {
88 promiseComponents = fetch(ajaxurl + '?action=wpfront_scroll_top_get_static&v=' + version)
89 .then((response) => {
90 if (response.ok) {
91 return response.json();
92 }
93
94 return Promise.reject('bad request');
95 })
96 .then(result => {
97 if(!result.success) {
98 return Promise.reject(result.data);
99 }
100
101 return result.data;
102 })
103 .then(result => {
104 appData.labels = result.labels;
105 appData.help = result.help;
106 appData.location_options = result.location_options;
107 appData.button_style_options = result.button_style_options;
108 appData.button_action_options = result.button_action_options;
109 appData.icons_list = result.icons_list;
110 appData.filter_options = result.filter_options;
111 appData.filter_posts_list = result.filter_posts_list;
112 appData.current_location = result.current_url;
113
114 return result.templates;
115
116 })
117 .then(components => {
118 app.component('DisplaySettings', {
119 template: components['display-settings'],
120 data: () => appData
121 });
122
123 app.component('ButtonActionSettings', {
124 template: components['button-action-settings'],
125 data: () => appData
126 });
127
128 app.component('LocationSettings', {
129 template: components['location-settings'],
130 data: () => appData
131 });
132
133 app.component('ImageButtonSettings', {
134 template: components['image-button-settings'],
135 data: () => appData,
136 methods: {
137 mediaLibrary() {
138 var self = this;
139
140 if(!wp.media.frames.file_frame) {
141 wp.media.frames.file_frame = wp.media({
142 title: appData.labels.media_library_title,
143 multiple: false,
144 'library': {
145 type: 'image'
146 },
147 button: {
148 text: appData.labels.media_library_text
149 }
150 }).on('select', function() {
151 var obj = wp.media.frames.file_frame.state().get('selection').first().toJSON();
152
153 self.data.custom_url = obj.url;
154 self.data.image = 'custom';
155 self.data.image_alt = self.data.image_alt || obj.alt || obj.title;
156 });
157 }
158
159 wp.media.frames.file_frame.open();
160 }
161 }
162 });
163
164 app.component('FontAwesomeButtonSettings', {
165 template: components['font-awesome-button-settings'],
166 data: () => appData
167 });
168
169 app.component('TextButtonSettings', {
170 template: components['text-button-settings'],
171 data: () => appData
172 });
173
174 app.component('HelpIcon', {
175 props: ['helpText'],
176 template: components['help-icon']
177 });
178
179 app.component('ColorPicker', {
180 props: ['modelValue'],
181 template: components['color-picker']
182 });
183
184 app.component('FilterSettings', {
185 template: components['filter-settings'],
186 data: () => appData
187 });
188
189 app.component('PostsFilterSelection', {
190 props: ['modelValue', 'postsList'],
191 template: components['posts-filter-selection'],
192 computed: {
193 selectedPosts: {
194 get() {
195 return this.modelValue.split(',');
196 },
197 set(values) {
198 this.$emit('update:modelValue', values.filter(e => e).join().trim());
199 }
200 }
201 }
202 });
203
204 });
205 }
206
207 function load() {
208 if ($('#scroll-top-content').length > 0) {
209 Promise.all([promiseData, promiseComponents])
210 .then(() => {
211 app.mount('#scroll-top-content');
212 })
213 .catch(error => {
214 handleError(error);
215 });
216 } else {
217 setTimeout(load, 200);
218 }
219 }
220
221 window.load_wpf_st = function(version) {
222 loadComponents(version);
223 load();
224 };
225
226 })();