Comment faire un compteur/calculateur à plusieurs résultats?

Fermé
zguguy - Modifié par baladur13 le 27/01/2017 à 09:35
 zguguy - 18 mars 2017 à 17:13
Bonjour,





Je n'ai pas les termes techniques du webmaster étant autodidacte mais je cherche à réaliser pour mon site un petit programme permettant de copier/coller une recette de cuisine (inventée ou trouvée sur le web) afin de décortiquer les aliments automatiquement et les classer selon des catégories spécifiques.

En gros, je veux faire ça, à ma sauce: http://www.monmenu.fr/s/calculer-calories.html


J'ai déjà extrait le code source qui m'intéresse avec un exemple :

<textarea id="content"
        name="content" rows="15" class="w100 mod"
        style="vertical-align: middle;" />5 pommes de terre à chair ferme 
225 g de petits pois frais 
1 boîte de maïs 
3 carottes 
6 saucisses de Francfort 
2 tranches de jambon</textarea>
        <br/>

       <strong>2.</strong> Précisez les portions :
       <select name="portions" id="portions" >
        <option id="1" value="1">1</option>
        <option id="2" value="2">2</option>
        <option id="3" value="3">3</option>
        <option id="4" value="4">4</option>
        <option id="5" value="5">5</option>
        <option id="6" value="6">6</option>
        <option id="7" value="7">7</option>
        <option id="8" value="8">8</option>
        <option id="9" value="9">9</option>
        <option id="10" value="10">10</option>
        <option id="11" value="11">11</option>
        <option id="12" value="12">12</option>       
       </select>
        <br/><br/>


      </div>


     <div class="mod">
      <form id="caloriesForm"  method="post"
        action="calculer-calories.html">
        <input type="hidden" id="hiddenContent" name="content" />    
        <input type="hidden" id="hiddenPortions" name="portions" />

       <input type="image" class="center ml2" src=""quot;"quot;"quot;http://static.monmenu.fr/s/img/calculer-calories.png" alt="calculator calorie, calcul calorique" onclick='fillContent();'>
      </form>    




      <h2>Valeur calorique  </h2>
      <div style="min-height:250px;padding:5px;">

       <a class="displayInline" style="margin-left:20px;" href="" > <img class="center" src=""quot;"quot;"quot;http://static.monmenu.fr/s/img/couper-blog.png"/></a><br/><br/>
       <div id="">

       <ul id="split" style="margin-left:30px;">
        <li id="kcal"><h3>Kcal</h3>
        <div >
         821 
        </div>
        </li>
        <li id="ig"><h3>IG</h3>
        <div >
         35 
        </div>
        </li>
        <li id="proteine"><h3>Protéines</h3>

        <div >
         33 gr
        </div>
        </li>
        <li id="lipide"><h3>Lipides</h3>
        <div >
         46 gr
        </div>

        </li>
        <li id="glucide" ><h3>Glucides</h3>

        <div >
         69 gr
        </div>
        </li>
        <li id="portion">
         <h3>Portions</h3>
         <div>
          1 x 749 gr
         </div>
        </li>
       </ul>

        <p style='clear:both; margin-left: 20px;text-align:left; font-size:12px;font-family:"Lucida Grande","Lucida Sans Unicode","Trebuchet MS",Verdana,Helvetica,sans-serif; '>
        <b>Les ingrédients:</b><br/><br/>       
         6.0     <a style="text-decoration:none;color:#675437;" href="http://www.monmenu.fr/s/aliments/Saucisse-de-Francfort-6520859" rel="nofollow noopener noreferrer" target="_blank">Saucisse de Francfort</a> <span style="font-size:10px;">452Kcal</span><br/>5.0     <a style="text-decoration:none;color:#675437;" href="http://www.monmenu.fr/s/aliments/Pommes-de-terre-425993" rel="nofollow noopener noreferrer" target="_blank">Pommes de terre</a> <span style="font-size:10px;">-4Kcal</span><br/>2.0     <a style="text-decoration:none;color:#675437;" href="http://www.monmenu.fr/s/aliments/Tranche-pain-de-mie-1998901" rel="nofollow noopener noreferrer" target="_blank">Tranche pain de mie</a> <span style="font-size:10px;">194Kcal</span><br/>3.0     <a style="text-decoration:none;color:#675437;" href="http://www.monmenu.fr/s/aliments/Carotte-360453" rel="nofollow noopener noreferrer" target="_blank">Carotte</a> <span style="font-size:10px;">79Kcal</span><br/>225.0  gr  <a style="text-decoration:none;color:#675437;" href="http://www.monmenu.fr/s/aliments/Petits-pois-carottes-2588715" rel="nofollow noopener noreferrer" target="_blank">Petits pois carottes</a> <span style="font-size:10px;">105Kcal</span><br/>1.0     <a style="text-decoration:none;color:#675437;" href="http://www.monmenu.fr/s/aliments/Fecule-de-mais-7635228" rel="nofollow noopener noreferrer" target="_blank">Fécule de maïs</a> <span style="font-size:10px;">-4Kcal</span><br/>
        </p>

       </div>






       <br/>
      </div> 


