How can I make a chrome packaged app which runs in fullscreen at startup? - google-chrome-app

Currently it seems that the fullscreen ability can only be activated from a user action (mouse/keyboard event). Is there a way to circumvent this?

Now, you can just add the state:"fullscreen" property on your main .js:
chrome.app.runtime.onLaunched.addListener(
function() {
chrome.app.window.create('index.html',
{
state: "fullscreen",
}
);
}
);
Make sure you don't add resizable: false or bounds properties, and you add a "fullscreen" permision on the manifest.json.
{
...
"permissions": [
...
"fullscreen"
]
}

You can use the HTML5 Fullscreen API, which requires a user action:
button.addEventListener('click', function() {
document.body.webkitRequestFullscreen();
});
or the more "app-y" way using the AppWindow object, which doesn't require a user action:
chrome.app.window.current().fullscreen();
Both need the "fullscreen" permission in the manifest.json.

I have got it working with below code
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('index.html', {
'width': 1024,
'height': 768
},
function(win) {
win.maximize();
});
});

Check out https://plus.google.com/100132233764003563318/posts/2SuD7MVd8mG referring to recently landed changelist https://chromiumcodereview.appspot.com/12205002. You can lift sample code from either of those sources:
document.body.addEventListener('click', function() {
document.body.webkitRequestFullscreen();
});
Make sure in your manifest you're requesting the "fullscreen" permission and that you're testing on a sufficiently recent Chrome build (beta channel ought to have this feature by now, and dev definitely does).
Your question specifically refers to packaged apps, but in case anyone reading this answer missed this, this will work only with Chrome packaged apps.

main.js
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('index.html',{},function(window) {
window.fullscreen();
});
});
manifest.json
{
...
"manifest_version": 2,
"minimum_chrome_version": "23",
"app": {
"background": {
"scripts": ["main.js"]
}
},
"permissions": ["fullscreen"]
}

Edit: Per BeardFist's comment, my original answer was wrong on two fronts. You can do this on a Chrome Extension (which this is tagged as), but probably not on a packaged app.
For extensions you can make it go fullscreen using the state:"fullscreen" option, which can be applied with chrome.window.update. The code below chains the creation of the window via chrome.windows.create with chrome.window.update. In my experiments you could not set the fullscreen state directly through the window creation.
chrome.windows.create(
{url:"PATH/TO/POPUP"},
function(newWindow) {
chrome.windows.update(newWindow.id, {state:"fullscreen"})
});

Related

How to change the shell title in Fiori App

I am looking at changing the ShellAppTitle in a Fiori app. Refer the highlighted part in the snapshot below:
I already know a way to to this which I am not proud of:
sap.ui.getCore().byId("shellAppTitle").getText() /.setText()
Is there any better approach to achieve this?
The only improvement I could think of is to implement this via the FLP ShellUIService rather than the getCore() method. The reason being that if SAP changes the id of the header text, your code will break since it is not designed to work this way.
To implement the service, first declare it in your manifest.json:
{
...
"sap.ui5": {
"services" : {
"ShellUIService": {
"factoryName": "sap.ushell.ui5service.ShellUIService"
}
}
}
...
}
Then, you can access it in your Component.js via the following code:
// Component.js (the app root component)
...
this.getService("ShellUIService").then( // promise is returned
function (oService) {
oService.setTitle("Application Title"); // also could use .getTitle() first
},
function (oError) {
jQuery.sap.log.error("Cannot get ShellUIService", oError, "my.app.Component");
}
);
...
The full documentation can be found in the SAPUI5 SDK

How to setMapToolbarEnabled on ionic 2 google maps native

I'm trying to disable the toolbar on android but am receiving setMapToolbarEnabled does not exist on type GoogleMap.
this.map.setMapToolbarEnabled(false);
is there another way to do this? I tried this too, and it didn't work.
this.map = this.googleMaps.create(element, {
'backgroundColor': 'white',
'controls': {
'compass': false,
'mapToolbar':false
},
Any ideas?
it works just dont forget to add api in the app.moel.ts in the proovider also
https://www.joshmorony.com/integrating-native-google-maps-into-an-ionic-2-application/

Sencha Cmd disable compressor

Does anyone know how to remove compression of javascript file in sencha cmd?
I want that my production app.js file what fully readable.
And I want to configure this in my app.json if possible.
I did this:
/**
* Settings specific to production builds.
*/
"production": {
"compressor": null, // compressor null
"output": {
"js": {
"optimize": false, // optimize false
},
"appCache": {
"enable": false,
"path": "../cache.appcache"
}
},
"loader": {
"cache": "${build.timestamp}"
},
"cache": {
"enable": false
}
}
But whereas the compressor option work, at the end my file is still "compressed" (not minified but still in one line).
I try the optimize method in the ideal situation, I would like all Sencha Cmd optimization to be perform except to shrink everything in one line...
If somebody know.
Thanks in advance!
thanks to #bnz, the proposed answer was not fully right but it helps me found the solution.
So, to disable the last compression of the app.js file during the build process, you have to go to your <appFolder>/.sencha/app/production.properties and this directive:
enable.resource.compression=false
I did not found yet how to set this in the app.json
No answer worked for me, but I found further possible solutions at Sencha Forum (that worked): https://www.sencha.com/forum/showthread.php?315722-How-to-ignore-compression-in-production-build
I leave it here for future people reaching this thread :)
[copied from the link]
Sencha Cmd v6.5.3.16:
app.json:
"production": {
"compressor": {
"type": "none"
}
}
To disable optimizations:
"output": {
"js": {
"optimize": false
}
}
Sencha Cmd 6.2.2.36 (change all the following):
app.json:
"production": {
"compressor": {
"type": "none"
}
}
.sencha/app/production.properties:
enable.resource.compression=false
Using app.json you can add
"debug" : {
"enable":false/true
}
to your production build object.
If you wanna disable this in general, until the next app upgrade,
you can have a look under
.sencha/app/production.defaults.properties
OR better to overwrite the settings
.sencha/app/production.properties
You need to set
build.options.debug=true
there.

Fancytree properties for setting maxHeight, minHeight

I want to give maxHeight and minHeight like below to my fancytree.
$("#tree").fancytree({
checkbox: true,
selectMode: 3,
autoSize: false,
fitToView: false,
minHeight: 300,
maxHeight: 600,
source: {
url: '#Url.Action("GetTerritories1", "Step1")',
dataType: "json",
success:function(data)
{
},
error:function(data, ajaxOptions, thrownError)
{alert(thrownError);}
},
lazyLoad: function(event, data){
// we can't return values from an event handler, so we
// pass the result as `data`attribute.
// alert('lazy call');
data.result = $.ajax({
url: '#Url.Action("GetTerritories1", "Step1")',
data: {mode: "children", nodeid: data.node.key}
});
}
});
});
I have gone through the documentation but could not determine if this is possible. Would there be another way to do this if not?
So fancytree is a jQuery plugin that I'm assuming you downloaded from this Github Project. There is some documentation, but as it is an Open Source project learning the project is really what you have to task yourself with. Usually learning the ins and outs is how to go.
Based on your question.
No. These options are the only options that are able to be used with fancytree. Depending on what you want to achieve it is possible to apply a min-width or min-height to an element via CSS or Javascript in almost any scenario. If you would like to make it more clear I can potentially provide an example of this, but as of now you cannot use options for this.
It may be a good idea to open an issue with the project on Github and request this as a functionality. You can open an issue by creating an account and going here. If the author or other contributors like your idea and it is well explained they may help you out!

