I want to load the URL when the new window is open, but I have an error ERR_INVALID_URL (-300) loading ' '
This is my javascript code
function newWindow(RoomName) {
const remote = require('electron').remote;
const BrowserWindow = remote.BrowserWindow;
const url = require('url');
const path = require('path');
const videoWindow = new BrowserWindow({
title: "Video Conference",
width: 1200,
height: 660
});
videoWindow.loadURL('/new-video-conference/{RoomName}')
//the url form razor page #page "/new-video-conference/{RoomName}"
videoWindow.on('closed', () => {
videoWindow = null
})
}
Related
I have an component that displays and image either taken by camera or selected from gallery. The point is when a user clicks the upload button i should send that Image to my server, but i am having difficulties extracting the file from the Image component.
<Image ref="profileImage" borderRadius="100" width="150" height="150" marginTop="20" stretch="aspectFill" :src="profileImage" />
And i have two functions for picking an image or capturing one
capture: function() {
var isAvailable = camera.isAvailable();
if (isAvailable) {
var options = {
width: 300,
height: 300,
keepAspectRatio: false,
saveToGallery: false,
cameraFacing: 'front'
};
var self = this;
var imageModule = require("tns-core-modules/ui/image");
camera.requestPermissions().then(
function success() {
camera.takePicture(options)
.then(function(imageAsset) {
self.profileImage = imageAsset;
}).catch(function(err) {
console.log("Error -> " + err.message);
});
},
function failure() {
// permission request rejected
}
);
}
},
pick() {
var self = this;
let context = imagepicker.create({
mode: 'single',
mediaType: 'image'
});
context.authorize()
.then(function() {
return context.present();
})
.then(selection => {
selection.forEach(selected => {
self.profileImage = selected;
});
}).catch(function(e) {
console.log('error in selectPicture', e);
});
},
What i need to do next is get the uploaded image and send it to server but i can't seem to find an options for that, i have the src of the and that's it in this case...
You can simply get ImageSource from ImageAsset and write it as file in data or temp directory, then upload it to server.
const imageSourceModule = require("tns-core-modules/image-source");
const fileSystemModule = require("tns-core-modules/file-system");
function uploadAsset(asset) {
imageSourceModule.fromAsset(asset)
.then(function(imageSource) {
var folderDest = fileSystemModule.knownFolders.documents();
var pathDest = fileSystemModule.path.join(folderDest.path, "test.png");
var saved = imageSource.saveToFile(pathDest, "png");
if (saved) {
console.log("Image saved successfully!");
// Now file is written at path `pathDest`
}
}).catch(function(err) {
console.log(err);
});
}
....
uploadAsset(profileImage);
Learn more at docs
I'm trying to send messages to my main window like show and hide, but it keeps saying that my main window is undefined. I'm not sure why. When i try assigning the result of open on the window manager the api says that it returns the object, but that doesn't seem to work how i understand it. Could you guys help me?
const electron = require('electron')
const Menu = require('electron').Menu
var path = require('electron').path
var windowManager = require('electron-window-manager');
const app = electron.app
const BrowserWindow = electron.BrowserWindow
var Tray = require('electron').Tray
var nativeImage = require('electron').nativeImage
var tray = null
var myValue;
var mainWindow;
const notifier = require('node-notifier');
var notified = 0;
// Modify the user agent for all requests to the following urls.
const filter = {
urls: ['https://*.github.com/*', '*://electron.github.io']
}
app.on('ready', function(){
var icon1 = nativeImage.createFromPath(`${__dirname}/../build/timer.png`)
tray = new Tray(icon1)
tray.setToolTip('Timer')
var icon2 = nativeImage.createFromPath(`${__dirname}/../build/timer.png`)
var contextMenu = Menu.buildFromTemplate([
{ label: 'Open Window', click: function(){
windowManager.get('home').show();
} },
{ label: 'Exit', click: function(){
app.isQuiting = true;
app.quit();
}
}
]);
tray.setContextMenu(contextMenu)
tray.setImage(icon1)
tray.on('click', () => {
windowManager.open('home', 'welcome', `file://${__dirname}/index.html`)
})
windowManager.init({
'onclose': function(event){
event.preventDefault()
}
});
// Open a window
windowManager.open('home', 'welcome', `file://${__dirname}/index.html`);
//mainWindow.loadURL(`file://${__dirname}/index.html`)
notifier.on('click', function(notifierObject, options) {
windowManager.get("home").show();
notified = 0;
})
notifier.on('timeout', function (notifierObject, options) {
// Triggers if `wait: true` and notification closes
mainWindow.show();
notified = 0;
});
/*
mainWindow.on('minimize',function(event){
event.preventDefault()
mainWindow.hide();
});
mainWindow.on('close', function (event) {
if( !app.isQuiting){
event.preventDefault()
mainWindow.hide();
}
return false;
});
*/
})
I found the solution. windowManager.createNew(....) only gives you a window object, in order to get a browser window, which allows you to show, hide, and add listeners, you do something like this
mainWindow = windowManager.createNew('home', 'welcome', file://${__dirname}/index.html);
mainWindow.create();
mainWindow.object.show();
I'm creating a firefox extension using Add-on SDK, which will display all the tab details including memory, title and url. I have tried to get the tab title using require("sdk/tabs"); tab package.
Below is the sample code:
popup.js
<body>
<ul>
<li>
Settings
</li>
</ul>
<script type="text/javascript" src="popup.js"></script>
</body>
popup.js
var tab_button = document.getElementById("tab_list");
tab_button.addEventListener("click", function() {
addon.port.emit("GET_TABS");
});
main file: index.js
const buttons = require("sdk/ui/button/action");
const { TogglePanel } = require("popupPanel");
var button = buttons.ActionButton({
id: "mem-tools",
label: "tabs info listing",
icon: {
"16": "./tab.png",
},
onClick: handleClick
});
let togglePanel = new TogglePanel();
function handleClick(state) {
togglePanel.panel.show({position:button});
}
Panel file: popupPanel.js
var Panel = require('sdk/panel');
var self = require('sdk/self');
var { MemoryHandler } = require('memory-handler');
var memoryHandler = new MemoryHandler();
function TogglePanel() {
this.panel = new Panel.Panel({
width: 150,
height: 200,
contentURL: self.data.url("popup.html")
});
this.panel.port.on("GET_TABS", function() {
memoryHandler.getAllTabs();
});
}
exports.TogglePanel = TogglePanel;
memory-handler.js
var tabs = require('sdk/tabs');
function MemoryHandler() {
return {
getAllTabs: () => {
for(let tab of tabs) {
console.log(tab.title);
}
}
}
}
exports.MemoryHandler = MemoryHandler;
This code only fetching all tab titles from the main window and child window, but not from all other new window's tabs which is opening using _blank attribute.
Note: we can easily recreate the issue just create an html page and use the below code:
Visit me
The page open using the "_blank" attribute is not coming under the tabs array.
Any help is appreciated.
Thanks in advance!!
We can get all the titles from all the window tabs by creating a custom array.
index.js
var memoryHandler = new MemoryHandler();
tabs.on('ready', function(tab) {
memoryHandler.addTabDetails({id: tab.id ,title: tab.title, url: tab.url});
});
If you want to get the title which is setting by using javascript after page load, you can inject a mutation observer code in the content script of tab
memory-handler.js
var presentTabs = []
function MemoryHandler() {
return {
addTabDetails: (tab_array) => {
presentTabs.push(tab_array);
}
}
}
exports.MemoryHandler = MemoryHandler;
Help, I need call the http.request for send Image captured in camera api in my NativeScript App.
I capture the photo in camera api for nativescript and need send to api in upload process.
Follow the code about this process:
var frameModule = require("ui/frame");
var viewModule = require("ui/core/view");
var Observable = require("data/observable").Observable;
var config = require("../../shared/config");
var cameraModule = require("camera");
var imageModule = require("ui/image");
var http = require("http");
exports.loaded = function(args) {
var page = args.object;
viewModel = new Observable({
coleta: config.id_coleta
});
page.bindingContext = viewModel;
};
exports.voltar = function() {
var topmost = frameModule.topmost();
topmost.navigate("views/ocorrencia/menuocorrencia");
};
function tapFoto() {
cameraModule.takePicture({
width: 300,
height: 300,
keepAspectRatio: true
}).then(function(picture) {
var image = new imageModule.Image();
image.imageSource = picture;
var item = {
itemImage: picture
};
var urlfoto = "http://192.1.1.1:8090/sendphoto/upload";
alert("URL: " + urlfoto);
http.request({
url: urlfoto,
method: "POST",
headers: {
"Content-Type": "multipart/form-data"
},
content: ({uploadFile: image.imageSource, entrega: config.id_coleta})
}).then(function (response) {
var statusCode = response.statusCode;
alert("Codigo Retorno: " + statusCode);
alert("Foto registrada com sucesso.");
}, function (e){
alert("Erro: " + e);
});
});
}
exports.tapFoto = tapFoto;
I recommend using of nativescript-background-http plugin for uploading files.
tns plugin add nativescript-background-http
Here is your code modifed to work with the installed plugin:
"use strict";
var Observable = require("data/observable").Observable;
var cameraModule = require("camera");
var fs = require("file-system");
var bghttpModule = require("nativescript-background-http");
var session = bghttpModule.session("image-upload");
var viewModel = new Observable();
function navigatingTo(args) {
var page = args.object;
page.bindingContext = viewModel;
}
exports.navigatingTo = navigatingTo;
function onTap() {
cameraModule.takePicture({
width: 300,
height: 300,
keepAspectRatio: true
}).then(function (imageSource) {
console.log("Image taken!");
var folder = fs.knownFolders.documents();
var path = fs.path.join(folder.path, "Test.png");
var saved = imageSource.saveToFile(path, "png");
var request = {
url: "http://httpbin.org/post",
method: "POST",
headers: {
"Content-Type": "application/octet-stream",
"File-Name": "Test.png"
},
description: "{ 'uploading': " + "Test.png" + " }"
};
var task = session.uploadFile(path, request);
task.on("progress", logEvent);
task.on("error", logEvent);
task.on("complete", logEvent);
function logEvent(e) {
console.log("----------------");
console.log('Status: ' + e.eventName);
// console.log(e.object);
if (e.totalBytes !== undefined) {
console.log('current bytes transfered: ' + e.currentBytes);
console.log('Total bytes to transfer: ' + e.totalBytes);
}
}
});
}
exports.onTap = onTap;
kendo UI chart API not working in ie9.Its working fine in chrome, firefox and ie10.I didn't get any exception in ie9.simply page refreshed.please see below code is not working in ie9
$("#btnExportToPDFView").click(function () {
// Convert the DOM element to a drawing using kendo.drawing.drawDOM
kendo.drawing.drawDOM($(".content-wrapper"))
.then(function (group) {
// Render the result as a PDF file
return kendo.drawing.exportPDF(group, {
paperSize: "auto",
margin: { left: "1cm", top: "1cm", right: "1cm", bottom: "1cm" }
});
})
.done(function (data) {
// Save the PDF file
kendo.saveAs({
dataURI: data,
fileName: "Reports.pdf"
//proxyURL: "http://demos.telerik.com/kendo-ui/service/export"
});
});
});
The kendo documentation here says that IE9 requires the use of the proxyURL that you have commented out in your code. You will need a service that can "return the decoded file with set "Content-Disposition" header."
Here is an example of a web service that you could use:
var response = System.Web.HttpContext.Current.Response;
var request = System.Web.HttpContext.Current.Request;
var fileName = request.Params["fileName"];
var contentType = request.Params["contentType"];
var encodedString = request.Params["base64"];
byte[] bytes = Convert.FromBase64String(encodedString);
response.Clear();
response.ClearHeaders();
response.ContentType = contentType;
response.AddHeader("Content-Disposition", "attachment; filename=\"" + fileName);
response.OutputStream.Write(bytes,0,bytes.Length);
response.Flush();
response.End();