diff --git a/README.md b/README.md
index 94340a5..bfabbf2 100644
--- a/README.md
+++ b/README.md
@@ -18,23 +18,35 @@ Here is an example usage of **ziba.js**:
Here is a ziba-link to my resume.
- That ziba-link will get turned into resume.
+ That ziba-link will get turned into resume.
Notice that the text and the href are the same.
Here is another one fource
- This ziba tag will get turned into fource
+ This ziba tag will get turned into fource
Notice that the href now has the value of the title of the ziba-link
- ziba-link is design to work for only local links.
+ once Twice tHRICE FOURCE should become once Twice tHRICE FOURCE
+
+
+ once Twice tHRICE FOURCE should become once Twice tHRICE FOURCE
+
+
+ once Twice tHRICE FOURCE should become once Twice tHRICE FOURCE
+
+
+ once Twice tHRICE FOURCE should become once Twice tHRICE FOURCE
+
+
+ ziba-link is designed to work for only local links.
@@ -45,6 +57,9 @@ Here is an example usage of **ziba.js**:
## Tags
* `` — used for local links.
+ * attributes:
+ * `title`
+ * `tramsform`
## Import
diff --git a/ziba.js b/ziba.js
index d53286d..5f9e062 100644
--- a/ziba.js
+++ b/ziba.js
@@ -20,38 +20,38 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
export function transform(rootElement) {
- console.log("[ziba][transform] begin")
+ log("[transform] begin")
if (undefined === rootElement) {
- console.log("[ziba][transform] root-elelemt is undefined")
- console.log("[ziba][transform] end")
+ log("[transform] root-elelemt is undefined")
+ log("[transform] end")
return
}
transform_link(rootElement)
- console.log("[ziba][transform] end")
+ log("[transform] end")
}
function transform_link(rootElement) {
- console.log("[ziba][transform_link] begin")
+ log("[transform_link] begin")
if (undefined === rootElement) {
- console.log("[ziba][transform_link] root-elelemt is undefined")
- console.log("[ziba][transform_link] end")
+ logerror("[transform_link] root-elelemt is undefined")
+ log("[transform_link] end")
return
}
const tagName = "ziba-link"
const elements = rootElement.getElementsByTagName(tagName)
if (!elements) {
- console.log("[ziba][transform_link] no elements")
- console.log("[ziba][transform_link] rootElement.innerHTML=", rootElement.innerHTML)
- console.log("[ziba][transform_link] end")
+ logerror("[transform_link] no elements")
+ log("[transform_link] rootElement.innerHTML=", rootElement.innerHTML)
+ log("[transform_link] end")
return
}
const length = elements.length
- console.log("[ziba][transform_link] found", length, tagName)
+ log("[transform_link] found", length, tagName)
// Because we are doing a replaceWith() on the HTMLCollection,
// we need to iterate through it backwards, because the HTMLCollection
@@ -66,17 +66,48 @@ function transform_link(rootElement) {
anchor.innerHTML = element.innerHTML
- let href = element.innerText
+ let ref = element.innerText
const elementTitle = element.getAttribute("title")
if (elementTitle) {
- href = elementTitle
+ ref = elementTitle
}
- href = "./"+href
+ const transform = element.getAttribute("transform")
+ if (transform) {
+ switch (transform) {
+ case "lowercase":
+ ref = ref.toLowerCase()
+ break;
+ case "lowersnakecase":
+ ref = ref.toLowerCase().replaceAll(" ", "_")
+ break;
+ case "uppercase":
+ ref = ref.toUpperCase()
+ break;
+ case "uppersnakecase":
+ ref = ref.toUpperCase().replaceAll(" ", "_")
+ break;
+ default:
+ logerror("unknow tramsform:", transform)
+ // Nothing here.
+ }
+ }
+
+ const href = "./"+ref
anchor.setAttribute("href", href)
element.replaceWith(anchor)
}
- console.log("[ziba][transform_link] end")
+ log("[transform_link] end")
+}
+
+function log(...args) {
+ args.unshift("[ziba]");
+ console.log(...args);
+}
+
+function logerror(...args) {
+ args.unshift("[ziba] ERROR:");
+ console.error(...args);
}
diff --git a/ziba_test.js b/ziba_test.js
index fbc01f9..d5309da 100644
--- a/ziba_test.js
+++ b/ziba_test.js
@@ -73,6 +73,146 @@ function testTransform() {
html:'',
expected:'',
},
+
+
+
+ {
+ html:'e',
+ expected:'e',
+ },
+ {
+ html:'E',
+ expected:'E',
+ },
+ {
+ html:'example',
+ expected:'example',
+ },
+ {
+ html:'Example',
+ expected:'Example',
+ },
+ {
+ html:'eXAMPLE',
+ expected:'eXAMPLE',
+ },
+ {
+ html:'EXAMPLE',
+ expected:'EXAMPLE',
+ },
+ {
+ html:'Hello world',
+ expected:'Hello world',
+ },
+ {
+ html:'apple Banana CHERRY',
+ expected:'apple Banana CHERRY',
+ },
+
+
+
+ {
+ html:'e',
+ expected:'e',
+ },
+ {
+ html:'E',
+ expected:'E',
+ },
+ {
+ html:'example',
+ expected:'example',
+ },
+ {
+ html:'Example',
+ expected:'Example',
+ },
+ {
+ html:'eXAMPLE',
+ expected:'eXAMPLE',
+ },
+ {
+ html:'EXAMPLE',
+ expected:'EXAMPLE',
+ },
+ {
+ html:'Hello world',
+ expected:'Hello world',
+ },
+ {
+ html:'apple Banana CHERRY',
+ expected:'apple Banana CHERRY',
+ },
+
+
+
+ {
+ html:'e',
+ expected:'e',
+ },
+ {
+ html:'E',
+ expected:'E',
+ },
+ {
+ html:'example',
+ expected:'example',
+ },
+ {
+ html:'Example',
+ expected:'Example',
+ },
+ {
+ html:'eXAMPLE',
+ expected:'eXAMPLE',
+ },
+ {
+ html:'EXAMPLE',
+ expected:'EXAMPLE',
+ },
+ {
+ html:'Hello world',
+ expected:'Hello world',
+ },
+ {
+ html:'apple Banana CHERRY',
+ expected:'apple Banana CHERRY',
+ },
+
+
+
+ {
+ html:'e',
+ expected:'e',
+ },
+ {
+ html:'E',
+ expected:'E',
+ },
+ {
+ html:'example',
+ expected:'example',
+ },
+ {
+ html:'Example',
+ expected:'Example',
+ },
+ {
+ html:'eXAMPLE',
+ expected:'eXAMPLE',
+ },
+ {
+ html:'EXAMPLE',
+ expected:'EXAMPLE',
+ },
+ {
+ html:'Hello world',
+ expected:'Hello world',
+ },
+ {
+ html:'apple Banana CHERRY',
+ expected:'apple Banana CHERRY',
+ },
]