Posts Tagged ‘AIR’

تم إصدار kzalek 0.2 beta

01/12/2009

السلام عليكم و رحمه الله تعالى و بركاته

منذ نصف ساعه تقريبا ، قمت بإصدار kzalek و أصبح متوافرا الان على http://kzalek.com للتحميل ، قمت ببرمجه kzalek بإستخدام AIR/JavaScript ، يمكنك تحويل إمتداد ملف kzalek.air إلى kzalek.zip ثم فك الضغط و رؤيه الكود ، او بعد تثبيته إفتح ملف keepondev فى مسار programmes files و يمكنك رؤيه كود التطبيق .

تحديث :

من مدونه عالم التقنيه : صدور البرنامج العربى تويتر Kzalek النسخه 0.2 التجريبه المفتوحه للجميع

Kzalek

21/10/2009

السلام عليكم و رحمه الله تعالى و بركاته

ss2

منذ يومين أعطيت تطبيقى الجديد Kzalek للبيتا تسترز حتى يختبروا التطبيق و اسمع كل اقتراحاتهم و ارائهم ، Kzalek عباره عن تطبيق AIR بالطبع يعمل على ويندوز و ماك و لينوكس وظيفته تسهيل التعامل مع موقع تويتر على سبيل المثال بدلا من فتح المتصفح لعده ساعات و عمل ريفرش لمعرفه كل جديد ، يمكنك وضع التطبيق فى ال TaskBar او ال Dock و سوف ينبهك بكل جديد بتنبيهات شبيهه ب Mac Growl ، يحتوى التطبيق على المميزات الاساسيه لموقع تويتر مصل استقبال و ارسال التويتات و الردود و الرسائل المباشره و وضع التويتات فى المفضله … الخ و يزيد على موقع تويتر ببعض المميزات الغير موجوده فيه مثل دعم اللغه العربيه و ترجمه التويتات من اى لغه إلى العربيه و إطاله و تقصير الروابط و إرسال الصور إلى تويتر و رؤيتها داخل التويت inline و الكثير من المميزات الاخرى .

kzalek notifications

جاء رد الفعل غير متوقع تماما بالنسبه لى ، هذا حوار مع مدونه عرب كرنش باللغه الانجليزيه و هذا باللغه العربيه ، و هذه تدوينه فى مدونه صديقى شاب مصرى ، و هذه أراء المستخدمين على تويتر ، و هذه تدوينه على مدونه تويتر العرب ، و الإحصائيات جيدة جدا خلال يومين مع العلم ان التطبيق مازال به الكثير من الاخطاء و ميزات ناقصه ،  و رسائل كثير على البريد الالكترونى من شركات تعرض على العمل معهم بأجر و اخرون يتطوعوا فى تصميم و برمجه Kzalek ، و اخرون يريدون المساعده فى دمج API خدماتهم مع Kzalek .

تحديث :

من مدونه عالم التقنيه : تقرير تجربتنا الخاصه حول برنامج kzalek
من مدونه lollwa :  تطبيق kzalek

المصفوفه فى جافاسكربت 1.6

06/05/2009

السلام عليكم و رحمه الله تعالى و بركاته

هذا الموضوع يعتمد فى بعض اجزائه على ماتم شرحه فى سلسله جافاسكربت الموجهه بالكائنات .

كما ذكرت من قبل فى موضوع نسخ الجافاسكربت ، زادت الجافاسكربت 1.6 بوظائف جديده للمصفوفه و بمواصفات E4X ، هذه الزيادات متاحه فى FireFox 1.5+ و Opera و Safari و AIR و Google Chrome ، اما ال E4X موجود فى فايرفوكس فقط .

Array.indexOf

اول وظيفه هى من وظائف المصفوفه هى indexOf ، تشبه نفس طريقه عمل String.indexOf حيث تقوم بجلب index العنصر الذى تم تمريره لها كعباره او ترجع -1 ان لم تجده فى المصفوفه ، كما يوضح المثال البسيط التالى :

var arr = ["a","b","c","d"];
alert(arr.indexOf("c")); // 2
alert(arr.indexOf("x")); // -1

تقبل أيضا عباره تانيه اختياريه و هى ال index الذى يبدأ عنده البحث – القيمه الافتراضيه له 0- كما يوضح الكود البسيط التالى :

var arr = ["a","b","e","a","z"];
alert(arr.indexOf("a",1)); // 3

