Show Hide Menus MVC jQuery - abp

Can anyone help me out discovering the correct way to show/hide menu items according to AbpUserRoles?
I am simply adding two menu items that should only be available to role=admin.
My code causes the Admin menu to show when it should not:
Code:
var adminMenu = context.Menu.GetAdministration();
adminMenu.Items.Add(new ApplicationMenuItem("Admin.Sites", "Sites", "/Sites"));
adminMenu.Items.Add(new ApplicationMenuItem("Admin.UserSites", "User Sites", "/UserSites"));

ok, so the way I ended up doing this was by getting hold of the CurrentUser as follows:
public class YourProjectMenuContributor : IMenuContributor
{
private async Task ConfigureMainMenuAsync(MenuConfigurationContext context)
{
if (context.GetHttpContext().User.IsInRole("admin"))
{
//....configure as required...
}
}
}

Related

Vaadin - How to convert a Grid column which has boolean value to Checkbox

I am using Vaadin 7.6.4 for my UI work. This has the following:-
I have a window which contains a grid with data in it. This window is actually a kind of a pop up[ which shows up when my main screen gets a click on the settings icon( not shown here). This is working fine( getting the UI screen to open the Vaadin window when the settings icon the main screen is clicked).
The problem is in showing the data as mentioned below.
This grid will have 4 columns for which the data comes from a bean container.
The first column is a boolean field with true/false getting displayed based on the data from the bean container.
I need to convert this boolean field column into a checkbox with true showing the field as a checkbox with a value selected. If the value is false, then show a checkbox which is not selected.
I am trying to do that as shown in the code below but I keep getting this checkbox name printed. I dont see the checkbox but the word "checkbox" printed in there?
This checkbox should be editable. The idea is that the user should be able to select some checkboxes and the ones selected should be shown in a panel ( not shown here). Thus, the checkbox has to be editable.
How do I fix this? The code for the window is shown below
package com.platform28.mybatis;
import java.util.List;
import com.vaadin.data.Item;
import com.vaadin.data.util.BeanItemContainer;
import com.vaadin.data.util.GeneratedPropertyContainer;
import com.vaadin.data.util.PropertyValueGenerator;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Button.ClickListener;
import com.vaadin.ui.CheckBox;
import com.vaadin.ui.Grid;
import com.vaadin.ui.HorizontalLayout;
import com.vaadin.ui.Label;
import com.vaadin.ui.VerticalLayout;
import com.vaadin.ui.Window;
#SuppressWarnings("serial")
public class ConfigPopUp extends Window {
VaadinUtils vaadinUtils = null;
public ConfigPopUp(List<TableColumnData> tblDataLst) {
vaadinUtils = new VaadinUtils();
// Some basic content for the window
VerticalLayout configLayout = new VerticalLayout();
configLayout.addComponent(new Label("Settings"));
configLayout.setMargin(true);
//configLayout.setWidth(null);;
setContent(configLayout);
//adding grid.
List<SettingsColumnData> settingsList = vaadinUtils.processSettingsList(tblDataLst);
final BeanItemContainer<SettingsColumnData> gridDataSource = new BeanItemContainer<SettingsColumnData>(SettingsColumnData.class, settingsList);
//change boolean value to checkbox.
GeneratedPropertyContainer gp = new GeneratedPropertyContainer(gridDataSource);
gp.addGeneratedProperty("columnDisplayed", new PropertyValueGenerator<CheckBox>() {
#Override
public CheckBox getValue(Item item, Object itemId, Object propertyId) {
boolean currentCheckBoxValue = (boolean) item.getItemProperty("columnDisplayed").getValue();
CheckBox chkBox = new CheckBox();
chkBox.setValue(currentCheckBoxValue);
return chkBox;
}
#Override
public Class<CheckBox> getType() {
return CheckBox.class;
}
});
Grid settingsGrid = new Grid(gp);
settingsGrid.setWidth("100%");
settingsGrid.setSizeFull();
settingsGrid.setColumnOrder("columnDisplayed", "columnName","columnShortName","columnDescription");
configLayout.addComponent(settingsGrid);
//configLayout.setExpandRatio(settingsGrid, 1);
// Disable the close button
setClosable(false);
HorizontalLayout hLayout = new HorizontalLayout();
hLayout.setSpacing(true);
hLayout.setMargin(true);
// Trivial logic for closing the sub-window
Button ok = new Button("Ok");
ok.addClickListener(new ClickListener() {
public void buttonClick(ClickEvent event) {
close(); // Close the sub-window
}
});
hLayout.addComponent(ok);
// Trivial logic for closing the sub-window
Button cancelBtn = new Button("Cancel");
cancelBtn.addClickListener(new ClickListener() {
public void buttonClick(ClickEvent event) {
close(); // Close the sub-window
}
});
hLayout.addComponent(cancelBtn);
configLayout.addComponent(hLayout);
// set pop up to center.
center();
// should be resizable
setResizable(true);
// should not be draggable
setDraggable(false);
//set it as modal window
setModal(true);
setWidth("50%");
setHeight("75%");
}
}
Ok, we used the SelectionMode.MULTI to show the selection of rows in there.
https://cdn.vaadin.com/vaadin-core-elements/latest/vaadin-grid/demo/selection.html
Still, I would love to learn more as to how we get the change done as shown in the question above.
Still looking for an answer to that.
Use a Renderer and a Converter, you don't need to use SelectionMode.MULTI.
An example of this is posted here.

get all dialogs in page in AEM

Is there any direct way to get dialog object of all components which are dragged on page.
For ex: when we load page and if there is any component like text, image are on page, I can get dialog. Please suggest?
Yes, it is possible. Attach a listener which listens to the editablesready event fired by WCM. Get all the editables on the page using the #getEditables() method of CQ.WCM and then get the dialog of each editable if it is present.
Sample code below.
CQ.WCM.on('editablesready', function() {
var editables = CQ.WCM.getEditables();
for(var path in editables) {
var editable = editables[path];
try {
console.log(editable.getEditDialog());
//Do stuff
} catch(e) { }
}
});

javafx combobox contextmenu not displayed

my problem is:
i made a combobox and i want to use context menu on it's elements, so when i'm setting the cellfactory as shown below, i can't see the items in any more and the context menu does not show.
CBXGroups.setCellFactory(new Callback<ListView<String>, ListCell<String>>() {
public ListCell<String> call(ListView<String> param) {
final ListCell<String> cell = new ListCell<String>();
final ContextMenu cellMenu = new ContextMenu();
MenuItem rimuoviDalControllo = new MenuItem("RIMUOVI DAL CONTROLLO");
MenuItem rimuoviDefinitivamente = new MenuItem("RIMUOVI DEFINITIVAMENTE");
rimuoviDalControllo.setOnAction(new EventHandler<ActionEvent>() {
public void handle(ActionEvent event) {
Service.deleteGroupFromControl(cell.getText(),CBXControllo.getSelectionModel().getSelectedItem());
populateLists();
}
});
rimuoviDefinitivamente.setOnAction(new EventHandler<ActionEvent>() {
public void handle(ActionEvent event) {
Service.deleteGroup(cell.getText());
populateLists();
}
});
cellMenu.setOnShowing(new EventHandler<WindowEvent>() {
public void handle(WindowEvent event) {
cell.requestFocus();
}
});
cellMenu.getItems().addAll(rimuoviDalControllo,rimuoviDefinitivamente);
cell.contextMenuProperty().bind(Bindings.when(Bindings.isNotNull(cell.itemProperty())).then(cellMenu).otherwise((ContextMenu) null));
return cell;
}
});
You can't see the items because you haven't set the text in your ListCell. You can do this with a one-liner:
cell.textProperty().bind(cell.itemProperty());
The context menu is trickier, and I don't really have a solution for it. The issue is that the ComboBox uses a PopupControl to display the list view, and the popup control has autoHide set to true. So when you click on the list view, the popup closes (preventing you seeing the context menu). There's no way to access the popup control, so I don't think there's going to be any way to do this.
Registering a context menu with items in a combo box seems like an unusual thing to do; I wonder if there is a better approach for what you want to do. A MenuButton is similar to a ComboBox in some ways (control that displays a popup with options), but it has a menu hierarchy so you can include cascading menus. This might provide the kind of functionality you want.

Localizing buttons of a FacesContext.addMessage in adf

Hi i want to localize the buttons eg: OK, Cancel in ADF,
I am using the following code
FacesContext fctx = FacesContext.getCurrentInstance();
fctx.addMessage(VALIDATIONERROR,new FacesMessage(FacesMessage.SEVERITY_ERROR, errorMessage, errorMessage));
fctx.renderResponse();
I get the pop and the error message is localized, My question is how to localize the buttons which are on the pop up, ex: OK,CANCEL
I suppose you are talking about a af:dialog component. In that case i can think about two ways of doing so:
The af:dialog component has two properties: cancelTextAndAccessKey and affermativeTextAndAccessKey. They can take an EL which can take the key of a specific record into a .properties file (which is loaded as a resource bundle into the project. An example: cancelTextAndAccessKey="#{lang['popUp.dialog.button.cancel']}" (where lang is the name of the declared bundle in my case)
You can override the default component label, by creating a ListResourceBundle (which should be also loaded as a resource bundle into faces-config.xml, Application tab).
The code should be something like:
public class CTSResourceBundle extends ListResourceBundle {
public CTSResourceBundle() {
super();
}
#Override
protected Object[][] getContents() {
return new Object[][] {
{ "af_dialog.LABEL_YES", "Po" },
{ "af_dialog.LABEL_NO", "Jo" },
{ "af_dialog.LABEL_OK", "Ok" },
{ "af_dialog.LABEL_CANCEL", "Anullo" }
};
}
}

Add class to DIV if checkbox is checked onload

I need help with a script to add an "active" class to a div when a hidden checkbox is checked. This all happening within a somewhat complex form that can be saved and later edited. Here's the process:
I have a series of hidden checkboxes that are checked when a visible DIV is clicked. Thanks to a few people, especially Dimitar Christoff from previous posts here, I have a few simple scripts that handle everything:
A person clicks on a div:
<div class="thumb left prodata" data-id="7"> yadda yadda </div>
An active class is added to the div:
$$('.thumb').addEvent('click', function(){
this.toggleClass('tactive');
});
The corresponding checkbox is checked:
document.getElements("a.add_app").addEvents({
click: function(e) {
if (e.target.get("tag") != 'input') {
var checkbox = document.id("field_select_p" + this.get("data-id"));
checkbox.set("checked", !checkbox.get("checked"));
}
}
});
Now, I need a fourth ( and final ) function to complete the project (using mootools or just plain javascript, no jQuery). When the form is loaded after being saved, I need a way to add the active class back to the corresponding div. Basically reverse the process. I AM trying to figure it out myself, and would love to post an idea but anything I've tried is, well, bad. I thought I'd at least get this question posted while I work on it. Thanks in advance!
window.addEvents({
load: function(){
if (checkbox.checked){
document.getElements('.thumb').fireEvent('click');
}
}
});
Example: http://jsfiddle.net/vCH9n/
Okay, in case anyone is interested, here is the final solution. What this does is: Create a click event for a DIV class to toggle an active class onclick, and also correlates each DIV to a checkbox using a data-id="X" that = the checkbox ID. Finally, if the form is reloaded ( in this case the form can be saved and edited later ) the final piece of javascript then sees what checkboxes are checked on page load and triggers the active class for the DIV.
To see it all in action, check it out here: https://www.worklabs.ca/2/add-new/add-new?itemetype=website ( script is currently working on the third tab, CHOOSE STYLE ). You won't be able to save/edit it unless you're a member however, but it works:) You can unhide the checkboxes using firebug and toggle the checkboxes yourself to see.
window.addEvent('domready', function() {
// apply the psuedo event to some elements
$$('.thumb').addEvent('click', function() {
this.toggleClass('tactive');
});
$$('.cbox').addEvent('click', function() {
var checkboxes= $$('.cbox');
for(i=1; i<=checkboxes.length; i++){
if(checkboxes[i-1].checked){
if($('c_'+checkboxes[i-1].id))
$('c_'+checkboxes[i-1].id).set("class", "thumb tactive");
}
else{
if($('c_'+checkboxes[i-1].id))
$('c_'+checkboxes[i-1].id).set("class", "thumb");
}
}
});
// Add the active class to the corresponding div when a checkbox is checked onLoad... basic idea:
var checkboxes= $$('.cbox');
for(i=1; i<=checkboxes.length; i++){
if(checkboxes[i-1].checked){
$('c_field_tmp_'+i).set("class", "thumb tactive");
}
}
document.getElements("div.thumb").addEvents({
click: function(e) {
if (e.target.get("tag") != 'input') {
var checkbox = document.id("field_tmp_" + this.get("data-id"));
checkbox.set("checked", !checkbox.get("checked"));
}
}
});
});

Resources