From 9032821f147d50014a8e4c730d1a48b1a93abf26 Mon Sep 17 00:00:00 2001 From: rolux Date: Fri, 30 Mar 2012 13:04:23 +0200 Subject: [PATCH] add first version of readme --- readme/css/readme.css | 27 ++++++++ readme/html/test1.html | 7 +++ readme/html/test2.html | 1 + readme/index.html | 13 ++++ readme/js/readme.js | 129 ++++++++++++++++++++++++++++++++++++++ readme/json/readme.json | 10 +++ source/Ox/png/OxJS16.png | Bin 0 -> 301 bytes source/Ox/png/OxJS256.png | Bin 0 -> 860 bytes source/Ox/png/OxJS64.png | Bin 0 -> 455 bytes 9 files changed, 187 insertions(+) create mode 100644 readme/css/readme.css create mode 100644 readme/html/test1.html create mode 100644 readme/html/test2.html create mode 100644 readme/index.html create mode 100644 readme/js/readme.js create mode 100644 readme/json/readme.json create mode 100644 source/Ox/png/OxJS16.png create mode 100644 source/Ox/png/OxJS256.png create mode 100644 source/Ox/png/OxJS64.png diff --git a/readme/css/readme.css b/readme/css/readme.css new file mode 100644 index 00000000..444952ae --- /dev/null +++ b/readme/css/readme.css @@ -0,0 +1,27 @@ +.head img { + float: left; + width: 32px; + height: 16px; + margin: 4px 2px 4px 4px; +} +.head div { + float: left; + height: 15px; + padding: 1px 2px 0 2px; + margin: 4px 2px 4px 2px; + background: -webkit-linear-gradient(top, rgb(128, 128, 128), rgb(64, 64, 64)); + font-weight: bold; + font-size: 12px; +} +code { + border: 1px solid rgb(192, 192, 192); + background: rgb(255, 255, 255); +} +.text { + padding: 16px 24px 16px 24px; +} +.title { + font-weight: bold; + font-size: 16px; +} + diff --git a/readme/html/test1.html b/readme/html/test1.html new file mode 100644 index 00000000..d52bc914 --- /dev/null +++ b/readme/html/test1.html @@ -0,0 +1,7 @@ +

This is just a test

+ +

Foo bar baz.

+ +

foo: // this is some code

+ +
blockquote
\ No newline at end of file diff --git a/readme/html/test2.html b/readme/html/test2.html new file mode 100644 index 00000000..c23a4b20 --- /dev/null +++ b/readme/html/test2.html @@ -0,0 +1 @@ +

This is another test, with a longer title

