I just add a menu onche you clic on the draw maker in draw.py toolbar
I modified the html of the map using this code
{{ this._parent.get_name() }}.on('draw:drawstart', function(e){
var type = e.layerType,
layer = e.layer;
if (type === 'marker') {
console.log('drawing starting... ' + e.layer)
// Do marker specific actions
var html = "<br><li class=''><a class='' title='Ubicacion de mujeres'>Ubicacion de mujeres</a></li><br>" +
"<li class=''><a class='' title='Zona de Violencia'>Zona de Violencia</a></li><br>" +
"<li class=''><a class='' title='Poblaciones diversas'>Poblaciones diversas</a></li><br>";
document.querySelector(".leaflet-draw-actions").innerHTML += html;
}
});
What i'm trying to do is to add a menu so the user can create a marker depending on what type of layer you choose previously
my idea es in this image here
When i do this, the "cancel operation" does not work anymore and also i dont know how to change the color of the marker draggable that it is displayed.
Any idea will be so helpful
Thank you and regards!
Related
I need to add a new button to existing IG toolbar, which will set a specific value in the table column and then save the record.
Is there any way to create new buttons/change the behavior of existing Interactive Grid toolbar buttons?
I see you are using APEX 5.1. Yes, you can customise toolbar buttons in an interactive grid. For example, you can modify the look and feel of the Save and Add Row buttons and also add a Delete button. Select your interactive grid region and in the property editor, enter a value for Advanced > Static ID. Select Attributes > Advanced > JavaScript Initialization Code and input the following:
function(config) {
let $ = apex.jQuery,
toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(),
toolbarGroup = toolbarData.toolbarFind("actions3");
addrowAction = toolbarData.toolbarFind("selection-add-row"),
saveAction = toolbarData.toolbarFind("save"); // Save button
// adding a "Delete" button
toolbarGroup.controls.push({type: "BUTTON",
action: "selection-delete",
icon: "icon-ig-delete",
iconBeforeLabel: true,
hot: true
});
// Modifying the buttons
addrowAction.icon = "icon-ig-add-row";
addrowAction.iconBeforeLabel = true;
addrowAction.hot = true;
saveAction.iconBeforeLabel = true;
saveAction.icon ="icon-ig-save-as";
saveAction.hot = true;
//storing the config
config.toolbarData = toolbarData;
return config;
}
Now run the page to see the customisation.
Here's a nice video that shows how to customise IG toolbar.
https://www.youtube.com/watch?v=_PBdBAfPBfQ
I am new in appcelerator. I want to insert html template in message property of alert dialog. When add message as a string it's working fine but i want to insert html template. what i tried so far mention bellow, but its not working.
var win1 = Titanium.UI.createWindow({
backgroundColor:'#F00'
});
var mybutton=Ti.UI.createButton
(
{top: 100,title: 'Push Me'}
);
win1.add(mybutton);
var a = Titanium.UI.createAlertDialog({
title:'Alert Test',
message:'Hello World'
});
Ti.API.info('Alert title: ' + a.getTitle() + ' : ' + a.title);
Ti.API.info('Alert message: ' + a.getMessage() + ' : ' + a.message);
mybutton.addEventListener('click', function(e)
{
a.show();
}
);
win1.open();
I want to show below template in alert dialog
Appcelerator is not an HTML-based environment, like PhoneGap. Appcelerator/Titanium exposes native controls in a JavaScript environment. You can't do what you want natively (the UIAlert/Alert classes support text, not HTML). So, you can't do that in Titanium. Spend a little time reading the docs and checking out the samples you'll find there.
To create the screen you show in your question, you'll need to create a View containing Labels, TextFields, TextAreas, and Buttons. I know, that probably sounds like all HTML stuff. But it's not, those will be representations of native components.
SmartFace MenuItem Icon is not coming up properly, How do i get the actual size or customize the icon?
var productAdd = new SMF.UI.Android.MenuItem({
id:"productAdd",
//title:"Hide Me!",
icon: "ic_action_new.png",
showAsAction:SMF.UI.Android.ShowAsAction.always,
onSelected:function(e){
alert("Selected item id: " + e.id);
Pages.MainPage.visible = false; // hides the menu item when clicked.
}
});
for supporting every device first of all , all the resource folders should be filled.
You can read more about from http://www.smartface.io/developer/guides/project/anatomy-project
Also the icon Sizes are defined in the link belows;
http://iconhandbook.co.uk/reference/chart/android/
http://developer.android.com/design/style/iconography.html
I need a select box with options and an on select / on change so i can populate a second select box.
My first instinct was to just create one using a surface with a click event and a renderController / scrollview to make my drop down appear. This works wonderfully except that if I leave and come back to the page the zindex of the scrollview breaks and it scrolls over the container size.
Its a bug I need to deal with but my other problem is that with the small Iphone screen size conventional drop downs just eat to much screen real-estate.
This stackoverflow famo.us: how to handle textbox.onchange events had some great hints on how to edit an InputSurface. I thought using that and looking at the code for a Surface I could do it but no luck.
Any Ideas on how to deal with the lack of a select surface?
You can access the value property from inside the callback function:
function SelectSurface(options) {
Surface.apply(this, arguments);
this.onchange = options.onchange;
this._superDeploy = Surface.prototype.deploy;
SelectSurface.prototype.elementType = 'select';
}
SelectSurface.prototype = Object.create(Surface.prototype);
SelectSurface.prototype.constructor = SelectSurface;
SelectSurface.prototype.deploy = function deploy(target) {
target.onchange = this.onchange;
this._superDeploy(target);
};
var regionSelector = new SelectSurface({
size:[140,40],
onchange: regionSelect(),
content: '<option disabled selected style="display:none;">REGION</option><option value="central">CENTRAL</option><option value="northern">NORTHERN</option><option value="pacific">PACIFIC</option><option value="southern">SOUTHERN</option><option value="western">WESTERN</option>',
});
var regionSelect = function(){
return function() {
alert(this.value);
}
};
I recently did this tutorial: http://fearlessflyer.com/2010/08/how-to-create-your-own-jquery-content-slider/ and I was wondering if anyone knows how I can use the code in this tutorial but change it to automatically scroll through the images instead of scrolling through when clicking on the text.
the code that scrolls the images after checking the mouse "click" event is:
$(theImage).each(
function(intIndex){
$(this).nextAll('a')
.bind("click", function(){
if($(this).is(".next")) {
$(this).parent('li').parent('ul').animate({
"margin-left": (-(intIndex + 1) * theWidth)
}, 1000)
} else if($(this).is(".previous")){
$(this).parent('li').parent('ul').animate({
"margin-left": (-(intIndex - 1) * theWidth)
}, 1000)
} else if($(this).is(".startover")){
$(this).parent('li').parent('ul').animate({
"margin-left": (0)
}, 1000)
}
});//close .bind()
});//close .each()
the statement:
.bind("click", function(){...
checks for a mouse "click" event and then executes the if statement. I would like to instead just run the if statement without first having to click. Any help would be greatly appreciated, thanks.
<script language="JavaScript" type="text/javascript">
var images = new Array('morning.jpg','afternoon.jpg','night.jpg','lightbulb_on.jpg')
var count = -1
function slideShow(){
if (count <=2){
count ++;
}
document.getElementById("show").innerHTML = "<img src="images/"+images[count]+"">"
setTimeout("slideShow()", 3000)
}
</script>
<div id="show">
<script>slideShow()</script>
</div>
That one works with the click event, so you have to change the way it works, setting timers.
I usually do it with this code. Hope it helps.
I dont put the comment because I cant (low reputation) sorry