Permalink
Browse files

Separate out imageBase from urlBase.

Summary:
urlBase is meant to point to the root of khan-exercises.  For images,
this isn't entirely appropriate, because khan-exercises just has a
copy of the 'canonical' version of the images (which live in the main
KA repo).  So imagesBase should be the same as urlBase only when the
canonical version of the images isn't available, and we have to use
the khan-exercises copy.  In cases where the canonical version *is*
available, we should default to using that.

I distinguish the cases where the canonical version is available or
not based on testMode.  More principled (but also slower) would be to do an actual ajax request
for an image, and see if '/images/face-smiley.png' is a 404, or we
have to use '/khan-exercises/images/face-smiley.png', and set
imageBase that way.  But this should work well enough.

Pass along the definition of imageBase, as needed.

Change imageBase to include the /images directory.

Test Plan:
One I 'arc mail' this, I'll go to I'll go to
one_step_equation_intuition and reading-pictographs-1 on
sandcastle.khanacademy.org (for this phabricator revision) and make
sure they display the images correctly.  We'll also have to double
check that they also work correctly once we deploy this to the live
site.

Reviewers: eater

Reviewed By: eater

Differential Revision: http://phabricator.khanacademy.org/D986
  • Loading branch information...
1 parent edf6059 commit e7b9125abdcdf95665719375066ca3d415f1837f @csilvers csilvers committed Dec 17, 2012
@@ -171,7 +171,7 @@
unknown: X,
leftConst: A,
rightConst: B,
- image: Khan.imageBase + "images/avatars/" + AVATAR
+ image: Khan.imageBase + "avatars/" + AVATAR
});
</div>
</p>
@@ -29,7 +29,7 @@
<div class="vars">
<var id="DATA">randRangeUnique( 1, 8, 5 )</var>
<var id="BADGE">randFromArray([ "meteorite", "moon", "earth" ])</var>
- <var id="FULL_IMAGE">"&lt;img src='" + Khan.imageBase + "images/badges/" + BADGE + "-small.png'&gt;"</var>
+ <var id="FULL_IMAGE">"&lt;img src='" + Khan.imageBase + "badges/" + BADGE + "-small.png'&gt;"</var>
<var id="VALUE_PER_IMG">1</var>
</div>
@@ -29,8 +29,8 @@
<div class="vars">
<var id="DATA">randRangeUnique( 1, 8, 5 )</var>
<var id="BADGE">randFromArray([ "meteorite", "moon", "earth" ])</var>
- <var id="FULL_IMAGE">"&lt;img src='" + Khan.imageBase + "images/badges/" + BADGE + "-small.png'&gt;"</var>
- <var id="HALF_IMAGE">"&lt;div style=\"background-image:url('" + Khan.imageBase + "images/badges/" + BADGE + "-small.png'); width:20px; height:40px;\"&gt;&nbsp;&lt;/div&gt;"</var>
+ <var id="FULL_IMAGE">"&lt;img src='" + Khan.imageBase + "badges/" + BADGE + "-small.png'&gt;"</var>
+ <var id="HALF_IMAGE">"&lt;div style=\"background-image:url('" + Khan.imageBase + "badges/" + BADGE + "-small.png'); width:20px; height:40px;\"&gt;&nbsp;&lt;/div&gt;"</var>
<var id="VALUE_PER_IMG">randFromArray([ 2, 4 ])</var>
<var id="HALF">VALUE_PER_IMG === 1 ? [ 0, 0, 0, 0, 0 ] : [ rand(2), rand(2), rand(2), rand(2), rand(2) ]</var>
</div>
View
@@ -251,8 +251,8 @@ var Khan = (function() {
// In test mode, we use khan-exercises local copy of the /images
// directory. But in production (on www.khanacademy.org), we use
// the canonical location of images, which is under '/'.
- imageBase = typeof urlBaseOverride !== "undefined" ? urlBaseOverride :
- testMode ? "../" : "/",
+ imageBase = ((typeof urlBaseOverride !== "undefined" || testMode)
+ ? (urlBase + "images/") : ("/images/"));
@spicyj
spicyj Mar 23, 2013 Member

semicolon :(

@csilvers
csilvers Mar 23, 2013 Member

I committed this like forever ago! Shouldn't it have caused problems before now? Or is it mostly cosmetic?

@spicyj
spicyj Mar 23, 2013 Member

It means that the rest of the variables in this declaration are polluting the global scope. Unlikely to cause actual problems, thankfully. :)

@csilvers
csilvers Mar 26, 2013 Member

OK, am fixing in a different commit.

lastFocusedSolutionInput = null,
@@ -1288,7 +1288,7 @@ function Protractor(center) {
var r = 8.05;
var imgPos = graph.scalePoint([this.cx - r, this.cy + r - 0.225]);
- this.set.push(graph.mouselayer.image(Khan.imageBase + "images/protractor.png", imgPos[0], imgPos[1], 322, 161));
+ this.set.push(graph.mouselayer.image(Khan.imageBase + "protractor.png", imgPos[0], imgPos[1], 322, 161));
// Customized polar coordinate thingie to make it easier to draw the double-headed arrow thing.

0 comments on commit e7b9125

Please sign in to comment.