I open a second window like that... its possible change the user-agent or other values for this window??
var new_win = gui.Window.open('http://google.com', {
position: 'center',
width: 300,
height: 300
//,show: false
});
I need change randomly this params(headers) for that my application works fine.
im using:
node-webkit v0.11.4
node.js v0.11.13-pre
Chromium 38.0.2125.104
commit hash: fa7a807-d8ecacd-e98a5c7-f2f89e2-d9a9d39-cdd879e
I don't find any solution to change the user-agent in Window.open.
But you can use iframe#nwUserAgent to change it .
For example:
index.html
var new_win = gui.Window.open('iframe.html', {
position: 'center',
width: 300,
height: 300
//,show: false
});
iframe.html
<iframe src="http://google.com" nwUserAgent="test" style="width:100%;height:100%"></iframe>
Related
I am using jsPdf to export table data as pdf file, I have about 50 columns in my table.
but i am not able to see all columns in pdf. only few col are visible rest seems out of page, but there is no scrollbar in pdf file.
please suggest how to get a horizontal scrollbar on pdf page.
Below is my code snippet :
exportPDF(myTableHeaders,myTableData) {
const pdf = new jsPDF();
pdf.setFont("helvetica");
pdf.setFontSize(6);
;
let headerConfig = myTableHeaders.map((header) => ({
name: header.fieldName,
prompt: header.label,
width: 30,
align: "center",
fontSize: 6,
padding: 0,
}));
pdf.table(20, 30, myTableData, headerConfig);
pdf.save("pdf.pdf");
}
Below is snap :
I got a navwheel generated from https://pmg.softwaretailoring.net/ but after going through their documentation I can't figure out how to add spcaing between the items in the wheel. They're cluttered together. Is there any function on the wheelnav object instantiated that I don't know of? I tried to go through their .js files to find it manually, but can't find anything.
You can use the stroke-width property with your background color to achieve spacing.
When cssMode is true use the following CSS.
[id|=wheelnav-wheelDiv-slice] {
fill: white;
stroke: *background-color*;
stroke-width: 10px;
cursor: pointer;
}
More info here: https://wheelnavjs.softwaretailoring.net/documentation/css3.html
Without cssMode use the following JavaScript.
var wheel = new wheelnav("wheelDiv");
wheel.slicePathAttr = { stroke: "*background-color*", "stroke-width": 10, cursor: 'pointer' };
wheel.sliceHoverAttr = { stroke: "*background-color*", "stroke-width": 10, cursor: 'pointer' };
wheel.sliceSelectedAttr = { stroke: "*background-color*", "stroke-width": 10, cursor: 'default' };
wheel.createWheel(["First", "Second", "Third", "Fourth"]);
Alternatively, you can create your own slicePath via customization.
More info here: https://wheelnavjs.softwaretailoring.net/documentation/slicePath.html#tutorial
I'm playing around with the react-VR framework and can't seem to find anything in the docs about entering vr mode on chrome/cardboard ? Any help or pointers much appreciated.
Here is my part of the code while creating a WebVR tour
<View>
<Pano source={asset(this.state.current_scene['scene_image'])} onInput={this.onPanoInput.bind(this)}
onLoad={this.sceneOnLoad} onLoadEnd={this.sceneOnLoadEnd}
style={{ transform: [{translate: [0, 0, 0]}] }}/>
{this.state.current_scene['navigations'].map(function(item,i){
return <Mesh key={i}
style={{
layoutOrigin: [0.5, 0.5],
transform: [{translate: item['translate']},
{rotateX: item['rotation'][0]},
{rotateY: item['rotation'][1]},
{rotateZ: item['rotation'][2]}]
}}
onInput={ e => that.onNavigationClick(item,e)}>
<VrButton
style={{ width: 0.15,
height:0.15,
borderRadius: 50,
justifyContent: 'center',
alignItems: 'center',
borderStyle: 'solid',
borderColor: '#FFFFFF80',
borderWidth: 0.01
}}>
<VrButton
style={{ width: that.state.animationWidth,
height:that.state.animationWidth,
borderRadius: that.state.animationRadius,
backgroundColor: '#FFFFFFD9'
}}>
</VrButton>
</VrButton>
</Mesh>
})}
</View>
onNavigationClick(item,e){
if(e.nativeEvent.inputEvent.eventType === "mousedown" && e.nativeEvent.inputEvent.button === 0){
var new_scene = this.state.scenes.find(i => i['step'] === item.step);
this.setState({current_scene: new_scene});
postMessage({ type: "sceneChanged"})
}
}
sceneOnLoad(){
postMessage({ type: "sceneLoadStart"})
}
sceneOnLoadEnd(){
postMessage({ type: "sceneLoadEnd"})
}
this.sceneOnLoad = this.sceneOnLoad.bind(this);
this.sceneOnLoadEnd = this.sceneOnLoadEnd.bind(this);
this.onNavigationClick = this.onNavigationClick.bind(this);
Maybe you will find something helpful for you also here
for desktop Chrome there is flag: chrome://flags/#enable-webvr
after you enable it and restart Chrome the button "View in VR" will appear, but unfortunately I didn't see any changes when I click it.
I also have tried it on experimental developers build of Chromium, but there was even more flags that should be enabled.
a lot of stuff about tuning your browser is here:
https://superuser.com/questions/836832/how-can-i-enable-webgl-in-my-browser
chrome://gpu/ is very handy to check your 3D environment and don't forget that in some cases (usually on laptops) you can run your browser on integrated videocard instead of powerful GPU, so resluts could be extremly different.
and finally you can check source code of node_modules/ovrui/dist/ovrui.js function attemptEnterVR() to understand better what should happens when you try to switch to VR mode.
Like Pavel Sokolov said, by default WebVR is not enabled and requires updating in the chrome://flags section. This will enable the Show in VR button. However, the current version of Chrome (57) has issues with WebVR, which may result in a black screen for you. In that case, try out Chrome Canary instead, I've had success using it.
I wrote a guide about getting my Cardboard up and running with React-VR, you can read it here.
So i have this code:
var answerView = Ti.UI.createScrollView({ //var added
top: Ti.Platform.displayCaps.platformHeight*0.55,
left:Ti.Platform.displayCaps.platformWidth*0.1,
width: Ti.Platform.displayCaps.platformWidth*0.8,
backgroundImage: '/images/labelBackground.png',
borderRadius: 8,
height: Ti.Platform.displayCaps.platformHeight*0.5,
contentHeight:'auto',
showHorizontalScrollIndicator:true,
scrollType:'vertical',
});
for (var j = 0; j < question.answers.length; j++){
var row = createRow(question.answers[j]);
answerView.add(row);
}
and this function:
function createRow(answer) {
var row = Ti.UI.createView({
width:'100%',
height: 'auto',
});
var answerButton = Ti.UI.createButton({
top: '1%',
left: '1%',
title: answer.answer,
value: answer.order,
width:'98%',
font : {fontSize:'12sp'},
});
row.add(answerButton);
return row;
}
The problem is, the darn thing overlays all the buttons into one... that is, it isn't "pushing down" the rows. From the titanium tutorial here:
http://docs.appcelerator.com/titanium/2.1/index.html#!/api/Titanium.UI.ScrollView
I would have thought this would work, but it doesn't. I know i can do some magic with the numbers and send each row the position it should have, but I thought maybe titanium would be clever enough to do that? Am i missing something?
Oh jesus.
Titanium is moronic in this instance - the problem was I had
height: 'auto' in the definition of each row - that is:
function createRow(answer) {
var row = Ti.UI.createView({
width:'100%',
height: 'auto',
});
...
And funnily enough, that makes each row REALLY BIG, probably as big as the entire space alloted for the row. I don't know, i never tried to scroll through it. So just change the height value for the row to something sane - i always base mine off the display height.
Now I have
function createRow(answer) {
var row = Ti.UI.createView({
width:'100%',
height: Ti.Platform.displayCaps.platformHeight*0.1,
});
...
and all is well.
Okay, guys -- I have to admit that my frustration level is growing as Titanium development continues to kick my backside. Every change I make, however innocuous it may appear, seems to break something else in a completely unexpected way.
Today, I'm simply trying to add a label to a view, but it's not displaying.
// UI Factory Include
var Inova = {};
Ti.include( '_ui.js' );
var win = Ti.UI.currentWindow;
win.layout = 'vertical';
// Header
win.add( Inova.ui.createHeaderView() );
// body
var body = Ti.UI.createView({
backgroundColor:'#00f', // Should see no blue
backgroundImage: '/images/body.png',
height: 350,
layout: 'vertical',
});
var label = Ti.UI.createLabel({
color: '#000',
text: 'Show me the label...please?',
textAlign: 'center',
});
body.add( label );
win.add( body );
I know I have to be missing something incredibly stupid and basic, but I think I've lost all ability to see the obvious. Help?
I think you need to explicitly set the width/height in the label. You can set it to width: 'auto', height: 'auto' but it has to be set.
(Oddly enough this is not true in Andriod, from my experiences).
Whenever I get flummoxed by the API, I return to the basics. Try this:
Create a new project called myTest. In the apps.js file add the following code to the bottom of the file above the last line
var win3 = Titanium.UI.createWindow({
title:'Tab 3',
backgroundColor:'#fff'
});
var tab3 = Titanium.UI.createTab({
icon:'KS_nav_ui.png',
title:'Tab 3',
window:win3
});
var label3 = Titanium.UI.createLabel({
color:'#999',
text:'I am Window 3',
font:{fontSize:20,fontFamily:'Helvetica Neue'},
textAlign:'center',
width:'auto'
});
var txtLabel = Ti.UI.createLabel({
color: '#000',
text: 'Show me the label...please?',
textAlign: 'center',
left: 100,
top: 50
});
win3.add( txtLabel );
win3.add(label3);
Your label, txtLabel, will now appear below label3 on tab3. I tried using the code you provided, but failed to get it to work as well. So, start with a basic page that shows the label, then add the other components until you get the expected results.
Hope that helps.