1+ import ohm from "https://unpkg.com/[email protected] /dist/ohm.js" ; 2+
3+ const exampleQueries = [
4+ "Composite(AA.AuN='mike smith')" ,
5+ "Ti='indexing by latent seman'" ,
6+ "Ti=='indexing by latent semantic analysis'" ,
7+ "Composite(AA.AuN=='susan t dumais')" ,
8+ "Y=[2010, 2012)" ,
9+ "Y=[2010, 2012]" ,
10+ "Y<=2010" ,
11+ "Y>=2005" ,
12+ "Y<2010" ,
13+ "D>'2010-02-03'" ,
14+ "D=['2010-02-03','2010-02-05']" ,
15+ "D='2010-02-03'" ,
16+ "And(Y=1985, Ti='disordered electronic systems')" ,
17+ "Or(Ti='disordered electronic systems', Ti='fault tolerance principles and practice')" ,
18+ "And(Or(Y=1985,Y=2008), Ti='disordered electronic systems')" ,
19+ "Composite(And(AA.AuN='mike smith',AA.AfN='harvard university'))" ,
20+ "And(Composite(AA.AuN='mike smith'),Composite(AA.AfN='harvard university'))"
21+ ]
22+
23+
24+ function createUILayer ( object , key ) {
25+ var subDiv = < div id = "innerDiv" style = "margin: 5px; border: 1px solid gray;" > { key } </ div > ;
26+ var valueOrObject = object [ key ] ;
27+ if ( typeof ( valueOrObject ) == "object" ) {
28+ Object . keys ( valueOrObject ) . map ( k => {
29+ subDiv . appendChild ( createUILayer ( valueOrObject , k ) ) ;
30+ } ) ;
31+ } else {
32+ var input = < input value = { valueOrObject } > </ input > ;
33+ subDiv . appendChild ( input ) ;
34+ }
35+ return subDiv ;
36+ }
37+
38+
39+ export default class LeoUIExample {
40+ static async create ( ) {
41+
42+ // var hello = <div id="helloDiv" draggable="true" click={() => lively.notify('hi')}>
43+ // Hi
44+ // </div>
45+
46+ // var world = <div id="worldDiv">
47+ // World
48+ // </div>
49+
50+ // let description = <p id="description"></p>
51+
52+ // hello.addEventListener('dragstart', dragStart);
53+ // hello.addEventListener('dragend', dragEnd);
54+
55+ // world.addEventListener('drop', drop);
56+
57+ var g = ohm . grammar ( 'Academic { \n Exp = \n AcademicQuery \n \n AcademicQuery = Attribute Comparator Value -- simple \n | ("And" | "Or") "(" AcademicQuery "," AcademicQuery ")" -- complex \n | "Composite(" CompositeQuery ")" -- composite \n \n CompositeQuery = Attribute "." Attribute Comparator Value -- simple \n | ("And" | "Or") "(" CompositeQuery "," CompositeQuery ")" -- complex \n \n Comparator = \n PartialComparator "="? \n PartialComparator = \n "=" | "<" | ">" \n \n Attribute (an attribute) = \n letter letter? letter? \n \n Value (a value) = \n "\'" alnum* "\'" -- string \n | Number \n | Date \n | ( "[" | "(" ) Number "," Number ( "]" | ")" ) -- numberRange \n | ( "[" | "(" ) Date "," Date ( "]" | ")" ) -- dateRange \n \n Number = \n digit+ \n Date = \n "\'" Number "-" Number "-" Number "\'" \n}' ) ;
58+
59+ /*lively.notify(g.match("Composite(And(AA.AuN='mike smith',AA.AfN='harvard university'))").succeeded(), "Composite(And(AA.AuN='mike smith',AA.AfN='harvard university'))");
60+ lively.notify(g.match("And(AA.AuN='mike smith',AA.AfN='harvard university')").succeeded(), "And(AA.AuN='mike smith',AA.AfN='harvard university')");*/
61+
62+ //var queryObject = {};
63+
64+ var s = g . createSemantics ( ) ;
65+
66+ s . addOperation (
67+ 'interpret' , {
68+ Exp : function ( e ) {
69+ return e . interpret ( ) ;
70+ } ,
71+
72+ AcademicQuery_simple : function ( attribute , comparator , value ) {
73+ return { [ attribute . interpret ( ) ] : {
74+ "comparator" : comparator . interpret ( ) ,
75+ "value" : value . interpret ( ) ,
76+ } }
77+ } ,
78+ AcademicQuery_complex : function ( conjunction , _1 , left , _2 , right , _3 ) {
79+ return { [ conjunction . sourceString ] : [
80+ left . interpret ( ) ,
81+ right . interpret ( )
82+ ] }
83+ } ,
84+ AcademicQuery_composite : function ( _1 , query , _2 ) {
85+ return query . interpret ( ) ;
86+ } ,
87+
88+ CompositeQuery_simple : function ( mainAttribute , _ , secondaryAttribute , comparator , value ) {
89+ return { [ mainAttribute . interpret ( ) ] :
90+ { [ secondaryAttribute . interpret ( ) ] :
91+ {
92+ "comparator" : comparator . interpret ( ) ,
93+ "value" : value . interpret ( ) ,
94+ }
95+ }
96+ }
97+ } ,
98+ CompositeQuery_complex : function ( conjunction , _1 , left , _2 , right , _3 ) {
99+ return { [ conjunction . sourceString ] : [
100+ left . interpret ( ) ,
101+ right . interpret ( )
102+ ] }
103+ } ,
104+
105+ Comparator : function ( main , secondary ) {
106+ return [ main . interpret ( ) , secondary . sourceString ] . join ( '' ) ;
107+ } ,
108+ PartialComparator : function ( comparator ) {
109+ return comparator . sourceString ;
110+ } ,
111+
112+ Attribute : function ( a , b , c ) {
113+ return [ a . interpret ( ) , b . interpret ( ) , c . interpret ( ) ] . join ( '' ) ;
114+ } ,
115+
116+ Value : function ( value ) {
117+ return value . interpret ( ) ;
118+ } ,
119+ Value_string : function ( _1 , string , _2 ) {
120+ return string . sourceString ;
121+ } ,
122+ Value_numberRange : function ( leftBracket , nLeft , _ , nRight , rightBracket ) {
123+ // TODO: refactor
124+ return "TODO" ; //arguments.map(a => {a.sourceString}).join('');
125+ } ,
126+ Value_dateRange : function ( leftBracket , dLeft , _ , dRight , rightBracket ) {
127+ return "TODO" ; //arguments.map(a => {a.sourceString}).join('');
128+ } ,
129+
130+ Number : function ( n ) {
131+ return parseFloat ( n . sourceString ) ;
132+ } ,
133+ Date : function ( _1 , year , _2 , month , _3 , day , _4 ) {
134+ return new Date ( year . interpret ( ) ,
135+ month . interpret ( ) ,
136+ day . interpret ( ) )
137+ } ,
138+
139+ letter : function ( a ) {
140+ return a . sourceString ;
141+ }
142+ }
143+ )
144+
145+ // "Test"
146+ exampleQueries . forEach ( q => {
147+ var m = g . match ( q ) ;
148+ if ( m . failed ( ) ) {
149+ lively . notify ( "Failed query: " , q )
150+ } else {
151+ lively . notify ( q , s ( m ) . interpret ( ) ) ;
152+ }
153+ } )
154+
155+
156+ // function dragStart(event) {
157+ // description.innerHTML = "dragging";
158+ // event.dataTransfer.setData("element", event.target.id);
159+ // }
160+
161+ // function dragEnd(event) {
162+ // description.innerHTML = "";
163+ // }
164+
165+ // function drop(event) {
166+ // event.preventDefault();
167+ // var data = event.dataTransfer.getData("element");
168+ // console.log("Datatransfer Types" + event.dataTransfer.types);
169+ // event.target.appendChild(lively.query(this, '#'+data))
170+ // }
171+
172+ var query = "Ti='indexing by latent seman'" ;
173+ var match = g . match ( query ) ;
174+ var queryObject = s ( match ) . interpret ( ) ;
175+
176+ var div = < div id = "outerDiv" > </ div >
177+
178+ Object . keys ( queryObject ) . forEach ( key => {
179+ div . appendChild ( createUILayer ( queryObject , key ) ) ;
180+ } ) ;
181+ //div.appendChild(<div>key</div>)
182+
183+ return div ;
184+ // <div>
185+ // <table>
186+ // <tr>
187+ // <td>
188+ // Title
189+ // </td>
190+ // <td>
191+ // Author
192+ // </td>
193+ // <td>
194+ // Year
195+ // </td>
196+ // </tr>
197+ // <tr style="vertical-align:top">
198+ // <td>
199+ // <input value='something'></input>
200+ // </td>
201+ // <td>
202+ // <table>
203+ // <tr>
204+ // <td>
205+ // Name
206+ // </td>
207+ // <td>
208+ // <input value='name'></input>
209+ // </td>
210+ // </tr>
211+ // <tr>
212+ // <td>
213+ // Institution
214+ // </td>
215+ // <td>
216+ // <input value='inst'></input>
217+ // </td>
218+ // </tr>
219+ // </table>
220+ // </td>
221+ // <td>
222+ // <input value='2001'></input>
223+ // </td>
224+ // </tr>
225+ // </table>
226+ // </div>
227+ }
228+ }
0 commit comments