Receiving two callbacks from modal in Native script Angular - javascript

I Want to send back two parameters when I close my modal,I can successfully get back ones parameter, the code below is what i've tried but it doesn't work and i cant find much on this around the internet , appreciate any help thanks.
onHandleInput(action: string, id: number) {
this.modalParams.closeCallback(action,id);
}
changePerson(index) {
//open up modal for choosing an exercise
this.modalDialog.showModal(PersonListModalComponent, {
fullscreen: false,
viewContainerRef: this.uiService.getRootVCRef() ? this.uiService.getRootVCRef() : this.vcRef, context: {}})
.then(({action,id}) => {this.personName = action,this.personId = id ,this.updatePersonChange(index)});
}

Related

Polymer back button doesn't work with hash routing

Sup! Back button sometimes doesn't work with my polymer project. When i hit back button the page variable is steel the current page and i need to hit the button twice or three times to get it working for example i go to the /#/rules page from /#/home but it doesn't go back to /#/home once i press the back button the second or third time by the way it does go back to the main page. Here is my observer and router:
properties: {
page: {
type: String,
reflectToAttribute: true,
observer: '_pageChanged',
},
},
observers: [
'_routePageChanged(routeData.page)',
],
_routePageChanged: function (page) {
this.page = page || 'home';
this.set('route.path', `/${this.page}`);
},
_pageChanged: function (page) {
// Load page import on demand. Show 404 page if fails
var resolvedPageUrl = this.resolveUrl(page + '.html');
this.importHref(resolvedPageUrl, null, this._showPage404, true);
window.history.pushState({}, null, `#/${this.page}`);
},
And this is my app-route element:
<app-route route="{{route}}" pattern="/:page" data="{{routeData}}" tail="{{subroute}}"></app-route>
Just can't figure out why it does not work the first time. Any help is appreciated and i have already searched a lot with no results.
Can you try this, assuming you have <app-route route="{{route}}"></app-route>?
observers: [
'_routePageChanged(route.path)',
],
_routePageChanged: function(path) {
if (path) {
this.page = this.routeData.page;
} else {
/*
* It's unnecessary to have the following line.
*/
// this.page = 'home';
this.set('route.path', '/home');
}
},
Why it works after all?
I learned my lesson by debugging the source code of <app-route>. If the path is empty, the code for updating data will be skipped - and your observer, _routePageChanged(routeData.page), won't be triggered. See
https://github.com/PolymerElements/app-route/blob/master/app-route.html#L254-L257
https://github.com/PolymerElements/app-route/blob/master/app-route.html#L320-L328
You may consider it to be a flaw in <app-route>. Whatsoever, it's open source, and you can always find your way.

How to use "position" configuration setting of Aurelia-Dialog plugin