\ No newline at end of file diff --git a/readme/index.html b/readme/index.html new file mode 100644 index 00000000..b045797e --- /dev/null +++ b/readme/index.html @@ -0,0 +1,13 @@ + + + + OxJS - readme + + + + + + + + \ No newline at end of file diff --git a/readme/js/readme.js b/readme/js/readme.js new file mode 100644 index 00000000..217e4fba --- /dev/null +++ b/readme/js/readme.js @@ -0,0 +1,129 @@ +Ox.load('UI', function() { + + var $ui = {}, items = []; + + renderUI(function() { + loadJSON(function(files) { + loadHTML(files, function() { + renderList(); + }); + }); + }); + + function loadJSON(callback) { + Ox.getJSON('json/readme.json', callback); + } + + function loadHTML(files, callback) { + files.forEach(function(file) { + Ox.get('html/' + file.name, function(html) { + var match = html.match(/

(.+)<\/p>/); + items.push({ + date: file.date, + file: file.name, + html: html, + title: match ? match[1] : file + }); + items.length == files.length && callback(items); + }); + }); + } + + function renderUI(callback) { + $ui.logo = $('').attr({href: 'https://oxjs.org'}) + .append( + $('').attr({src: '../source/Ox/png/OxJS64.png'}) + ); + $ui.title = $('').attr({href: 'https://oxjs.org/#readme'}) + .append( + $('

').css({color: 'rgb(192, 192, 192)'}).html('readme') + ); + $ui.bar = Ox.Bar({size: 24}) + .addClass('head') + .append($ui.logo) + .append($ui.title); + $ui.text = Ox.Element().addClass('text'), + $ui.inner = Ox.SplitPanel({ + elements: [ + { + element: Ox.Element(), + resizable: true, + resize: [256, 384, 512], + size: 384 + }, + { + element: $ui.text + } + ], + orientation: 'horizontal' + }); + $ui.outer = Ox.SplitPanel({ + elements: [ + { + element: $ui.bar, + size: 24 + }, + { + element: $ui.inner + } + ], + orientation: 'vertical' + }) + .appendTo(Ox.$body); + callback(); + } + + function renderList() { + Ox.print('?', items) + $ui.list = Ox.TextList({ + columns: [ + { + id: 'file', + unique: true + }, + { + id: 'title', + operator: '+', + title: 'Title', + visible: true, + width: 256 + }, + { + align: 'right', + format: function(value) { + return Ox.formatDate(value, '%B %e, %Y', true); + }, + id: 'date', + operator: '-', + title: 'Date', + visible: true, + width: 128 + } + ], + columnsVisible: true, + items: Ox.api(items, {unique: 'file'}), + max: 1, + min: 1, + selected: [items[0].file], + sort: [{key: 'date', operator: '-'}] + }) + .bindEvent({ + resize: function(data) { + this.resizeColumn('title', data.size - 128); + }, + select: selectText + }); + $ui.inner.replaceElement(0, $ui.list); + selectText({ids: [items[0].file]}); + } + + function selectText(data) { + Ox.print(data) + if (data.ids.length) { + $ui.text.html(Ox.getObject(items, 'file', data.ids[0]).html); + } else { + $ui.text.empty(); + } + } + +}); \ No newline at end of file diff --git a/readme/json/readme.json b/readme/json/readme.json new file mode 100644 index 00000000..7bddac46 --- /dev/null +++ b/readme/json/readme.json @@ -0,0 +1,10 @@ +[ + { + "date": "2012-04-01 04:01:12", + "name": "test2.html" + }, + { + "date": "2012-03-31 03:31:12", + "name": "test1.html" + } +] \ No newline at end of file diff --git a/source/Ox/png/OxJS16.png b/source/Ox/png/OxJS16.png new file mode 100644 index 0000000000000000000000000000000000000000..da56604f8c3529408731f8f225b4b40dd93ccbe8 GIT binary patch literal 301 zcmV+|0n+}7P)K5|j-q%7kF#rG+!f)bn4E;ilj8QzB-A(mHk9}I^53NVuF?w~ zn&#Cmpf_Qh0kDq!k^uwXtbq@{W#`KRE-jcJDl@0#Lkgn|00000NkvXXu0mjfBtn2C literal 0 HcmV?d00001 diff --git a/source/Ox/png/OxJS256.png b/source/Ox/png/OxJS256.png new file mode 100644 index 0000000000000000000000000000000000000000..2baeefd21433232fa9cf1bd70413a1301ade2974 GIT binary patch literal 860 zcmeAS@N?(olHy`uVBq!ia0y~yU<5K58aSAMWcGE1SOx}WWltB!kcv5P?{3VSn#yqO zi z`M;aTrTlg^>;FE#ck_qN(k=IR{M-MFG6wiEga|WSWpOaY!@ND~5c|A8h4XAT%ss2W zebe9Ozq4=ty!kP?=ljEdzB}fp+5Y>pUj5>~bIX5U{P)7f+Wt?e#O#OX>;FI7`=Lfd zjbRmMLl)D5Sqv-iF+bKed{nDW`g+%I%m0rrOm6L;yXdEd<(YH)_ulILw!Gcm{rB9f z-!IzjQNaT=_0>D(JNKjAem_n>zxZ#_ zd&e#EkHgINCw*run_hj<7VTu&!oA0wn{I3&u8-Kn={(+KB{k!*z`!lN~ KelF{r5}E*a#&%}_ literal 0 HcmV?d00001 diff --git a/source/Ox/png/OxJS64.png b/source/Ox/png/OxJS64.png new file mode 100644 index 0000000000000000000000000000000000000000..b8086b7cc890bc9bd20ed9bbcd5a99e7e2adcd7d GIT binary patch literal 455 zcmV;&0XY7NP)^*lmsV5;d)q+cq-K=@EBNSh6hg#=Jn-}xiyeDEP)D;KdkIP z+;G_f@>Z$`Xe^`P#AUu{^_btm(2XU&7Sxz~@fEWhoI!p;H4>gcpJ4t|H(*|(S6Ju= zlkq!X3&>mA9{9}}9pW=y$#Yu486^dC{@4STotU{qVmR`)nT_88TR`5LsR#CakGXx< zVfOqwBwdC4g1Y=Q&(CtwWBXdX_B}91GQNPBdf+B$G9Og;nVU(M`M7!r`31H4VL3xw zo8~=Z{0`Ux@|Ly-lKY5x^iSVH(QRMC&oTvjpcToSEnJ(D`+)6%d6Mx3IAt6y0&D&Y x!Rb!%H!WnFku_%LYpOH#U&!8x=SjvF@B`ynp)tBFEIa@J002ovPDHLkV1m$I&U^p> literal 0 HcmV?d00001