Code_Manager_Tabs.php — Code Manager 1.0.12

code-manager / Code_Manager / Code_Manager_Tabs.php

code-manager / Code_Manager Last commit date

Code_Manager.php 4 years ago Code_Manager_Dashboard.php 4 years ago Code_Manager_Export.php 4 years ago Code_Manager_Form.php 4 years ago Code_Manager_Import.php 4 years ago Code_Manager_Import_File.php 4 years ago Code_Manager_List.php 4 years ago Code_Manager_List_View.php 4 years ago Code_Manager_Model.php 4 years ago Code_Manager_Preview.php 4 years ago Code_Manager_Settings.php 4 years ago Code_Manager_Tabs.php 4 years ago Message_Box.php 4 years ago WP_List_Table.php 4 years ago

Code_Manager_Tabs.php

189 lines

1	<?php
2
3	namespace Code_Manager {
4
5	/**
6	* Class Code_Manager_Tabs
7	*
8	* Builds the Code Manager tab mode IDE
9	*
10	* @author Peter Schulz
11	* @since 1.0.0
12	*/
13	class Code_Manager_Tabs {
14
15	protected $wpnonce;
16	protected $wpnonce_get_code;
17
18	/**
19	* Code_Manager_Tabs constructor
20	*
21	* Creates a number of wpnonces needed to authorize ajax calls
22	*
23	* @since 1.0.0
24	*/
25	public function __construct() {
26	$this->wpnonce = wp_create_nonce( 'code-manager-' . Code_manager::get_current_user_login() );
27	$this->wpnonce_get_code = wp_create_nonce( 'code-manager-get-code' . Code_manager::get_current_user_login() );
28	}
29
30	/**
31	* Shows the tab mode IDE
32	*
33	* JavaScript depending on server variables not available in the browser are added here. Generic JavaScript
34	* code is added as a script file.
35	*
36	* @since 1.0.0
37	*/
38	public function show() {
39	?>
40	<script type="text/javascript">
41	var wpnonce = '<?php echo $this->wpnonce; ?>';
42	var wpnonce_get_code = '<?php echo $this->wpnonce_get_code; ?>';
43	var code_manager_code_groups = [];
44	<?php
45	$code_manager_tab_class = CODE_MANAGER_TAB_CLASS;
46	$code_manager_tab = new $code_manager_tab_class();
47	$code_types = $code_manager_tab->get_code_types();
48	foreach ( $code_types as $code_type_group => $value ) {
49	echo 'code_manager_code_group = [];';
50	foreach ( $value as $code_type => $code_type_label ) {
51	echo "code_manager_code_group['{$code_type}'] = '{$code_type_label}';";
52	}
53	echo "code_manager_code_groups['{$code_type_group}'] = code_manager_code_group;";
54	}
55	?>
56	function filter_code_list() {
57	jQuery("#code_manager_code_list > option").each(function() {
58	showCode = true;
59	if (jQuery("#code_manager_filter_code_type").val()!=="") {
60	if (jQuery("#code_manager_filter_code_type").val()!==jQuery(this).data("type")) {
61	jQuery(this).hide();
62	showCode = false;
63	}
64	}
65	if (showCode && jQuery("#code_manager_filter_code_name").val()!=="") {
66	if (!jQuery(this).data("name").toLowerCase().includes(jQuery("#code_manager_filter_code_name").val().toLowerCase())) {
67	jQuery(this).hide();
68	showCode = false;
69	}
70	}
71	if (showCode) {
72	jQuery(this).show();
73	}
74	});
75	}
76	</script>
77	<div class="wrap">
78	<table cellspacing="0" cellpadding="0" border="0" width="100%">
79	<tr>
80	<td>
81	<h1 class="wp-heading-inline">
82	<span>
83	<span class="cm_page_title">
84	<?php echo CODE_MANAGER_H1_TITLE . ' - tab mode'; ?>
85	</span>
86	<?php
87	if ( ! Code_Manager_Dashboard::dashboard_enabled() ) {
88	?>
89	<a href="?page=<?php echo CODE_MANAGER_MENU_SLUG; ?>"
90	title="Switch to list mode (standard WordPress list view)">
91	<span class="material-icons cm_menu_title">menu</span></a>
92	<a id="code_manager_new" href="javascript:void(0)">
93	<span class="material-icons cm_menu_title"
94	title="Add new code">add_circle_outline</span></a>
95	<a id="code_manager_open" href="javascript:void(0)">
96	<span class="material-icons cm_menu_title"
97	title="Open existing code">arrow_circle_down</span></a>
98	<a href="<?php echo CODE_MANAGER_HELP_URL; ?>" target="_blank"
99	title="Plugin help - opens in a new tab or window">
100	<span class="material-icons cm_menu_title">help_outline</span></a>
101	<?php
102	}
103	?>
104	</span>
105	</h1>
106	</td>
107	<td style="text-align:right;padding-right:10px;padding-top:4px">
108	<a id="disable_preview"
109	href="javascript:void(0)"
110	class="material-icons cm_menu_title"
111	style="text-decoration:none"
112	title="Turn of preview mode for all code IDs"
113	>visibility_off</a>
114	</td>
115	</tr>
116	</table>
117	<style>
118	#code_manager_code_list {
119	background-image: none;
120	min-width: 100%;
121	width: 100%;
122	max-width: 100%;
123	font-family: monospace;
124	font-size: 90%;
125	}
126	#code_manager_code_list option {
127	width: 100%;
128	}
129	</style>
130	<div id="code_manager_open_frame" style="display: none; background-color: transparent;">
131	<p style="margin-top:0">Hold ctrl key to select multiple code blocks, double click to select single code block</p>
132	<div style="margin-right:-2px">
133	<span>
134	<input type="text" placeholder="Filter code name" id="code_manager_filter_code_name" onkeyup="filter_code_list()" autocomplete="off"/>
135	</span>
136	<span style="float: right">
137	<select id="code_manager_filter_code_type" onchange="filter_code_list()"></select>
138	</span>
139	</div>
140	<div>
141	<select id="code_manager_code_list" size="14" multiple="multiple">
142	<option>Loading data...</option>
143	</select>
144	</div>
145	</div>
146	<div id="code_manager_taskbar_tabmode" class="nav-tab-wrapper"></div>
147	<div id="code_manager_workspace_tabmode"></div>
148	<div class="cm_tab_mode_intro">
149	<p>
150	<i class="fas fa-hand-point-right"></i>
151	Press the "add new code" icon in the toolbar to start writing new code
152	</p>
153	<p>
154	<i class="fas fa-hand-point-right"></i>
155	Press the "open existing code" icon in the toolbar to change existing code
156	</p>
157	<div class="cm_tab_mode_intro_close">
158	<a href="#" onclick="javascript:jQuery('.cm_tab_mode_intro').remove()">
159	<i class="fas fa-times-circle"></i>
160	</a>
161	</div>
162	</div>
163	</div>
164	<?php
165	}
166
167	/**
168	* Get code types
169	*
170	* Code types are organized in group to allow grouping in list boxes.
171	*
172	* @since 1.0.0
173	*
174	* @return string[][]
175	*/
176	public function get_code_types() {
177	return [
178	'Shortcodes' => [
179	'php shortcode' => 'PHP Shortcode',
180	'javascript shortcode' => 'JavaScript Shortcode',
181	'css shortcode' => 'CSS Shortcode',
182	'html shortcode' => 'HTML Shortcode'
183	],
184	];
185	}
186
187	}
188
189	}