Avro Phonetic Plugin for WordPress

অভ্র-র প্লাগিনে যে ৬-টা সমস্যার কথা বলেছিলাম – কোডিং/প্রোগ্রামিং না জানা সত্ত্বেও তার বেশির ভাগই আমি আমার মতো করে – বুঝে হোক বা না বুঝে হোক – সমাধান করে ফেলেছি! আমার মনে হলো – এই সমাধানগুলি আপনাকে জানিয়ে দিলে ভাল হয় – যাতে আপনি প্রয়োজনীয় আপডেট করে নিতে পারেন।

নীচে প্রতিটা সমস্যার নীচে আমার সমাধানগুলি দিলাম পয়েন্টওয়াইজ —
১। পোস্টের নীচে মন্তব্য-ফর্মে যে ইনপুট বক্সে মন্তব্যকারীর ইমেল এ্যাড্রেস লিখতে হয় – সেখানেও অভ্র চালু থাকে। ইংরেজিতে লেখা ইমেল স্বয়ংক্রিয় ভাবে বাংলা হয়ে যায়। কিন্তু ইমেল তো আর বাংলা হয় না! মন্তব্য-ফর্মের যে ইনপুট বক্সে ওয়েবসাইট ইউআরএল দিতে হয়, সেক্ষেত্রেও একই ঘটনা! আমার প্রশ্ন হচ্ছে শুধুমাত্র এই দুইটি ইনপুট বক্সে (নাকি টেক্সট বক্স বলে?) কি করে অভ্র বন্ধ রাখা যায়??

সমাধানঃ এটার প্রকৃত সমাধান করতে পারিনি। তবে রিফাত সাহেবের অভ্রর মূল জেকোয়েরি প্লাগিনটার মত আপনার প্লাগিনেও Ctrl+M কীবোর্ড শর্টকাট চেপে ভাষা পরিবর্তন করা যায়। বাংলা মোডে চালু থাকা অবস্থাতেও ইমেল, ওয়েবসাইট ইত্যাদি জাতীয় টেক্সটবক্সে বাই ডিফল্ট অভ্র বন্ধ থাকলে খুবই ভাল হত সন্দেহ নাই।  আশা করি আপনি এটা বাস্তবায়ন করতে পারবেন। তবে আপাতত Ctrl+M কীবোর্ড শর্টকাট চেপে কাজ চালানো যাচ্ছে। তবে, এখানে একটাই বি-শা-ল সমস্যা!  কাজটা শুধু ফায়ারফক্সেই চালানো যাচ্ছে। ক্রোমে যাচ্ছে না। আর কোন কোন ব্রাউজার যায় কিম্বা যায় না আমি জানি না – আমি শুধু এই দুইটাই পরীক্ষা করেছি। ক্রোমে বাই ডিফল্ট ইংরেজি আসে – এবং ইংরেজিই থাকে – বাংলায় বদলানো যায় না। তবে, হ্যঁ, আমি এটার সমাধান করেছি। কিভাবে সেটা নীচে বলেছি।

২। ২য় সমস্যাটা হচ্ছে – সার্চবক্সে অভ্র প্লাগিনটা কাজ করছে না। এখানে ফোনেটিকালি ইংরেজি অক্ষরে লেখা শব্দ বাংলা হচ্ছে না। এটা ঠিক করবো কিভাবে?