الوظيفه Array.indexOf غير موجوده فى JavaScript 1.5 ، لكن يمكن اضافتها عن طريق التعديل على Array.prototype حتى ترثها جميع المصفوفات كما يوضح الكود البسيط التالى الذى يعتمد على ماتم شرحه فى سلسله جافاسكربت الموجهه بالكائنات :

if(!Array.prototype.indexOf){
    Array.prototype.indexOf = function(elem /*, from*/){
        var length = this.length;
        var from = Number(arguments[0]) || 0;
        from = (from < 0)
                ? Math.ceil(from)
                : Math.floor(from);
        for(; from<length; from++){
            if(from in this &&
               this[from]==elem){
                return from;
            }
        }
        return -1;
    }
}

بالطبع يمكنك الان استخدام Array.indexOf فى جافاسكربت 1.5 بعد كتابه الكود السابق .

ِArray.lastIndexOf

ثانى وظيفه هى lastIndexOf ، تشبه نفس طريقه عمل String.lastIndexOf تقوم بجلب index العنصر الذى يمرر لها لكنها تبدأ من اخر المصفوفه او ترجع -1 ان لم تجد هذا العنصر ، و ايضا تقبل عباره تانيه ال index الذى يبدأ عنده البحث -القيمه الافتراضيه له array.length- كما يوضح الكود البسيط التالى :

var arr = [3,1,0,5,3];
alert(arr.lastIndexOf(3)); //4
alert(arr.lastIndexOf(3,5)); //4
alert(arr.lastIndexOf(3,-2)); //0
alert(arr.lastIndexOf(9)); //-1

الوظيفه Array.lastIndexOf غير موجوده فى JavaScript 1.5 ، و لكن يمكن اضافتها بالتعديل على Array.prototype كما يوضح الكود البسيط التالى :

if(!Array.prototype.lastIndexOf){
    Array.prototype.lastIndexOf = function(elem /*, startIndex*/){
        var length = this.length;
        var from = Number(arguments[1]);
        if(isNaN(from)){
            from = length-1;
        }
        else {
            from = (from<0)
                       ? Math.ceil(from)
                       : Math.floor(from);
            if(from<0){
                from += length;
            }
            else if(from>=length){
                from = length-1;
            }
        }
        for(; from>-1; from++){
            if (from in this && this[from]== elem){
                return from;
            }
        }
        return -1;
    }
}

عن طريق الكود السابق يمكننا استخدامها بأمان فى المتصفحات التى تدعم JavaScript 1.5 فقط .

Array.every

الوظيفه every تختبر هل عناصر المصفوفه ستجتاز الوظيفه التى تمرر لها ام لا ، حيث ان الوظيفه التى تمرر ل every يتم تمرير لها 3 عبارات : الاولى عنصر المصفوفه ، الثانيه ترتيبه فى المصوفه ، الثالث مرجع للمصفوفه نفسها ، الوظيفه every ترجع القيم true اذا ارجعت كل عناصر المصفوفه true ، اوترجع القيمه false إذا ارجعت احدى عناصر المصفوفه false و يمكن استخدامها كما يلى :

var arr=[1,2,3,4,5,6];
// وظيفه لاختبار هل العنصر الذى يمرر لها فردى ام لا
function odd(x){
    return x%2;
}

arr.every(odd); //false

// اختبار قيمه عناصر المصفوفه كلها اقل من عشره
arr.every(function(elem,index,arr){
    return elem<10;
}); //true

الوظيفه every غير موجوده فى جافاسكربت 1.5 ، و لكن يمكننا زيادتها على ال Array.prototype حتى ترثها كل المصفوفات و يمكننا استخدامها بامان كما يوضح الكود التالى :

if(! Array.prototype.every){
    Array.prototype.every = function(fn /*, thisObject*/){
        var length = this.length;
        if(typeof fn != "function"){
            throw new TypeError();
        }
        var thisObject = arguments[1];
        for(var i=0; i<length; i+=1){
            if(i in this &&
                !fn.call(thisObject,this[i],i,this)){
                return false;
            }
        }
    }
}

و بإضافه الكود السابق يمكننا استخدام array.every بأمان .

Array.filter

الوظيفه filter تقوم بفلتره عناصر المصفوفه ، حيث ترجع العناصر التى ترجع true مع الوظيفه التى تمرر لها ، تقبل الوظيفه every عبارتين : الاولى الوظيفه التى يتم فلتره عناصر المصفوفه بها ، العباره الثانيه الكائن الذى يحل محل this عند استدعاء هذه الوظيفه ، عليك ملاحظه ان filter لا تغير المصفوفه لذلك عليك استقبال النتيجه فى متغير جديد ، كما توضح الامثله البسيطه التاليه :

