לוגו אתר Fresh          
 
 
  אפשרות תפריט  ראשי         אפשרות תפריט  מבזקים     אפשרות תפריט  צור קשר     חץ שמאלה ‎print ‎"Hello World!"; if‎ ‎not rules.‎know ‎then rules.‎read(); חץ ימינה  

לך אחורה   לובי הפורומים > מחשבים > תכנות ובניית אתרים
שמור לעצמך קישור לדף זה באתרי שמירת קישורים חברתיים
תגובה
 
כלי אשכול חפש באשכול זה



  #2  
ישן 10-09-2014, 14:15
צלמית המשתמש של ShoobyD
  ShoobyD מנהל ShoobyD אינו מחובר  
מנהל משבראש, בלשנות, תכנות ויהדות
 
חבר מתאריך: 04.06.06
הודעות: 32,988
שלח הודעה דרך MSN אל ShoobyD Facebook profile LinkedIn profile Follow me...
בתגובה להודעה מספר 1 שנכתבה על ידי שם_משתמש שמתחילה ב "עזרה בבניית דף HTML פשוט"

אין צורך לטעון את כל הדף מחדש.
אם מדובר בטקסט קבוע מראש, אפשר לערוך את השינוי באמצעות קוד ג׳אווה־סקריפט פשוט, שרץ עם טיימר.
גם אם מדובר על טקסט מתחדש, שצריך לטעון מהשרת כל פעם, גם אז אין צורך לטעון מחדש את כל הדף, אלא רק את הטקסט המתחלף, ולעדכן דינאמית את הדף, בטכניקה שנקראת AJAX, שהיא בעיקרה ג׳אווה־סקריפט עם יכולות ניהול בקשות HTTP.
בפייסבוק, לדוגמא, כשאתה פותח חלונית של התראות, או כשאתה מתכתב בצ׳אט, הדף לא נטען מחדש בכל פעם, אלא רק הקטעים הרלוונטיים; הטעינה היא אסינכרונית.

על AJAX, עם דוגמאות:
http://www.w3schools.com/ajax/

תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #6  
ישן 11-09-2014, 10:22
  שם_משתמש שם_משתמש אינו מחובר  
 
חבר מתאריך: 02.06.03
הודעות: 1,224
אני עובד עם בקר ארדיאנו , שמחוברים אליו 2 חיישני תנועה
בתגובה להודעה מספר 5 שנכתבה על ידי MatiM שמתחילה ב "אכן יהיה עדיף אם תביא את הקוד..."

