Merge branch 'master' of https://github.com/benbalter/Emphasis into b…

…enbalter-master Conflicts: README.md js/emphasis-src.js
nytimes · Dec 23, 2011 · b592cbe · b592cbe
2 parents 395daa6 + 68c88b5
commit b592cbe
Show file tree

Hide file tree

Showing 4 changed files with 286 additions and 215 deletions.
diff --git a/README → README.md b/README → README.md
@@ -1,31 +1,33 @@
+Prologue
+========
+
+This is a jQueryized version of the NYT's PrototypeJS-dependant Emphasis script.
+
 Emphasis
 ========
 
-Emphasis provides dynamic paragraph-specific anchor links and the 
+Emphasis provides dynamic paragraph-specific anchor links and the ability to highlight text in a document,
-ability to highlight text in a document, all of which is made available 
+all of which is made available in the URL hash so it can be emailed, bookmarked, or shared.
-in the URL hash so it can be emailed, bookmarked, or shared. 
 
-For more information and examples please go to this blog post: 
+For more information and examples please go to this blog post:
-http://open.blogs.nytimes.com/2011/01/11/emphasis-update-and-source/ 
+
+http://open.blogs.nytimes.com/2011/01/11/emphasis-update-and-source/
 
 Configuration
 -------------
 
-The main configuration element is specifiying what paragraph elements 
+The main configuration element si specifiying what paragraph elements are in scope and are not. To this end
-are in scope and which are not. To this end we specify the elements on 
+we specify the elements on or near Line 54:
-or near Line 54: 
 
     this.paraSelctors = $$(
                         ".entry p:not(p[class]):not(:empty)",
                         ".post p:not(p[class]):not(:empty)", 
                         "article p:not(p[class]):not(:empty)"
                         );
 
-This covers a lot of common markup in many sites and blog. However this
+This covers a lot of common markup in many sites and blog. However this could be configured for your specific site.
-could be configured for your specific site.
 
-Example: If all your P tags reside in DIV tags with the "entry"
+Example: If all you P tags reside in DIV tags with the "entry" classname, then this would be sufficient:
-classname, then this would be sufficient:
 
     this.paraSelctors = $$(".entry p:not(p[class]):not(:empty)");
 
@@ -35,19 +37,20 @@ Over at The New York Times, we use the following:
 
 Dependencies
 ------------
-Currently this requires that you use the PrototypeJS library
+<del>Currently this requires that you use the PrototypeJS library - tested with version 1.6.</del>
-(http://prototypejs.org/download) - tested with version 1.6.
+
+jQuery (Tested with 1.4.4)
 
 Thanks
 ------
 
-Levenshtein calculation in the script is based on some nice code by
+Levenshtein calculation in the script is based on some nice code by Andrew Hedges
-Andrew Hedges (http://andrew.hedges.name/experiments/levenshtein/)
+http://andrew.hedges.name/experiments/levenshtein/
 
 To-Do
 -----
 
  - Remove framework dependency (PrototypeJS)
  - Further work on UI for highlighting with focus on simplicity
  - Social
- - Support for touch-based devices
+ - Support for touch-based devices
diff --git a/demo/index.html b/demo/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <title>Emphasis Demo</title>   
+  <style>
+    #article-content { padding: 20px; font-size: 20px; }
+  </style>
+</head>
+<body>
+  <div id="article-content">
+    <h1>The Wizard of Oz</h1>
+    <p>The morning after the balloon had gone up with Oz, the four travelers met in the Throne Room and talked matters over.  The Scarecrow sat in the big throne and the others stood respectfully before him.</p>
+
+    <p>"We are not so unlucky," said the new ruler, "for this Palace and the Emerald City belong to us, and we can do just as we please.  When I remember that a short time ago I was up on a pole in a farmer's cornfield, and that now I am the ruler of this beautiful City, I am quite satisfied with my lot."</p>
+
+    <p>"I also," said the Tin Woodman, "am well-pleased with my new heart; and, really, that was the only thing I wished in all the world."</p>
+
+    <p>"For my part, I am content in knowing I am as brave as any beast that ever lived, if not braver," said the Lion modestly.</p>
+
+    <p>"If Dorothy would only be contented to live in the Emerald City," continued the Scarecrow, "we might all be happy together."</p>
+
+    <p>"But I don't want to live here," cried Dorothy.  "I want to go to Kansas, and live with Aunt Em and Uncle Henry."</p>
+
+    <p>"Well, then, what can be done?" inquired the Woodman.</p>
+
+    <p>The Scarecrow decided to think, and he thought so hard that the pins and needles began to stick out of his brains.  Finally he said:</p>
+
+    <p>"Why not call the Winged Monkeys, and ask them to carry you over the desert?"</p>
+
+    <p>"I never thought of that!" said Dorothy joyfully.  "It's just the thing.  I'll go at once for the Golden Cap."</p>
+  </div>
+  <!-- /article-content -->
+  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
+  <script src="../js/emphasis-src.js"></script>
+</body>
+</html>