Readium js viewer config language - config

How do i configure the language from readium js viewer to translate the buttons in the audio player.
This is my current configuration:
config : {
'readium_js_viewer/ModuleConfig' : {
'fonts': fontsArray,
'useSimpleLoader' : false,
'epubLibraryPath': undefined,
'canHandleUrl' : false,
'canHandleDirectory' : false,
'workerUrl': undefined,
'epubReadingSystemUrl': undefined
}
}

Just add
navigator.userLanguage = 'es' or the language that you want

Related

IOS loading failure on large (more than 50) images using swiper

trying to build a website with swiper with bigger number of photos.
On various browsers on Mac and PC it works well, but fail on ios safari after more than 50 images are within my images array.
Failure is that IOS Safari try to load the page, refreshes automatically and try again and again, then show a message saying that website loading failed.
Same on IOS Firefox works.
The source I build up using some PHP within a CMS (LEPTON), after collection the image names (without size & extension) within an array:
foreach( $aImages as $image )
{
$div .= ' <div class="swiper-slide" data-title="' . $image . '" >' . PHP_EOL;
$div .= ' <img data-src="' . $imageURL . $image . '_8b.png" data-srcset="' . $imageURL . $image . '_24b.png 1200w" class="swiper-lazy">' . PHP_EOL;
$div .= ' <div class="swiper-lazy-preloader"></div>' . PHP_EOL;
$div .= ' </div>' . PHP_EOL;
}
my JS to initialize the slider looks like:
$(document).ready(function () {
//initialize swiper when document ready
var mySwiper = new Swiper ('.swiper-container', {
/* parameters with different value than default */
// Duration of transition between slides (in ms)
speed: 1400,
// fading effect
effect: 'fade',
fadeEffect: {
crossFade: true
},
// show hand on image
grabCursor: true,
// add visibility class to currently showing image
watchSlidesProgress: true,
watchSlidesVisibility: true,
// Lazy Loading
preloadImages: false,
lazy: {
loadPrevNext: true,
loadPrevNextAmount: 1,
loadOnTransitionStart: true,
},
// continuous loop mode
loop: true,
// double click zoom into image
zoom: false,
// enable keyboard navigation prev/next
keyboard: {
enabled: true,
onlyInViewport: true,
pageUpDown: true,
},
// Navigation arrows
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
hideOnClick: false,
},
// center image
centeredSlides: true,
centeredSlidesBounds: false,
// autoplay
autoplay: {
delay: 3000,
disableOnInteraction: true
},
autoplay: false,
});
Any idea what's wrong or what I can change in order to solve my issue ?
Thx in advance
I think the solution for my problem are the virtual slides ....
Testing this but getting other issues there ....
And the available examples in native JS does not really help.
Update: Finally I got it running with virtual slides.
However there is a bug within combination with fadings.
Without fade parameter it is running.

SimpleWebRTC with switchable Audio and Video call

I am using SimpleWebRTC for Audio Video calls.
I am able to make Video call or Audio call individually as below.
For Audio:
var webrtc = new SimpleWebRTC({
url : myURL,
localVideoEl : 'localAudio',
autoRequestMedia : true,
remoteVideosEl : '',
debug : false,
detectSpeakingEvents : true,
autoAdjustMic : false,
media : {
video : false,
audio : true
},
receiveMedia : {
offerToReceiveAudio : 1,
offerToReceiveVideo : 0
}
});
For Video
webrtc = new SimpleWebRTC({
url : result,
localVideoEl : 'localVideo',
remoteVideosEl : '',
autoRequestMedia : true,
debug : false,
detectSpeakingEvents : true,
autoAdjustMic : false
});
My Video element:
<video id="localVideo" style="height: 200px;" oncontextmenu="return false;"></video>
With events:
webrtc.on('videoAdded', function (video, peer) {
console.log('video is added', peer);
});
How can I switch video stream to audio one? Or vice versa? How can I effectively convert active video call to audio one, or and Audio call to video one without making a new SimpleWebRTC object?
I am okay with workarounds, if any.
I have tried is make a video call, and make use webrtc.pauseVideo(); which still transmits the stream and uses my camera and bandwidth. I certainly don't want that.

Event SelectField Sencha Touch 2.1 and Using Store and Model in it. (in Sencha Architect 2)

I begin learn about Sencha Touch 2. So, I have had many problems to ask! ^^ Let's research it.
Now I have a data json like:
{
result: "SUCCESS",
national: [
"Afghanistan",
"Albania",
"Albania",
"Algeria",
"American Samoa",
"Andorra"
]
}
Then, I will load it from url: nation.php file.
How can i load it to My Select Field.??????
Share and Support to me.! Thanks :).
I don't know how to do this in Sencha Architect 2 ( i am not using it).. but still
Instead of asking question without try (I mean you didn't post tried code here), Better you start with Sencha Touch Documentation.
Anyway, you can do it as follows
Model
Ext.define('AppName.model.countries', {
extend : 'Ext.data.Model',
config: {
fields: [
{name: 'name', convert: function(value, record) {
return record.raw;
}}
],
}
});
Store
var myStore = Ext.create("Ext.data.ArrayStore", {
model : 'AppName.model.countries',
proxy: {
type: "ajax",
url : "nation.php",
reader: {
type: 'json',
rootProperty : function(data) {
return data.national;
}
}
},
autoLoad: true
});
Select Field in View
Ext.create('Ext.form.Panel', {
fullscreen: true,
items: [{
xtype: 'selectfield',
store: myStore ,
valueField:'name',
displayField:'name'
}]
});
With Viswa's Support. :) I found this problem - XMLHttpRequest cannot load. Origin is not allowed by Access-Control-Allow-Origin error (browser policy security).
And Sencha Touch document say: " The JsonP proxy is useful when you need to load data from a domain other than the one your application is running on. If your application is running on http://domainA.com it cannot use Ajax to load its data from http://domainB.com because cross-domain ajax requests are prohibited by the browser.
" Also, All we need to do is - "Implement all api in Your Webserver" and Follow JsonP's format code: ( in PHP)
$callback = $_REQUEST['callback'];// check callbackkey
// Create the output object.
$output = array('a' => 'Apple', 'b' => 'Banana');// output data.
//start output
if ($callback) {
header('Content-Type: text/javascript');
echo $callback . '(' . json_encode($output) . ');';
} else {
header('Content-Type: application/x-json');
echo json_encode($output);
}
If. Using Sencha Touch 2.1, You can use:
Ext.data.JsonP.request({
url: 'http://otherdomain/svn_visaapi/trunk/api/visa_api.php/test_json',
callbackKey: 'callback',
success: function(result) {
console.log(result);
//Your success function here...
}
});
- If, Using Sencha Architect, you can use a Store.proxy.JsonP to call api.
- Read more document Sencha Touch 2.1 to see that.

Dojo custom language variants

Does Dojo support creation of custom language variants to be used for with Dojo's locale and i18n
Does anyone know if I am able to create a custom language variant for Dojo's locale that works with i18n?.
Example
define({
root: {
greeting: "Hello, world!"
}
"de-myVariant" : true
});
Yes, it can be done. If you have nls/SampleApp.js as:
define({
root: {
greeting: "Hello!"
}
"de" : true,
"de-at": true,
"de-x-mundl": true
});
then there would be three sub-directories under nls:
nls/de
nls/de-at
nls/de-x-mundl
for nls/de/SampleApp.js:
define(({
greeting: "Hallo!"
}));
for nls/de-at/SampleApp.js:
define(({
greeting: "Gruß Gott!"
}));
and for nls/de-x-mundl/SampleApp.js:
define(({
greeting: "Servus, Mundi!"
}));
Then if you config Dojo to get the locale as a URL parameter:
<script src="./dojo/1.8.3/dojo/dojo.js"
data-dojo-config="locale: location.search.substring(1).toLowerCase()">
</script>
you can switch the language easily by passing the locale tag as that parameter:
.../app.html?de-DE
.../app.html?de-at
.../app.html?de-x-Mundl
Note that Dojo considers locale tags as case-sensitive and that's why the input is toLowerCase()ed and internally all the tags are kept in lower-case.

File upload with extjs4

i am working on Extjs4 file upload control. i have view with file upload control as-
Ext.define('Balaee.view.kp.dnycontent.Content',
{
extend:'Ext.form.Panel',
requires:[
'Balaee.view.kp.dnycontent.ContentView'
],
id:'ContentId',
alias:'widget.Content',
enctype : 'multipart/form-data',
title:'This day in a history',
items:[
{
xtype: 'fileuploadfield',
hideLabel: true,
emptyText: 'Select a file to upload...',
//inputType: 'file',
id: 'upfile',
width: 220
}],
buttons: [{
xtype : 'button',
fieldlabel:'upload',
action:'upload',
name:'upload',
text: 'Upload',
formBind:'true'
}]
});
And corresponding action in controller is-
getUpload : function() {
var file10 = Ext.getCmp('ContentId').getEl().down('input[type=file]').dom.files[0];
var reader = new FileReader();
reader.onload = function(oFREvent) {
fileobj=oFREvent.target.result;
console.log(oFREvent.target.result);
};
}
});
So above controller's function is retriving uploaded file and displaying it in encoded format inside reader's onload function. i.e. "console.log(oFREvent.target.result);" line is displaying uploaded file's data in encoded format in console. I need to send this file to server side. So i am passing above fileobj as parameter to store as-
var storeObj=this.getStore('kp.DnycontentStore');
storeObj.load({
params:{
data:fileobj
},
callback: function(records,operation,success){
console.log("send");
},
scope:this
})
But its showing fileobj as undefined outside reader.onload function. So how to send this file along with its contents to server side? Is there any other way to get uploaded file in controller and send it to server. Please can someone guide me.
I dont know how to handle fileuplaod on php side, but the return response from the server needs to be text/html encoded
See the docs on this:
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.form.Basic-method-hasUpload
also example PHP fileupload script:
http://www.w3schools.com/php/php_file_upload.asp