FolioReader · marcqtan · Jul 6, 2020 · Jul 15, 2020 · Aug 14, 2020 · Aug 18, 2020
diff --git a/folioreader/build.gradle b/folioreader/build.gradle
@@ -118,5 +118,7 @@ dependencies {
 
     // Lifecycle
     implementation "androidx.lifecycle:lifecycle-extensions:$versions.lifecycle"
+
+    implementation 'org.jsoup:jsoup:1.13.1'
 }
 apply from: '../folioreader/bintray/bintrayv1.gradle'
diff --git a/folioreader/res/layout/folio_activity.xml b/folioreader/res/layout/folio_activity.xml
@@ -6,7 +6,7 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context="com.folioreader.ui.activity.FolioActivity"
-    tools:menu="@menu/menu_main">
+    tools:menu="@menu/menu_main_folio">
 
     <com.folioreader.ui.view.DirectionalViewpager
         android:id="@+id/folioPageViewPager"

diff --git a/folioreader/res/layout/folio_page_fragment.xml b/folioreader/res/layout/folio_page_fragment.xml
@@ -8,6 +8,7 @@
     android:orientation="vertical">
 
     <FrameLayout
+        android:paddingTop="?android:actionBarSize"
         android:id="@+id/webViewLayout"
         android:layout_width="match_parent"
         android:layout_height="match_parent"

diff --git a/folioreader/res/menu/menu_main.xml → folioreader/res/menu/menu_main_folio.xml b/folioreader/res/menu/menu_main.xml → folioreader/res/menu/menu_main_folio.xml
diff --git a/folioreader/src/main/java/com/folioreader/ui/activity/FolioActivity.kt b/folioreader/src/main/java/com/folioreader/ui/activity/FolioActivity.kt
@@ -260,7 +260,7 @@ class FolioActivity : AppCompatActivity(), FolioActivityCallback, MediaControlle
         // getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
 
         setConfig(savedInstanceState)
-        initDistractionFreeMode(savedInstanceState)
+        //initDistractionFreeMode(savedInstanceState)
 
         setContentView(R.layout.folio_activity)
         this.savedInstanceState = savedInstanceState
@@ -359,7 +359,7 @@ class FolioActivity : AppCompatActivity(), FolioActivityCallback, MediaControlle
     }
 
     override fun onCreateOptionsMenu(menu: Menu): Boolean {
-        menuInflater.inflate(R.menu.menu_main, menu)
+        menuInflater.inflate(R.menu.menu_main_folio, menu)
 
         val config = AppUtil.getSavedConfig(applicationContext)!!
         UiUtil.setColorIntToDrawable(config.themeColor, menu.findItem(R.id.itemSearch).icon)

diff --git a/folioreader/src/main/java/com/folioreader/ui/base/HtmlUtil.java b/folioreader/src/main/java/com/folioreader/ui/base/HtmlUtil.java
@@ -5,6 +5,11 @@
 import com.folioreader.Constants;
 import com.folioreader.R;
 
+import org.jsoup.Jsoup;
+import org.jsoup.nodes.Document;
+import org.jsoup.parser.Parser;
+import org.jsoup.select.Elements;
+
 /**
  * @author gautam chibde on 14/6/17.
  */
@@ -54,7 +59,15 @@ public static String getHtmlContent(Context context, String htmlContent, Config
                 "setMediaOverlayStyleColors('#C0ED72','#C0ED72')") + "\n";
 
         jsPath = jsPath
-                + "<meta name=\"viewport\" content=\"height=device-height, user-scalable=no\" />";
+                + "<meta name=\"viewport\" content=\"height=device-height, user-scalable=yes\" />" + "\n";
+
+        jsPath = jsPath + String.format(context.getString(R.string.script_tag_method_call), "function playAudio(src) {\n" +
+                "    var audioElement = $('#player')[0];\n" +
+                "    audioElement.setAttribute('src',src);\n" +
+                "    audioElement.load();\n" +
+                "    audioElement.play();\n" +
+                "    $(audioElement).show();\n" +
+                "}") + "\n";
 
         String toInject = "\n" + cssPath + "\n" + jsPath + "\n</head>";
         htmlContent = htmlContent.replace("</head>", toInject);
@@ -101,8 +114,71 @@ public static String getHtmlContent(Context context, String htmlContent, Config
                 break;
         }
 
-        htmlContent = htmlContent.replace("<html", "<html class=\"" + classes + "\"" +
-                " onclick=\"onClickHtml()\"");
+        htmlContent = checkClassAttr(htmlContent, classes);
+
+
+        Document doc = Jsoup.parse(htmlContent, "", Parser.xmlParser());
+
+        Elements audios = doc.getElementsByTag("audio");
+        if(audios.size() > 0) {
+            Elements rect = doc.getElementsByTag("rect");
+            for (int i = 0; i < rect.size(); i++) {
+                for(int y = 0; y < audios.size(); y++) {
+                    String src = null;
+                    String id = audios.get(y).attr("id");
+                    String onclick = rect.get(i).attr("onclick"); //$("#TRAC_126")[0].play()
+                    if(onclick.split("\"").length > 1) {//split by quotation
+                        String rectAudioId = onclick.split("\"")[1].substring(1); //to extract TRAC_126
+                        if (id.equals(rectAudioId)) {
+                            src = audios.get(y).attr("src");
+                            rect.get(i).attr("onclick", "playAudio('" + src + "')");
+                            break;
+                        }
+                    }
+                }
+            }
+
+            if(rect.size() > 0) {
+                doc.getElementsByTag("body").append("<audio id=\"player\" controls=\"controls\" style=\"width:100%; " +
+                        "margin: 0 auto;display: table;\"" + "\n</body>");
+            }
+
+            return doc.html();
+        }
         return htmlContent;
     }
