Use ckeditor in modern mobile browsers - ckeditor

I use ckeditor in my site: https://times.mk.ua/1: https://times.mk.ua/
here code:
CKEDITOR.replace('ae-textarea-text', {
filebrowserImageUploadUrl: '/Record/Upload?waterMarkOn=01',
height: 650,
width: 950
});
but in modern browsers ckeditor don't shows
here test url - [enter link description here]https://times.mk.ua/home/ckc1

You're using version "4.3.1", that's very old and won't work properly with mobile browsers.

Related

navigator.share is set on desktop Firefox but doesn't do anything

I have some code like this:
if (navigator.share) {
navigator.share({
title: 'example',
url: 'http://example.com',
});
}
According to this documentation for navigator.share on MDN, desktop browsers do not support the Web Share API, and navigator.share is undefined in those browsers.
However, when I run this code in desktop Firefox, navigator.share is defined and set to a function that doesn't seem to do anything when called.
It probably is a browser extension that is setting navigator.share. Try disabling all your extensions.
In my case, it turned out to be this extension: Plasma Integration by KDE.

Cordova app navigates to home screen when fetching image from PhotoLibrary

Use Case: Choose image from Gallery and execute callbacks
Issue: Redirection to Home screen of the app after image selection from Gallery.
Getting image from Camera works:
navigator.camera.getPicture(function() {
console.log('success');
},function() {
console.log('failure');
} , {
destinationType: Camera.DestinationType.DATA_URL
});
Choosing image from Gallery redirects to the homescreen
navigator.camera.getPicture(function() {
console.log('success');
},function() {
console.log('failure');
} , {
destinationType: navigator.camera.DestinationType.FILE_URI,
sourceType: navigator.camera.PictureSourceType.SAVEDPHOTOALBUM
});
The code is fairly simple and is mentioned at many places to give an example of how to choose image from Gallery. This code doesn't work on any screen other than the home screen of App. Also, no errors are reported before redirection.
The following code also results in redirection to the homescreen after image selection.
<input type="file" name="">
Configuration:
Device: Windows Lumia 535
Device OS Version: 8.1
Cordova: 6.1.1
Cordova plugin camera: 2.2.0
Wasn't able to stop the page navigation, unless on the first page of the app(without query parameters). Later, transformed the app to single page application thus avoiding this issue.
Issue can be tracked at https://issues.apache.org/jira/browse/CB-11295

Joomla frontend publishing options not shown correctly

I am creating a Joomla template with the use of Bootstrap.
When editing at the frontend, some options are not shown correctly.
For example: the options under 'Categorie'.
url: https://test.wouterschaeffer.nl/
Login using name: test password: user
Edit page (arrow down menu) and go to publishing
I am not able to find a solution, hopefully someone can help me.
Add the following rows to your CSS:
.chzn-container {
width: 100%!important;
}
or with fixed width:
.chzn-container {
width: 200px!important;
}

WindowsPhone 8 and AngularJs - ng-src not working?

Im trying to run my (Phonegap / Angular) App on a Windows Phone Emulator.
Everything works fine but some images are not be displayed. I figured out that ng-src is the troublemaker. When im using src instead of ng-src for local images in the same folder - it works fine.
Here some examples:
dispalyed:
<img ng-click="mediaPlay()" ng-hide=showButton() src="img/go.png" style="float: right">
not displayed:
<img ng-src="img/{{poi.poiimage}}" style="display: block; margin: 0 auto">
My App works perfect on Android and IOs.
Any ideas how to fix this?
EDIT*
Ok now its getting weird o0... I've putted this "img/{{poi.poiimage}}" in a p tag and it gives me this path: img/poi-12-galgentor-01.png
So i tried it with src:
<img src="img/12-galgentor-01.png" style="display: block; margin: 0 auto">
And ng-src:
<img ng-src="img/12-galgentor-01.png" style="display: block; margin: 0 auto">
Both worked for me!
But this...
<img ng-src="img/{{poi.poiimage}}" style="display: block; margin: 0 auto">
<img src="img/{{poi.poiimage}}" style="display: block; margin: 0 auto">
does not work.
Edit2*
Tested in the emulators browser ... works fine too. -.-
this is not a solution per se: Angularjs is broken on WP8 devices.
no it is not...
i got it:
It is just a Problem with old IE's and Windows Phones.
SrcUrls have to be whitelistet. Otherwhise angular generates a "unsafe:" prefix on every src Url.
It can be fixed by changing the angular apps config like below:
schreibwerkApp.config(['$routeProvider', '$compileProvider',
function ($routeProvider, $compileProvider) {
$compileProvider.imgSrcSanitizationWhitelist('img/');
$routeProvider.
when('/splash', {
templateUrl: 'partials/splash.html'
}).
when('/terms', {
templateUrl: 'partials/terms.html'
}).
when('/intro', {
templateUrl: 'partials/intro.html'
}).
when('/poi/:stationID', {
templateUrl: 'partials/poi.html',
controller: 'PoiCtrl'
}).
when('/directive', {
templateUrl: 'partials/directive.html'
}).
when('/imgview/:stationID/:imgID', {
templateUrl: 'partials/imgview.html',
controller: 'ImgCtrl'
}).
otherwise({
redirectTo: '/splash'
});
}]);
Windows Phone uses a different internal url prefix: "x-wmapp". I have seen it use "x-wmapp0" so to be safe I modified the standard imgSrcSanitizationWhitelist as follows:
$compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|chrome-extension|x-wmapp.?):|data:image\//);
this is not a solution per se: Angularjs is broken on WP8 devices.
A colleague of mine is working on a fix. I've pinged him and will post more info when I have it.
-- edit --
here is an issue on the Angular.js board which seems to indicate that the problems with angular on wp8 have been resolved in CDV 3.4.0
I am making a Windows Universal App with Cordova and AngularJS. I tried all the solutions above and others that I found in internet, but nothing worked...
Then, I found that in my Windows 10 (pc) the img src attributes were appended with ms-appx. So, I added ms-appx with other options in imgSrcSanitizationWhitelist and it is now working...
So, my code looks like, this,
$compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|ms-appx|chrome-extension|x-wmapp.?):|data:image\//);
I will update this answer after I test my app in Windows Phone 8.1 and Android.

Slickgrid resize works in Firefox, doesn't work in Chrome

When I resize the column in Chrome, the screen freezes for 20 ~ 30 seconds. In Firefox, this doesn't happen.
I'm using slickgrid v2.0 alpha from Github.
<!--- JQUERY -->
<script type="text/javascript" src="js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
On my workstation I have Chrome 17.0.963.83 m and on the workstations with issues I have Chrome 6.0.495.0 m. I upgraded one of the workstations to the newest version of Chrome and I can't resize the collumns, it freezes up for 20 ~ 30 seconds.
I'm wondering what tests can I do to find out what is wrong, I don't see any errors in Javascript Console or anything else.
Thanks.
LATER EDIT
I'm initializing my grid as following
// additional options
var options = {
enableCellNavigation: true,
enableColumnReorder: false,
showHeaderRow: true,
editable:true,
asyncEditorLoading: false,
autoEdit:true,
defaultColumnWidth:90
};
And I'm not sure if this code affects the resize plugin
// header code
grid.onColumnsResized.subscribe(function (e, args) {
updateHeaderRow();
$('#pager').html("Count : " + grid.getDataLength());
});
Please don't ask why I'm not using the Dataview method provided with Slickgrid.
the solution was to upgrade the Chrome client to the latest version on faulty workstations, no coding errors whatsoever

Resources