Skip to content

Commit cf64dc0

Browse files
jperljperl
committed
Deobfuscate stories view
1 parent d184c5a commit cf64dc0

File tree

4 files changed

+378
-393
lines changed

4 files changed

+378
-393
lines changed

‎packages/paper/story-views/stories_view.js

Lines changed: 192 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,19 @@
11
Famous.loaded(function (require) {
2-
function StoriesView() {
3-
n.apply(this, arguments), S.call(this), g.call(this), w.call(this), window.app = this
4-
}
2+
var Matrix = (require("famous/Engine"), require("famous/Matrix")),
3+
View = require("famous/View"),
4+
EventHandler = (require("famous/Modifier"), require("famous/EventHandler")),
5+
GenericSync = require("famous-sync/GenericSync"),
6+
Transitionable = require("famous/Transitionable"),
7+
SpringTransition = require("famous-physics/utils/SpringTransition"),
8+
Scrollview = require("famous-views/Scrollview"),
9+
ViewSequence = require("famous/ViewSequence"),
10+
Utility = require("famous/Utility"),
11+
Utils = require("famous-utils/Utils"),
12+
StoryView = Paper.StoryView,
13+
PhotoStoryView = Paper.PhotoStoryView,
14+
ArticleStoryView = Paper.ArticleStoryView;
515

6-
var StoryData = [
16+
var storyData = [
717
{
818
name: "Nathalie Pickens",
919
profilePics: ["./img/profile-pics/nat.jpg"],
@@ -68,20 +78,146 @@ Famous.loaded(function (require) {
6878
}
6979
];
7080

71-
var o = (require("famous/Engine"), require("famous/Matrix")),
72-
n = require("famous/View"),
73-
r = (require("famous/Modifier"), require("famous/EventHandler")),
74-
a = require("famous-sync/GenericSync"),
75-
h = require("famous/Transitionable"),
76-
u = require("famous-physics/utils/SpringTransition"),
77-
p = require("famous-views/Scrollview"),
78-
c = require("famous/ViewSequence"),
79-
l = require("famous/Utility"),
80-
f = require("famous-utils/Utils"),
81-
m = Paper.StoryView,
82-
y = Paper.PhotoStoryView,
83-
v = Paper.ArticleStoryView;
84-
h.registerMethod("spring", u), StoriesView.prototype = Object.create(n.prototype), StoriesView.prototype.constructor = StoriesView, StoriesView.DEFAULT_OPTIONS = {
81+
var setupStoryViews = function () {
82+
this.storiesHandler = new EventHandler;
83+
this.scrollview = new Scrollview(this.options.scrollOpts);
84+
this.stories = [];
85+
for (var storyIndex = 0; storyIndex < storyData.length; storyIndex++) {
86+
var articleStoryView,
87+
options = {
88+
profilePics: storyData[storyIndex].profilePics,
89+
name: storyData[storyIndex].name,
90+
text: storyData[storyIndex].text,
91+
time: storyData[storyIndex].time,
92+
likes: storyData[storyIndex].likes,
93+
comments: storyData[storyIndex].comments,
94+
scale: this.options.cardScale
95+
};
96+
97+
if (storyData[storyIndex].article) {
98+
options.content = storyData[storyIndex].article;
99+
options.thumbSm = storyData[storyIndex].articleThumbSm;
100+
options.thumbLg = storyData[storyIndex].articleThumbLg;
101+
options.velThreshold = this.options.velThreshold;
102+
articleStoryView = new ArticleStoryView(options);
103+
} else {
104+
options.photos = storyData[storyIndex].photos;
105+
if (storyData[storyIndex].photos && storyData[storyIndex].photos.length > 1) {
106+
articleStoryView = new PhotoStoryView(options);
107+
} else {
108+
articleStoryView = new StoryView(options);
109+
}
110+
}
111+
112+
articleStoryView.pipe(this.storiesHandler);
113+
this.stories.push(articleStoryView);
114+
115+
articleStoryView.on("touchstart", function (story) {
116+
this.targetStory = story;
117+
}.bind(this, articleStoryView));
118+
}
119+
120+
this.storiesHandler.pipe(this.scrollview);
121+
this.storiesHandler.pipe(this.ySync);
122+
123+
var viewSequence = new ViewSequence(this.stories, 0, true);
124+
this.scrollview.sequenceFrom(viewSequence);
125+
this.scrollview.on("paginate", function () {
126+
if (this.targetStory.sequence) {
127+
this.targetStory.sequence();
128+
this.targetStory.disableScroll();
129+
}
130+
}.bind(this));
131+
};
132+
133+
var ySyncHandlers = function () {
134+
this.ySync.on("start", function () {
135+
var t = this.yPos.get();
136+
this.direction = undefined;
137+
138+
if (0 === t && this.targetStory.scrollable) this.targetStory.enableScroll();
139+
if (0 === t && this.targetStory.flipable) this.targetStory.enableFlip();
140+
141+
this.enableY = false;
142+
}.bind(this));
143+
144+
this.ySync.on("update", function (t) {
145+
var i = this.yPos.get();
146+
147+
if (!this.direction) {
148+
if (Math.abs(t.v[1]) > Math.abs(t.v[0])) {
149+
this.direction = "y";
150+
} else {
151+
this.storiesHandler.unpipe(this.ySync);
152+
this.direction = "x";
153+
}
154+
}
155+
156+
if (this.direction === "y") {
157+
if (0 !== i) {
158+
this.enableY = true;
159+
this.swipeY = true;
160+
} else {
161+
if (!this.targetStory.scrollable && !this.targetStory.flipable) this.enableY = true;
162+
163+
if (this.targetStory.scrollable && this.targetStory.top && t.v[1] > 0) {
164+
this.targetStory.disableScroll();
165+
this.enableY = true;
166+
}
167+
168+
if (this.targetStory.flipable && this.targetStory.closed && t.v[1] > 0) {
169+
this.targetStory.disableFlip();
170+
this.enableY = true;
171+
}
172+
173+
if (this.enableY) {
174+
this.yPos.set(Math.min(this.options.initY + 75, Math.max(-75, t.p[1])));
175+
}
176+
}
177+
} else if (this.targetStory.scrollable && Math.abs(this.targetStory.scrollview.getVelocity()) > .05) {
178+
this.storiesHandler.unpipe(this.scrollview);
179+
}
180+
}.bind(this));
181+
182+
this.ySync.on("end", function (t) {
183+
this.storiesHandler.pipe(this.scrollview);
184+
this.storiesHandler.pipe(this.ySync);
185+
var i = t.v[1].toFixed(2);
186+
if (this.enableY) {
187+
if (this.yPos.get() < this.options.posThreshold) {
188+
if (i > this.options.velThreshold) {
189+
this.slideDown(i);
190+
} else {
191+
this.slideUp(Math.abs(i));
192+
}
193+
} else {
194+
if (i < -this.options.velThreshold) {
195+
this.slideUp(Math.abs(i));
196+
} else {
197+
this.slideDown(i);
198+
}
199+
}
200+
}
201+
}.bind(this));
202+
};
203+
204+
function StoriesView() {
205+
View.apply(this, arguments);
206+
207+
this.yPos = new Transitionable(this.options.initY);
208+
this.ySync = new GenericSync(function () {
209+
return [0, this.yPos.get()];
210+
}.bind(this));
211+
212+
setupStoryViews.call(this);
213+
ySyncHandlers.call(this);
214+
}
215+
216+
Transitionable.registerMethod("spring", SpringTransition);
217+
StoriesView.prototype = Object.create(View.prototype);
218+
StoriesView.prototype.constructor = StoriesView;
219+
220+
StoriesView.DEFAULT_OPTIONS = {
85221
velThreshold: .7,
86222
spring: {
87223
method: "spring",
@@ -94,8 +230,14 @@ Famous.loaded(function (require) {
94230
},
95231
cardScale: .445,
96232
gutter: 2
97-
}, StoriesView.DEFAULT_OPTIONS.cardWidth = StoriesView.DEFAULT_OPTIONS.cardScale * window.innerWidth, StoriesView.DEFAULT_OPTIONS.cardHeight = StoriesView.DEFAULT_OPTIONS.cardScale * window.innerHeight, StoriesView.DEFAULT_OPTIONS.initY = window.innerHeight - StoriesView.DEFAULT_OPTIONS.cardHeight, StoriesView.DEFAULT_OPTIONS.posThreshold = (window.innerHeight - StoriesView.DEFAULT_OPTIONS.cardHeight) / 2, StoriesView.DEFAULT_OPTIONS.scrollOpts = {
98-
direction: l.Direction.X,
233+
};
234+
235+
StoriesView.DEFAULT_OPTIONS.cardWidth = StoriesView.DEFAULT_OPTIONS.cardScale * window.innerWidth;
236+
StoriesView.DEFAULT_OPTIONS.cardHeight = StoriesView.DEFAULT_OPTIONS.cardScale * window.innerHeight;
237+
StoriesView.DEFAULT_OPTIONS.initY = window.innerHeight - StoriesView.DEFAULT_OPTIONS.cardHeight;
238+
StoriesView.DEFAULT_OPTIONS.posThreshold = (window.innerHeight - StoriesView.DEFAULT_OPTIONS.cardHeight) / 2;
239+
StoriesView.DEFAULT_OPTIONS.scrollOpts = {
240+
direction: Utility.Direction.X,
99241
defaultItemSize: [StoriesView.DEFAULT_OPTIONS.cardWidth, StoriesView.DEFAULT_OPTIONS.cardHeight],
100242
itemSpacing: 2 / StoriesView.DEFAULT_OPTIONS.cardScale,
101243
margin: 3 * window.innerWidth,
@@ -105,71 +247,49 @@ Famous.loaded(function (require) {
105247
speedLimit: 10,
106248
drag: .001
107249
};
108-
var g = function () {
109-
this.storiesHandler = new r, this.scrollview = new p(this.options.scrollOpts), this.stories = [];
110-
for (var t = 0; t < StoryData.length; t++) {
111-
var i, e = {
112-
profilePics: StoryData[t].profilePics,
113-
name: StoryData[t].name,
114-
text: StoryData[t].text,
115-
time: StoryData[t].time,
116-
likes: StoryData[t].likes,
117-
comments: StoryData[t].comments,
118-
scale: this.options.cardScale
119-
};
120-
StoryData[t].article ? (e.content = StoryData[t].article, e.thumbSm = StoryData[t].articleThumbSm, e.thumbLg = StoryData[t].articleThumbLg, e.velThreshold = this.options.velThreshold, i = new v(e)) : (e.photos = StoryData[t].photos, i = StoryData[t].photos && StoryData[t].photos.length > 1 ? new y(e) : new m(e)), i.pipe(this.storiesHandler), this.stories.push(i), i.on("touchstart", function (t) {
121-
this.targetStory = t
122-
}.bind(this, i))
123-
}
124-
this.storiesHandler.pipe(this.scrollview), this.storiesHandler.pipe(this.ySync);
125-
var s = new c(this.stories, 0, !0);
126-
this.scrollview.sequenceFrom(s), this.scrollview.on("paginate", function () {
127-
this.targetStory.sequence && (this.targetStory.sequence(), this.targetStory.disableScroll())
128-
}.bind(this))
129-
},
130-
S = function () {
131-
this.yPos = new h(this.options.initY), this.ySync = new a(function () {
132-
return [0, this.yPos.get()]
133-
}.bind(this))
134-
},
135-
w = function () {
136-
this.ySync.on("start", function () {
137-
var t = this.yPos.get();
138-
this.direction = void 0, 0 === t && this.targetStory.scrollable && this.targetStory.enableScroll(), 0 === t && this.targetStory.flipable && this.targetStory.enableFlip(), this.enableY = !1
139-
}.bind(this)), this.ySync.on("update", function (t) {
140-
var i = this.yPos.get();
141-
this.direction || (Math.abs(t.v[1]) > Math.abs(t.v[0]) ? this.direction = "y" : (this.storiesHandler.unpipe(this.ySync), this.direction = "x")), "y" === this.direction ? (0 !== i ? (this.enableY = !0, this.swipeY = !0) : (this.targetStory.scrollable || this.targetStory.flipable || (this.enableY = !0), this.targetStory.scrollable && this.targetStory.top && t.v[1] > 0 && (this.targetStory.disableScroll(), this.enableY = !0), this.targetStory.flipable && this.targetStory.closed && t.v[1] > 0 && (this.targetStory.disableFlip(), this.enableY = !0)), this.enableY && this.yPos.set(Math.min(this.options.initY + 75, Math.max(-75, t.p[1])))) : this.targetStory.scrollable && Math.abs(this.targetStory.scrollview.getVelocity()) > .05 && this.storiesHandler.unpipe(this.scrollview)
142-
}.bind(this)), this.ySync.on("end", function (t) {
143-
this.storiesHandler.pipe(this.scrollview), this.storiesHandler.pipe(this.ySync);
144-
var i = t.v[1].toFixed(2);
145-
this.enableY && (this.yPos.get() < this.options.posThreshold ? i > this.options.velThreshold ? this.slideDown(i) : this.slideUp(Math.abs(i)) : i < -this.options.velThreshold ? this.slideUp(Math.abs(i)) : this.slideDown(i))
146-
}.bind(this))
147-
};
250+
148251
StoriesView.prototype.slideUp = function (t) {
149252
console.log("slide up");
150253
var i = this.options.spring;
151-
i.velocity = t, this.options.scrollOpts.paginated = !0, this.scrollview.setOptions(this.options.scrollOpts), this.yPos.set(0, i)
152-
}, StoriesView.prototype.slideDown = function (t) {
254+
i.velocity = t;
255+
this.options.scrollOpts.paginated = true;
256+
this.scrollview.setOptions(this.options.scrollOpts);
257+
this.yPos.set(0, i);
258+
};
259+
260+
StoriesView.prototype.slideDown = function (t) {
153261
console.log("slide down");
154262
var i = this.options.spring;
155-
i.velocity = t, this.options.scrollOpts.paginated = !1, this.scrollview.setOptions(this.options.scrollOpts), this.yPos.set(this.options.initY, i)
156-
}, StoriesView.prototype.render = function () {
157-
var t = this.yPos.get(),
158-
i = f.map(t, 0, this.options.initY, 1, this.options.cardScale);
159-
this.progress = f.map(t, this.options.initY, 0, 0, 1, !0), this.scrollview.sync.setOptions({
160-
direction: a.DIRECTION_X,
263+
i.velocity = t;
264+
this.options.scrollOpts.paginated = false;
265+
this.scrollview.setOptions(this.options.scrollOpts);
266+
this.yPos.set(this.options.initY, i);
267+
};
268+
269+
StoriesView.prototype.render = function () {
270+
var yPos = this.yPos.get(),
271+
i = Utils.map(yPos, 0, this.options.initY, 1, this.options.cardScale);
272+
273+
this.progress = Utils.map(yPos, this.options.initY, 0, 0, 1, true);
274+
275+
this.scrollview.sync.setOptions({
276+
direction: GenericSync.DIRECTION_X,
161277
scale: 1 / i
162278
});
163279
for (var e = 0; e < this.stories.length; e++) this.stories[e].setProgress(this.progress);
164-
return this.spec = [], this.spec.push({
280+
281+
this.spec = [];
282+
this.spec.push({
165283
origin: [.5, 1],
166-
transform: o.scale(i, i, 1),
284+
transform: Matrix.scale(i, i, 1),
167285
target: {
168286
size: [window.innerWidth, window.innerHeight],
169287
target: this.scrollview.render()
170288
}
171-
}), this.spec
172-
}
289+
});
290+
291+
return this.spec;
292+
};
173293

174294
Paper.StoriesView = StoriesView;
175295
});

0 commit comments

Comments
 (0)