יום ראשון, 8 במרץ 2009

הודעות הודעות לרוב

שלום לכול קוראי הבלוג שלי, בקרוב כמה עדכונים מאוד חשובים

1. אני מקליט בימים אלה ממש סדרה של סקינקאסטים בעברית על jQuery, שיעזרו לכם המתחילים בספריה הזו מאוד. המדריכים מתחילים מרמת המתחיל ועד לרמה מתקדמת יותר.

2. FlexUploader - בימים אלה ממש אני גם עובד על גרסה חדשה לגמרי לUploader בפלקס, עם Api בjavascript שאיתו יהיה קל יותר לעבוד.

במידה ואתם מעוניינים להיות מעודכנים, שלחו לי מייל לavi.kenso@gmail.com ואני מבטיח לעדכן בזמן היציאה של הרכיבים האלה, אני אעדכן גם בטוויטר שלי http://www.twitter.com/kensodev

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

 

בברכת שבוע טוב,

יום שבת, 31 בינואר 2009

רכיב פלאש חינמי להעלאת קבצים

שלום לכולם,

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

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

איך הרכיב נראה?
ובכן, הרכיב הוא בעצם קובץ Swf ברוחב של 350 פיקסלים ובגובה של 116 פיקסלים.
יכול להתאים לכל אתר או מערכת ניהול שאתם בונים.

1

(צילום מסך)

איך משתמשים ברכיב?
ובכן, כל שאתם צריכים לעשות הוא להוסיף פונקציית Javascript בדף שבו הרכיב נמצא ובו אתם מורים לרכיב לאן הוא צריך לשלוח את הקובץ.

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

אבטחה
אם אתם מקבלים שגיאת אבטחה, אתם צריכים להוסיף קובץ שנקרא CrossDomain.xml לRoot של הדומיין שאליו אתם רוצים להעלות את הקבצים.

ד.א
אם מישהו רוצה (וזה ממש חשוב לו) את הרכיב הזה בלי הלוגו שלי :-(, שלחו מייל ואשלח אליכם גרסה ללא הלוגו שלי.
המייל שלי הוא avi.kenso@gmail.com

כל דבר, מדיווחי באגים ועד הצעות לשיפורים יתקבלו בברכה, באמת שאשמח לשמוע כל דבר שתגידו. אבל בבקשה תגידו דברים טובים :-)

ניתן לראות מספר צילומי מסך של הרכיב הזה כאן.
ולהוריד אותו, כולל אתר דוגמא כאן

יום שישי, 9 בינואר 2009

שילוב Flash בדף Html מבלי מסגרת

כמה פעמים נדרשנו לשלב באנר פלאש או כל אובייקט פלאש אחר בדף HTML.
כנראה שהמון.

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

במיוחד בשביל זה, יש לי פונקציה בJavascript שאני משלב אותו בדף בכל מקום שבו אני רוצה לשלב פלאש. כך, אני לא מקבל מסגרת מסביב לפלאש, יכול לשלב גם HTML וכו'.

נגיע להכל, אבל קודם כל, הנה הפונקציה. (מימוש שלה בדף)

//WriteFlashObj(sSrc,sWidth,sHeight,bTrans,sFlashVars,sID)
WriteFlashObj('images/bannerHosts/193x219.swf','193px','219px',false,'','BannerFlash')

 

אוקיי,
נסביר את הפרמטרים:

sSrc - מיקום הקובץ הפיזי (swf) של הפלאש
sWidth - רוחב הפלאש
sHeight - גובה הפלאש
bTrans - נתון בוליאני האם הפלאש יוטמע כשקוף או לא
sFlashVars - אם אנחנו רוצים להוסיף Variables, פחות רלוונטי לבאנרים
sID -זיהוי של האובייקט בדף, ניתן גם לגשת אליו בDocument.getElementById

אוקיי, ועכשיו לפונקציה עצמה

   1: function DocumentWrite(sHtml)


   2: {


   3:     document.writeln(sHtml);


   4: }


   5: ///write flash into the html


   6: function WriteFlashObj(sSrc,sWidth,sHeight,bTrans,sFlashVars,sID)


   7: {


   8:     var sObj = "";


   9:     var sWMode = "";


  10:     var sObjID = sSrc.replace(".swf","");


  11:     var sVars = "";


  12:     var sPrfx = "?";


  13:     if(sFlashVars){


  14:         sVars = sFlashVars;


  15:     }


  16:     if(sID){


  17:         sObjID = sID;


  18:     }else{


  19:         sObjID = sSrc.replace(".swf","");


  20:     }


  21:     sObj = sObj+"<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab' width='"+sWidth+"' height='"+sHeight+"' id='"+sObjID+"' align='middle' VIEWASTEXT>";


  22:     sObj = sObj+"<param name='allowScriptAccess' value='sameDomain' />";


  23:     sObj = sObj+"<param name='movie' value='"+sSrc+"' />";


  24:     sObj = sObj+"<param name='quality' value='high' />";


  25:     sObj = sObj+"<param name='bgcolor' value='#ffffff' />";


  26:     sObj = sObj+"<param name='flashvars' value='"+sVars+"' />";


  27:     if(bTrans == true){


  28:         sObj = sObj+"<PARAM NAME='WMode' VALUE='Transparent'>";


  29:         sWMode = "wmode='transparent'";


  30:     }


  31:     sObj = sObj+"<embed src='"+sSrc+"' flashvars='"+sVars+"' quality='high' bgcolor='#ffffff' "+sWMode+" width='"+sWidth+"' height='"+sHeight+"' ID='"+sObjID+"' NAME='bg' align='middle' allowScriptAccess='sameDomain' swLiveConnect=true ID='bg' type='application/x-shockwave-flash' pluginspage='http://www.macromedia.com/go/getflashplayer' />";


  32:     sObj = sObj+"</object>";


  33:     


  34:     DocumentWrite(sObj);


  35: }




לא לדאוג, אם לא ניתן לקרוא, אני אצרף לינק לקובץ js שיהיה קריא מאוד :-)



הנה הוא כאן



אוקיי, עכשיו ניתן להוסיף פלאשים לדף כמה שרוצים :-)

ברגע שנרצה לשנות את שיטת ההטמעה של הפלאש, פשוט נשנה פונקציה אחת גלובאלית וכל הפלאשים שלנו ישתנו בהתאם.



בהצלחה, וכרגיל, אשמח לשמוע תגובות.