Issue:
I've been trying to figure out how to use the "position" configuration settings of the Aurelia-Dialog plugin on my Aurelia based website, but I can't figure it out cannot find a single example on all of the Internet of Things.
A very vague bit of documentation can be found here:
http://aurelia.io/hub.html#/doc/article/aurelia/dialog/latest/dialog-basics/5
For those of you not wishing to visit the link, for "position" it says:
Position - a callback that is called right before showing the modal with the signature: (modalContainer: Element, modalOverlay: Element) => void. This allows you to setup special classes, play with the position, etc... If specified, centerHorizontalOnly is ignored. (optional)
I've tried everything from attempting to add code directly to the plugin configuration in main.js:
plugin('aurelia-dialog', config => {}
.plugin('aurelia-dialog', config => {
config.useDefaults();
//config.settings.position = ;
})
To attempting to use it as an argument my dialogService.open function:
showMessage(message, title = 'Message', options = ['Ok'], dismissable = false) {
return this.dialogService.open({ viewModel: TestModal,
model: { message, title, options },
overlayDismiss:
dismissable,
position: function(stuff){ modal, modalOverlay} });
My Question:
How do I actually use the position setting, and if my function(stuff){modal, overlay} format is correct, how do I actually pass a modal and an overlay to this function?
I'm pretty much at a dead-end on this so any help would be useful.
Thanks in Advance.
In the constructor of your dialog class, you need to inject the DialogController, then define the callback function.
import { DialogController } from "aurelia-dialog";
#inject(DialogController)
export class YourDialog {
constructor(private controller: DialogController) {
this.controller.settings.position = (modalContainer: Element, modalOverlay: Element) => {
let container = modalContainer;
let overlay = modalOverLay;
};
}
}

How to hide some issue link types in the Issue Link pop up window for Jira 5.1.8 using javascript?

I wanted to hide some issue link outward & inwards strings of Link type from the Link Issues Popup Window using java script.
I have tried using java script but I am not getting the popup screen from the java script.
Please see the screenshot below :
Can anyone tell me how can I get this popup screen in the java script?
Is there any other method to hide this?
Thanks & Regards,
Renuka.
To hide the clone issue link every page:
edit the file system-webresources-plugin.xml (should be at /atlassian-jira/WEB-INF/classes/), and add to <web-resource key="jira-fields"> this code:
<resource type="download" name="myScript.js" location="/includes/jira/field/script.js">
<param name="source" value="webContextStatic"/>
</resource>
than, on /includes/jira/field/myScript.js write this:
AJS.$(document).ready(function() {
if (AJS.$("#link-type option[value*='clon']").size() > 0) {
// will work even when right clicking on More
// Actions->Link & open it into a new window
AJS.$("#link-type option[value*='clon']").remove()
} else if (AJS.$("#link-issue").size() > 0) {
// will work in case the link menu showing via popup
AJS.$("#link-issue").click(function(){
// wait for the popup to show, and remove the clone options
setTimeout(function (){
AJS.$("#link-type option[value*='clon']").remove();
}, 300);
});
}
});
restart Jira and it that it!
The script attaches a function to the link-menu opening, than gives the menu 0.3 seconds to load, and removes the unwanted items. If it doesn't work well for you, try to raise the timeout from 300 to 500-1000.
On jira 4, run instead:
AJS.$("#issue-link-link-type option[value*='clon']").remove();
The previous solution has an issue:
It will only work when clicking the "Link Issue"-Menu-Item.
When I use the Point (.)-Shortcut-Menu, it won't remove the issue types.
I have established the following solution:
JS-Binding-Part:
AJS.$(document).ready(function() {
JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function(e, context, reason) {
hideIssueLinkTypes();
});
});
JS-Backing-Function:
function hideIssueLinkTypes() {
var apiURL = "/rest/scriptrunner/latest/custom/getHiddenLinkTypes"
$.getJSON( apiURL, {
}).done(function( objectData ) {
$.each( objectData, function( i, item ) {
var issueLinkType = item.issueLinkType[0];
AJS.$("#link-type option[value='"+issueLinkType.inwardDescription+"']").remove();
AJS.$("#link-type option[value='"+issueLinkType.outwardDescription+"']").remove();
});
});
}
Scriptrunner-REST-Endpoint:
import com.onresolve.scriptrunner.runner.rest.common.CustomEndpointDelegate
import groovy.json.JsonBuilder
import groovy.transform.BaseScript
import com.atlassian.jira.issue.link.DefaultIssueLinkTypeManager
import com.atlassian.jira.issue.link.IssueLinkTypeManager
import com.atlassian.jira.issue.link.IssueLinkType
import com.atlassian.jira.component.ComponentAccessor
import com.atlassian.jira.config.properties.ApplicationProperties
import javax.ws.rs.core.MultivaluedMap
import javax.ws.rs.core.Response
#BaseScript CustomEndpointDelegate delegate
String HIDDEN_IDENT="[hidden]"
getHiddenLinkTypes(httpMethod: "GET") { MultivaluedMap queryParams, String body ->
def appProperties = ((ApplicationProperties) ComponentAccessor.getComponentOfType(ApplicationProperties.class));
def appClonersLinkTypeName = appProperties.getDefaultBackedText("jira.clone.linktype.name");
def jsBuilder=new JsonBuilder();
def issueLinkTypes = ((IssueLinkTypeManager) ComponentAccessor.getComponentOfType(IssueLinkTypeManager.class)).getIssueLinkTypes();
jsBuilder issueLinkTypes.findAll({it.getName().contains(HIDDEN_IDENT) || it.getName()==appClonersLinkTypeName }),
{ IssueLinkType linkType ->
issueLinkType linkType.getId(),
name: linkType.getName(),
inwardDescription: linkType.getInward(),
outwardDescription: linkType.getOutward()
}
return Response.ok(jsBuilder.toString()).build();
}
What you can do then ist just annotate and Link-Type with putting [hidden] in the link name and it will disappear for all users (It can still be programmatically added though or created by cloning).
If you don't have Scriptrunner or don't need the dynamic nature of the implementation, you can still hard-code the values as Kuf described in the answer above in hideIssueTypes() like this:
AJS.$("#issue-link-link-type option[value*='clon']").remove();

Data object in jquery is undefined after replaceWith

I'm coding a jquery plugin and I need some buttons to have a double state (like edit/save)
I get this info via JSON and insert it in the button as:
node
- current //['primary'/'secondary']
- primary // some info
- secondary // some info
Once I click the button I get here to change the action. So I want to replace the whole link through a template and the info I get from button.data.
As I want to replace not only the innerHtml but the outer, I have to use 'replaceWith'. Then I copy the 'data' to the new button and (ideally) delete the older one.
changeButtonAction : function(button, selector){
var node = button.data('node'),
info;
if(node.current == 'primary'){
info = node.secondary;
node.current = 'secondary';
}else{
info = node.primary;
node.current = 'primary';
}
button.replaceWith(multiReplace(OPERATION_ITEM, info, true));
button.data('node', $.extend( true, {}, node));
... //bit of interaction
}
The thing is: Once out the function I loose the new data as it says it's undefined.
Could somebody help? Using 'replaceWith' it's not a must, so if you come up with another solution it will be ok.
Ok, I solved it.
Thanks to Diode I tried reproducing it in jsfiddle. The click function did not work neither so I changes my code a bit. Instead of replacing with text:
button.replaceWith(multiReplace(OPERATION_ITEM, info, true));
button.data('node', $.extend( true, {}, node));
Do it with an object:
var button2 = $(multiReplace(OPERATION_ITEM, info, true))
.data('node', $.extend( true, {}, node));
button.replaceWith(button2);
You can see it in action:
http://jsfiddle.net/p8vMR/9/

Comparison between Javascript objects

I have made a simple accordion for my site using jQuery... It worked great, but I've recently started working on a change where if you click the currently opened segments title (the clickable area to slide up/down), it should close the current section.
var sideMenu = {
activated: {},
setup: function() {
$('.menu-category-heading').bind('click', function() {
sideMenu.slideMenu($('ul', $(this).parent()));
});
},
slideMenu: function(menuObj) {
if (sideMenu.activated == menuObj) {
$(sideMenu.activated).slideUp(400);
sideMenu.activated = null;
console.log('same');
} else {
$(sideMenu.activated).slideUp(400);
menuObj.slideDown(500);
sideMenu.activated = menuObj;
console.log('new');
}
}
}
For some reason the comparison is never working... it does if I add $(menuObj).attr('id') and the same for activated. But this is not ideal as not all items will have an id attribute.
Any suggestions as to make the object comparison work? Or any other tips?
Thank you!
You are probably saving a jQuery object (the result of a $ call) rather than the native element. Each time you do a $(myEl) a new object is created and the references will not match up, but the native element will. Try:
if (slideMenu.activated[0] == menuObj[0]) {
...
}

Categories