I'm using first version of Aloha Editor and now would like to update to new version.
In first version I used this script to read changes:
Aloha.ready(function() {
Aloha.require( ['aloha', 'aloha/jquery'], function( Aloha, jQuery) {
// save all changes after leaving an editable
Aloha.bind('aloha-editable-deactivated', function(){
var content = Aloha.activeEditable.getContents();
var contentId = Aloha.activeEditable.obj[0].id;
//var pageId = document.referrer;
//var pageId = window.location.pathname;
var pageId = location.pathname + location.search;
// textarea handling -- html id is "xy" and will be "xy-aloha" for the aloha editable
if ( contentId.match(/-aloha$/gi) ) {
contentId = contentId.replace( /-aloha/gi, '' );
}
var request = jQuery.ajax({
url: "editor_save.php",
type: "POST",
data: {
content : content,
contentId : contentId,
pageId : pageId
},
dataType: "html"
});
request.done(function(msg) {
jQuery("#log").html( msg ).show().delay(800).fadeOut();
});
request.error(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
});
});
});
I can't find anything about it in version 2.0 of this script.
Related
In my angularjs project the rooting is like this
{
name: 'room-edit',
config: {
url: '/:view?id',
templateUrl: function (params) {
var view = params.view || 'index';
return '/general/' + view + '.html?v=' + version;
},
isSecure: true,
parent: 'generalMaster',
}
}
In the html page I am calling a function to get the information of the Room obj
<div data-ng-init="getRoom()">
And the getRoom() is like this
$scope.getRoom = function () {
var roomid = 15344;
$http.get("/rest/room/get/" + roomid + "?format=json").then(function
(result) {
$scope.room = result.data;
});
};
How can i get the room id from the query string?
Import $location like $scope in controller and
Try this
$location.search()['id']
or
$location.search()['roomid']
i i have a kendo UI panelBar, and i want to load data dynamically. I want inside panelBar option to have a template that use Angular. I have this part of code but this doesnt work.
$http({
method: 'GET',
url: '/PDFEditor/GetPDFDocumentInfo',
params: { fileId: fileId }
}).then(function successCallback(response) {
$scope.test = "My name is: <h1>Bond, James Bond </h1>";
var tml = '<div id="testId"></div>';
$scope.pdfInfo = response.data;
$scope.appendToPanelBar([{
text: 'Info',
content: tml
}]);
document.getElementById("testId").innerHTML = "<p ng-bind-html=\"test\"></p> {{test}}";
}, function errorCallback(response) {
//todo
console.error('todo error handling');
});
I also tried without to get element by id and add directly to content: '{{test}}'. Seems that AngularJS doesn't compile this template.
I find the solution!!
$scope.test = "My name is: <h1>Bond, James Bond </h1>";
var tml = '<div id="testId"></div>';
var data = $compile('<p>{{test}}</p>')($scope);
console.log(data)
$scope.pdfInfo = response.data;
$scope.appendToPanelBar([{
text: 'Info',
content: tml
}]);
document.getElementById("testId").append(data[0]);
cheers!
I'm using ngCordova File Transfer plugin in an ionic project to download set of images from urls. Here is the code i'm using for that.
// Save a image file in a given directory
$scope.saveImage = function(dir,imgUrl,imageName) {
var url = imgUrl;
var targetPath = cordova.file.dataDirectory+ dir+"/" + imageName;
var trustHosts = true;
var options = {};
// Download the image using cordovafiletransfer plugin
$cordovaFileTransfer.download(url, targetPath, options, trustHosts)
.then(function(result) {
$scope.loadedCount ++;
$ionicLoading.show({template : "<ion-spinner class='spinner-energized'></ion-spinner><p> Downloading pages : "+ $scope.loadedCount+" of "+ $scope.pages.length+ "</p><p>Please wait...</p><p><button class=\"button button-block button-positive\">continue in background</button></p>"});
if($scope.loadedCount == $scope.pages.length) {
$ionicLoading.hide();
$scope.showDownloadSuccessAlert = function() {
var alertPopup = $ionicPopup.alert({
title: 'Success!',
template: "Your magazine successfully downloaded. You can view it on Downloads!"
});
};
$scope.showDownloadSuccessAlert();
}
}, function(err) {
alert(JSON.stringify(err));
}, function (progress) {
if($scope.loadedCount > 80) {
}
});
};
// Download the current magazine
$scope.downloadMagazine = function() {
if($rootScope.user.user_id == undefined) {
$scope.showLoginAlert = function() {
var alertPopup = $ionicPopup.alert({
title: 'Oops!',
template: "Your must login to download magazines"
});
};
$scope.showLoginAlert();
return;
}
document.addEventListener('deviceready', function () {
var dirName = $rootScope.currentIssue.slug+'_VOL_'+$rootScope.currentIssue.vol+'_ISU_'+$rootScope.currentIssue.issue;
// First create the directory
$cordovaFile.createDir(cordova.file.dataDirectory, dirName, false)
.then(function (success) {
var count = 1;
$scope.loadedCount = 0;
angular.forEach($scope.pages, function(value, key) {
var imgName = count+".png";
$scope.saveImage(dirName,value.link,imgName); // Then save images one by one to the created directory.
count++;
});
}, function (error) {
// Directory already exists means that the magazine is already downloaded.
$scope.showDownloadedAlert = function() {
var alertPopup = $ionicPopup.alert({
title: 'Why worry!',
template: "Your have already downloaded this magazine. You can view it on downloads"
});
};
$scope.showDownloadedAlert();
});
}, false);
};
})
Problem here is that program try to download everything at once without waiting for previous one to finish. How to wait for one file to finish downloading and then start the other?
Thanks
If you want to do that automatically (you're not the first one : How can I execute array of promises in sequential order?), you could try reducing the list of address to a single Promise that will do the whole chain.
$scope.pages.reduce(function (curr,next) {
return curr.then(function(){
return $scope.saveImage(dirName, curr.link, imgName);
});
}, Promise.resolve()).then(function(result) {
$ionicLoading.show({template : "<ion-spinner class='spinner-energized'></ion-spinner><p> Downloading pages : "+ $scope.loadedCount+" of "+ $scope.pages.length+ "</p><p>Please wait...</p><p><button class=\"button button-block button-positive\">continue in background</button></p>"});
if($scope.loadedCount == $scope.pages.length) {
$ionicLoading.hide();
$scope.showDownloadSuccessAlert = function() {
var alertPopup = $ionicPopup.alert({
title: 'Success!',
template: "Your magazine successfully downloaded. You can view it on Downloads!"
});
};
$scope.showDownloadSuccessAlert();
}
});
And don't forget to make your saveImage async which returns a promise.
UPDATE:
You will need to remove the then logic from your save method and return the download method call:
return $cordovaFileTransfer.download(url, targetPath, options, trustHosts).promise;
Then you can put your download handler into Promise.resolve()).then. See above.
There's no other way other than chaining your promises. Here's an example:
angular.module('app', [])
.service('fakeDownloadService', function($timeout) {
this.download = (file) => $timeout(() => file, 100);
return this;
})
.run(function($rootScope, $q, fakeDownloadService) {
var listOfFiles = [];
for (var i = 0; i < 10; i++)
listOfFiles.push('file' + i);
$rootScope.log = [];
$rootScope.download = () => {
listOfFiles
.reduce((prev, curr) => {
return prev.then((result) => {
if(result)
$rootScope.log.push(result + ' downloaded');
return fakeDownloadService.download(curr);
});
}, $q.resolve())
.then(() => $rootScope.log.push('all done'));
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script>
<div ng-app="app">
<button ng-click="download()">Start</button>
<div>Log:</div>
<ul>
<li ng-repeat="entry in log track by $index">
{{entry}}
</li>
</ul>
</div>
I have a controller which loads data via Restangular like so:
var oneTopic = Restangular.one('topics', topic.id);
oneTopic.get({}, {"Authorization" : localStorageService.get('***')}).then(function(topic) {
topic.getList('comments', {}, {"Authorization" : localStorageService.get('***')}).then(function(comments){
$scope.comments = comments;
//console.log($scope.comments);
});
});
And then a function which posts a new comment and one that deletes a comment.
$scope.delComment = function(comment_id, author_id){
var comment = Restangular.one('comments', comment_id);
comment.remove({author_id: author_id}, {"Authorization" : localStorageService.get('***')}).then(function(){
// need to perform refresh here
});
};
$scope.postComment = function(mood) {
$scope.commentData.mood = mood;
comments.post($scope.commentData, {}, {"Authorization" : localStorageService.get('***')}).then(function(response){
// need to perform refresh here
}, function(response){
$scope.error = response.data.message;
})
};
How would I refresh the comments scope without reloading the page? The data is being populated in the HTML with an
<div ng-repeat="comment in comments">
Modify the existing array referenced by $scope.comments and the data binding will take care of it.
For example:
$scope.delComment = function(comment_id, author_id) {
var comment = Restangular.one('comments', comment_id);
comment.remove({ author_id: author_id }, { "Authorization": localStorageService.get('***')
}).then(function() {
// Some remove-from-array implementation, for example:
var c = $scope.comments;
for(var i = 0, l = c.length; i < l; i++) {
if (c[i].comment_id === comment_id) {
c = c.splice(i, 1);
break;
}
}
});
};
My code is as follow:
var AppRouter = Backbone.Router.extend({
_data: null,
_length: 0,
_index: null,
_todos: null,
routes: {
"*action": "index",
"category/:name": "hashcategory"
},
initialize: function(options){
this._data = options.data;
this._todos = new TodosCollection(options.data);
this._length = this._todos.length;
this._index = new CategoriesView({collection: this._todos});
},
index: function(){
this._index.render();
},
hashcategory: function(name){
console.log('started');
}
});
initializeRouter = function (router) {
Backbone.history.start({ pushState: true });
$(document).on('click', 'a:not([data-bypass])', function (evt) {
var href = $(this).attr('href');
var protocol = this.protocol + '//';
if (href.slice(protocol.length) !== protocol) {
evt.preventDefault();
router.navigate(href, true);
}
});
return router;
};
var start = function(){
p = $.ajax({
url: 'data/todolist.json',
dataType: 'json',
data: {},
success: function(data) {
var approuter = initializeRouter(new AppRouter({data: data}));
}
});
};
I have a <a> link in my html which has a href = "category/num1" attibute. But every time I click the link, it always shows a security error in firebug. Actually I just have one index.html page, what I want to do is append a string to it to make a fake html page like folder/index.html/category/num1 and all of the things will still be rendered in current page. But the url shown to me when the link is hovered is folder/category/num1. Because this path actually doesn't exist in my folder, I think that's why it shows a security error.
So how should I fix it? Should I create another html page and the corresponding folder? Or can I make all of the routing in one index.html page?
Try putting a # in the href, like
href = "#category/num1"