+
+    //This will fix the "Attribute Class Redefined" error
+    private static String checkClassAttr(String html, String classes) {
+        //get the entry of <html>
+        String s1 = html.substring(html.indexOf("<html"));
+        String s2= s1.substring(0, s1.indexOf(">"));
+        String classValue = "";
+
+        //check if class attribute exists
+        if(s2.contains("class=")) {
+            String classVal = s2.substring(s2.indexOf("class="));
+            String[] kvPairs = classVal.split(" ");
+
+            //get the value
+            for(String kvPair: kvPairs) {
+                String[] kv = kvPair.split("=");
+                String key = kv[0];
+
+                if(key.equals("class")) {
+                    classValue = kv[1]; //get the value of class attribute
+                    break;
+                }
+            }
+
+            //remove the class attribute since it will be readded later to avoid "attribute redefined error"
+            html = html.replaceFirst("class=" + classValue, "");
+            classValue = classValue.substring(1); //remove the first quotation
+
+
+        }
+        classValue =  classValue.equals("") ? "\"" : classValue;
+        html = html.replace("<html", "<html class=\"" + classes + " " + classValue + " onclick=\"onClickHtml()\"");
+        return html;
+    }
 }
diff --git a/folioreader/src/main/java/com/folioreader/ui/fragment/FolioPageFragment.kt b/folioreader/src/main/java/com/folioreader/ui/fragment/FolioPageFragment.kt
@@ -391,6 +391,10 @@ class FolioPageFragment : Fragment(),
         mWebview!!.webChromeClient = webChromeClient
 
         mWebview!!.settings.defaultTextEncodingName = "utf-8"
+        mWebview!!.settings.builtInZoomControls = true;
+        mWebview!!.settings.displayZoomControls = false;
+
+
         HtmlTask(this).execute(chapterUrl.toString())
     }
 
@@ -657,9 +661,13 @@ class FolioPageFragment : Fragment(),
         if (mConfig!!.isNightMode) {
             mRootView!!.findViewById<View>(R.id.indicatorLayout)
                 .setBackgroundColor(Color.parseColor("#131313"))
+            mRootView!!.findViewById<FrameLayout>(R.id.webViewLayout)
+                .setBackgroundColor(Color.parseColor("#131313"))
         } else {
             mRootView!!.findViewById<View>(R.id.indicatorLayout)
                 .setBackgroundColor(Color.WHITE)
+            mRootView!!.findViewById<FrameLayout>(R.id.webViewLayout)
+                .setBackgroundColor(Color.WHITE)
         }
     }
 

diff --git a/folioreader/src/main/java/com/folioreader/ui/view/FolioWebView.kt b/folioreader/src/main/java/com/folioreader/ui/view/FolioWebView.kt
@@ -144,9 +144,9 @@ class FolioWebView : WebView {
 
     @JavascriptInterface
     fun toggleSystemUI() {
-        uiHandler.post {
-            folioActivityCallback.toggleSystemUI()
-        }
+//        uiHandler.post {
+//            folioActivityCallback.toggleSystemUI()
+//        }
     }
 
     @JavascriptInterface