How to minimize a prime ng dialog? - dialog

I would like to know how can I minimize a prime ng dialog box. I read this but it is not working in Angular 7.
Also, as per their site here, the property minimizable is not present
Also I am using the dialogService of primeng. Is there any way that I can minimize the dialog and continue working.
Demo code for reference where I am using dialog service to open the angular component:
showPopup(header: string, groupName: string, controlName: string) {
const dialogRef = this.dialogService.open(StandardParagrahPopupComponent, {
header: header,
width: '60%',
closable: true,
data: {
groupName: groupName
}
});
dialogRef.onClose.subscribe(comments =>
this.onPopupClose(comments, controlName)
);
}

Minimize is not working in PrimeNG for Angular.
It is only working in Primefaces for JavaServletFaces.
The first link you provides leads to Primefaces Showcase, the second to PrimeNG showcase. So it is correct that on the second link you canĀ“t find the minimize feature.

Related

Creating Menu in SwiftUI - receive output message of [UILog] Called -[UIContextMenuInteraction updateVisibleMenuWithBlock:]

I'm attempting to create a pull down menu in SwiftUI , the menu seems to be fully visible on the device/simulator and I can interact with it but I get the following message:
[UILog] Called -[UIContextMenuInteraction updateVisibleMenuWithBlock:] while no context menu is visible. This won't do anything.
Can anyone suggest a solution or help me understand the problem ? XCode Version 12.2 beta 4
struct AardvarkQuantity: View {
var body: some View {
VStack{
Menu(content: {
ForEach((1...5), id: \.self) {
Text("\($0)")
.font(Font.fontSFProText(size: 9))
}
}, label: {
Text("Number of Aardvarks")
.font(Font.fontSFProText(size: 12))
.foregroundColor(ColorManager.itemRowLabelText)
})
}
}
}
As Andrew and pawello2222 both confirmed, the error message appears to be a log warning and code appears to be working
I ended up using the solution listed here.
Although I'm still not clear on how I should respond to the warning.

Chrome DevTools Protocol: control new tabs

Need to be done: I need to simulate user interactions (journeys) across a chain of sites.
Question: Do you have any tips how to programatically controll a tab opened as a result of a simulated click?
My experience:
I'm using the chrome-remote-interface npm package.
I'm able to simulate a click with a custom ChromeController class which initializes the chrome-remote-interface and these methods:
async simulateClick(selector) {
return await this.evaluate(function (selector) {
document.querySelector(selector).click()
}, selector);
}
/**
* Shamelessly stolen from simple-headless-browser
*/
async evaluate (fn, ...args) {
const exp = args && args.length > 0 ? `(${String(fn)}).apply(null, ${JSON.stringify(args)})` : `(${String(fn)}).apply(null)`
const result = await this.client.Runtime.evaluate({
expression: exp,
returnByValue: true
})
return result
}
Now I would like to interact with the recently opened tab. I can get the targetId of the new tab with the experimenetal Target Domain (prototyping in node cli):
var targets;
chromeController.client.Target.getTargets().then(t => targets = t);
Which results in:
{ targetInfos:
[ { targetId: '97556479-cdb6-415c-97a1-6efa4e00b281',
type: 'page',
title: 'xxx/preview/239402/',
url: 'xxx/preview/239402/' },
{ targetId: 'bbfe11d5-8e4a-4879-9081-10bb7234209c',
type: 'page',
title: 'Document',
url: 'xxx/preview/239402/teaser/0/' } ] }
I am able to switch between the tabs with:
chromeController.client.Target.activateTarget({targetId:'xxx'})
However I'm not able to get any interaction with this, I can't find the connection, how to load it into the Page and Runtime objects.
I've searched in the docs and also tried googling: 'site:chromedevtools.github.io targetId' which only lead me to
> chromeController.client.Browser.getWindowForTarget({targetId: '97556479-cdb6-415c-97a1-6efa4e00b281'}).catch(e => console.log(e.message));
Promise { <pending> }
> 'Browser.getWindowForTarget' wasn't found
I've also tried to Target.setDiscoverTargets({discover: true}) and to close the original tab.
Thanks for any help!
Recently faced this same issue and in short I had to create a new dev tools protocol client for each new target I wanted control over.
My experience is with dev tools protocol using direct communication with websocket but the api is the same so it should be similar. So here is a summary of what I had to do.
Initially looking at the docs I would have assumed Target.attachToTarget should give us control of the new tab but I found that it didn't work.
My workaround was to create a listener that listened for the Target.targetCreated event which provides a targetInfos just like you found with Target.getTargets but for every new target created like a new tab, page, or iframe. Note: you need to enable Target.setDiscoverTargets in order to receive these events over the protocol.
[ { targetId: '97556479-cdb6-415c-97a1-6efa4e00b281',
type: 'page',
title: 'xxx/preview/239402/',
url: 'xxx/preview/239402/' },
{ targetId: 'bbfe11d5-8e4a-4879-9081-10bb7234209c',
type: 'page',
title: 'Document',
url: 'xxx/preview/239402/teaser/0/' } ] }
With that listener I looked for targets that were of type page, you could filter on a specific url if you know what the page will be. With the targetId in hand I requested available websocket targets following the HTTPEndpoints section near the bottom of the devtools home page.
GET /json or /json/list
A list of all available websocket targets.
[ {
"description": "",
"devtoolsFrontendUrl": "/devtools/inspector.html?ws=localhost:9222/devtools/page/DAB7FB6187B554E10B0BD18821265734",
"id": "DAB7FB6187B554E10B0BD18821265734",
"title": "Yahoo",
"type": "page",
"url": "https://www.yahoo.com/",
"webSocketDebuggerUrl": "ws://localhost:9222/devtools/page/DAB7FB6187B554E10B0BD18821265734"
} ]
I could then launch a new dev tools protocol client using the webSocketDebuggerUrl and have full control over the tab.
I know this is a pretty round about way but, its the only way I was able to make if work.
Although these days it's probably easier to use something like puppeteer to interface with multiple tabs in chrome if you can. Here is the source code to a puppeteer module that follows new tabs that could be good reference for trying to replicate it pageVideoStreamCollector.ts
This is a very late answer but just putting this here if anyone else has the same issue as help on chrome dev tools is very hard to come by. Hope it helps someone out.
I also am getting "Browser.getWindowForTarget wasn't found" on debian, google-chrome-unstable version 61