var arr = [1,2,3,4,5,6,7,8];
var evenNumbers = arr.filter(function(elem){
    return elem%2==0;
}); //[2,4,6,8]

[5,7,8,9,10,11,12,13].filter(function(){
    return elem>10;
}); //[11,12,13]

الوظيفه filter غير موجوده فى جافاسكربت 1.5 ، و لكن يمكن اضافتها عن طريق الاضافه على Array.prototype كما يوضح الكود البسيط التالى :

if(!Array.prototype.filter){
    Array.prototype.filter = function(fn /*, thisObject*/){
        var length = this.length;
        if(typeof fn != "function"){
            throw new TypeError();
        }
        var result = [];
        for(var i=0; i<length; i+=1){
            var val = this[i];
            if(fn.call(thisObject, val, i, this)){
                result.push(val);
            }
        }
        return result;
    }
}

بعد إضافه الكود السابق يمكنك استخدمها فى المتصفحات التى تعمل فى بيئه جافاسكربت 1.5 بدون مشاكل .

Array.forEach

الوظيفه forEach تقوم بتنفيذ الوظيفه التى تمرر لها على جميع عناصرها ، لاتتغير المصفوفه ولا ترجع الوظيفه شيئا، يمرر للوظيفه forEach عبارتين : الأولى الوظيفه التى سيتم تنفيذها على جميع عناصر المصفوفه ، الثانيه الكائن الذى سيحل محل this عند استدعاء الوظيفه ، كما توضح المثال البسيط التالي :

var arr = [1,2,3,4]
function multiply(x){
    alert(x*x);
}
arr.forEach(mulitply); // 1,4,9,16

جافاسكربت 1.5 لا تحتوى على forEach و لككننا يمكننا اضفتها على ال Array.prototype بكل سهوله كما يوضح الكود البسيط التالى :

if(!Array.prototype.forEach){
    Array.prototype.forEach = function(fn /*, thisObject*/){
        var length = this.length;
        if(typeof fn != "function"){
            throw new TypeError();
        }
        var thisObject = arguments[i];
        for(var i=0; i<length; i+=1){
            if(i in this){
                fn.call(thisObject, this[i], i, this);
            }
        }
    }
}

Array.map

الوظيفه map تعمل بنفس طريقه Array.forEach غير انها ترجع الناتج فى مصفوفه جديده ، بعكس Array.forEach التى لا ترجع ناتج ، الوظيفه map تقبل عبارتين الاولى الوظيفه التى ستنفذ على جميع عناصرها ، و العباره التانيه الكائن الذى سيحل محل this عند استدعاء الوظيفه ، كما توضح الامثله البسيطه التاليه :

var arr=[1,2,3,4];
var result = arr.map(function(x){
    return x*10;
}); //[10,20,30,40];

جافاسكربت 1.5 لا تحتوى على map و لككننا يمكننا اضفتها على ال Array.prototype بكل سهوله كما يوضح الكود البسيط التالى :

if(!Array.prototype.map){
    Array.prototype.map = function(fn /*, thisObject*/){
        var length = this.length;
        if(typeof fn != "function"){
            throw new TypeError();
        }
        var thisObject = arguments[1];
        var result = [];
        for(var i=0; i<length; i+=1){
            if(i in this){
                result[i] = fn.call(thisObject, this[i], i, this);
            }
        }
        return result;
    }
}

Array.some

و اخيرا الوظيفه some تختبر هل احدى عناصر المصفوفه ستعطى true اذا مررت للوظيفه التى تمرر ل some ، حيث تعطى true اذا اعطت اخدى العناصر القيمه true او تعطى false اذا اعطت كل العناصر القيمه false ، مع ملاحظه ان الوظيفه some لا تغير المصفوفه لذلك لابد من استقبال الناتج فى متغير جديد ، حيث تقبل some عبارتين الاولى هى الوظيفه التى ستم اتنفيذها على كل عناصرها ، و العباره التانيه هى الكائن الذى سيحل محل this عند استدعاء الوظيفه ، كما يوضح المثال البسيط التالى :

var arr = ["Amhed Ali","Eman Nader","Mostafa Farghaly"];
function anaMawgood(x){
    return x.toLowerCase()=="Mostafa Farghaly";
}
alert(arr.some(anaMawgood)); // true