সমাধানঃ আপনার পিএইচপি প্লাগিনের কোডে avro_js_loader() ফাংশানটার ভিতরে থাকা jQuery(‘textarea, input[type=text]’).avro({‘bn’:false}, function(isBangla) ফাংশানটা আমি avro_js_loader()  ফাংশান-এর ভিতরেই আরেকবার রিপিট অর্থাৎ কপি-পেস্ট করে ২য় বার দিয়েছি। শুধু ২য় বার input type=text -এর ক্ষেত্রে ‘text’-এর বদলে ‘search’ দিয়ে দিয়েছি। এতেই কাজ হচ্ছে! এখন সার্চবক্সেও অভ্র কাজ করছে। একদম  নীচে পুরো কোডটাই দিয়ে দিয়েছি – সেখানে দেখুন।

৩। মূল অভ্রতে যেমন লেখার মাঝখানেই বাংলা থেকে ইংরেজি বা ইংরেজি থেকে বাংলায় সুইচ করা যায় বা মোড পরিবর্তন করা যায়, এই প্লাগিনে তেমনটা করা যাচ্ছে না। এটা একবারেই বাই ডিফল্ট বাংলা মোডে চালু হচ্ছে এবং এটা দরকার হলে বদলানোও যাচ্ছে না – বন্ধও করা যাচ্ছে না!! এই বিষয়টা ঠিক করব কিভাবে?

সমাধানঃ ৪ নং পয়েন্টের উত্তরে দেখুন।

৪। এটা গুগল ক্রোমে কাজ করছে না। প্রথমবার ফায়ারফক্সে টেস্ট করে আপনাকে আগের ইমেলে লিখেছিলাম (উপরে ৩ নং পয়েন্টে) – “মূল অভ্রতে যেমন লেখার মাঝখানেই বাংলা থেকে ইংরেজি বা ইংরেজি থেকে বাংলায় সুইচ করা যায় বা মোড পরিবর্তন করা যায়, এই প্লাগিনে তেমনটা করা যাচ্ছে না। এটা একবারেই বাই ডিফল্ট বাংলা মোডে চালু হচ্ছে এবং এটা দরকার হলে বদলানোও যাচ্ছে না – বন্ধও করা যাচ্ছে না!! এই বিষয়টা ঠিক করব কিভাবে?“। ক্রোমের ক্ষেত্রে ঘটছে ঠিক উলটোটা। ক্রোমে প্লাগিনটা বাই ডিফল্ট ইংরেজি মোডে চালু হচ্ছে (স্ক্রীনের ডান পাশে ‘ই’ আইকনটা দেখা যায়) এবং একে তারপর বাংলায় সুইচ করা যাচ্ছে না। অর্থাৎ ক্রোমে অভ্র কাজই করছে না – যেটা তার মূল কাজ আরকি – বাংলায় লেখা। প্লাগিনটার ক্রস-ব্রাউজার (ওএসএর ক্ষেত্রে এক্সপি থেকে উইন্ডোজের সাম্প্রতিক ভার্শনসহ) কম্প্যাটিবিলিটি ও ফাংশনেবিলিটি দরকার।

সমাধানঃ  উপরে ১নং পয়েন্টের উত্তরেই যেমন বলেছি – ফায়ারফক্সে Ctrl+M চাপলেই এই সুইচিংটা করা যায় আসলে — কিন্তু ক্রোমে করা যায় না। ক্রোম সংক্রান্ত এই সমস্যার সমাধান হয়েছে আপনার প্লাগিনে “enable_avro()” নামের ফাংশানে স্ক্রীপ্ট সোর্স অর্থাৎ script.src -এর সোর্স ফাইল অর্থাৎ রিফাত সাহেবের অভ্রর জেকুয়েরি প্লাগিনটার সোর্স ফাইল ও তার গন্তব্য পথ বদলে দিয়ে। আপনি avro-latest.js ফাইলটা ব্যবহার করেছেন, যা এখানে আছে – https://raw.githubusercontent.com/torifat/jsAvroPhonetic/master/dist/avro-latest.js। আমি এর বদলে ব্যবহার করেছি এর মিনিফাইড ভার্শানটা – avro-v1.1.4.min.js, যা এখানে আছে – http://torifat.github.io/jsAvroPhonetic/libs/avro-keyboard/dist/avro-v1.1.4.min.js  । এটা করতেই দেখা গেল ক্রোম-সমস্যা দূর হয়ে গেছে !!! তবে এটা কেন হলো বুঝতে পারছি না, কারন avro-latest.js আর avro-v1.1.4.min.js – দুটোরই ভার্শান সংখ্যা একই – v1.1.4 – আর পরেরটা শুধু আগেরটার সংকুচিত সংস্করণ মাত্র হওয়ার কথা। তবে এক্ষেত্রে আরও একটা বিষয় উল্লেখ্য। আপনি প্লাগিনে জেকুয়েরি-লাইব্রেরি ভার্শান ১.৭ অর্থাৎ  jquery-1.7.min.js – ব্যবহার করেছেন। পক্ষান্তরে আমি এটা বদলে দিয়ে ব্যবহার করেছি ভার্শান 2.1.1 – অর্থাৎ jquery-2.1.1.min.js – এখান থেকে – http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.min.js । এরও কোন একটা ভূমিকা থাকতে পারে!৫। আরেকটা বিষয় হলো, একবার প্লাগিনটা ইন্সটল করলে পুরো সাইট জুড়েই চালু হয়ে যায়। এমনকি এ্যাডমিন প্যানেলেও। আর ভাষা সুইচ করা যায় না বলে এবং প্লাগিনটা ডিএক্টিভেট না করা পর্যন্ত বাংলা বন্ধও করা যায় না বলে ফায়ারফক্সে (যেটাতে বাই ডিফল্ট বাংলা আসে) পিএইচপি বা সিএসএস বা অন্য কোন ফাইলের কোড এডিট করা খুবই ঝুঁকিপূর্ণ হয়ে যায়।  আমি পিএইচপি কোডিং জানি না, কিন্তু বেশ কিছু ইংরেজি স্ট্রিং বাংলা অনুবাদ করতে গিয়ে অজান্তে কিছু কোডও বাংলা বানিয়ে ফেলেছিলাম স্রেফ স্পেসবার বা ঐরকম কিছু চাপার কারনে মনে হয়। সমস্যা দেখা দেওয়ার পর তার কারন বুঝে উঠে সমাধান করতে গিয়ে অনেক সময় লেগে গেছে।
সমাধানঃ ফায়ারফক্সে Ctrl+M চেপে ভাষা সুইচ করা যায় বটে – তারপরও এডমিন / ব্যাক এন্ডে কোড এডিট করা খুবই ঝুঁকিপূর্ণ থেকে যায়। একটু এদিক-ওদিক হলেই নিজের অজান্তেই যেকোন কোড বাংলা হয়ে যেতে পারে এবং তা থেকে যেতে পারে অগোচরে সমস্যা দেখা দেয়ার আগ পর্যন্ত। এবং তারপর সেটা খুঁজে বের করাও  এক বিশাল মাথাব্যথা হয়ে দাঁড়াতে পারে!!! এর চেয়ে প্লাগিন সেটিংসে না গিয়েই সব উইন্ডো বা স্ক্রীন থেকেই অভ্রকে পুরোপুরি অন/অফ করার একটা দ্রুত ও সহজেই এ্যাক্সেসিবল অপশন থাকলে ভাল হতো – অভ্রের আইকন – ‘অ’ বা ‘E’  – যেমন সব উইন্ডো বা স্ক্রীনে থাকে।

৬। প্লাগিনটা ইন্সটল করলে পুরো সাইট জুড়েই চালু হয়ে যাওয়ার আরেকটা সমস্যা আছে। আমি পুরোপুরি ইংরেজিতে একটা বড় সাইট করতে চাচ্ছি যেখানে পুরো সাইটের শুধুমাত্র কয়েকটা পৃষ্ঠায় কিছু ল্যাঙ্গুয়েজ টুল থাকবে যেখানে ফোনেটিকালি বাংলায় টাইপ করা লাগবে, যেমন – বাংলা অনুবাদক, অনলাইন বাংলা ডিকশনারি সার্চ, সার্চবক্স (সাইটসার্চ বা নেটসার্চ), শুধুমাত্র ফোনেটিকালি বাংলায় টাইপ করার জন্য টেক্সট এরিয়া, ইত্যাদি ইত্যাদি। কিন্তু আপনার প্লাগিনটা পুরো সাইটেই প্রয়োগ না করে শুধুমাত্র সুনির্দিষ্ট কিছু পৃষ্ঠাতে কিভাবে প্রয়োগ করব বুঝে উঠতে পারছি না! এটাও একটু দেখা লাগবে।
সমাধানঃ হ্যাঁ, এইটা আমি করতে পারিনি — কিন্তু এটা অসম্ভব জরুরি!!!

 

নীচে আমার সম্পাদিত কোড দেখুন —

<!– <?php

/**
* @package Avro Phonetic WP Plugin
* @version 1.1.4
*/
/*
Plugin Name: Avro Phonetic WP Plugin
Plugin v1.1 URI: http://www.masnun.me/2011/11/11/avro-phonetic-wp-plugin.html
 Description: Adds Avro Phonetic to all your text inputs
Author: Masnun | Modification: Monmajhi
Version: 1.1.4
Author URI: https://masnun.com

*/

//Admin Section
add_action(‘admin_head’, ‘avro_phonetic_styles_admin’);
add_action(‘admin_head’, ‘avro_phonetic’);
add_action(‘admin_footer’, ‘avro_phonetic_notif’);

// Blog View
add_action(“widgets_init”, “avro_phonetic_register_widget”);

add_action(‘wp_head’, ‘avro_phonetic_styles’);
add_action(‘wp_head’, ‘avro_phonetic’);
add_action(‘wp_footer’, ‘avro_phonetic_notif’);

function avro_phonetic_disclaimer()
{
echo ‘Bangla input is proudly powered by <a href=”http://www.masnun.me/2011/11/11/avro-phonetic-wp-plugin.html

” target=”_blank”>Avro Phonetic WP Plugin</a> ‘;
}

function avro_phonetic_register_widget()
{
register_widget(“AvroPhoneticWidget”);
}

function avro_phonetic_styles_admin()
{
?>

<style type=”text/css”>
#avro-phonetic-notif {
border: 0;
position: fixed;
top: 200px;
right: 0;

}
</style>
<?php

}