כך שאם מישהו עובד מצד ימין צד שמאל - אני יודע שהוא נכנס ולהפך
לא משהו מסובך
קוד:
void loop () {//start of the loop // listen for incoming clients EthernetClient client = server.available(); if (client) {//start server if 1 boolean currentLineIsBlank = true; while (client.connected()) {//start while 1 if (client.available()) {//start if 2 char c = client.read(); // see if HTTP request has ended with blank line if (c == '\n' && currentLineIsBlank) {//start if 3 // send a standard http response header client.println("HTTP/1.1 200 OK"); client.println("Content-Type: text/html"); client.println(); //meta-refresh page every 1 seconds client.println("<HTML>"); client.print(F("<HEAD>")); client.print(F("<meta http-equiv=\"refresh\" content=\"1\">")); client.print(F("<TITLE />My Sensor</title>")); client.print(F("</head>")); client.println(F("<BODY>")); client.print(F("<span font-weight:bold>Head of the page</span> ")); client.println(F("<br />")); client.print(F("Version is - ")); client.print(F(__FILE__)); client.println(F("<br />")); client.print(F("Today is - ")); printDate(); HttpPrintDate(client); client.println(F("<br />")); client.println(F("Work mode is- ")); OC=Operation_cheak(); if (OC==1) { client.println(F("<span style=color:blue;font-weight:bold>Manual</span>")); } else if(OC==0) { client.println(F("<span style=color:blue;font-weight:bold>Automatic</span>")); } client.print(F("<br />")); client.println(F("LOG count is - ")); client.print(t); client.println(" "); client.println("LOG time:"); client.print(LogMonthDay); client.print("/"); client.print(LogMonth); client.print("/"); client.print(LogYear); client.print(" "); client.print(LogHour); client.print(":"); if (LogMinute<10) { client.print("0"); } client.print(LogMinute); client.print(":"); if(LogSecond<10) { client.print("0"); } client.println(LogSecond); client.print("<br />"); if (OC==1) {//start of OC=1 //work manual Serial.println("oc=1 , manual"); client.print("<br />"); ML=Manual_button(); if (ML==1) {//start of ml=1 client.println("<span style=color:green;font-weight:bold>Green ON</span>"); client.print("<br />"); BlinkLed(); printDate(); HttpPrintDate(client); }//end of ML=1 else { if (ML==2) {//start of ML=2 client.println("<span style=color:red;font-weight:bold>Red ON</span>"); client.print("<br />"); BlinkLed(); printDate(); HttpPrintDate(client); }//end of ML=2 } }//end of OC=1 else {//start of else oc if (OC==0) {//start of OC=0 - autoPIR client.print("<br />"); d=pir_cheak(); client.println("The direction is - "); if (PIRDirection==true) { client.println(" Enter->Exit"); } else if (PIRDirection==false) { client.println(" Exit<-Enter"); } client.println("<br /"); if (d==0) {//start of d=0 no move client.print("All Good - No Movement"); client.print("<br />"); }//end of d=0 no move else {//start of else d=1 or 2 if (d==1) {//start of d=1 client.println(F("<span style=color:green>Warning Entering The Secure Zone!</span>")); client.print("<br />"); BlinkLed(); HttpPrintDate(client); HttpPrintLog(client); }//end of d=1 else {//start of else d=2 if (d==2) {//start of d=2 client.println(F("<span style=color:red>Warning Leaving The Secure Zone!</span>")); client.print("<br />"); BlinkLed(); HttpPrintDate(client); HttpPrintLog(client); }//end of d=2 }//end of else d=2 }//end of else d=1 or 2 }//end of OC=0 }//end of else oc Serial.println ("END OF LOOP !!!"); break; } if (c == '\n') { // you're starting a new line currentLineIsBlank = true; } else if (c != '\r') { // you've gotten a character on the current line currentLineIsBlank = false; } } } // give the web browser time to receive the data delay(1); // close the connection: client.stop(); } }//end of the loop


אשמח לעזרה/כיוון

תודה ,

_____________________________________
It is nice to be importent but it's more importent to be nice

תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #7  
ישן 11-09-2014, 15:08
צלמית המשתמש של MatiM
  משתמש זכר MatiM MatiM אינו מחובר  
 
חבר מתאריך: 12.04.06
הודעות: 2,021
שלח הודעה דרך MSN אל MatiM
בתגובה להודעה מספר 6 שנכתבה על ידי שם_משתמש שמתחילה ב "אני עובד עם בקר ארדיאנו , שמחוברים אליו 2 חיישני תנועה"

רק עכשיו קלטתי על מה אתה בעצם מדבר.
עד עכשיו חשבתי שכשאתה אומר "בקר", אתה מתכוון לכל מיני שדות/כפתורים וכדומה שהם חלק מהHTML.
רק עכשיו הבנתי שאתה מתכוון לבקר-אלקטרוני של ארדואינו חחחחח.
* הנושא לא ממש קשור לפורום "בניית אתרים" *

****עידכנתי את הפוסט בסוף****

כדי לגשת למידע מהחיישנים של הבקר, אתה צריך דרך לקרוא אותם מעמוד אינטרנט.
ממה שאני מבין מהקוד שלך, אתה עובד עם סוג כלשהו של חיבור לאינטרנט עם Ethernet Shield?
מה שלא ממש ברור לי, כשאתה מוציא את המידע לclient דרך איפה אתה צופה בו ורואה את השינויים לאיזו כתובת אתה גולש? אם בכלל...?
האם אתה צריך שהגישה תהיה מכל מחשב ברשת האינטרנט, או רק דרך מחשב ספציפי שאליו מחובר הבקר?

בעיקרון, מהרגע שאתה מחובר לאינטרנט יש לך כל מיני שיטות שאתה יכול לעבוד בהן.
אתה יכול להשתמש בsocketים כדי לשלוח מידע דרך הבקר ישירות לעמוד.
אתה יכול לשלוח מידע לעמוד כלשהו (בצד שרת), על כל שינוי שמתרחש בבקר, ודרך Javascript לקרוא את העמוד ולהציג את המידע המתאים.

באיזו תדירות אתה רוצה שהמידע יתעדכן? האם הפרש של כמה שניות הוא קריטי ורלוונטי?

אני עובד עם בקר ארדואינו, אבל לא יצא לי לעבוד עם Ethernet שמחובר אליו, ולכן, אני אשמח לעזור אבל אצטרך להבין קצת יותר את הנושא ולהבין מה בדיוק אתה רוצה שיקרה.

בינתיים אתה יכול להתחיל כאן:
https://www.google.co.il/?gws_rd=ss...from+javascript



עידכון:

אני מצאתי את זה:
http://www.raywenderlich.com/38841/...perature-sensor

זה די דומה לקוד שהבאת, ולדעתי עבדת לפי מדריך כזה / דומה לו.

עכשיו אני מבין, שבעצם מה שקורה זה שדרך הבקר אתה יוצר עמוד אינטרנט בכתובת מסויימת (לפי מה שמוגדר במשתנים בקוד שלך), ואז..... כל מי שניכנס לאותה כתובת, בעצם מקבל את הפלט שיוצר הבקר. (וזה הקוד HTML שכתבת אצלך).
ולכן, עד עכשיו..כדי לראות את המידע מתעדכן, היה צריך לבצע ריפרש לעמוד כדי שהמידע ישלח מחדש עם נתונים מעודכנים.

כדי לגרום לזה לעבוד כמו ששובי הציע,
אתה פשוט צריך ליצור עמוד HTML משלך (חדש, נפרד ממה שכתבת בבקר) עם מעט קוד Javascript ובאמצעות בקשת AJAX להתחבר לכתובת של הבקר ולטעון משם את המידע לקובץ HTML הזה. ככה, המידע נטען בצורה אסינכרונית לעמוד ובעזרת טיימר פשוט, אתה יכול לקרוא שוב ושוב לאותה בקשת AJAX בכל פרק זמן שאתה מעוניין (לדוגמא, כל שניה).

אם אתה רוצה, אני יכול ליצור לך עמוד פשוט כזה לדוגמא, רק תגיד לי מה הכתובת שאליה אתה מתחבר כדי לקרוא את המידע (איפה שזה מבצע ריפרש כל שניה). אתה יכול לשלוח לי אותה בפרטי, אם אתה לא רוצה כאן.

בעיקרון, בהמשך..יהיה עדיף שתעביר רק את הערך של החיישנים (ולא את כל הפלט של הHTML), ואז דרך הAJAX תשנה את זה במקום הרצוי בדף.


כתבתי כאן לא מעט, אני יודע. חחחח
צריך קצת לנסות ולשחק עם זה כדי להבין איך זה עובד...
_____________________________________
תמונה שהועלתה על ידי גולש באתר ולכן אין אנו יכולים לדעת מה היא מכילה

תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #9  
ישן 13-09-2014, 11:56
צלמית המשתמש של MatiM
  משתמש זכר MatiM MatiM אינו מחובר  
 
חבר מתאריך: 12.04.06
הודעות: 2,021
שלח הודעה דרך MSN אל MatiM
בתגובה להודעה מספר 8 שנכתבה על ידי שם_משתמש שמתחילה ב "קודם כך תודה , הכתובת של הבקר..."

אני מקווה שהצלחתי על הניסיון הראשון ליצור לך קוד שעובד, זה קצת קשה "על עיוור".

שיניתי לך את הקוד לבקר, כך שבמקום פלט HTML הוא יפלוט פלט בפורמט JSON.

JSON זה פורמט שבאמצעותו אפשר להעביר נתונים (במקרה שלך, את הערכים מהבקר) בצורת מחרוזת (טקסט פשוט).

במקרה של הקוד שיצרתי אצלך, הוא ניראה בערך ככה:

עבור מצב אוטומטי: (oc = 0)
קוד:
{"workMode":"AUTOMATIC","direction":"Exit->Enter","status":2}


עבור מצב ידני: (oc = 1)
קוד:
{"workMode":"MANUAL","MLColor":"Red"}


כל זוג ערכים מופרד בפסיק, כשהחלק הראשון (לפני הנקודתיים) הוא שם הערך שבעזרתו אפשר לזהות את הנתון, והחלק השני (אחרי הנקודתיים) הוא הערך עצמו.

אז זה הקוד לבקר:
קוד:
void loop (){ // listen for incoming clients EthernetClient client = server.available(); if(client){ boolean currentLineIsBlank = true; while (client.connected()){ if (client.available()){ char c = client.read(); if (c == '\n' && currentLineIsBlank) { // see if HTTP request has ended with blank line // send a standard http response header client.println("HTTP/1.1 200 OK"); client.println("Content-Type: text/html"); client.println(); client.print("{"); // start JSON STRING OC = Operation_cheak(); if (OC == 1){ Serial.println("oc=1 , manual"); client.print("\"workMode\":\"MANUAL\","); ML=Manual_button(); if (ML==1){ client.print("\"MLColor\":\"Green\""); BlinkLed(); } else if (ML==2){ client.print("\"MLColor\":\"Red\""); BlinkLed(); } } else if(OC == 0){ client.print("\"workMode\":\"AUTOMATIC\","); d = pir_cheak(); if (PIRDirection==true){ client.print("\"direction\":\"Enter->Exit\""); } else if (PIRDirection==false){ client.print("\"direction\":\"Exit->Enter\""); } client.print(","); if (d==0){ client.print("\"status\":0"); } else if (d==1){ client.print("\"status\":1"); BlinkLed(); } else if (d==2){ client.print("\"status\":2"); BlinkLed(); } } client.print("}"); // end JSON STRING Serial.println ("END OF LOOP !!!"); break; } if (c == '\n'){ // you're starting a new line currentLineIsBlank = true; } else if (c != '\r'){ // you've gotten a character on the current line currentLineIsBlank = false; } } } // give the web browser time to receive the data delay(1); // close the connection: client.stop(); } }



בנוסף, תצטרך ליצור קובץ חדש (איפה שבא לך, במחשב שלך) ותקרא לו לדוגמא, mySensor.html .
(סיומת .html היא החשובה)

פתח את הקובץ לעריכה (באמצעות פנקס רשימות, כל תוכנות דומות לעריכת קוד) ותדביק את הקוד הבא:

קוד:
<!DOCTYPE html> <html> <head> <title>My Sensor</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script> $(document).ready(function(){ setInterval("readSensors()" , 1000); }); function readSensors(){ $.getJSON("http://10.0.0.25" , function(data){ if(typeof(data.workMode) != "undefined"){ $("#workMode") .html( data.workMode ); console.log(data.workMode.toLowerCase()); if(data.workMode.toLowerCase() == "automatic"){ $("#auto").show(); $("#manual").hide(); } else { $("#manual").show(); $("#auto").hide(); } } if(typeof(data.MLColor) != "undefined"){ $("#colorIndicator") .css("color" , data.MLColor) .html( data.MLColor + " ON" ); } if(typeof(data.direction) != "undefined"){ $("#direction") .html( data.direction ); } if(typeof(data.status) != "undefined"){ var statusColor = "black"; var statusText = ""; switch(data.status){ case 1: { statusColor = "green"; statusText = "Warning Entering The Secure Zone!"; break; } case 2: { statusColor = "red"; statusText = "Warning Leaving The Secure Zone!"; break; } default: { statusColor = "black"; statusText = "All Good - No Movement"; } } $("#status") .css("color" , statusColor) .html( statusText ); } }); } </script> </head> <body> <div> Work mode is- <span style="color: blue; font-weight: bold;" id="workMode">Manual / Automatic</span> </div> <!-- MANUAL --> <div id="manual"> <div id="colorIndicator" style="color: black; font-weight: bold;">Green ON / Red ON</div> </div> <!-- AUTO --> <div id="auto"> <div>The direction is - <span id="direction">Enter->Exit / Exit<-Enter</span></div> <div id="status" style="color: black;">All Good - No Movement</div> </div> </body> </html>


זהו.
אתה יכול לשמור את הקבצים,
תצרוב מחדש את הבקר ותריץ אותו.

אחרי שהבקר רץ, תיכנס לעמוד mySensor.html שיצרת, ובתקווה שהכל עובד כשורה והעמוד יצליח למצוא את המידע מהבקר שלך, אתה תראה את השינויים בזמן אמת (סטייה של שנייה אחת).

בתוך ה<body> של עמוד הHTML, תוכל לראות את הקוד/המבנה הפשוט של העמוד, בצורה דומה לפלט המקורי שהיה מהבקר שלך.
בתוך <script> תוכל לראות את קוד הJavascript ששולח בקשת getJSON לכתובת של הבקר שלך, ומעבד את המידע שמתקבל כדי לעדכן את האלמנטים המתאימים בעמוד.


כמה הערות חשובות, אם משום מה זה לא עובד:
  1. לפני שאתה ניכנס ל mySensors.html אתה יכול לנסות לגשת לעמוד שיוצר הבקר כרגיל (כמו שהיית ניגש עד עכשיו) ולבדוק מה הפלט שמתקבל. במקרה של תקלה, תעתיק לכאן את הפלט כדי שאני אוכל לבדוק מה לא נכון. בכל מקרה, תוכל להשוות לדוגמאות JSON שהבאתי למעלה כדי לראות שלא מתקבל משהו שגוי.
  2. שים לב שבפלט של הJSON אסור שיהיה שום תו שהוא לא חלק מהJSON. (גם לא \n או \r וכדומה).
  3. תשים לב שהמבנה של הJSON שלם, שלא חסרים סוגריים (מסולסלים, לדוגמא), מרכאות עבור מחרוזות, פסיקים בין הערכים וכדומה.
  4. הקידוד שמוגדר לHTML הוא UTF-8, צריך לוודא שזה אכן הקידוד שיתקבל מהפלט של הבקר (אין לי אפשרות לבדוק את זה)
  5. כדי להקל על הבנת הקוד, השתמשתי בספרייה שניקראת jQuery. כדי שהיא תפעל, אתה צריך להיות מחובר לאינטרנט, כי השימוש בה נעשה דרך האינטרנט. אם במקרה אתה לא מחובר לאינטרנט במחשב שמקבל את המידע מהבקר, תגיד לי, ואני אסביר לך איך לסדר את זה.


* אני שיניתי קצת את הפלט של הבקר, והוא לא שולח כרגע version , date, logNumber, logTime וכדומה. עשיתי את הקוד הכי פשוט כדי לראות שזה עובד. את הערכים הנ"ל אפשר אח"כ להוסיף גם בJavascript, תלוי מה ואיך אתה רוצה שזה יעבוד.




מקווה שיעבוד טוב.

/סוף חפירה.
_____________________________________
תמונה שהועלתה על ידי גולש באתר ולכן אין אנו יכולים לדעת מה היא מכילה

תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
תגובה

כלי אשכול חפש באשכול זה
חפש באשכול זה:

חיפוש מתקדם
מצבי תצוגה דרג אשכול זה
דרג אשכול זה:

מזער את תיבת המידע אפשרויות משלוח הודעות
אתה לא יכול לפתוח אשכולות חדשים
אתה לא יכול להגיב לאשכולות
אתה לא יכול לצרף קבצים
אתה לא יכול לערוך את ההודעות שלך

קוד vB פעיל
קוד [IMG] פעיל
קוד HTML כבוי
מעבר לפורום



כל הזמנים המוצגים בדף זה הם לפי איזור זמן GMT +3. השעה כעת היא 10:28

הדף נוצר ב 0.38 שניות עם 10 שאילתות

הפורום מבוסס על vBulletin, גירסא 3.0.6
כל הזכויות לתוכנת הפורומים שמורות © 2019 - 2000 לחברת Jelsoft Enterprises.
כל הזכויות שמורות ל Fresh.co.il ©

צור קשר | תקנון האתר