quran-madina-html 0.2.4 → 0.2.6

package/.jshintignore

@@ -1 +1 @@
-src/x-tag-components.js
+src/x-tag-components.js

package/Gruntfile.js

@@ -1,77 +1,77 @@
-module.exports = function(grunt) {
-
-  grunt.initConfig({
-    pkg: grunt.file.readJSON('package.json'),
-    concat: {
-      options: {
-        separator: ';'
-      },
-      dist: {
-        src: ['src/<%= pkg.name %>.js',
-         'bower_components/x-tag-core/dist/x-tag-core.min.js'],
-        dest: 'dist/<%= pkg.name %>.js'
-      }
-    },
-    uglify: {
-      options: {
-        banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
-      },
-      dist: {
-        files: {
-          'dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
-        }
-      }
-    },
-    cssmin: {
-      target: {
-        files: [{
-          expand: true,
-          cwd: 'src',
-          src: ['*.css', '!*.min.css'],
-          dest: 'dist',
-          ext: '.min.css'
-        }]
-      }
-    },
-    jshint: {
-      files: ['Gruntfile.js', 'src/**/*.js', 'test/**/*.js'],
-      options: {
-        // options here to override JSHint defaults
-        globals: {
-          jQuery: true,
-          console: true,
-          module: true,
-          document: true
-        },
-        esnext: true
-      }
-    },
-    'json-minify': {
-      build: {
-        files: 'assets/db/*.json'
-      }
-    },
-    clean : {
-      yourTarget : {
-          src : [ "dist"
-          ]
-      }
-    },
-    watch: {
-      files: ['<%= jshint.files %>'],
-      tasks: ['jshint']
-    }
-  });
-
-  grunt.loadNpmTasks('grunt-contrib-uglify');
-  grunt.loadNpmTasks('grunt-contrib-jshint');
-  grunt.loadNpmTasks('grunt-contrib-watch');
-  grunt.loadNpmTasks('grunt-contrib-concat');
-  grunt.loadNpmTasks('grunt-contrib-clean');
-  grunt.loadNpmTasks('grunt-contrib-cssmin');
-  grunt.loadNpmTasks('grunt-json-minify');
-
-  grunt.registerTask('test', ['jshint']);
-  grunt.registerTask('default', ['jshint', 'clean', 'concat', 'uglify', 'cssmin', 'json-minify']);
-
+module.exports = function(grunt) {
+
+  grunt.initConfig({
+    pkg: grunt.file.readJSON('package.json'),
+    concat: {
+      options: {
+        separator: ';'
+      },
+      dist: {
+        src: ['src/<%= pkg.name %>.js',
+         'bower_components/x-tag-core/dist/x-tag-core.min.js'],
+        dest: 'dist/<%= pkg.name %>.js'
+      }
+    },
+    uglify: {
+      options: {
+        banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
+      },
+      dist: {
+        files: {
+          'dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
+        }
+      }
+    },
+    cssmin: {
+      target: {
+        files: [{
+          expand: true,
+          cwd: 'src',
+          src: ['*.css', '!*.min.css'],
+          dest: 'dist',
+          ext: '.min.css'
+        }]
+      }
+    },
+    jshint: {
+      files: ['Gruntfile.js', 'src/**/*.js', 'test/**/*.js'],
+      options: {
+        // options here to override JSHint defaults
+        globals: {
+          jQuery: true,
+          console: true,
+          module: true,
+          document: true
+        },
+        esnext: true
+      }
+    },
+    'json-minify': {
+      build: {
+        files: 'assets/db/*.json'
+      }
+    },
+    clean : {
+      yourTarget : {
+          src : [ "dist"
+          ]
+      }
+    },
+    watch: {
+      files: ['<%= jshint.files %>'],
+      tasks: ['jshint']
+    }
+  });
+
+  grunt.loadNpmTasks('grunt-contrib-uglify');
+  grunt.loadNpmTasks('grunt-contrib-jshint');
+  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-contrib-concat');
+  grunt.loadNpmTasks('grunt-contrib-clean');
+  grunt.loadNpmTasks('grunt-contrib-cssmin');
+  grunt.loadNpmTasks('grunt-json-minify');
+
+  grunt.registerTask('test', ['jshint']);
+  grunt.registerTask('default', ['jshint', 'clean', 'concat', 'uglify', 'cssmin', 'json-minify']);
+
 };

package/README.md

@@ -1,55 +1,55 @@
-# Quran Madina Html (no-images)
-[![pylint](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/pylint.yml/badge.svg)](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/pylint.yml)
-[![db_test](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/db_test.yml/badge.svg)](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/db_test.yml)
-[![npm-grunt](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/npm-grunt.yml/badge.svg)](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/npm-grunt.yml)
-
-A Madina Quran HTML Renderer without images
-
-Theres a pre-processing python script to generate Json databases with quran text with special metadata. The preprocessing is based on text from [Tanzil](tanzil.net), and the [OCR DB](https://github.com/quran/ayah-detection) downloaded from [Murtaza Raja](https://github.com/murtraja/quran-android-images-helper) helper project.
-Afterwards, the JS library uses those Json objects to render Madina-based Quran pages and lines.
-
-The main purpose of this library is:
-* Render Quran text that's visually similar to Madina Printed Pages
-* Efficient Loading of Quran Visual Text (Not image-based, but pure Html)
-* Easy to use: just a simple HTML tag!
-
-<img src="https://github.com/tarekeldeeb/quran-madina-html/assets/90985/dc3972c3-71a6-4f48-8d45-2df28ddc409f" width="750px">
-
-# Getting Started
-In your Html header, add this script:
-```html
-  <script type="text/javascript" src="https://unpkg.com/quran-madina-html"></script>
-```
-* Supported ``data-name`` parameters are: Madina05 (default), others are under development (Shemerly, Qaloon, Newer Madina)
-* Supported ``data-font`` parameters are: Hafs (default), Uthman, Amiri Quran, Amiri Quran Colored
-* Other options include: ``data-font-size`` which defaults to 16 (px)
-
-Then in your body, just add the tag.
-```html
-<quran-madina-html sura="2" aya="8-10"></quran-madina-html>
-```
- If the selected aya(s) fit on a single line, the default is to generate an inline ``<span>`` element, otherwise a ``<div>`` is generated.
-  
-# Dev Setup
-
-The project is published on npm ``npm install quran-madina-html``, with sources, assets and distributables.
-Alternatively, you can fork this repo, then clone it.
-
-```
-$ apt install python3-distutils nodejs npm chromium-driver
-$ npm install	// install components and scripts
-$ bower install	// install bower libs
-$ npm run build-db // build all json Db files
-$ npm run release // build the dist with dependencies
-
-```
-
-# Demo
-
-https://tarekeldeeb.github.io/quran-madina-html/demo/index.html
-
-Don't forget to see the page source!
-
-# Links
-
-[X-Tags Docs](http://x-tags.org/docs)
+# Quran Madina Html (no-images)
+[![pylint](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/pylint.yml/badge.svg)](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/pylint.yml)
+[![db_test](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/db_test.yml/badge.svg)](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/db_test.yml)
+[![npm-grunt](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/npm-grunt.yml/badge.svg)](https://github.com/tarekeldeeb/quran-madina-html/actions/workflows/npm-grunt.yml)
+
+A Madina Quran HTML Renderer without images
+
+Theres a pre-processing python script to generate Json databases with quran text with special metadata. The preprocessing is based on text from [Tanzil](tanzil.net), and the [OCR DB](https://github.com/quran/ayah-detection) downloaded from [Murtaza Raja](https://github.com/murtraja/quran-android-images-helper) helper project.
+Afterwards, the JS library uses those Json objects to render Madina-based Quran pages and lines.
+
+The main purpose of this library is:
+* Render Quran text that's visually similar to Madina Printed Pages
+* Efficient Loading of Quran Visual Text (Not image-based, but pure Html)
+* Easy to use: just a simple HTML tag!
+
+<img src="https://github.com/tarekeldeeb/quran-madina-html/assets/90985/dc3972c3-71a6-4f48-8d45-2df28ddc409f" width="750px">
+
+# Getting Started
+In your Html header, add this script:
+```html
+  <script type="text/javascript" src="https://unpkg.com/quran-madina-html"></script>
+```
+* Supported ``data-name`` parameters are: Madina05 (default), others are under development (Shemerly, Qaloon, Newer Madina)
+* Supported ``data-font`` parameters are: Hafs (default), Uthman, Amiri Quran, Amiri Quran Colored
+* Other options include: ``data-font-size`` which defaults to 16 (px)
+
+Then in your body, just add the tag.
+```html
+<quran-madina-html sura="2" aya="8-10"></quran-madina-html>
+```
+ If the selected aya(s) fit on a single line, the default is to generate an inline ``<span>`` element, otherwise a ``<div>`` is generated.
+  
+# Dev Setup
+
+The project is published on npm ``npm install quran-madina-html``, with sources, assets and distributables.
+Alternatively, you can fork this repo, then clone it.
+
+```
+$ apt install python3-distutils nodejs npm chromium-driver
+$ npm install	// install components and scripts
+$ bower install	// install bower libs
+$ npm run build-db // build all json Db files
+$ npm run release // build the dist with dependencies
+
+```
+
+# Demo
+
+https://tarekeldeeb.github.io/quran-madina-html/demo/index.html
+
+Don't forget to see the page source!
+
+# Links
+
+[X-Tags Docs](http://x-tags.org/docs)

package/assets/fonts/www.unpkg.com/quran-madina-html@0.2.4/dist/quran-madina-html.min.css

@@ -0,0 +1 @@
+quran-madina-html{/* padding: 0px 0px 7px 0px; */background-color:beige;border-radius:5px;overflow: hidden;}quran-madina-html-line{text-align:right;white-space:nowrap;transform-origin:top right;padding: 0px 5px 0px 5px;transition:background-color 1s ease}

package/bower.json

@@ -1,16 +1,16 @@
-{
-  "name": "quran-madina-html",
-  "description": "",
-  "version": "0.1.1",
-  "keywords": [
-    "web-components",
-    "x-tag"
-  ],
-  "main": [
-    "src/quran-madina-html.js",
-    "src/quran-madina-html.css"
-  ],
-  "dependencies": {
-    "x-tag-core": "*"
-  }
+{
+  "name": "quran-madina-html",
+  "description": "",
+  "version": "0.1.1",
+  "keywords": [
+    "web-components",
+    "x-tag"
+  ],
+  "main": [
+    "src/quran-madina-html.js",
+    "src/quran-madina-html.css"
+  ],
+  "dependencies": {
+    "x-tag-core": "*"
+  }
 }

package/demo/index.html

@@ -1,20 +1,20 @@
-<!DOCTYPE html>
-<html dir="rtl" lang="ar">
-
-<head>
-  <meta charset="utf-8" />
-  <title>quran-madina-html مشروع</title>
-  <script type="text/javascript" src="https://unpkg.com/quran-madina-html"></script>
-</head>
-
-<body>
-	<h2>عرض لإمكانية مشروع قران المدينة Html بدون صور</h2>
-
-  يمكن عرض نص آية قصيرة وسط الكلام مثل قوله تعالى: 
-	<quran-madina-html sura="1" aya="3"></quran-madina-html> 
-  واذا تم اختيار ايات تمتد لأكثر من سطر، فيتم عرض عدة أسطر متوافقة مع ترتيب كلمات مصحف المدينة بشكل تلقائي 
-  <quran-madina-html sura="2" aya="13-14"></quran-madina-html> 
-  يتميز المشروع بأنه مفتوح المصدر ويسهل تغيير الفونت، كما يعمل على مصاحف غير مصحف المدينة
-</body>
-
-</html>
+<!DOCTYPE html>
+<html dir="rtl" lang="ar">
+
+<head>
+  <meta charset="utf-8" />
+  <title>quran-madina-html مشروع</title>
+  <script type="text/javascript" src="https://unpkg.com/quran-madina-html"></script>
+</head>
+
+<body>
+	<h2>عرض لإمكانية مشروع قران المدينة Html بدون صور</h2>
+
+  يمكن عرض نص آية قصيرة وسط الكلام مثل قوله تعالى: 
+	<quran-madina-html sura="1" aya="3"></quran-madina-html> 
+  واذا تم اختيار ايات تمتد لأكثر من سطر، فيتم عرض عدة أسطر متوافقة مع ترتيب كلمات مصحف المدينة بشكل تلقائي 
+  <quran-madina-html sura="2" aya="13-14"></quran-madina-html> 
+  يتميز المشروع بأنه مفتوح المصدر ويسهل تغيير الفونت، كما يعمل على مصاحف غير مصحف المدينة
+</body>
+
+</html>