Skip to content

Commit 8f48b4a

Browse files
committed
Merge branch 'example-edit-on-plunker'
2 parents 6b50962 + 75135d6 commit 8f48b4a

File tree

16 files changed

+211
-22
lines changed

16 files changed

+211
-22
lines changed
File renamed without changes.

example/assets/edit-on-plunker.js

+153
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
(function (module) {
2+
3+
var DEFAULT_CACHE_KEY = 'pc035860';
4+
5+
var getCache = function ($cacheFactory) {
6+
var ID = 'to-plunker';
7+
return $cacheFactory.get(ID) || $cacheFactory(ID);
8+
};
9+
10+
module
11+
12+
.directive('toPlunker', function ($cacheFactory) {
13+
return {
14+
link: function postLink(scope, iElm, iAttrs) {
15+
var scriptPathsCache, cache, cacheKey;
16+
17+
if (iElm[0].tagName === 'SCRIPT' && angular.isDefined(iAttrs.toPlunker)) {
18+
scriptPathsCache = getCache($cacheFactory);
19+
cacheKey = iAttrs.toPlunker || DEFAULT_CACHE_KEY;
20+
21+
cache = scriptPathsCache.get(cacheKey);
22+
if (!cache) {
23+
cache = [];
24+
}
25+
cache.push(iAttrs.src);
26+
27+
scriptPathsCache.put(cacheKey, cache);
28+
}
29+
}
30+
};
31+
})
32+
33+
.directive('editOnPlunker', function (openPlunker, $document, $q, $http, $cacheFactory) {
34+
return {
35+
restrict: 'EA',
36+
template: '<button class="btn btn-default" style="position:fixed; z-index: 65535; top: 8px; left: 50%; margin-left: -61px;" ng-click="edit()">Edit on Plunker</button>',
37+
replace: true,
38+
scope: {
39+
id: '@',
40+
getFiles: '&files',
41+
description: '@',
42+
getTags: '&tags'
43+
},
44+
link: function postLink(scope, iElm, iAttrs) {
45+
var preparePromise = prepareFiles();
46+
47+
scope.edit = function () {
48+
var description = scope.description || $document[0].title,
49+
tags = (scope.getTags || angular.noop)() || [];
50+
51+
preparePromise.then(function (fileObjs) {
52+
openPlunker(fileObjs, description, tags);
53+
});
54+
};
55+
56+
function prepareFiles () {
57+
var scriptPathsCache = getCache($cacheFactory),
58+
cacheKey = scope.id || DEFAULT_CACHE_KEY,
59+
scripts = scriptPathsCache.get(cacheKey),
60+
files = scope.getFiles(),
61+
promises = [];
62+
63+
if (scripts && angular.isArray(scripts)) {
64+
files = files.concat(scripts);
65+
}
66+
67+
angular.forEach(files, function (path) {
68+
var promise = $http.get(path, {transformResponse: transformResponse})
69+
.then(function (res) {
70+
var content = res.data,
71+
filename = getFilename(path);
72+
73+
if (filename === 'index.html') {
74+
angular.forEach(scripts, function (scriptPath) {
75+
content = content.replace(scriptPath, getFilename(scriptPath));
76+
});
77+
}
78+
79+
return {
80+
filename: filename,
81+
content: content
82+
};
83+
});
84+
promises.push(promise);
85+
});
86+
87+
return $q.all(promises);
88+
}
89+
90+
function transformResponse(data, headerGetter) {
91+
return data;
92+
}
93+
94+
function getFilename(path) {
95+
return path.substring(path.lastIndexOf('/') + 1);
96+
}
97+
}
98+
};
99+
})
100+
101+
.factory('formPostData', function ($document) {
102+
return function(url, fields) {
103+
var form = angular.element('<form style="display: none;" method="post" action="' + url + '" target="_blank"></form>');
104+
angular.forEach(fields, function(field) {
105+
var name = field.name,
106+
value = field.value;
107+
108+
var input = angular.element('<input type="hidden" name="' + name + '">');
109+
input.attr('value', value);
110+
form.append(input);
111+
});
112+
$document.find('body').append(form);
113+
form[0].submit();
114+
form.remove();
115+
};
116+
})
117+
118+
.factory('openPlunker', function (formPostData) {
119+
return function (files, description, tags) {
120+
var postData = [];
121+
122+
description = description || '';
123+
tags = tags || [];
124+
125+
angular.forEach(files, function (file) {
126+
postData.push({
127+
name: 'files[' + file.filename + ']',
128+
value: file.content
129+
});
130+
});
131+
132+
angular.forEach(tags, function (tag) {
133+
postData.push({
134+
name: 'tags[]',
135+
value: tag
136+
});
137+
});
138+
139+
postData.push({
140+
name: 'private',
141+
value: true
142+
});
143+
postData.push({
144+
name: 'description',
145+
value: description
146+
});
147+
148+
formPostData('http://plnkr.co/edit/?p=preview', postData);
149+
};
150+
});
151+
152+
153+
})(angular.module('app.edit-on-plunker', []));
File renamed without changes.

