Payar Bhara Har Aik Ishara Lyrics (پیار بھرا ہر ایک اشارہ)

(Roman Urdu)

پیار بھرا ہر ایک اشارہ، پیارا اسکا ہر نظارہ

جس نے زمیں پے پیار اتارا، وہ خود ہو گا کتنا پیارا

پیار کا اُسکے نہیں شمار، اللہ ہے بس پیار ہی پیار

اللہ ہے بس پیار ہی پیار

پھول بنائے پیارے پیارے ، تتلی جگنو اور فوارے

جگ مگ کرتے چاند ستارے، اور کہا یہ سب ہیں تمہارے

پیار کا اُسکے نہیں شمار، اللہ ہے بس پیار ہی پیار

اللہ ہے بس پیار ہی پیار

 

 برسایا پانی کا تار، ہم کو دی فصلوں کی بہار

گندم چاول مکئی جوار، سیب خوبانی آم انار

پیار کا اُسکے نہیں شمار، اللہ ہے بس پیار ہی پیار

اللہ ہے بس پیار ہی پیار

 

بادل بارش دریا مٹی، لہر لہر موجوں کی مستی

رواں دواں چھوٹی سی کشتی، سب کی مالک ایک ہی ہستی

پیار کا اُسکے نہیں شمار، اللہ ہے بس پیار ہی پیار

اللہ ہے بس پیار ہی پیار

 

 دریاؤں میں تیرتی مچھلی، باہر موجیں سیپی موتی

سمجھیں تو ہر چیز ہے اپنی، سب پر ایک ہی نام کی تختی

پیار کا اُسکے نہیں شمار، اللہ ہے بس پیار ہی پیار

اللہ ہے بس پیار ہی پیار

(Roman English)

Piar Bhara Har Aik Ishara, Piara Us Ka Har Nazara

Jis Nay Zameen Pay Piaar Utara, Woh Khud Ho Ga Kitna Piara

Piar Ka Us Kay Nahien Shumar, Allah Hay Bas Piar Hi Piar

Phool Banayay Piaray Piaray, Titli Jugno Aur Fawaray

Jag Mag Kartay Chand Sitaray, Aur Kaha Yeh Sab Hain Tumharay

Piar Ka Us Kay Nahien Shumar, Allah Hay Bas Piar Hi Piar

Barsaya Pani Ka Taar, Ham Ko Di Fasloon Ki Bahar

Gandum Chaawal Makayee Jawar, Saib Khubani Aaam Anaar

Piar Ka Us Kay Nahien Shumar, Allah Hay Bas Piar Hi Piar

Badal Barish Darya Mati, Lehe Leher Mojoon Ki Masti

Rawan Dawan Chooti See Kashti, Sab Ki Maalik Aik Hi Hasti

Piar Ka Us Kay Nahien Shumar, Allah Hay Bas Piar Hi Piar

Daryaoon Main Tairtee Machli, Bahir Mojain Seepi Mooti

Samjhain To Har Cheez Hay Apni, Sab Par Aik Hi Naam Ki Takhti

Piar Ka Us Kay Nahien Shumar, Allah Hay Bas Piar Hi Piar

Getting through Tainted Canvas or CORS error in client side setup (vanilla Javascript, Local files, no Server Side Settings)

Okay, I was making a small, totally client side solution to generate final viva sheets. The application required users to upload an excel file, then it reads the data and shows some check boxes, user can select the desired check boxes and then click a button to download a word file (.docx). I was using TinyMCE and a bit of vanilla Javascript to generate the content inside the Tiny MCE HTML Editor and downloading the file:

Things were going well, but as soon as I used the company logo inside the editor, it will always throw tinted canvas error first and if I set my image tag attribute as crossorigin='anonymous', it will then throw CORS error when downloading the file:

I was completely stumped with this issue, as I only needed to access a small logo file inside the same folder but there was simply no solution available. As all solutions require a local or remote web server to host file with CORS enabled settings etc. I simply did not needed it as I wanted the users to do it completely on their PCs without even Internet working (just the excel file as input).

So I had to hack my way around, first thing worked for me was, to create a batch file and put the MS DOS commands to start chrome with some arguments to disable security and allow local file access. And I had to include the arguments to launch a new instance with Default profile, so that the security and allow file access properly work the command is:
start chrome /new-window file:///%CD%/vsheets.html --allow-file-access-from-files --allow-file-access --allow-cross-origin-auth-prompt --user-data-dir=Default

It worked well, as there was no error and word file downloaded correctly. The only minor issue was it would create around 60MB new folder having Default chrome profile.

Then actually GOD helped me, I clicked an image on google, and it opened
in a new window with a weired and long URL starting with: 
data:image/png;base64,aASilkuhkjhkjhkj....

I had no idea about it, but when searched, I came to know you can actually put simple text inside image tag src attribute and browser will convert it to an image. So I used  https://www.base64-image.de/ to upload my image, get it converted to base64 and copied the generated URL inside my src attribute, and voila, it worked like a charm. No more tainted canvas or CORS error and so was the best solution. My image tag finally was:
<img src='data:image/jpeg;base64,/9j/4AAZJRgABAQAAA.....' alt='' >

But I didnt find it any where on stackoverflow or other search as all were only suggesting to setup a local server or access the file from some remote server/link having CORS enabled on that image/resource. So I thought my little blog could help some one in similar situation.

The only draw back of this solution is it will slow down the page depending upon the size of image that is converted. But my image was very tiny (60 x 37 pixels logo) so there was no performance drop at all (even I reduced it further using some other free online services to reduce JPG size, before generating base64 text).

Good luck.