function avro_phonetic_styles()
{
?>

<style type=”text/css”>
#avro-phonetic-notif {
border: 0;
position: fixed;
top: 200px;
right: 0;

}

</style>
<?php

}

function avro_phonetic_notif()
{
echo ‘<div id=”avro-phonetic-notif”><img src=”https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-english.png” width=”50px” height=”50px” alt=”E” /></div>’;
}

function avro_phonetic()
{
?>
<script type=”text/javascript”>

var root = (document.getElementsByTagName(‘head’)[0] || document.getElementsByTagName(‘body’)[0]);
var ns = document.createElementNS && document.documentElement.namespaceURI;

if (typeof jQuery === ‘undefined’) {
var script = ns ? document.createElementNS(ns, ‘script’) : document.createElement(‘script’);
script.type = ‘text/javascript’;
script.onreadystatechange = function () {
if (this.readyState == ‘complete’) enable_avro();
}
script.onload = enable_avro;
script.src = ‘http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.min.js‘;
root.appendChild(script);
}
else {
enable_avro();
}

function enable_avro() {
jQuery.noConflict();
var script = ns ? document.createElementNS(ns, ‘script’) : document.createElement(‘script’);
script.type = ‘text/javascript’;
script.onreadystatechange = function () {
if (this.readyState == ‘complete’) avro_js_loader();
}
script.onload = avro_js_loader;
script.src = ‘http://torifat.github.io/jsAvroPhonetic/libs/avro-keyboard/dist/avro-v1.1.4.min.js‘;
root.appendChild(script);

preload_avro_images();

}

function avro_js_loader() {
jQuery(function() {
jQuery(‘textarea, input[type=text]’).avro({‘bn’:false}, function(isBangla){
if (isBangla) {
jQuery(“#avro-phonetic-notif”).html(‘<img src=”https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-bangla.png” width=”50px” height=”50px” alt=”অ” />’)
}
else {
jQuery(“#avro-phonetic-notif”).html(‘<img src=”https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-english.png” width=”50px” height=”50px” alt=”E” />’)
}
});

jQuery(“#avro-phonetic-notif”).hide();

jQuery(‘textarea, input[type=text]’).focus(function() {
jQuery(“#avro-phonetic-notif”).show();
});

jQuery(‘textarea, input[type=text]’).blur(function() {
jQuery(“#avro-phonetic-notif”).hide();
});

});

jQuery(function() {
jQuery(‘textarea, input[type=search]’).avro({‘bn’:false}, function(isBangla){
if (isBangla) {
jQuery(“#avro-phonetic-notif”).html(‘<img src=”https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-bangla.png” width=”50px” height=”50px” alt=”অ” />’)
}
else {
jQuery(“#avro-phonetic-notif”).html(‘<img src=”https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-english.png” width=”50px” height=”50px” alt=”E” />’)
}
});

jQuery(“#avro-phonetic-notif”).hide();

jQuery(‘textarea, input[type=search]’).focus(function() {
jQuery(“#avro-phonetic-notif”).show();
});

jQuery(‘textarea, input[type=search]’).blur(function() {
jQuery(“#avro-phonetic-notif”).hide();
});

});
}

function preload_avro_images() {

var avro_preload = [‘https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-bangla.png‘, ‘https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-english.png‘];
var avro_images = [];

for (var i = 0; i < avro_preload.length; i++) {
avro_images[i] = new Image();
avro_images[i].src = avro_preload[i];
}
}
</script>

<?php

}

// WordPress Widget

class AvroPhoneticWidget extends WP_Widget {

function AvroPhoneticWidget()
{
$widget_ops = array(
“classname” => “AvroPhoneticWidget”,
“description” => “Adds Avro Phonetic Layout”
);
$this->WP_Widget(‘AvroPhoneticWidget’, ‘Avro Phonetic’, $widget_ops);
}

function widget($args, $instance)
{
extract($args);
echo $before_widget;
echo $before_title;
echo ‘<img src=”https://github.com/masnun/Avro-Phonetic-WP-Plugin/raw/master/avro-bangla.png” width=”50px” height=”50px” alt=”অ” />’;
echo $after_title;
echo “The blog supports Avro Phonetic. Press <strong>Ctrl + M</strong> to switch keyboard.<br/>”;
avro_phonetic_disclaimer();
echo $after_widget;
}

} –>

উপরের ৬-নং পয়েন্টে বলা সমস্যাটার একটাসমাধান দিতে পারলে খুব ভাল হয়!