Chrome Extension - Duplication of the event listener?

Introduction
I've got a problem with my extension for Chrome. It supposed to show a small overlay popup window (created in jQuery) with search results from google based on your text selection. Basically you should be able to highlight a text on any page, right click on it (context menu), click on "Search for 'selected keyword'" and a small window pops up in the same tab as an overlay with all search results from google or different search engine.
The problem
Now the extension works really well and without problems, HOWEVER after extensive using of this extension (let's say 1 hour) when I'll highlight another keyword and search for it, extension REMEMBERS last keyword and shows wrong search results. Then again, when I'll highlight another keywords it rememebrs the keyword I've just highlighted but previously didn't get the results for it. It's like a chaining process and I'm always one keyword behind.
My thoughts
I think that the cause of this problem might be event listeners, because when this problem occurs I've got a log from console.log(chrome.extension.onRequest.hasListeners()); which says true. It means that there are 2 or more event listeners attached and they shouldn't as I'm removing them by chrome.extension.onRequest.removeListener(listener1);
Maybe it happens when the actual web page is still loading and I'm highlighting keyword, clicking on context menu and extension can't load yet but somehow event listeners firing... I really can't fully replicate this problem... and what causes this problem.
Manifest File
{
"name": "Search Accelerator",
"version": "1.0",
"manifest_version": 2,
"description": "Search Accelerator extension",
"icons": {
"16": "icon19.png",
"48": "icon48.png",
"128": "icon128.png"
},
"background": {
"scripts": ["content_script.js"]
},
"minimum_chrome_version": "18",
"permissions": [
"contextMenus",
"tabs",
"http://*/*",
"https://*/*",
"management",
"webRequest"
]
}
Content Script
chrome.contextMenus.create({ "title": 'Search for "%s"',
"contexts":['selection'], "onclick": getClickHandler() });
function getClickHandler() { return function(info, tab) {
console.log(chrome.extension.onRequest.hasListeners());
chrome.extension.onRequest.addListener(function listener1 (request, sender, sendResponse) {
var url = "http://www.google.com/?s=" + info.selectionText;
console.log(url); var keywordObj = {keyword: url};
if (request.keywordRequest == "Yes") {
console.log(keywordObj);
sendResponse(keywordObj);
};
chrome.extension.onRequest.removeListener(listener1); } );
chrome.tabs.executeScript(null, { file: "jquery.js" }, function() {
chrome.tabs.executeScript(null, { file: "popup.js" });
}); }; };
Popup js
chrome.extension.sendRequest({keywordRequest: "Yes"}, function(response) {
$(document).ready(function() {
if($("#e14_accelerator")) {
$("#e14_accelerator").remove();
}
var rkeyword = response.keyword;
$("body").append("<div id=\"e14_accelerator\" style=\"position: fixed;top: 30px;right: -330px;z-index: 999999; \"><iframe style=\"border:5px solid #c9c9c9;-webkit-box-shadow: 1px 1px 15px 1px rgba(0, 0, 0, 0.2);\" src=\""+ rkeyword +"\" width=\"328\" height=\"240\"></iframe></div>");
$("#e14_accelerator").animate({right:-13},500);
$(document).click(function() {
$("#e14_accelerator").remove();
});
$("#e14_accelerator").click(function() {
return false;
});
});
});
Error messages that appear when this problem occur:
Error during tabs.executeScript: Cannot access contents of url "chrome-devtools://devtools/devtools.html?docked=true&dockSide=bottom&toolbarColor=rgba(230,230,230,1)&textColor=rgba(0,0,0,1)". Extension manifest must request permission to access this host. sendRequest:21
chromeHidden.handleResponse sendRequest:21
Error during tabs.executeScript: Cannot access contents of url "chrome-devtools://devtools/devtools.html?docked=true&dockSide=bottom&toolbarColor=rgba(230,230,230,1)&textColor=rgba(0,0,0,1)". Extension manifest must request permission to access this host. sendRequest:21
chromeHidden.handleResponse