I'm working to simulate files and directories structure ,using drag and drop,
my code is working fine in IE, Chrome but not working in Firefox ,
while i'm searching i found this fiddle .
> http://jsfiddle.net/G9mJw/20/
same problem works on IE,Chrome but not Firefox !
http://jsfiddle.net/G9mJw/140/
var dropzone = document.getElementById('dropzone');
var draggable = document.getElementById('draggable');
draggable.addEventListener('dragstart', onDragStart, false);
dropzone.ondragover = function(e){e.preventDefault(); }
dropzone.ondrop = function(e){ onDragOver(e); }
function onDragStart(event) {
event.dataTransfer.setData('text/html', null); //cannot be empty string
}
function onDragOver(event) {
var counter = document.getElementById('counter');
counter.innerHTML = parseInt(counter.innerHTML) + 1;
}
Related
Hi guys I'm having problem with listview component on IOS13
I tried updating to the latest version but that doesn't work
I fixed it by patching listview.ios.js, directly in node_modules
Like suggested from comment here:
https://github.com/NativeScript/nativescript-ui-feedback/issues/1160#issuecomment-542039004
And that is working fine but is there any to patch it differently ?
For example:
I tried creating new file app-platform.ios.js
and attaching missing methods to listview directly like:
const listview = require('nativescript-ui-listview');
listview.ListViewCell.prototype.systemLayoutSizeFittingSizeWithHorizontalFittingPriorityVerticalFittingPriority = function (targetSize, horizontalFittingPriority, verticalFittingPriority) {
if (this.view && this.view.itemView && this.view.itemView.parent) {
var owner = this.view.itemView.parent;
owner._preparingCell = true;
var dimensions = owner.layoutCell(this, undefined);
owner._preparingCell = false;
return CGSizeMake(view_1.layout.toDeviceIndependentPixels(dimensions.measuredWidth), view_1.layout.toDeviceIndependentPixels(dimensions.measuredHeight));
}
return targetSize;
};
But that creashes my app, I get cannot call method on undefined :/
If someone still needs this, managed to solve it in you main.js path listview with this.
const application = require('application');
if (application.ios) {
const view_1 = require("tns-core-modules/ui/core/view");
const listView = require('nativescript-ui-listview');
listView.ExtendedListViewCell.prototype.systemLayoutSizeFittingSizeWithHorizontalFittingPriorityVerticalFittingPriority = function (targetSize, horizontalFittingPriority, verticalFittingPriority) {
if (this.view && this.view.itemView && this.view.itemView.parent) {
var owner = this.view.itemView.parent;
owner._preparingCell = true;
var dimensions = owner.layoutCell(this, undefined);
owner._preparingCell = false;
return CGSizeMake(
view_1.layout.toDeviceIndependentPixels(dimensions.measuredWidth),
view_1.layout.toDeviceIndependentPixels(dimensions.measuredHeight)
);
}
return targetSize;
};
}
I am using the inline shared CKEditor (version 4.5.7) in a CMS.
To simplify editing new elements in the page-builder, I use the following code if the text in the container is dummy-text:
editor.on( 'focus', function(ev) {
if(obj.isDummyText($(ev.editor.element.$))) {
ev.editor.execCommand( 'selectAll' );
}
});
The problem is, if the container has a initial styling set, like a h-tag, the h-tag gets stripped when you start typing.
I want to maintain that h-tag in the element so an initial style is already set and the UX is a bit better.
I have tried fixing this with the CKEDITOR.config:
config.enterMode = CKEDITOR.ENTER_BR;
config.shiftEnterMode = CKEDITOR.ENTER_BR;
config.forcePasteAsPlainText = false;
CKEDITOR.dtd.$removeEmpty['i'] = false;
CKEDITOR.dtd.$removeEmpty['h1'] = false;
CKEDITOR.dtd.$removeEmpty['h2'] = false;
CKEDITOR.dtd.$removeEmpty['h3'] = false;
CKEDITOR.dtd.$removeEmpty['h4'] = false;
CKEDITOR.dtd.$removeEmpty['h5'] = false;
CKEDITOR.dtd.$removeEmpty['h6'] = false;
config.allowedContent = true;
Sadly this didn't change anything, the h-tags still get stripped when you start typing:
Before selection:
While selecting:
And after I started typing:
Is there any way to fix/hack this issue?
The solution I found was to create a new selectionRange for the content of the h4 element (without the h4 element itself):
editor.on('focus', function(ev) {
setTimeout(function() {
var element = element = ev.editor.document.getElementsByTag('h4').getItem(0).$;
var textNode = element.childNodes[0];
var startIndex = 0;
var endIndex = textNode.length;
var range = document.createRange();
range.setStart(textNode, startIndex);
range.setEnd(textNode, endIndex);
var selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
}, 100);
})
The code worked great on all browsers but IE without the setTimeout function, so I added this.
Here is a working example:
https://jsfiddle.net/dhxpyobo/
The Oracle Application Express code editor is just plain back text on white background. No Code highlighting. Also I can't press "tab" without the textfield loosing focus.
I am using firefox 31 (can't upgrade, rescricted by Admin at work here) Also I can't install plugins. I know you can change css on specific sites using a special folder in firefox ("chrome"-folder / userContent.css). I already used this to change die default size of the textfield, because it was frickin small everytime I opened the edit page.
So do you know any framework or script I can use in Apex ? (I could copy that shit to jsfiddle.net every time but that sucks
(I also found the scratchpad in Firefox, which can run js and jquery. Does that help ?)
[SOLVED]
since you can't use
<script src = "">
etc. in plain js, I had to use loadScript. For css files it was even more complicated, but I got it all working.
This is my code, I run it in scratchpad (firefox). It uses ACE to change a div to an editor with highlighting. When clicking apply I revert the editor-changes in the DOM but keep the text/code.
// Load Ace js
loadScript("http://cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/ace.js", function(){
//initialization code
});
// Load Ace css
var cssId = 'myCss'; // you could encode the css path itself to generate id..
if (!document.getElementById(cssId)){
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link');
link.id = cssId;
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = 'http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.0/css/bootstrap.min.css';
link.media = 'all';
head.appendChild(link);
}
// change textarea to div
var editorRegion = document.getElementById('F4000_P4651_PLUG_SOURCE_fieldset');
editorRegion.innerHTML = editorRegion.innerHTML.replace("textarea","div");
// run ACE
highlight();
// Modify the apply Button in Apex to first revert ACE-Editor to normal, then do the usual apply.
var applyChanges = document.getElementById('B3456326662');
applyChanges.setAttribute("onclick","modifiedApply()");
function modifiedApply(){
close();
setTimeout(normalApply, 500);
}
function normalApply(){
javascript:apex.submit('Apply_Changes');
}
// Revert ACE-Changes, but keep changed text/code.
function close(){
var value = editor.getValue();
editor.destroy();
var oldDiv = editor.container;
var newDiv = oldDiv.cloneNode(false);
newDiv.textContent = value;
oldDiv.parentNode.replaceChild(newDiv, oldDiv);
newDiv.outerHTML = newDiv.outerHTML.replace("div","textarea");
var old_new_old = document.getElementById('F4000_P4651_PLUG_SOURCE');
old_new_old.textContent = old_new_old.textContent.substring(0, old_new_old.textContent.length - 6);
}
var editor;
function highlight() {
editor = ace.edit("F4000_P4651_PLUG_SOURCE");
editor.setTheme("ace/theme/monokai");
editor.getSession().setUseWorker(false);
editor.getSession().setMode("ace/mode/javascript");
document.getElementsByClassName('ace_print-margin')[0].setAttribute("style","left:1000px");
}
function loadScript(url, callback){
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" ||
script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others
script.onload = function(){
callback();
};
}
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}
On Mozilla Firefox version 26 bing maps doesn't work. I dosn't zoom and locate (and location service are enabled in firefox settings). In don't get any error or warning. In all other browsers (IE, Chrome...) all works fine. Where is problem?
It should work with Firefox 26 according to the supported browser information.
Firefox 3.6 and later
It works fine when I run it on Windows.
function GetLocation() {
if (!!navigator.geolocation) {
navigator.geolocation.getCurrentPosition(UpdateLocation, HandleErrors);
}
}
function UpdateLocation(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
setPushpin(longitude, latitude);
document.getElementById('longitude').value = longitude;
document.getElementById('latitude').value = latitude;
Microsoft.Maps.Events.addHandler(map, 'click', changePosition);
}
function HandleErrors(error) {
switch (error.code) {
case error.PERMISSION_DENIED: alert("user did not share geolocation data");
break;
case error.POSITION_UNAVAILABLE: alert("could not detect current position");
break;
case error.TIMEOUT: alert("retrieving position timed out");
break;
default: alert("unknown error");
break;
}
}
function setPushpin(longi, lati){
map.setView({ center: { latitude: lati, longitude: longi }, zoom: 16});
deletePushpin();
var newURL = window.location.protocol + "//" + window.location.host + "/";
var pushpin= new Microsoft.Maps.Pushpin(map.getCenter(), {icon:newURL+"images/marker.png", height:35, width:26});
map.entities.push(pushpin);
pushpin.setLocation(new Microsoft.Maps.Location(lati, longi));
}
function deletePushpin(){
for(var i=map.entities.getLength()-1;i>=0;i--){
var pushpin= map.entities.get(i);
if (pushpin instanceof Microsoft.Maps.Pushpin){
map.entities.removeAt(i);
}
}
}
changePosition = function (e) {
if (e.targetType == "map") {
var point = new Microsoft.Maps.Point(e.getX(), e.getY());
var loc = e.target.tryPixelToLocation(point);
document.getElementById('longitude').value = loc.longitude;
document.getElementById('latitude').value = loc.latitude;
setPushpin(loc.longitude, loc.latitude);
}
}
So this is my code for getting current locations and put pushpin on it.
I don't get any error. Map isn't doing anything just stays on full world view.
On all other browsers works just fine, it zooms, get current location and put pushpin on it.
This is where I call map:
map = new Microsoft.Maps.Map(document.getElementById('placeForMap'), {credentials:"xxx",showMapTypeSelector:false, disableBirdseye: true});
GetLocation();
I tried to use Bing Ajax 7 controls, but same problem is there too, bing map in firefox is drop dead, and in other browser works fine.
There is no issue with the Bing Maps control. Firefox 26 has a couple of bugs in it which are causing the issue you are encountering.
I'm using Ctrl+Left / Ctrl+Right in a GreaseMonkey script as a hotkey to turn back / forward pages. It seems to works fine, but I want to disable this behavior if I'm in a text edit area. I'm trying to use document.activeElement to get the page active element and test if it's an editable area, but it always returns "undefined".
document.activeElement works for me in FF3 but the following also works
(function() {
var myActiveElement;
document.onkeypress = function(event) {
if ((myActiveElement || document.activeElement || {}).tagName != 'INPUT')
// do your magic
};
if (!document.activeElement) {
var elements = document.getElementsByTagName('input');
for(var i=0; i<elements.length; i++) {
elements[i].addEventListener('focus',function() {
myActiveElement = this;
},false);
elements[i].addEventListener('blur',function() {
myActiveElement = null;
},false);
}
}
})();
element.activeElement is part of HTML5 spec but is not supported by most browsers. It was first introduced by IE.