جافاسكربت 1.5 لا تحتوى على some و لككننا يمكننا اضفتها على ال Array.prototype بكل سهوله كما يوضح الكود البسيط التالى :

if(! Array.prototype.some){
    Array.prototype.some = function(fn /*, thisObject*/){
        var length = this.length;
        if(typeof fn != "function"){
            throw new TypeError();
        }
        var thisObject = arguments[1];
        for(var i=0; i<length; i+=1){
            if(i in this && fn.call(thisObject, this[i], i, this)){
                return true;
            }
        }
        return false;
    }
}

بإضافه الكود السابق يمكننا استخدام some فى جافاسكربت 1.5 .

Aray generics

اضافه يضا جافاسكربت 1.6 امكانيه استخدام وظائف ال Array على انواع اخرى غير المصفوفه بدون الخوض فى سلسله ال prototype كما يوضح المثال التالى :

function isLetter(character){
    return (character >= "a" && character <= "z");
}

var str="Mostafa Farghaly";
if(Array.prototype.every.call(str,isLetter)){
    alert("str contains only letters!");
}

يمكنك استبدال الكود الذى يخوض فى سلسله ال protoype كالاتى :

if(Array.every(str,isLetter)){
    alert("str contains only letters!");
}

ملحوظه الكود السابق يعمل على فايرفوكس فقط .

للمزيد : New in JavaScript 1.6 و Mozilla new Array methods .

شارك فى اختيار السلسله القادمه

03/04/2009

السلام عليكم و رحمه الله تعالى و بركاته

يمكنكم التصويت على الموضوع الذى ساتناوله إن شاء الله فى سلسله درووس بعد انتهاء السلسله الحاليه – انماط تصميم جافاسكربت JavaScript design patterns – بحيث سيتم شرح اعلى موضوع تصويتا و حذفه من قائمه التصويتات ، و لن ينتهى الامر عند هذا الحد ، سيظل التصويت قائما و سيتم شرح الموضوع الذى سيأخذ اعلى تصويت بعده … الخ ، و يمكنك أيضا اقتراح موضوعات اخرى فى مربع النص اسفل التصويت ليتم إضافتها داخل التصويت ،  يعنى ان شاء الله سيتم شرح كل الموضوعات التى بالقائمه ، إذا كنت تتابعنى من RSS ولا ترى التصويت قم بزياره المدونه ، و يمكنك وضع رابط للموضوع فى اى منتدى او مدونتك حتى يزداد التصويت و يكون القرار عادل ، انا شخصيا مستمتع بهذا الموضوع لأن التدوينه يعطينى الفرصه لدراسه تقنيات لأول مره او المراجعه عليها و غالبا ما تزداد خبرتى ، منتظر تصويتكم و تعليقاتكم .

المزيد من محاضرات Ajax experience 2008

29/03/2009

السلام عليكم و رحمه الله تعالى و بركاته

قد كتب موضوع من قبل عن محاضرات Ajax experience 2008 التى وضعها Dion almear و ben galbraith فى مدونتهما Ajaxian.com ، لكنهما كتبوا يوم الجمعه 27 مارس 2009 موضوع وضعوا فيه روابط لأربع محاضرات بالفيديو جديده ، يمكنك تحميل المحاضرات من هنا ، تتناول الاربع محاضرات المواضيع التاليه :

- Ajax 2.0 with Anne van Kesteren
- Ajax Testing Tool Review with Ted Husted
- Analyzing the Ajax Application Performance with Gaurav Seth
- Building Your First Adobe AIR Application with Kevin Hoyt

اتمنى لكم و لنفسى مشاهده ممتعه :) .

Canvas

23/02/2009

السلام عليكم و رحمه الله تعالى و بركاته

عندما كانت مواصفات SVG يتم كتابتها و مراجعتها و إدراجها فى محركات ترجمه ، كانت شركه Apple تعمل على الكائن Canvas الذى يمكن المحرك WEBKit من عمل Vector graphics ، تم ادراج مواصفات هذا الكائن فى نسخه HTML5 الذى تكتب مواصفاتها مجموعه WHATWG و بالتالى ادراج العنصر <canvas> فى المتصفحات التى تدعمه Firefox 1.5 و Safari2 و Opera9 و بالطبع موجود فى AIR  ، انترنت اكسبلورر لا يدعمه فى الوقت الحالى ، و يبدو انه لن يدعمه لأنه يدعم لغته XAML التى وراء تقنيه SilverLight و يدعم ايضا اللغه القديمه VRML التى تستتخدم لعمل رسومات عن طريق ال XML .