Maintenant j'aimerai que l'on m'aiguille car mes compétences s'arrêtent ici.
Comment réaliser ma base de donnée permettant la reconnaissance automatique des ingrédients copier dans le cadre texte?
Comment créer un calcul spécifique pour certain ingrédient?
Comment cumuler et classer les autres ingrédients?

Si une âme charitable pouvait m'aider à comprendre le fonctionnement de ce calculateur et me permettre de réaliser le mien, je lui en serai reconnaissant :)

Merci d'avance,
Hugues

9 réponses

Salut,
HTML est un langage de description et présentation. Il est complété par CSS pour "styler"(ajouter/modifier des paramètres) et ainsi donner l'apparence que l'on veux à la page.
IL EST IMPORTANT POUR LES PAGES WEB DE BIEN FAIRE LA Différence ENTRE LE CONTENU ET LA Présentation! et de les séparer dans leur création comme utilisation (même s'ils ne serons pas séparés pour le résultat final: ce qui s'affiche dans le navigateur).

C'est le prioncipe des pages dynamiques.

Pour répondre précisément à vos questions:
faire des calculs est impossible par HTML puisque cela décrit uniquement les contenus de la page(c'est ce quo'n appelle une page statique si uniquement HTML).

La programmation seule permet de manipuler des données(informations en informatique). Les opérations arithmétiques sont à la base de la programmation avec les mathématiques booléennes(plus simple encore que 1+1=2 car en base 2 il n'y a que 0 et 1 comme valeurs(équivalent l'humain pour vrai/faux) ). C'est par exeemple le cas de javascript qui permets d'effectuer des calculs mathématiques sur l'ordinateur de l'utilisateur.

"Comment réaliser ma base de donnée permettant la reconnaissance automatique des ingrédients copier dans le cadre texte? "

Justement créez la base de données elle a des outils(un langage complet) pour trier, filtrer ou faire des opérations mathématiques. Cependant une base de données ne peut jamais être accessible directement par la page web pour des raisons de sécuroté.
Elle est donc accessible par un programme s'effectuant sur le serveur et écris avec le langage PHP(par exemple).


Si vos cherchez à être aiguillés:
apprenez la programmation(n'importe quel langage fonctionne de la même façon en gros, leur écriture/syntaxe diffère ainsi que leur champ d'application).

LE principe des pages dynamiques est décrit ici:
https://www.commentcamarche.net/contents/221-reseaux-architecture-client-serveur-a-3-niveaux

Les bases de données utilise le langage SQL avec des variantes selon le SGBD choisit. C'est un langage assez intuitif et simple(environ 500 instructions utiles simplement pour tout faire).

Il existe des cours gratuit (autodidaxie) qui permettent d'apprendre soit l'une ou l'autre des technologies soit l'ensemble et son fonctionnement global.
1