a selector in jquery WordPress

Sébastien | French WordpressDesigner comments:

the box ( = the selector) is at the top of the backend, or like a metabox in the edition of each page and post. As you want.

Hai Bui comments:

Please try this: (I used cookies to save the language settings)


<?php
/* Define the language box */
add_action( 'add_meta_boxes', 'mflang_add_custom_box' );

/* Adds the language box to the main column on the Post and Page edit screens */
function mflang_add_custom_box() {
wp_enqueue_script("jquery-cookie");
add_meta_box(
'mflang_id',
'Languages',
'mflang_box',
'post',
'normal',
'high'
);
add_meta_box(
'myplugin_sectionid',
'Languages',
'mflang_box',
'page',
'normal',
'high'
);
}

/* Prints the language box content */
function mflang_box( $post ) {
?>
<div id="mf-lang-bar">
<a id="mf-field-fr" href="#">fr</a>
<a id="mf-field-en" href="#">en</a>
<a id="mf-field-zh" href="#">zh</a>
<a id="mf-field-ja" href="#">ja</a>
<a id="mf-field-all" href="#">all</a>
</div>
<script>
jQuery(document).ready(function($) {
allfields = $('div[class*="mf-field-en"],div[class*="mf-field-fr"],div[class*="mf-field-zh"],div[class*="mf-field-ja"]');
$("#mf-lang-bar a").click(function() {
if ($(this).attr("id") != 'mf-field-all') {
activefields = $('div[class*="' + $(this).attr('id') + '"]');
allfields.not(activefields).hide();
activefields.show();
}
else allfields.show();
setCookie("mf-lang",$(this).attr("id"),365);
return false;
});
savedLang = getCookie("mf-lang");
if (savedLang!="") {
alert(savedLang+"");
$("#"+savedLang).click();
}
});
function setCookie(c_name,value,exdays) {
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name) {
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
x=x.replace(/^\s+|\s+$/g,"");
if (x==c_name) {
return unescape(y);
}
}
}
</script>
<?php

}
?>


You still have to style the links (to make them flags), though. Let me know if there are any problems.

Sébastien | French WordpressDesigner comments:

hey ! that seems perfect ! that works !
i make some tests now

Sébastien | French WordpressDesigner comments:

just comment, please, tle line adding an alert
and add please a class "current" in the flag
:-)) thanks

Sébastien | French WordpressDesigner comments:

is it possible to have only english fields visible as default settings ?
i can increase the fee to 55$
is it ok for you ?

Hai Bui comments:

Sorry about the alert line, I forgot to delete it. Below is the update code following your instructions. If you can increase the prize to $55, that would be great.


<?php
/* Define the language box */
add_action( 'add_meta_boxes', 'mflang_add_custom_box' );

/* Adds the language box to the main column on the Post and Page edit screens */
function mflang_add_custom_box() {
wp_enqueue_script("jquery-cookie");
add_meta_box(
'mflang_id',
'Languages',
'mflang_box',
'post',
'normal',
'high'
);
add_meta_box(
'mflang_id',
'Languages',
'mflang_box',
'page',
'normal',
'high'
);
}

/* Prints the language box content */
function mflang_box( $post ) {
?>
<div id="mf-lang-bar">
<a id="mf-field-fr" href="#">fr</a>
<a id="mf-field-en" href="#">en</a>
<a id="mf-field-zh" href="#">zh</a>
<a id="mf-field-ja" href="#">ja</a>
<a id="mf-field-all" href="#">all</a>
</div>
<script>
jQuery(document).ready(function($) {
allfields = $('div[class*="mf-field-en"],div[class*="mf-field-fr"],div[class*="mf-field-zh"],div[class*="mf-field-ja"]');
$("#mf-lang-bar a").click(function() {
$("#mf-lang-bar a").removeClass("current");
$(this).addClass("current");
if ($(this).attr("id") != 'mf-field-all') {
activefields = $('div[class*="' + $(this).attr('id') + '"]');
allfields.not(activefields).hide();
activefields.show();
}
else allfields.show();
setCookie("mf-lang",$(this).attr("id"),365);
return false;
});
savedLang = getCookie("mf-lang");
if (!savedLang) savedLang = "mf-field-en";
$("#"+savedLang).click();
});
function setCookie(c_name,value,exdays) {
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function getCookie(c_name) {
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
x=x.replace(/^\s+|\s+$/g,"");
if (x==c_name) {
return unescape(y);
}
}
}
</script>
<?php
}
?>


Sébastien | French WordpressDesigner comments:

that doesn't work, it seems.
I clear my cookies but the setting by default seems to be "all"

Sébastien | French WordpressDesigner comments:

i have this problem in FF not in chrome

Hai Bui comments:

Weird... it works for me in all browsers. Are you sure you cleared the cookies?

Sébastien | French WordpressDesigner comments:

it's ok now !