add api key settings page
This commit is contained in:
parent
2b135c3d6f
commit
62a68df686
|
@ -21,8 +21,77 @@
|
|||
*
|
||||
* @see https://developer.wordpress.org/reference/functions/register_block_type/
|
||||
*/
|
||||
add_action( 'init', 'create_block_matchplay_block_init' );
|
||||
function create_block_matchplay_block_init(): void {
|
||||
register_block_type_from_metadata( __DIR__ . '/build' );
|
||||
}
|
||||
|
||||
add_action( 'init', 'create_block_matchplay_block_init' );
|
||||
|
||||
add_action( 'admin_init', 'matchplay_register_settings' );
|
||||
function matchplay_register_settings() {
|
||||
register_setting( 'matchplay', 'matchplay_options' );
|
||||
|
||||
add_settings_section(
|
||||
'matchplay',
|
||||
'',
|
||||
'',
|
||||
'matchplay'
|
||||
);
|
||||
|
||||
add_settings_field(
|
||||
'matchplay_field_api_key',
|
||||
'API Key',
|
||||
'matchplay_field_api_key_callback',
|
||||
'matchplay',
|
||||
'matchplay',
|
||||
['label_for' => 'matchplay_field_api_key']
|
||||
);
|
||||
}
|
||||
|
||||
function matchplay_field_api_key_callback( $args ) {
|
||||
$options = get_option( 'matchplay_options' );
|
||||
?>
|
||||
<input
|
||||
type="text"
|
||||
name="matchplay_options[matchplay_field_api_key]"
|
||||
value="<?= $options["matchplay_field_api_key"] ?? "" ?>" />
|
||||
<?php
|
||||
}
|
||||
|
||||
|
||||
add_action( 'admin_menu', 'matchplay_options_page' );
|
||||
function matchplay_options_page() {
|
||||
add_options_page(
|
||||
'Matchplay Settings',
|
||||
'Matchplay Settings',
|
||||
'manage_options',
|
||||
'matchplay',
|
||||
'matchplay_settings_page_html'
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
function matchplay_settings_page_html() {
|
||||
// check user capabilities
|
||||
if ( ! current_user_can( 'manage_options' ) ) return;
|
||||
|
||||
if ( isset( $_GET['settings-updated'] ) ) {
|
||||
add_settings_error( 'matchplay_messages', 'matchplay_message', 'Settings saved', 'updated' );
|
||||
}
|
||||
|
||||
settings_errors( 'matchplay_messages' );
|
||||
?>
|
||||
|
||||
<div class="wrap">
|
||||
<h1><?= esc_html( get_admin_page_title() ) ?></h1>
|
||||
<form action="options.php" method="post">
|
||||
<?php
|
||||
settings_fields( 'matchplay' );
|
||||
do_settings_sections( 'matchplay' );
|
||||
submit_button( 'Save' );
|
||||
?>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
}
|
||||
|
|
54
src/edit.js
54
src/edit.js
|
@ -12,16 +12,50 @@ import './editor.scss';
|
|||
* @return {WPElement} Element to render.
|
||||
*/
|
||||
export default function Edit( { attributes, setAttributes } ) {
|
||||
const [apiData, setApiData] = useState(null);
|
||||
const [standings, setStandings] = useState(null);
|
||||
const [players, setPlayers] = useState(null);
|
||||
|
||||
|
||||
function fetchTournamentData() {
|
||||
let url = `https://matchplay.events/data/tournaments/${attributes.tournament_id}/standings`;
|
||||
fetch(url)
|
||||
const headers = {
|
||||
"Authorization": `Bearer ${attributes.matchplay_api_key}`,
|
||||
"Content-Type": "application/json",
|
||||
"Accept": "application/json",
|
||||
};
|
||||
|
||||
const tournamentUrl = new URL(`https://next.matchplay.events/api/tournaments/${attributes.tournament_id}`);
|
||||
const standingsUrl = new URL(`https://next.matchplay.events/api/tournaments/${attributes.tournament_id}/standings`);
|
||||
|
||||
const params = {
|
||||
"includePlayers": "1",
|
||||
"includeArenas": "0",
|
||||
"includeBanks": "0",
|
||||
"includeScorekeepers": "0",
|
||||
"includeSeries": "0",
|
||||
"includeLocation": "1",
|
||||
"includeRsvpConfiguration": "0",
|
||||
"includeParent": "1",
|
||||
"includePlayoffs": "1",
|
||||
"includeShortcut": "0",
|
||||
};
|
||||
Object.keys(params).forEach(key => tournamentUrl.searchParams.append(key, params[key]));
|
||||
|
||||
fetch(tournamentUrl, {method: "GET", headers})
|
||||
.then(response => response.json())
|
||||
.then(response => {
|
||||
let players = { ...response };
|
||||
setAttributes( { players: players } );
|
||||
setPlayers(players);
|
||||
console.log(players);
|
||||
})
|
||||
.catch(err => console.error( err ));
|
||||
|
||||
fetch(standingsUrl, {method: "GET", headers})
|
||||
.then(response => response.json())
|
||||
.then(response => {
|
||||
let newData = { ...response };
|
||||
setAttributes( { data: newData } );
|
||||
setApiData(newData);
|
||||
setAttributes( { standings: newData } );
|
||||
setStandings(newData);
|
||||
console.log(newData);
|
||||
})
|
||||
.catch(err => console.error( err ));
|
||||
|
@ -42,7 +76,7 @@ export default function Edit( { attributes, setAttributes } ) {
|
|||
<div { ...useBlockProps() }>
|
||||
<p>Results for tournament id { attributes.tournament_id }</p>
|
||||
<button onClick={() => fetchTournamentData()}>Fetch Results</button>
|
||||
{apiData && (
|
||||
{attributes.players && attributes.standings && (
|
||||
<>
|
||||
<table id="tournament-results-table">
|
||||
<thead>
|
||||
|
@ -53,12 +87,12 @@ export default function Edit( { attributes, setAttributes } ) {
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{Object.keys(apiData).map((player, i) => {
|
||||
{Object.keys(attributes.standings).map((player, i) => {
|
||||
return (
|
||||
<tr key={player}>
|
||||
<td>{apiData[i].position}</td>
|
||||
<td>{apiData[i].name}</td>
|
||||
<td>{apiData[i].points}</td>
|
||||
<td>{attributes.standings[i].position}</td>
|
||||
<td>{attributes.players.find(p => p.player_id === attributes.standings[i].player_id).name}</td>
|
||||
<td>{attributes.standings[i].points}</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
|
|
Loading…
Reference in New Issue