How to display an image generated dynamically by javascript in jsf page?

Using JSF and PrimeFaces I try to use java script external library (Highcharts) in order to display an image generated dynamically. Data used by the image is loaded from database. Image should be refreshed every n seconds.
In JSF I know that I can run java script function by
< h:outputScript name="js/volatilityChart.js">
but I have to somehow put parameters in order to appropriately display this function. I know there is possibility of calling execute() from RequestContext but I have no idea how to display an image generated in such a way. If knew I could probably use p:poll in order to refreshing it. I've searched the web but couldn't find proper solution.
Any advice will be appreciated.
Edited:
As followed BalusC suggestion and after some digging I managed to create something that suits me (simply speaking accessing bean fields and methods inside javascript code within xhtml). In XHTML I put:
<script>
//<![CDATA[
$(function () {
$('#container_portfolio').highcharts('StockChart', {
chart: {
alignTicks: false
},
rangeSelector: {
inputEnabled: $('#container').width() > 480,
selected: 1
},
title: {
text: ''
},
series: [{
type: 'column',
name: 'Volatility',
data: #{statisticsView.getStatistic()},
dataGrouping: {
units: [[
'week', // unit name
[1] // allowed multiples
], [
'month',
[1, 2, 3, 4, 6]
]]
}
}]
});
});
//]]>
</script>
Above function works and gives what I expected. However, I would like to insert many similar calls. Is it somehow possible to extract them to separate files? It would dramatically increase manageability of the code. Thanks in advance.

Add a MediaPicker to the General Site Settings

