From 9941ad2ea45664a3db1fb7641fff477461d747a2 Mon Sep 17 00:00:00 2001 From: Andrew Brown Date: Thu, 7 Feb 2019 20:41:58 -0600 Subject: [PATCH] analysis design work --- Gemfile | 1 + Gemfile.lock | 5 +- app/assets/stylesheets/application.css | 1 + app/views/documents/analysis.html.erb | 305 ++++++++++++++++--------- 4 files changed, 200 insertions(+), 112 deletions(-) diff --git a/Gemfile b/Gemfile index 9327840c..ed45ea4c 100644 --- a/Gemfile +++ b/Gemfile @@ -35,6 +35,7 @@ gem 'paranoia' # Javascript gem 'coffee-rails' gem 'rails-jquery-autocomplete' +gem 'animate-rails' # SEO gem 'meta-tags' diff --git a/Gemfile.lock b/Gemfile.lock index 60802fc5..34073450 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -54,6 +54,8 @@ GEM activerecord (>= 3.0) addressable (2.5.2) public_suffix (>= 2.0.2, < 4.0) + animate-rails (1.0.10) + rails arel (9.0.0) ast (2.4.0) authority (3.3.0) @@ -546,6 +548,7 @@ PLATFORMS DEPENDENCIES acts_as_list + animate-rails authority aws-sdk (~> 1.5) aws-sdk-s3 @@ -619,4 +622,4 @@ RUBY VERSION ruby 2.5.1p57 BUNDLED WITH - 1.16.4 + 1.17.3 diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index 9aa7a8b5..f79752be 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -13,5 +13,6 @@ *= require font-awesome *= require medium-editor/medium-editor *= require medium-editor/themes/beagle + *= require animate *= require_tree . */ diff --git a/app/views/documents/analysis.html.erb b/app/views/documents/analysis.html.erb index a9010d5d..8e13cc07 100644 --- a/app/views/documents/analysis.html.erb +++ b/app/views/documents/analysis.html.erb @@ -9,18 +9,7 @@
Length
-
-
- -
12,235
- Characters - -
-
-
- -
-
+
3,400
@@ -30,17 +19,6 @@
-
-
-
- -
935
- Paragraphs - -
-
-
-
@@ -51,10 +29,52 @@
+ +
+
+
+ +
12
+ Chapters + +
+
+
+
+
+
+ +
935
+ Paragraphs + +
+
+
+
+
+
+ +
12,235
+ Characters + +
+
+
Time to read
+
+
+
+ +
17 minutes
+ Average reader +
200 words per minute
+ +
+
+
@@ -67,18 +87,7 @@
-
-
- -
17 minutes
- Average reader -
200 words per minute
- -
-
-
-
-
+
11 minutes
@@ -89,7 +98,7 @@
-
+
8 minutes
@@ -104,7 +113,7 @@
Ease of reading
-
+
@@ -119,7 +128,7 @@
-
+
How is this calculated? @@ -129,14 +138,11 @@ Readability scales close -

- Readability scales are a real thing, I promise. This is some text about - their background that speaks to their legitimacy. -

In order to provide you with a generalized score in Notebook.ai, we compute several of the most well-known readability scores on your text and average - them together. You can see the original scores per readability test below: + them together. You can see the original scores per readability test by clicking + "show more readability statistics".

  • Flesch-Kincaid grade level: 35
    • @@ -151,55 +157,23 @@
-
- -
Characters
-
-
-
-
-
Page presence
- <%= - timeline([ - ["Alice Yellowbottom", 1, 10 + rand(10)], - ["Alice Yellowbottom", 20, 20 + rand(10)], - ["Bob Zebracakes", 1 + rand(10), 10 + rand(10)], - ["Bob Zebracakes", 20 + rand(10), 30 + rand(10)], - ["Carol Anderson", 5 + rand(10), 20 + rand(10)], - ["David Butters", 10 + rand(10), 20 + rand(10)], - ["Ethan Coolridge", 1 + rand(10), 12 + rand(7)], - ["Ethan Coolridge", 15 + rand(10), 20 + rand(10)], - ["Fred Danvers", 20 + rand(10), 35], - ["Fred Danvers", 1 + rand(10), 10 + rand(5)], - ]) - %> -
-
-
-
+
-
Number of pages each character is on
-

- <%= - pie_chart({ - 'Alice Yellowbottom' => 33, - 'Bob Zebracakes' => 19, - 'Carol Anderson' => 12, - 'David Butters' => 10, - 'Ethan Coolridge' => 15, - 'Fred Danvers' => 14 - }) - %> -

+ To increase your readability further, try using shorter sentences.
+ +
+ + Show more readability statistics + +
-
Word Choice
-
+
@@ -292,6 +266,7 @@
+
@@ -407,33 +383,12 @@
-
Plot progression
+
Plot
-
+
-
Pages per chapter
- <%= - timeline [ - ["Chapter 1", 0, 3], - ["Chapter 2", 3, 9], - ["Chapter 3", 9, 20], - ["Chapter 4", 20, 22], - ["Chapter 5", 22, 50], - ["Chapter 6", 50, 57] - ] - %> -
-
-
-
- -
Sentiment
-
-
-
-
-
Emotions per chapter
+
Emotions per page
<%= line_chart([ { name: 'Joy', data: (1..10).map { |i| [i, 3 * Math.sin(i).abs * rand(2)] }, color: 'green'}, { name: 'Anger', data: (1..10).map { |i| [i, 3 * Math.sin(1 + i).abs * rand(2)] }, color: 'red'}, @@ -444,13 +399,120 @@
+ + + +
-
Rhythm & flow
+
Characters
-
-
+
+
+
Page presence
+ <%= + timeline([ + ["Alice Yellowbottom", 1, 10 + rand(10)], + ["Alice Yellowbottom", 20, 20 + rand(10)], + ["Bob Zebracakes", 1 + rand(10), 10 + rand(10)], + ["Bob Zebracakes", 20 + rand(10), 30 + rand(10)], + ["Carol Anderson", 5 + rand(10), 20 + rand(10)], + ["David Butters", 10 + rand(10), 20 + rand(10)], + ["Ethan Coolridge", 1 + rand(10), 12 + rand(7)], + ["Ethan Coolridge", 15 + rand(10), 20 + rand(10)], + ["Fred Danvers", 20 + rand(10), 35], + ["Fred Danvers", 1 + rand(10), 10 + rand(5)], + ]) + %> +
+
+
+ +
+
+
+
Number of pages each character is on
+

+ <%= + pie_chart({ + 'Alice Yellowbottom' => 33, + 'Bob Zebracakes' => 19, + 'Carol Anderson' => 12, + 'David Butters' => 10, + 'Ethan Coolridge' => 15, + 'Fred Danvers' => 14 + }) + %> +

+
+
+
+ +
+
+
+
Main characters
+

+ Based on their frequency in appearing in <%= @document.title %>, the + following characters are ordered by importance. +

+ +
    + <% 3.times do %> +
  • + + <%= Character.icon %> + + <%= link_to 'Alice Yellowbottom', '#', class: 'title' %> +

    Main character

    +
    • + <% end %> +
+ +
+
+
+
+ +
Style
+
+
+
+
Words per sentence

<%= line_chart((1..100).map { |i| [i, 5 + 7 * Math.sin(i).abs * rand(3)] }) %> @@ -480,3 +542,24 @@

+ +