Hello !
Pour les besoins de mon design, je suis en train d’essayer d’afficher une liste Google Tasks spécifique avec des cases à cocher.
Rien de fou au premier abord, sauf que j’ai passé une journée entière à réussir à afficher cette liste sur une page web ^^ (mes connaissances en javascript étant moyennes).
Bref maintenant ça fonctionne sur mon fichier HTML, c’est déjà bien !
Sauf que, ça aurait été trop beau de copier mon code et le mettre dans mon « texte/html » sur mon design.
Du coup je me demandais s’il était possible de mettre ce code dans un widget, voire… dans un plugin !
J’ai suivi le début du tuto de Sylvain (dispo ici) sans l’appliquer encore.
Est-ce que ça intéresserait des gens d’avoir ce plugin ?
Est-ce qu’il n’y a pas un moyen plus simple que le développement d’un plugin pour arriver à mes fin (en HTML tout mon code tient sur 1 page, avec les API call et l’affichage etc.)
En tout cas, dans un premier temps SI jamais je me lance à créer le plugin, ça sera du super basique : vous aurez 3 champs à remplir (Client ID, clé API, Liste à afficher), valider la visibilité et l’activation des tâches, et ça vous l’affichera selon le modèle que j’aurai créé. Je ne me vois pas encore gérer la gestion de l’affichage de plusieurs listes avec options type afficher les tâches réalisées etc. (pour le moment en tout cas).
Voilà voilà, je peux vous partager mon code si vous voulez, si j’arrive à trouver une solution plus simple je l’adopterais, mais je peux toujours partager mon code avec plaisir si ça peut intéresser quelqu’un, ou si quelqu’un veut m’aider à faire ça
Salut !
Alors désolé j’avais vu ton message, j’ai tenté mais depuis le reste s’est chamboulé.
Effectivement je n’y avais pas pensé, mais en le faisant j’ai EXACTEMENT le même résultat.
Je peux mettre une capture d’écran même si je ne pense pas que ça aide beaucoup.
Et je n’arrive pas à exécuter un debug correctement
J’ai donc une belle base qui permet de créer des objets en tant que listes, et d’y mettre les paramètres nécessaires.
Ca m’affiche bien un bloc sur le Dashboard, vide avec juste le nom de ma commande.
Par contre là je bloque complet.
Je pourrais tenter en PHP, mais niveau code j’ai du mal à aborder l’API (j’ai regardé dans le code de CloudSyncPro qui m’a donné quelques pistes).
Puis je me suis dit que c’est vraiment trop bête. J’ai un fichier .html qui contient le HTML et le Javascript fonctionnel, il doit bien y avoir un moyen de charger mon Javascript, et de lui faire ajouter des
dans mon bloc sur le Dashboard non ?
Je suis perdu -_- pourtant ça m’amuse bien de créer ça et de mettre le nez dans le code
Si quelqu’un a une idée
Voici mon fichier .html qui fonctionne sur serveur :
<!--Add buttons to initiate auth sequence and sign out-->
<button id="authorize_button" style="display: none;">Authorize</button>
<button id="signout_button" style="display: none;">Sign Out</button>
<pre id="content" style="white-space: pre-wrap;">
<ul id="tasks"></ul>
</pre>
<pre id="tasks" style="white-space: pre-wrap;"></pre>
<script type="text/javascript">
// Client ID and API key from the Developer Console
var CLIENT_ID = 'MON_CLIENT_ID';
var API_KEY = 'MA_CLE_API';
// Array of API discovery doc URLs for APIs used by the quickstart
var DISCOVERY_DOCS = ["https://www.googleapis.com/discovery/v1/apis/tasks/v1/rest"];
// Authorization scopes required by the API; multiple scopes can be
// included, separated by spaces.
var SCOPES = "https://www.googleapis.com/auth/tasks.readonly";
var authorizeButton = document.getElementById('authorize_button');
var signoutButton = document.getElementById('signout_button');
/**
* On load, called to load the auth2 library and API client library.
*/
function handleClientLoad() {
gapi.load('client:auth2', initClient);
}
/**
* Initializes the API client library and sets up sign-in state
* listeners.
*/
function initClient() {
gapi.client.init({
apiKey: API_KEY,
clientId: CLIENT_ID,
discoveryDocs: DISCOVERY_DOCS,
scope: SCOPES
}).then(function () {
// Listen for sign-in state changes.
gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);
// Handle the initial sign-in state.
updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
authorizeButton.onclick = handleAuthClick;
signoutButton.onclick = handleSignoutClick;
}, function(error) {
appendPre(JSON.stringify(error, null, 2));
});
}
/**
* Called when the signed in status changes, to update the UI
* appropriately. After a sign-in, the API is called.
*/
function updateSigninStatus(isSignedIn) {
if (isSignedIn) {
authorizeButton.style.display = 'none';
signoutButton.style.display = 'block';
listTaskLists();
} else {
authorizeButton.style.display = 'block';
signoutButton.style.display = 'none';
}
}
/**
* Sign in the user upon button click.
*/
function handleAuthClick(event) {
gapi.auth2.getAuthInstance().signIn();
}
/**
* Sign out the user upon button click.
*/
function handleSignoutClick(event) {
gapi.auth2.getAuthInstance().signOut();
}
/**
* Append a pre element to the body containing the given message
* as its text node. Used to display the results of the API call.
*
* @param {string} message Text to be placed in pre element.
*/
function appendPre(message) {
}
/**
* Print task lists.
*/
function listTaskLists() {
gapi.client.tasks.tasks.list({
'maxResults': 10,
"tasklist": "MA_LISTE_DE_TACHES",
"showCompleted": false,
"showDeleted": false,
"showHidden": false
}).then(function(response) {
var taskLists = response.result.items;
if (taskLists && taskLists.length > 0) {
for (var i = 0; i < taskLists.length; i++) {
var taskList = taskLists[i];
var pre = document.getElementById('tasks');
var li = document.createElement('li');
li.setAttribute('id', taskList.id)
var textContent = document.createTextNode(taskList.title + '\n');
var checkbox = document.createElement('input');
checkbox.type = "checkbox";
checkbox.name = taskList.title;
checkbox.id = taskList.id;
checkbox.onclick = function(event) {
var thisTaskId = this.id;
if (this.checked) {
gapi.client.tasks.tasks.patch({'tasklist': "MA_LISTE_DE_TACHES",'task': thisTaskId, "resource": {
"status": "completed"
}}, thisTaskId).then(function (response) {document.getElementById("tasks").innerHTML = "";listTaskLists();});
}
else {
}
};
var label = document.createElement('label')
label.htmlFor = taskList.id;
label.appendChild(document.createTextNode(' ' + taskList.title));
li.appendChild(checkbox);
li.appendChild(label);
/* li.appendChild(textContent); */
pre.appendChild(li);
/* oneTask = '<input type="checkbox" id="horns" name="horns"> <label>' + taskList.title + '</label>'
document.getElementById('tasks').innerHTML = oneTask; */
}
} else {
appendPre('No task found.');
}
});
}
</script>
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>
Je pensais plus a un screen du code fonctionnel sur une page html.
Si tu fais un plugin je pense que ce serait mieux de faire une commande info par tâche et une commande action pour décocher/cocher avec un tâche cron qui ferais la mise à jour de la liste en supprimant/créant les commandes
Ensuite dans le code du widget tu l’affiche en liste/tableau avec le bouton devant pour cocher/décocher
Aloooors voilà ce que ça donne sur mon fichier HTML de test sur mon serveur, j’ai fait aucun CSS pour le moment, ça sera l’étape finale :
En suivant le tuto ci-dessus je me suis dit qu’il fallait passer par du PHP, j’ai essayé de m’y mettre mais même le Quickstart ne fonctionnait pas.
A la base je pensais créer une commande avec le résultat HTML complet, mais effectivement passer une tâche par commande ça doit être faisable.
Si déjà j’arrive à mettre l’autorisation de l’API dans la configuration du plugin, ce sera bien.
Ensuite pour créer une commande par tâche ça devrait pouvoir le faire normalement. Par contre pour créer la coche c’est une autre histoire…
L’idée était de coder une véritable checkbox mais y’a d’autres possibilités dont par exemple un widget qui affiche une image de case vide à 0 et une case cochée à 1 plus simplement
Super merci beaucoup !
Je vais retrousser mes manches et tenter de m’y remettre, je vous dit si ça marche ou si je bloque
Bien sur, si ça fonctionne je fais une documentation propre et je met ça sur le market.
Aller c’est parti. C’est mon premier Github officiel, j’ai pourtant lu des tonnes d’articles et regardé des tonnes de vidéos, comme d’habitude je bosse seul je ne m’en suis jamais servi. Donc l’initialisation d’un projet qui est déjà présent dans mon ordi était un peu… laborieuse hahaha.
Hello !
Je pensais à toi hier !
Mon mois de janvier a été beaucoup trop chargé au travail du coup je n’ai pas pu voir une seule ligne de code.
J’ai prévu de m’y remettre doucement à partir de la semaine prochaine !
Salut !
Je suis passé par cette page : Method: tasklists.list | Google Tasks API | Google Developers
J’ai utilisé leur exemple sur la droite, dans les résultats il te donne la liste de tes listes de tâches avec les ID.
A la base c’était le script d’exemple que j’utilisais qui permettait de récupérer les listes et que j’ai modifié pour partir d’une liste donnée et récupérer les tâches.
J’ai un peu avancé, j’ai déjà codé une partie permettant de remonter les listes présente dans le compte pour qu’ils soit sélectionnable dans l’équipement (ça évite de chercher l’id).
Faut juste que je voie comment faire pour générer le token.
Mais j’ai pas les droits pour faire des comits sur ton github, du coup c’est sur mon pc