The current project I'm on is utilizing tenant sites. With each site, we want the ability to change the logo through out the tenant site by modifying the its settings (on the admin page, settings > general).
I've added two text fields to the site settings by following this well documented tutorial. However, I'd like the user to be able to pick the logos using the media picker instead of typing in the path.
Currently I have a LogoBarSettings part with its record, driver and handler. I'm not sure how to add the media picker to the my LogoBarSettings and even if I did, must I also create another handler, driver, and record for it? I can't imagine I would but I'm pretty stuck at this point.
Can someone provide some direction on this?
Here is my LogoBarSettings
public class LogoBarSettings : ContentPart<LogoBarSettingsPartRecord>
{
public string ImageUrl
{
get { return Record.ImageUrl; }
set { Record.ImageUrl = value; }
}
public string ImageAltText
{
get { return Record.ImageAltText; }
set { Record.ImageAltText = value; }
}
}
The MediaPicker is invoked through Javascript, so you shouldn't need to change any of your model classes. When the MediaPicker is loaded for a page, it sets up a jQuery event handler for all form elements on the page. Triggering the event orchard-admin-pickimage-open will open the MediaPicker. Supply a callback function to capture the picked media.
Here is a quick example that you can run in Firebug or Chrome Developer Tools from a page which has the MediaPicker loaded, such as a Page editor:
$('form').trigger("orchard-admin-pickimage-open", {
callback: function(data) {
console.log(data);
}})
This should print something similar to this:
Object {img: Object}
img: Object
align: ""
alt: ""
class: ""
height: "64"
html: "<img src="/Media/Default/images/test.jpg" alt="" width="64" height="64"/>"
src: "/Media/Default/images/test.jpg"
style: ""
width: "64"
__proto__: Object
__proto__: Object
The BodyPart editor integrates Orchard's MediaPicker with TinyMce, so you can start looking at that module for a more complete example, specifically Modules\TinyMce\Scripts\plugins\mediapicker\editor_plugin_src.js.

asp.net jqGrid dropdown multiselect

i'm trying to use jQuery multiselect plugin in a form editing jqGrid (add form).
This is the code (colModel extract) I'm using to build the dropdown:
{
name: 'CaratteristicheCamera',
index: 'CaratteristicheCamera',
width: 50,
hidden: true,
edittype: 'select',
editable: true,
editrules: { edithidden: true, required: true },
editoptions: {
multiselect: true,
dataUrl: '<%# ResolveUrl("~/Service/Domain/ServiceRoom.asmx/GetRoomFeatureList") %>',
buildSelect: function (data) {
var retValue = $.parseJSON(data);
var response = $.parseJSON(retValue.d);
var s = '<select id="CaratteristicheCamera" name="CaratteristicheCamera">';
if (response && response.length) {
for (var i = 0, l = response.length; i < l; i++) {
s += '<option value="' + response[i]["Id"] + '">' +
response[i]["Descrizione"] + '</option>';
}
}
return s + "</select>";
},
dataInit: function() {
$("#CaratteristicheCamera").multiselect();
}
}
},
As you guys can see, jqGrid call webmethod placed in asmx file. Everything seems to work ok, but I can't receive all the values user select from the dropdown. It seems that the system send to the server the last selection.
Do u have any tips on it?
EDIT: this is the asmx webservice declaration
[WebMethod]
public string SaveRoom(string id, string codice, string Numero, string NumeroPiano,
string Nome, string TipoCamera, string StatoCamera,
string CaratteristicheCamera, string TipoSdoppiabilita)
{}
I tried Eric Hynds jQuery UI MultiSelect Widget together with jqGrid 3.4.1 and couldn't see any problem which you described. I recommend you compare your demo with my to find the differences.
One bad thing which I see in your code is that you set id="CaratteristicheCamera" attribute on the <select> which you generate in buildSelect. You should just use <select> without any additional attributes. The jqGrid will set itself all attributes like id or multiple="multiple".
In the demo I used editurl: 'test.asmx/dummy' which not exist on the server. So one sees the error message like
after choosing and submitting the selected items
Nevertheless one can see with respect of tools like Fiddler, Firebug or Developer Tools of IE or Chrome (see HTTP traffic in "Network" tab) that the demo post the data like
{"name":"test8","closed":"No","ship_via":"FE,TN","oper":"edit","id":"8"}
to the http://www.ok-soft-gmbh.com/jqGrid/test.asmx/dummy. So the values "FE,TN" of selected items FedEx, TNT will be send as expected. In your case the CaratteristicheCamera parameter of SaveRoom should be initialized to the comma separated list of selected values. I hope you will find the problem in your code if you compare my demo with youth.
Another small problem in the code which you posted is that you make serialization to JSON manually in the WebMethod GetRoomFeatureList and returns string. So the string will be serialized to JSON twice. So you use
var retValue = $.parseJSON(data);
var response = $.parseJSON(retValue.d);
Correct will be to return something like List<Room>. ASP.NET will serialize it automatically. If you would use the jqGrid option
ajaxSelectOptions: {
contentType: 'application/json; charset=utf-8',
dataType: "json"
}
the data in buildSelect will be not needed to parsed at all. You can directly use data.d[i].Id and data.d[i].Descrizione in the loop. I wrone you about the same problem in another answer on your old question.

Resources