أبرز ما يميز canvas انه لا يوجد به التعقيدات و العناصر الكثيره جدا الموجوده ب SVG و XAML و VRML ، بل يعتمد كليا على الجافاسكربت ، يمكنك من خلال Canvas رسم اشكال معقده جدا من خلال Canvas JavaScript API ، فى الوقت الحالى الاشكال ثنائيه الابعاد فقط لكن فايرفوكس و اوبرا يبحثان ادراج امكانيه الرسم ثلاثى الابعاد بإستخدام OpenGL ، من أبرز الاعمال التى قام المبرمجين بها من خلال canvas : قام John Resig بإدراج اللغه Processing التى هى لغه لل visualization إلى الجافاسكربت عن طريق processing.js ، يمكن رؤيه مايمكن ان يتم عمله من خلال canvas بواسطه processing.js – بالطبع لابد ان تعرض الصفحه فى احد المتصفحات التى ذكرتها بالأعلى أو اجدد منها – ، قام أيضا Dion almaer و Ben Galbraith المدونين ب Ajaxian.com بإطلاق Bespin محرر تفاعلى مبنى على Canvas .

heart-by-canvas

يمكنك رسم القلب اعلاه عن طريق الكود التالى :

<canvas id="heart" width="150" height="150">
<script>
var canvas = document.getElementById("heart");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.moveTo(75,40);
ctx.bezierCurveTo(75,37,70,25,50,25);
ctx.bezierCurveTo(20,25,20,62.5,20,62.5);
ctx.bezierCurveTo(20,80,40,102,75,120);
ctx.bezierCurveTo(110,102,130,80,130,62.5);
ctx.bezierCurveTo(130,62.5,130,25,100,25);
ctx.bezierCurveTo(85,25,75,37,75,40);
ctx.fill();
</script>

game-canvas

و يمكنك عمل رسومات هذه اللعبه كما توضح هذه الصفحه

تم ذكر Canvas فى بعض الكتب مثل :

SitePoint » The Art and Science of JavaScript فى الفصل 3 .
O’Reilly » Painting the web فى الفصل ال 11 و 12 .
Apress » Pro JavaScript techniques الفصل 14 .

لكنى لن أجد شرح ل canvaas أفضل من شرح Mozilla كما يوضح الرابط بالأسفل

للمزيد :

Mozilla » Canvas tutorial
Canvas cheat sheet
Game using canvas

AIR 1.5 cheatsheet

18/02/2009

السلام عليكم و رحمه الله تعالى و بركاته

انتهيت من كتابه AIR 1.5 cheat sheet عباره عن 7 ورقات تضم كل  اصناف و خواص و طرق ال AIR API ، بعد طباعتها و قرائتها وجدتها لا ينقصها شىء ، هناك فقط بعد التكرار الذى لم اتعمده ، لكل المهتمين بتعلم AIR يمكنك تحميلها من هنا air1.5-cheatsheet.

debugger جديد فى aptana لتطيبقات AIR

24/11/2008

السلام عليكم و رحمه الله تعالى و بركاته

Aptana air debugger

أعلن فريق محرر Aptana فى مؤتمر Adobe MAX عن debugger جديد لتطبيقات AIR التى يتم برمجتها بال javascript ، لا يختلف كثيرا عن أى debugger اخر ، حيث يمكنك وضع breakpoint و التجول فى scope البرنامج و معرفه قيم المتغيرات عند نقطه معينه … الخ ، يوجد فيديو على aptana.tv يشرح قدرات ال debugger و كيفيه إستخدامه يمكنك مشاهدته من هنا .

data URI فى HTML و CSS

24/11/2008

السلام عليكم و رحمه الله تعالى و بركاته

data URI هى عباره عن URI schema تهدف إلى وضع البيانات الخارجيه داخل الصفحه inline بدون الحاجه إلى الإشاره إلى مسار الملف الفعلى الذى يحتوى على هذه البيانات عن طريق src او href فى HTML او url() فى CSS ، و بذلك ستقل عدد ال HTTP request التى يصدرها المتصفح ، و يمكن أن تستخدمه محررات النصوص التى تقبل صور فى محتواها من مصدر خارجى بحيث بعد الحصول على البيانات الخارجيه تتم تحويلها إلى data URI و تلغى الإعتماد علىالمصدر الخارجى ، تؤدى أيضا إلى سرعه تحميل البيانات التى تنتقل عبر HTTPS لأنها تكون مضمنه داخل html او css  مثلا .
أما عيوبها فتتمثل فى أن البيانات التى يتم إستخدامها أكثر من مره – كالصور مثلا – لا تستفيد من الكاش و سيتم تحميلها كل مره من السيرفر ، انترنت اكسبلورر 7 لا يدعم ال data URI – لكن جميع المتصفحات الاخرى تدعمها ، عندما يتم تشفير البيانات بواسطه base64 فإن حجمها سيزيد بنسبه 30% .
و الصيغه العامه لل data URI كالتالى :