example/digest-sync/index.html

+11-3
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,16 @@
1010
<link rel="stylesheet" type="text/css" href="style.css">
1111

1212
<script src="//code.angularjs.org/1.2.22/angular.js"></script>
13-
<script src="../../src/angular-scroll-watch.js"></script>
14-
<script src="../digest-count.js"></script>
13+
<script to-plunker src="../../src/angular-scroll-watch.js"></script>
14+
<script to-plunker src="../assets/digest-count.js"></script>
15+
<script to-plunker src="../assets/edit-on-plunker.js"></script>
1516

1617
<script>
17-
angular.module('app', ['app.digest-count', 'pc035860.scrollWatch'])
18+
angular.module('app', [
19+
'app.digest-count',
20+
'app.edit-on-plunker',
21+
'pc035860.scrollWatch'
22+
])
1823

1924
.controller('MainCtrl', function ($scope, $log) {
2025
$scope.from = 0;
@@ -37,6 +42,9 @@
3742

3843
<!-- digest count -->
3944
<div digest-count></div>
45+
<!-- edit on plunker -->
46+
<edit-on-plunker files="['index.html', 'style.css']"
47+
tags="['angularjs', 'scroll', 'angular-scroll-watch']"></edit-on-plunker>
4048

4149
<div id="scroll-stage"
4250
scroll-watch="{from: from, to: to}"

example/digest-sync/style.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../lesshat-prefixed";
1+
@import "../assets/lesshat-prefixed";
22

33
body {
44
margin: 0;

example/sw-broadcast-through-emit/index.html

+7-2
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,15 @@
1212

1313
<script src="//code.angularjs.org/1.2.22/angular.js"></script>
1414
<script src="//code.angularjs.org/1.2.22/angular-animate.js"></script>
15-
<script src="../../src/angular-scroll-watch.js"></script>
16-
<script src="../digest-count.js"></script>
15+
<script to-plunker src="../../src/angular-scroll-watch.js"></script>
16+
<script to-plunker src="../assets/digest-count.js"></script>
17+
<script to-plunker src="../assets/edit-on-plunker.js"></script>
1718

1819
<script>
1920
angular.module('app', [
2021
'ngAnimate',
2122
'app.digest-count',
23+
'app.edit-on-plunker',
2224
'pc035860.scrollWatch'
2325
])
2426

@@ -42,6 +44,9 @@
4244

4345
<!-- digest count -->
4446
<div digest-count></div>
47+
<!-- edit on plunker -->
48+
<edit-on-plunker files="['index.html', 'style.css']"
49+
tags="['angularjs', 'scroll', 'angular-scroll-watch']"></edit-on-plunker>
4550

4651
<div id="scroll-stage"
4752
scroll-watch="{from: 0, to: -1}"

example/sw-broadcast-through-emit/style.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../lesshat-prefixed";
1+
@import "../assets/lesshat-prefixed";
22

33
body {
44
margin: 0;

example/sw-broadcast/index.html

+7-2
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,15 @@
1212

1313
<script src="//code.angularjs.org/1.2.22/angular.js"></script>
1414
<script src="//code.angularjs.org/1.2.22/angular-animate.js"></script>
15-
<script src="../../src/angular-scroll-watch.js"></script>
16-
<script src="../digest-count.js"></script>
15+
<script to-plunker src="../../src/angular-scroll-watch.js"></script>
16+
<script to-plunker src="../assets/digest-count.js"></script>
17+
<script to-plunker src="../assets/edit-on-plunker.js"></script>
1718

1819
<script>
1920
angular.module('app', [
2021
'ngAnimate',
2122
'app.digest-count',
23+
'app.edit-on-plunker',
2224
'pc035860.scrollWatch'
2325
])
2426

@@ -46,6 +48,9 @@
4648

4749
<!-- digest count -->
4850
<div digest-count></div>
51+
<!-- edit on plunker -->
52+
<edit-on-plunker files="['index.html', 'style.css']"
53+
tags="['angularjs', 'scroll', 'angular-scroll-watch']"></edit-on-plunker>
4954

5055
<div id="scroll-stage" ng-controller="StageCtrl"
5156
scroll-watch="{from: 0, to: -1}"

example/sw-broadcast/style.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../lesshat-prefixed";
1+
@import "../assets/lesshat-prefixed";
22

33
body {
44
margin: 0;

example/sw-class-with-ng-repeat/index.html

+8-3
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,15 @@
1212

1313
<script src="//code.angularjs.org/1.2.22/angular.js"></script>
1414
<script src="//code.angularjs.org/1.2.22/angular-animate.js"></script>
15-
<script src="../../src/angular-scroll-watch.js"></script>
16-
<script src="../digest-count.js"></script>
15+
<script to-plunker src="../../src/angular-scroll-watch.js"></script>
16+
<script to-plunker src="../assets/digest-count.js"></script>
17+
<script to-plunker src="../assets/edit-on-plunker.js"></script>
1718

1819
<script>
1920
angular.module('app', [
2021
'ngAnimate',
2122
'app.digest-count',
23+
'app.edit-on-plunker',
2224
'pc035860.scrollWatch'
2325
])
2426

@@ -33,7 +35,7 @@
3335
})
3436

3537
.controller('MainCtrl', function ($scope, $log, getWinDim) {
36-
$scope.number = 20;
38+
$scope.number = 50;
3739
$scope.angulars = [];
3840

3941
$scope.$watch('number', function (newVal, oldVal) {
@@ -79,6 +81,9 @@
7981

8082
<!-- digest count -->
8183
<div digest-count></div>
84+
<!-- edit on plunker -->
85+
<edit-on-plunker files="['index.html', 'style.css']"
86+
tags="['angularjs', 'scroll', 'angular-scroll-watch']"></edit-on-plunker>
8287

8388
<div id="scroll-stage"></div>
8489

example/sw-class-with-ng-repeat/style.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../lesshat-prefixed";
1+
@import "../assets/lesshat-prefixed";
22

33
body {
44
margin: 0;

example/sw-class/index.html

+7-2
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,15 @@
1212

1313
<script src="//code.angularjs.org/1.2.22/angular.js"></script>
1414
<script src="//code.angularjs.org/1.2.22/angular-animate.js"></script>
15-
<script src="../../src/angular-scroll-watch.js"></script>
16-
<script src="../digest-count.js"></script>
15+
<script to-plunker src="../../src/angular-scroll-watch.js"></script>
16+
<script to-plunker src="../assets/digest-count.js"></script>
17+
<script to-plunker src="../assets/edit-on-plunker.js"></script>
1718

1819
<script>
1920
angular.module('app', [
2021
'ngAnimate',
2122
'app.digest-count',
23+
'app.edit-on-plunker',
2224
'pc035860.scrollWatch'
2325
])
2426

@@ -37,6 +39,9 @@
3739

3840
<!-- digest count -->
3941
<div digest-count></div>
42+
<!-- edit on plunker -->
43+
<edit-on-plunker files="['index.html', 'style.css']"
44+
tags="['angularjs', 'scroll', 'angular-scroll-watch']"></edit-on-plunker>
4045

4146
<div id="scroll-stage"
4247
scroll-watch="{from: 0, to: -1}"

example/sw-class/style.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../lesshat-prefixed";
1+
@import "../assets/lesshat-prefixed";
22

33
body {
44
margin: 0;

example/sw-style/index.html

+11-3
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,16 @@
1010
<link rel="stylesheet" type="text/css" href="style.css">
1111

1212
<script src="//code.angularjs.org/1.2.22/angular.js"></script>
13-
<script src="../../src/angular-scroll-watch.js"></script>
14-
<script src="../digest-count.js"></script>
13+
<script to-plunker src="../../src/angular-scroll-watch.js"></script>
14+
<script to-plunker src="../assets/digest-count.js"></script>
15+
<script to-plunker src="../assets/edit-on-plunker.js"></script>
1516

1617
<script>
17-
angular.module('app', ['app.digest-count', 'pc035860.scrollWatch'])
18+
angular.module('app', [
19+
'app.digest-count',
20+
'app.edit-on-plunker',
21+
'pc035860.scrollWatch'
22+
])
1823

1924
.controller('MainCtrl', function ($scope, $log) {
2025
$scope.from = 0;
@@ -39,6 +44,9 @@
3944

4045
<!-- digest count -->
4146
<div digest-count></div>
47+
<!-- edit on plunker -->
48+
<edit-on-plunker files="['index.html', 'style.css']"
49+
tags="['angularjs', 'scroll', 'angular-scroll-watch']"></edit-on-plunker>
4250

4351
<div id="scroll-stage"
4452
scroll-watch="{from: from, to: to}"

example/sw-style/style.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@import "../lesshat-prefixed";
1+
@import "../assets/lesshat-prefixed";
22

33
body {
44
margin: 0;

gulpfile.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ gulp.task('lint:example', function () {
7979
.pipe(jshint.reporter('jshint-stylish'));
8080
});
8181
gulp.task('less:example', function () {
82-
return gulp.src('example/*/*.less', {base: './'})
82+
return gulp.src('example/*/style.less', {base: './'})
8383
.pipe(changed('./', {extension: '.css'}))
8484
.pipe(less())
8585
.pipe(gulp.dest('./'));

0 commit comments

Comments
 (0)