← All changes | admin/js/import.js +10 -148 1.9.2 → 3.4 View file →

		@@ -1,6 +1,6 @@
1	1	/**
2		- * JavaScript code for the "Import" screen
	2	+ * JavaScript code for the "Import" screen.
3	3	*
4	4	* @package TablePress
5	5	* @subpackage Views JavaScript
6	6	* @author Tobias Bäthge
		@@ -6,152 +6,14 @@
6	6	* @author Tobias Bäthge
7	7	* @since 1.0.0
8	8	*/
9	9
10		-/* global alert, tablepress_import */
	10	+/**
	11	+ * Internal dependencies.
	12	+ */
	13	+import { initializeReactComponent } from './common/react-loader';
	14	+import Screen from './import/screen';
11	15
12		-jQuery( document ).ready( function( $ ) {
13		-
14		- 'use strict';
15		-
16		- /**
17		- * Show select box for table to replace only if needed
18		- *
19		- * @since 1.0.0
20		- */
21		- $( '#row-import-type' ).on( 'change', 'input', function() {
22		- $( '#tables-import-existing-table' ).prop( 'disabled', ( 'replace' !== $(this).val() && 'append' !== $(this).val() ) );
23		- } )
24		- .find( 'input:checked' ).change();
25		-
26		- /**
27		- * Show only the import source field that was selected with the radio button
28		- *
29		- * @since 1.0.0
30		- */
31		- $( '#row-import-source' ).on( 'change', 'input', function() {
32		- $( '#row-import-source-file-upload, #row-import-source-url, #row-import-source-server, #row-import-source-form-field' ).hide();
33		- $( '#row-import-source-' + $(this).val() ).show();
34		- } )
35		- .find( 'input:checked' ).change();
36		-
37		- /**
38		- * Show only the WP-Table Reloaded import source field that was selected with the radio button
39		- *
40		- * @since 1.0.0
41		- */
42		- $( '#row-import-wp-table-reloaded-source' ).on( 'change', 'input', function() {
43		- $( '#row-import-wp-table-reloaded-source-dump-file, #row-import-wp-table-reloaded-source-db' ).hide();
44		- $( '#row-import-wp-table-reloaded-source-' + $(this).val() ).show();
45		- } )
46		- .find( 'input:checked' ).change();
47		-
48		- /**
49		- * Select correct value in import format dropdown on file select
50		- *
51		- * @since 1.0.0
52		- */
53		- $( '#tables-import-file-upload, #tables-import-url, #tables-import-server' ).on( 'change', function( event ) {
54		- var path = $(this).val(),
55		- filename_start,
56		- extension_start,
57		- filename = path,
58		- extension = 'csv';
59		-
60		- // default extension: CSV for file upload and server, HTML for URL
61		- if ( 'tables-import-url' === event.target.id ) {
62		- extension = 'html';
63		- }
64		- // determine filename from full path
65		- filename_start = path.lastIndexOf( '\\' );
66		- if ( -1 !== filename_start ) { // Windows-based path
67		- filename = path.substr( filename_start + 1 );
68		- } else {
69		- filename_start = path.lastIndexOf( '/' );
70		- if ( -1 !== filename_start ) { // Windows-based path
71		- filename = path.substr( filename_start + 1 );
72		- }
73		- }
74		- // determine extension from filename
75		- extension_start = filename.lastIndexOf( '.' );
76		- if ( -1 !== extension_start ) {
77		- extension = filename.substr( extension_start + 1 ).toLowerCase();
78		- }
79		-
80		- // allow .htm for HTML as well
81		- if ( 'htm' === extension ) {
82		- extension = 'html';
83		- }
84		-
85		- // Don't change the format for ZIP archives
86		- if ( 'zip' === extension ) {
87		- return;
88		- }
89		-
90		- $( '#tables-import-format' ).val( extension );
91		- } );
92		-
93		- /**
94		- * Check, whether inputs are valid
95		- *
96		- * @since 1.0.0
97		- */
98		- $( '#tablepress-page' ).find( 'form' ).on( 'submit.tablepress', function( /* event */ ) {
99		- var import_source = $( '#row-import-source' ).find( 'input:checked' ).val(),
100		- selected_import_source_field = $( '#tables-import-' + import_source ).get(0),
101		- valid_form = true,
102		- import_type = $( '#row-import-type' ).find( 'input:checked' ).val();
103		-
104		- /* the value of the selected import source field must be set/changed from the default */
105		- if ( selected_import_source_field.defaultValue === selected_import_source_field.value ) {
106		- $( selected_import_source_field )
107		- .addClass( 'invalid' )
108		- .one( 'change', function() { $(this).removeClass( 'invalid' ); } )
109		- .focus().select();
110		- valid_form = false;
111		- }
112		-
113		- /* if replace or append is selected, a table must be selected */
114		- if ( 'replace' === import_type || 'append' === import_type ) {
115		- if ( '' === $( '#tables-import-existing-table' ).val() ) {
116		- $( '#row-import-type' )
117		- .one( 'change', 'input', function() { $( '#tables-import-existing-table' ).removeClass( 'invalid' ); } );
118		- $( '#tables-import-existing-table' )
119		- .addClass( 'invalid' )
120		- .one( 'change', function() { $(this).removeClass( 'invalid' ); } )
121		- .focus().select();
122		- valid_form = false;
123		- }
124		- }
125		-
126		- if ( ! valid_form ) {
127		- return false;
128		- }
129		- // at this point, the form is valid and will be submitted
130		- } );
131		-
132		- /**
133		- * Remove form validation check if "Import from WP-Table Reloaded" button is clicked
134		- *
135		- * @since 1.0.0
136		- */
137		- $( '#tablepress-page' ).find( '#submit_wp_table_reloaded_import' ).on( 'click', function() {
138		- $( '#tablepress-page' ).find( 'form' ).off( 'submit.tablepress' );
139		-
140		- /* File upload must have a file, if Dump File is selected as the source */
141		- if ( $( '#import-wp-table-reloaded-source-dump-file' ).prop( 'checked' ) && '' === $( '#tables-import-wp-table-reloaded-dump-file' ).val() ) {
142		- $( '#tables-import-wp-table-reloaded-dump-file' )
143		- .addClass( 'invalid' )
144		- .one( 'change', function() { $(this).removeClass( 'invalid' ); } )
145		- .focus().select();
146		- return false;
147		- }
148		-
149		- /* At least one checkbox must be check, to have something imported */
150		- if ( ! $( '#import-wp-table-reloaded-tables' ).prop( 'checked' ) && ! $( '#import-wp-table-reloaded-css' ).prop( 'checked' ) ) {
151		- alert( tablepress_import.error_wp_table_reloaded_nothing_selected );
152		- return false;
153		- }
154		-
155		- } );
156		-
157		-} );
	16	+initializeReactComponent(
	17	+ 'tablepress-import-screen',
	18	+ <Screen />
	19	+);