data:[<mime-type>][;charset="<encoding>"][;base64],<data>

يبدأ بكلمه data ، ثم : ، ثم نوع البيانات فى صيغه mime-type مثل image/jpeg و هذه الخيار إختيارى ، ثم charset و هو اختيارى إيضا ، و عند ترك الخيار mime-type فإنه ستحول إلى text/plain;charset=US-ASCII ، اما كلمه base64 فى توضح ان البيانات تم تشفيرها بواسطه base64 ، و اخيرا البيانات الحقيقيه التى تمثل صوره او ملف صوتى … الخ و إليك مثال لوضع صوره – عباره عن نقطه حمراء :) – داخل ملف html بدون الإشاره إلى مسارها عن طريق src :

<img src=”data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==
” alt=”Red dot” />

و هذا مثال اخر يوضح كيفيه إستخدام ال data URI فى ال CSS :

li {
margin-left: 20px;
background:url(‘data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAA
ABlBMVEUAAAD///+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/5
8ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6P9/A
FGGFyjOXZtQAAAAAElFTkSuQmCC
‘) top left no-repeat; }

السؤال الذى يطرأ على ذهنك ، كيف احول صوره او ملف صوتى او أى ملف إلى تلك الصيغه التى فوق و أستخدمها مع data URI ؟
يمكنك إستخدام ال php فى تحويل الملفات التى على السيرفر إلى نصوص مضغوطه بصيغه base64 لكى تستخدم inline مع data URI كما يوضح المثال التالى الذى يقرأ الملف بواسطه وظيفه file_get_contents و يضعه فى متغير بإسم contents ثم يشفره بواسطه وظيفه base64_encode و يضعه فى متغير bas64 ثم يقوم بإرجاع ال data URI كناتج لإستدعاء الوظيفه data_URI التى تقبل الجمله الاولى مسار الملف و الجمله التانيه ال mime-type لنوع البيانات :

<?php
function data_URI($file, $mime)
{
$contents = file_get_contents($file);
$base64 = base64_encode($contents);
return (‘data:’ . $mime . ‘;base64,’ . $base64);
}
?>
<img src=”<?php echo data_URI(‘elephant.png’,’image/png’) ?>” alt=”An elephant” />

إستخدامات ال data URI لا تعد و لكنى أجدها منتشره جدا فى سكربتات grease monkey و أيضا ألعاب الجافاسكربت التى تكون عباره عن هذه اللعبه سوبر ماريو عباره عن ملف جافاسكربت واحد فقط بدون أى صور خارجيه او اصوات او اى شىء ، كما انها متاحه أيضا للإستخدام داخل adobe air ، كما ان steve souders المهندس المتخصص فى ال performance فى جوجل حاليا و ياهو سابقا ينصح بها لجلب الملفات الصغيره كالصور داخل الصفح التى لا تتغير إلا نادرا و يتم إدخالها فى ال cache .

إستخدام كود C و C++ فى AIR

21/11/2008

السلام عليكم و رحمه الله تعالى و بركاته

أعلنت شركه أدوبى فى مؤتمر MAX عن مشروع جديد بإسم Alchemy ، يهدف إلى تحويل أكواد ال C و ال C++ إلى كود actionscript و بذلك يمكن إستخدامه فى برامج ال  AIR ، و بما أن برمجيات AIR التى تكتب بواسطه جافاسكربت تستطيع إستخدام flash api ، فأنها تستطيع أيضا إستخدام اكواد C التى تم تحويلها إلى actionscript ، لمزيد من التفاصيل عن المشروع الجديد يمكنك مشاهده صفحه Alchemy فى adobe labs ، أكثر ما أعجبنى فى هذه الموضوع أنك تستطيع إستخدام ملايين المكتبات التى تم كتابتها بال C و التى تقوم بعمل كل شىء و أى شىء لم تمتد إليه ال AIR api .


Follow

Get every new post delivered to your Inbox.