Skip to content

Embed URL

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
howto make an angular app with a JS bookmarklet
/**
* redirect javascript bookmarklet
*/
// javascript:location.href='http://example.com/?uri='+encodeURIComponent(location.href)
/**
* bookmarklet loaded on site
*/
(function(){
// Load the script from url and when it's ready loading run the callback.
function loadScript(url, callback) {
var script = document.createElement('script');
script.src = url;
// Attach handlers for all browsers
var done = false;
script.onload = script.onreadystatechange = function() {
if(
!done && (
!this.readyState ||
this.readyState === 'loaded' ||
this.readyState === 'complete')
) {
done = true;
// Continue your code
callback();
// Handle memory leak in IE
script.onload = script.onreadystatechange = null;
document.head.removeChild(script);
}
};
document.head.appendChild(script);
}
// Load a list of scripts *one after the other* and run cb
var loadScripts = function(scripts, cb) {
var script;
if(scripts.length) {
script = scripts.shift();
loadScript(script, function(){
loadScripts(scripts.slice(0), cb);
});
} else {
if (cb) { cb(); }
}
};
var loadStyles = function(csss) {
var css, _i, _len;
for (_i = 0, _len = csss.length; _i < _len; _i++) {
css = csss[_i];
var e = document.createElement('link');
e.setAttribute('rel','stylesheet');
e.setAttribute('href', css);
document.head.appendChild(e);
}
};
var appRoot = 'http://example.com/';
// Loading style definitions
loadStyles([
appRoot + 'css/bootstrap.min.css',
appRoot + 'css/application.css'
]);
// Loading the scripts
loadScripts([
'https://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js',
appRoot + 'js/init.js',
appRoot + 'js/controller.js'
], function() {
// Manual Initialization of angular app
angular.element(document).ready(function() {
angular.bootstrap(document, ['bookmarklet']);
});
});
})();
app.controller('AController', function($scope, $http) {
// here you can use $scope.URL which is the actual site from JavaScript's location.href
$scope.views = ['a', 'b', 'c'];
});
<a href="javascript:(function () {
var js = document.createElement('script');
js.setAttribute('src', 'http://example.com/bookmarklet.js');
document.body.appendChild(js);
}());">
bookmarklet
</a>
var div = document.createElement('div');
div.setAttribute('ng-controller', 'AController');
div.innerHTML = '<div ng-repeat="view in views" id="{{view}}">';
document.body.appendChild(div);
var app = angular.module('bookmarklet', []);
app.run(function ($rootScope) {
$rootScope.URL = location.href;
});
@mentomorph

Thank you very much! :)

@fotoflo

hmm, how do i append a template to the current page?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.