Commit 048020ff9811dde7b00454cc517551fa523641e5

  • avatar
  • arvind
  • Wed May 01 16:45:22 IST 2013
Bug fixes
  - Moving /server to /alipi.
	- Standardizing how data is sent to APIs
  
1from flask import Flask
2from flask import request
3from flask import render_template
4from flask import make_response
5import lxml.html
6import pymongo
7from bson import Code
8import urllib2
9import StringIO
10from flask import g
11from flask import redirect
12from urllib import quote_plus
13from urllib import unquote_plus
14import conf
15import oursql
16import requests
17from flask import jsonify
18import json
19
20
21app = Flask(__name__)
22@app.before_request
23def first():
24 g.connection = pymongo.MongoClient('localhost',27017) #Create the object once and use it.
25 g.db = g.connection[conf.MONGODB[0]]
26@app.teardown_request
27def close(exception):
28 g.connection.disconnect()
29@app.route('/')
30def start_page() :
31 d = {}
32 d['foruri'] = request.args['foruri']
33 myhandler1 = urllib2.Request(d['foruri'],headers={'User-Agent':"Mozilla/5.0 (X11; U; Linux i686) Gecko/20071127 Firefox/2.0.0.11"}) #A fix to send user-agents, so that sites render properly.
34 try:
35 a = urllib2.urlopen(myhandler1)
36 if a.geturl() != d['foruri']:
37 return "There was a server redirect, please click on the <a href='http://y.a11y.in/web?foruri={0}'>link</a> to continue.".format(quote_plus(a.geturl()))
38 else:
39 page = a.read()
40 a.close()
41 except ValueError:
42 return "The link is malformed, click <a href='http://y.a11y.in/web?foruri={0}&lang={1}&interactive=1'>here</a> to be redirected.".format(quote_plus(unquote_plus(d['foruri'].encode('utf-8'))),request.args['lang'])
43 except urllib2.URLError:
44 return render_template('error.html')
45 try:
46 page = unicode(page,'utf-8') #Hack to fix improperly displayed chars on wikipedia.
47 except UnicodeDecodeError:
48 pass #Some pages may not need be utf-8'ed
49 try:
50 g.root = lxml.html.parse(StringIO.StringIO(page)).getroot()
51 except ValueError:
52 g.root = lxml.html.parse(d['foruri']).getroot() #Sometimes creators of the page lie about the encoding, thus leading to this execption. http://lxml.de/parsing.html#python-unicode-strings
53 if request.args.has_key('lang') == False and request.args.has_key('blog') == False:
54 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
55 for i in g.root.iterlinks():
56 if i[1] == 'href' and i[0].tag != 'link':
57 try:
58 i[0].attrib['href'] = 'http://{0}?foruri={1}'.format(conf.DEPLOYURL[0],quote_plus(i[0].attrib['href']))
59 except KeyError:
60 i[0].attrib['href'] = '{0}?foruri={1}'.format(conf.DEPLOYURL[0],quote_plus(i[0].attrib['href'].encode('utf-8')))
61 setScripts()
62 g.root.body.set("onload","a11ypi.loadOverlay();")
63 return lxml.html.tostring(g.root)
64
65 elif request.args.has_key('lang') == True and request.args.has_key('interactive') == True and request.args.has_key('blog') == False:
66 setScripts()
67 setSocialScript()
68 g.root.body.set("onload","a11ypi.ren();a11ypi.tweet(); a11ypi.facebook(); a11ypi.loadOverlay();")
69 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
70 return lxml.html.tostring(g.root)
71
72 elif request.args.has_key('lang') == True and request.args.has_key('blog') == False:
73 script_jq_mini = g.root.makeelement('script')
74 g.root.body.append(script_jq_mini)
75 script_jq_mini.set("src", conf.JQUERYURL[0] + "/jquery.min.js")
76 script_jq_mini.set("type", "text/javascript")
77 d['lang'] = request.args['lang']
78 script_test = g.root.makeelement('script')
79 g.root.body.append(script_test)
80 script_test.set("src", conf.APPURL[0] + "/alipi/ui.js")
81 script_test.set("type", "text/javascript")
82 g.root.body.set("onload","a11ypi.ren()");
83 return lxml.html.tostring(g.root)
84
85 elif request.args.has_key('interactive') == True and request.args.has_key('blog') == True and request.args.has_key('lang') == True:
86 setScripts()
87 setSocialScript()
88 g.root.body.set("onload","a11ypi.filter(); a11ypi.tweet(); a11ypi.facebook(); a11ypi.loadOverlay();");
89 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
90 return lxml.html.tostring(g.root)
91
92 elif request.args.has_key('interactive') == False and request.args.has_key('blog') == True:
93 setScripts()
94 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
95 g.root.body.set('onload', 'a11ypi.loadOverlay();')
96 return lxml.html.tostring(g.root)
97
98def setScripts():
99 script_test = g.root.makeelement('script')
100 script_edit = g.root.makeelement('script')
101 g.root.body.append(script_test)
102 g.root.body.append(script_edit)
103 script_test.set("src", conf.APPURL[0] + "/alipi/ui.js")
104 script_test.set("type", "text/javascript")
105 script_edit.set("src", conf.APPURL[0] + "/alipi/wsgi/pageEditor.js")
106 script_edit.set("type","text/javascript")
107 script_config = g.root.makeelement('script')
108 g.root.body.append(script_config)
109 script_config.set("src", conf.APPURL[0] + "/alipi/config.js")
110 script_config.set("type", "text/javascript")
111
112
113 script_jq_mini = g.root.makeelement('script')
114 g.root.body.append(script_jq_mini)
115 script_jq_mini.set("src", conf.JQUERYURL[0] + "/jquery.min.js")
116 script_jq_mini.set("type", "text/javascript")
117
118 style = g.root.makeelement('link')
119 g.root.body.append(style)
120 style.set("rel","stylesheet")
121 style.set("type", "text/css")
122 style.set("href", conf.APPURL[0] + "/alipi/stylesheet.css")
123
124 script_jq_cust = g.root.makeelement('script')
125 g.root.body.append(script_jq_cust)
126 script_jq_cust.set("src", conf.JQUERYUI[0] + "/jquery-ui.min.js")
127 script_jq_cust.set("type", "text/javascript")
128
129 style_cust = g.root.makeelement('link')
130 style_cust.set("rel","stylesheet")
131 style_cust.set("type", "text/css")
132 style_cust.set("href", conf.JQUERYCSS[0] + "/jquery-ui.css")
133 g.root.body.append(style_cust)
134
135def setSocialScript():
136 info_button = g.root.makeelement('button')
137 g.root.body.append(info_button)
138 info_button.set("id", "info")
139 info_button.set("class", "alipi")
140 info_button.set("onClick", "a11ypi.showInfo(a11ypi.responseJSON);")
141 info_button.text = "Info"
142 info_button.set("title", "Have a look at the information of each renarrated element")
143
144 share_button = g.root.makeelement('button')
145 g.root.body.append(share_button)
146 share_button.set("id", "share")
147 share_button.set("class", "alipi")
148 share_button.set("onClick", "a11ypi.share();")
149 share_button.text = "Share"
150 share_button.set("title", "Share your contribution in your social network")
151
152 see_orig = g.root.makeelement('button')
153 g.root.body.append(see_orig)
154 see_orig.set("id", "orig-button")
155 see_orig.set("class", "alipi")
156 see_orig.set("onClick", "a11ypi.showOriginal();")
157 see_orig.text = "Original Page"
158 see_orig.set("title", "Go to Original link, the original page of this renarrated")
159
160 tweetroot = g.root.makeelement("div")
161 tweetroot.set("id", "tweet-root")
162 tweetroot.set("class", "alipi")
163 tweetroot.set("style", "display:none;padding:10px;")
164 g.root.body.append(tweetroot)
165
166 tweet = g.root.makeelement("a")
167 tweet.set("id", "tweet")
168 tweet.set("href", "https://twitter.com/share")
169 tweet.set("class", "alipi twitter-share-button")
170 tweet.set("data-via", "a11ypi")
171 tweet.set("data-lang", "en")
172 tweet.set("data-url", "http://y.a11y.in/web?foruri={0}&lang={1}&interactive=1".format(quote_plus(request.args['foruri']),(request.args['lang']).encode('unicode-escape')))
173 tweet.textContent = "Tweet"
174 tweetroot.append(tweet)
175
176 fblike = g.root.makeelement("div")
177 fblike.set("id", "fb-like")
178 fblike.set("class", "alipi fb-like")
179 fblike.set("style", "display:none;padding:10px;")
180 fblike.set("data-href", "http://y.a11y.in/web?foruri={0}&lang={1}&interactive=1".format(quote_plus(request.args['foruri']),(request.args['lang']).encode('unicode-escape')))
181 fblike.set("data-send", "true")
182 fblike.set("data-layout", "button_count")
183 fblike.set("data-width", "50")
184 fblike.set("data-show-faces", "true")
185 fblike.set("data-font", "arial")
186 g.root.body.append(fblike)
187
188 style = g.root.makeelement('link')
189 g.root.body.append(style)
190 style.set("rel","stylesheet")
191 style.set("type", "text/css")
192 style.set("href", "http://y.a11y.in/alipi/stylesheet.css")
193
194
195@app.route('/directory')
196def show_directory():
197 collection = g.db['post']
198 query = collection.group(
199 key = Code('function(doc){return {"about" : doc.about,"lang":doc.lang}}'),
200 condition={"about":{'$regex':'^[/\S/]'}},
201 initial={'na': []},
202 reduce=Code('function(doc,out){out.na.push(doc.blog)}')
203 )
204 query.reverse()
205 return render_template('directory.html', name=query, mymodule = quote_plus, myset=set, mylist= list)
206
207@app.route('/getLoc', methods=['GET'])
208def get_loc():
209
210 term = request.args['term']
211 connection = oursql.Connection(conf.DBHOST[0],conf.DBUSRNAME[0],conf.DBPASSWD[0],db=conf.DBNAME[0])
212 cursor = connection.cursor(oursql.DictCursor)
213 cursor.execute('select l.name, c.country_name from `location` as l, `codes` as c where l.name like ? and l.code=c.code limit ?', (term+'%', 5))
214 r = cursor.fetchall()
215 connection.close()
216 d = {}
217 d['return'] = r
218 response = jsonify(d)
219 response.headers['Access-Control-Allow-Origin'] = '*'
220 return response
221@app.route('/getLang', methods=['GET'])
222def get_lang():
223 term = request.args['term']
224 connection = oursql.Connection(conf.DBHOST[0],conf.DBUSRNAME[0],conf.DBPASSWD[0],db=conf.DBNAME[0])
225 cursor = connection.cursor(oursql.DictCursor)
226 cursor.execute('select * from `languages` as l where l.name like ? limit ?', (term+'%',5))
227 r = cursor.fetchall()
228 connection.close()
229 d = {}
230 d['return'] = r
231 response = jsonify(d)
232 response.headers['Access-Control-Allow-Origin'] = '*'
233 return response
234@app.route('/blank', methods=['GET'])
235def serve_blank():
236 return render_template('blank.html')
237
238@app.route('/info', methods=['GET'])
239def serve_info():
240 coll = g.db['post']
241 d = {}
242 cntr = 0
243 for i in coll.find({"about":unquote_plus(request.args['about']),"lang":request.args['lang']}):
244 i['_id'] = str(i['_id'])
245 d[cntr] = i
246 cntr+=1
247 response = jsonify(d)
248 response.headers['Access-Control-Allow-Origin'] = '*'
249 return response
250
251
252@app.route("/replace", methods=['GET'])
253def replace():
254 collection = g.db['post']
255 lang = request.args['lang']
256 url = request.args['url']
257 query = collection.group(
258 key = Code('function(doc){return {"xpath" : doc.xpath, "about": doc.url}}'),
259 condition={"about" : url, "lang" : lang,"elementtype":"text"},
260 initial={'narration': []},
261 reduce=Code('function(doc,out){out.narration.push(doc);}')
262 )
263
264 print query
265
266 audio_query =collection.group(
267 key = Code('function(doc){return {"xpath" : doc.xpath, "about": doc.url}}'),
268 condition={"about" : url, "lang" : lang, 'elementtype':"audio/ogg"},
269 initial={'narration': []},
270 reduce=Code('function(doc,out){out.narration.push(doc);}')
271 )
272
273 image_query =collection.group(
274 key = Code('function(doc){return {"xpath" : doc.xpath, "about": doc.url}}'),
275 condition={"about" : url, "lang" : lang, 'elementtype':"image"},
276 initial={'narration': []},
277 reduce=Code('function(doc,out){out.narration.push(doc);}')
278 )
279 try:
280 for i in audio_query:
281 query.append(i)
282 except IndexError:
283 pass
284 try:
285 for i in image_query:
286 query.append(i)
287 except IndexError:
288 pass
289
290 for i in query:
291 for y in i['narration']:
292 del(y['_id'])
293 d = {}
294 d['r'] = query
295 response = jsonify(d)
296 response.headers['Access-Control-Allow-Origin'] = '*'
297 return response
298
299@app.route('/feeds', methods=['GET'])
300def serve_feed_temp():
301 return render_template("feeds.html")
302
303@app.route('/feed', methods=['GET'])
304def serve_feed():
305 coll = g.db['post']
306 d = {}
307 cntr = 0
308 for i in coll.find().sort('_id',direction=-1):
309 if i['data'] != '<br/>':
310 i['_id'] = str(i['_id'])
311 d[cntr] = i
312 cntr+=1
313 response = jsonify(d)
314 response.headers['Access-Control-Allow-Origin'] = '*'
315 return response
316
317@app.route('/about', methods=['GET'])
318def serve_authors():
319 coll = g.db['post']
320 d = {}
321 cntr = 0
322 for i in coll.find({"about":unquote_plus(request.args['about'])}):
323 i['_id'] = str(i['_id'])
324 d[cntr] = i
325 cntr+=1
326 response = jsonify(d)
327 response.headers['Access-Control-Allow-Origin'] = '*'
328 return response
329#Retrieve all information about a specific $about and a given $author.
330@app.route('/author', methods=['GET'])
331def serve_author():
332 coll = g.db['post']
333 d = {}
334 cntr = 0
335 for i in coll.find({"about":unquote_plus(request.args['about']),"author":unquote_plus(request.args['author'])}):
336 i['_id'] = str(i['_id'])
337 d[cntr] = i
338 cntr += 1
339 response = jsonify(d)
340 response.headers['Access-Control-Allow-Origin'] = '*'
341 return response
342
343@app.route('/getAllLang', methods=['GET'])
344def get_lang():
345 term = request.args['term']
346 connection = oursql.Connection(conf.DBHOST[0],conf.DBUSRNAME[0],conf.DBPASSWD[0],db=conf.DBNAME[0])
347 cursor = connection.cursor(oursql.DictCursor)
348 cursor.execute('select * from `languages` as l where l.name like ?', (term+'%',))
349 r = cursor.fetchall()
350 connection.close()
351 d = {}
352 d['return'] = r
353 response = jsonify(d)
354 response.headers['Access-Control-Allow-Origin'] = '*'
355 return response
356
357
358@app.route("/askSWeeT",methods=['POST'])
359def askSweet():
360 data = json.loads(request.form['data'])
361 for i in data:
362 response = requests.api.get(conf.SWEETURL[0]+"/query/"+i['id'])
363 collection = g.db['post']
364 rep = response.json()
365 rep['bxpath'] = ''
366 if response.status_code == 200:
367 collection.insert(rep)
368 reply = make_response()
369 return reply
370
371@app.route("/menu",methods=['GET'])
372def menuForDialog():
373 if request.args.has_key('option') == False:
374 collection = g.db['post']
375 c = {}
376 cntr = 0
377 print request.args['url']
378 for i in collection.find({"about":request.args['url']}).distinct('lang'):
379 for j in collection.find({"about":request.args['url'],'lang':i}).distinct('type'):
380 d = {}
381 d['lang'] = i
382 d['type'] = j
383 c[cntr] = d
384 cntr += 1
385 print c
386 return jsonify(c)
387 else:
388 collection = g.db['post']
389 #get the ren languages for the received url
390 langForUrl = collection.group(
391 key = Code('function(doc){return {"about" : doc.about}}'),
392 condition={"about" : d['url'],"blog":{'$regex':'/'+d['option']+'.*/'}},
393 initial={'lang': []},
394 reduce=Code('function(doc, out){if (out.lang.indexOf(doc.lang) == -1) out.lang.push(doc.lang)}') #here xpath for test
395 )
396
397 #send the response
398 if (langForUrl):
399 connection.disconnect()
400 return json.dumps(langForUrl[0]['lang'])
401 else:
402 connection.disconnect()
403 return "empty"
404
405
406@app.route('/info', methods=['GET'])
407def serve_info():
408 coll = g.db['post']
409 d = {}
410 cntr = 0
411 for i in coll.find({"about":unquote_plus(request.args['about']),"lang":request.args['lang']}):
412 i['_id'] = str(i['_id'])
413 d[cntr] = i
414 cntr+=1
415 response = jsonify(d)
416 response.headers['Access-Control-Allow-Origin'] = '*'
417 return response
418
419
420import logging,os
421from logging import FileHandler
422
423fil = FileHandler(os.path.join(os.path.dirname(__file__),'logme'),mode='a')
424fil.setLevel(logging.ERROR)
425app.logger.addHandler(fil)
426
427if __name__ == '__main__':
428 app.run(debug=True, host='0.0.0.0')
  
1<!doctype>
2<head>
3 <style type="text/css" rel="stylesheet">
4 #inputurl {
5 width:85%;
6 height:35px;
7 background-color:#efd;
8 }
9 button {
10 width:12%;
11 background-color:#4d9;
12 height:36px;
13 font-size:20px;
14 font-style:italic;
15}
16</style>
17 <title> Alipi </title>
18 <script type="text/javascript">
19 function wget()
20 {
21 foruri = document.getElementById("inputurl").value;
22 if(foruri.substring(0,7) == "http://") {
23 if(window.location.href == "http://dev.a11y.in/server/")
24 {
25 window.open("http://dev.a11y.in/web?foruri=" + encodeURIComponent(foruri));
26 }
27 else
28 {
29 window.open("http://127.0.0.1:5000/?foruri=" + encodeURIComponent(foruri));
30 }
31 }
32 else if (foruri.substring(0,8) == "https://") {
33 window.open("http://127.0.0.1:5000/?foruri=" + encodeURIComponent(foruri));
34 }
35 else {
36 alert("Please enter 'HTTP' protocoled URL");
37 }
38 }
39</script>
40
41</head>
42<body>
43 <fieldset>
44 <legend> Enter a URL </legend>
45 <input id="inputurl" placeholder="http://a11y.in/" />
46 <button type="submit" onClick="wget()"> Get</button>
47 </fieldset>
48</body>
49</html>
  
1import sys
2import os.path
3sys.path.insert(0, os.path.dirname(__file__))
4from alipi import app as application
  
1/* Copyright (c) 2007 Google Inc.
2 *
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 * http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16/**
17 * @fileoverview Sample code for Blogger's JavaScript client library.
18 * Provides an embeded blog post editor which grabs the title and location
19 * of the current page for promotion on a user's blog.
20 * @author api.jscudder@gmail.com (Jeffrey Scudder)
21 */
22
23// Load the Google data Blogger JavaScript library.
24google.load('gdata', '2.x', {packages: ['blogger']});
25google.setOnLoadCallback(addEditorToPage);
26
27// Global object to hold constants and "global" variables.
28var blogThis = {
29 // URL constants.
30 BLOG_LIST_URL: 'https://www.blogger.com/feeds/default/blogs',
31 AUTH_URL: 'https://www.blogger.com/feeds',
32 // Document element ID constants.
33 SAMPLE_CONTAINER: 'blog_this',
34 POST_BODY_INPUT: 'blog_post_body',
35 EDITOR_DIV: 'blog_this_div',
36 LOGIN_BUTTON: 'login_button',
37 BLOG_SELECTOR: 'available_blogs',
38 TITLE_INPUT: 'blog_post_title',
39 TAGS_INPUT: 'blog_post_tags',
40 RESULT_DIV: 'status_display'
41};
42
43/**
44 * Simple error handler which displays the error in an alert box.
45 * @param {Object} e An error passed in from the google.gdata.service
46 * object when the HTTP call failed.
47 */
48function handleError(e) {
49 var statusDiv = document.getElementById(blogThis.RESULT_DIV);
50 statusDiv.appendChild(document.createTextNode('Error: ' +
51 (e.cause ? e.cause.statusText : e.message)));
52 statusDiv.appendChild(document.createElement('br'));
53};
54
55/**
56 * Performs HTML escapes on special characters like double quotes,
57 * less-than, greater-than, and the ampersand. This function is used
58 * on the page title to ensure that special characters do not lead to
59 * invalid HTML when it is included in the atom:content.
60 * I recommend using something like this on any text that you want
61 * to be treated as plaintext within HTML content.
62 * @param {String} inputString The string which will be scrubbed.
63 * @return {String} The input string with special characters replaced
64 * by their HTML-safe equivalents.
65 */
66function htmlEscape(inputString) {
67 return inputString.replace(/&/g, '&amp;').replace(/"/g, '&quot;'
68 ).replace(/</g, '&lt;').replace(/>/g, '&gt;');
69};
70
71/**
72 * Adds the HTML for the login and blog post editor to the sample
73 * container div. It also populates the contents of the blog post edit form
74 * with a link to the current page. The current page's title is used as the
75 * anchor text.
76 */
77function addEditorToPage() {
78 var sampleContainerDiv = document.getElementById(blogThis.SAMPLE_CONTAINER);
79 sampleContainerDiv.innerHTML = [
80 '<div id="login_button">',
81 ' <input type="button" value="Login" onclick="login();"></input>',
82 '</div>',
83 '<div id="blog_this_div" style="display: none;">',
84 ' Choose blog: <select id="available_blogs">',
85 ' <option value="">Loading...</option>',
86 ' </select><br/>',
87 ' Title:<br/>',
88 ' <input type="text" id="blog_post_title" size="80"></input><br/>',
89 ' Post Body:<br/>',
90 ' <div id="blog_post_body"></div><br/>',
91 ' Labels (comma separated):<br/>',
92 ' <input type="text" id="blog_post_tags" size="80"></input><br/>',
93 ' <input type="button" value="Publish Post" ',
94 ' onclick="insertBlogEntry();"></input>',
95 ' <input type="button" value="Logout" onclick="logout();"></input><br/>',
96 '</div>',
97 '<div id="status_display"></div>'].join('');
98
99 // Create the Blogger client object which talks to the blogger servers.
100 blogThis.service = new google.gdata.blogger.BloggerService(
101 'GoogleInc-blogThisEmbeddedEditor-1')
102 // Get the title and address of the current page.
103 var currentPageUrl = window.location.href;
104 var pageTitle = document.title;
105 // Set the contents of the body input field.
106 var blogPostBody = document.getElementById(blogThis.POST_BODY_INPUT);
107 // blogPostBody.value = ['<a href="', currentPageUrl, '">',htmlEscape(pageTitle), '</a>'].join('');
108 y = localStorage.myContent.split('###');
109 abc = [];
110 for(var i=0;i<y.length;i++)
111 {
112 x=[];
113 for(var j=0;j<y[i].split('&').length;j++)
114 {
115 x[y[i].split('&')[j].split('=')[0]] = y[i].split('&')[j].split('=')[1];
116 }
117 abc.push(x);
118 }
119 postData = '';
120 for (var i = 0;i<abc.length;i++)
121 {
122 if(abc[i].elementtype == 'audio/ogg')
123 {
124 var aud = sprintf('<audio controls="controls" src="%s" about="%s" xpath="%s" alipius="lang:%s,elementtype:%s,location:%s,author:%s,style:%s"></audio>',decodeURIComponent(abc[i].data),decodeURIComponent(abc[i].about),decodeURIComponent(abc[i].xpath),decodeURIComponent(abc[i].lang),decodeURIComponent(abc[i].elementtype),decodeURIComponent(abc[i].location),decodeURIComponent(abc[i].author),decodeURIComponent(abc[i].style));
125 postData = postData + aud + '<br/>';
126 }
127 else if(abc[i].elementtype.match('image'))
128 {
129 var width = decodeURIComponent(abc[i].data).split(',')[0].split('x')[0];
130 var height = decodeURIComponent(abc[i].data).split(',')[0].split('x')[1];
131 var img = sprintf('<img src="%s" about="%s" xpath="%s" alipius="lang:%s,elementtype:%s,location:%s,author:%s,style:%s" height=%s width=%s></img>',decodeURIComponent(abc[i].data).split(',')[1],decodeURIComponent(abc[i].about),decodeURIComponent(abc[i].xpath),decodeURIComponent(abc[i].lang),decodeURIComponent(abc[i].elementtype),decodeURIComponent(abc[i].location),decodeURIComponent(abc[i].author),decodeURIComponent(abc[i].style),height, width);
132 postData =postData + img + '<br/>';
133 }
134 else
135 {
136 var p = sprintf('<p about="%s" xpath="%s" alipius="lang:%s,elementtype:%s,location:%s,author:%s,style:%s">%s</p>',decodeURIComponent(abc[i].about),decodeURIComponent(abc[i].xpath),decodeURIComponent(abc[i].lang),decodeURIComponent(abc[i].elementtype),decodeURIComponent(abc[i].location),decodeURIComponent(abc[i].author),decodeURIComponent(abc[i].style),decodeURIComponent(abc[i].data));
137 postData = postData + p + '<br/>';
138 }
139 }
140 blogPostBody.innerHTML = postData;
141 determineEditorVisibility();
142};
143
144/**
145 * Populates the contents of the blog post edit form with a link to the
146 * current page. The current page's title is used as the anchor text.
147 */
148function initializeBlogPostInput() {
149 // Create the Blogger client object which talks to the blogger servers.
150 blogThis.service = new google.gdata.blogger.BloggerService(
151 'GoogleInc-blogThisEmbeddedEditor-1')
152 // Get the title and address of the current page.
153 var currentPageUrl = window.location.href;
154 var pageTitle = document.title;
155 // Set the contents of the body input field.
156 var blogPostBody = document.getElementById(blogThis.POST_BODY_INPUT);
157 blogPostBody.value = ['<a href="', currentPageUrl, '">',
158 htmlEscape(pageTitle), '</a>'].join('');
159 determineEditorVisibility();
160};
161
162/**
163 * Makes the blog post editor div visible if the user is authenticated. If
164 * the user is not authenticated with Blogger, the editor div is hidden
165 * and the login button is made visible.
166 */
167function determineEditorVisibility() {
168 var blogThisDiv = document.getElementById(blogThis.EDITOR_DIV);
169 var loginButton = document.getElementById(blogThis.LOGIN_BUTTON);
170 if (google.accounts.user.checkLogin(blogThis.AUTH_URL)) {
171 // If the user is logged in, show the blow editor.
172 blogThisDiv.style.display = 'inline';
173 loginButton.style.display = 'none';
174 // Request the feed to populate the editor's blog selection menu.
175 blogThis.service.getBlogFeed(blogThis.BLOG_LIST_URL, receiveBlogList,
176 handleError);
177 } else {
178 // The user cannot get a list of blogs, so display the login button.
179 blogThisDiv.style.display = 'none';
180 loginButton.style.display = 'inline';
181 }
182};
183
184/**
185 * Requests an AuthSub token for interaction with the Calendar service.
186 */
187function login() {
188 var token = google.accounts.user.login(blogThis.AUTH_URL);
189 determineEditorVisibility();
190};
191
192/**
193 * Creates options in the blog editor's drop down blog selector box.
194 * This method receives the results of a query for a list of the current
195 * viewer's blogs.
196 * @param {Object} blogList An object containing a
197 * google.gdata.blogger.BlogFeed.
198 */
199function receiveBlogList(blogList) {
200 // Clear any existing options from the blog selector.
201 var selector = document.getElementById(blogThis.BLOG_SELECTOR);
202 selector.innerHTML = '';
203 // Find the titles and post links for each blog and populate the
204 // blog select options.
205 var numBlogs = blogList.feed.getEntries().length;
206 var newOption;
207 for (var i = 0, entry; entry = blogList.feed.getEntries()[i]; ++i) {
208 newOption = document.createElement('option');
209 newOption.value = entry.getEntryPostLink().href;
210 newOption.appendChild(document.createTextNode(
211 entry.getTitle().getText()));
212 // Add this as an option to the blog selector.
213 selector.appendChild(newOption);
214 }
215};
216
217/**
218 * Revokes the authentication token for this application.
219 * The editor div is then hidden and the login button is displayed.
220 */
221function logout() {
222 google.accounts.user.logout();
223 // Hide the editor div and make the login button visible.
224 var blogThisDiv = document.getElementById(blogThis.EDITOR_DIV);
225 var loginButton = document.getElementById(blogThis.LOGIN_BUTTON);
226 blogThisDiv.style.display = 'none';
227 loginButton.style.display = 'inline';
228};
229
230/**
231 * Reads the contents of the blog post editor and sends it to the Blogger
232 * servers as a new blog post.
233 */
234function insertBlogEntry() {
235 // Find the target blog and the post URL.
236 var blogSelector = document.getElementById(blogThis.BLOG_SELECTOR);
237 var targetUrl = blogSelector.options[blogSelector.selectedIndex].value;
238 // Create event.
239 var blogPost = new google.gdata.blogger.PostEntry();
240 // Add title - from the input field.
241 var title = document.getElementById(blogThis.TITLE_INPUT).value;
242 blogPost.setTitle(google.gdata.atom.Text.create(title));
243 // Get the body from the input field.
244 var body = document.getElementById(blogThis.POST_BODY_INPUT).innerHTML;
245 // Set the content to be the body of the input form and tell the server
246 // to interpret it as html.
247 blogPost.setContent(google.gdata.atom.Text.create(body, 'html'));
248 // Read the tags from the input form and add them as categories to
249 // the blog post entry.
250 var tags = document.getElementById(blogThis.TAGS_INPUT).value;
251 var tagList = tags.split(',');
252 for (var i = 0, tag; tag = tagList[i]; ++i) {
253 blogPost.addCategory(new google.gdata.atom.Category(
254 {'scheme':'http://www.blogger.com/atom/ns#',
255 // Remove leading and trailing whitespace from the tag text.
256 // If the tag begins or ends with whitespace, the Blogger server
257 // will remove the whitespace but send back 2 category elements,
258 // one with the original term, and another with the stripped term.
259 'term':tag.replace(/^\s+/g, '').replace(/\s+$/g, '')}));
260 }
261 blogThis.service.insertEntry(targetUrl, blogPost, handlePostSuccess,
262 handleError);
263};
264
265/**
266 * Displays the contents of the new blog post after the Blogger server
267 * responds to the POST request.
268 * @param {Object} newBlogPost An object containing the
269 * google.gdata.blogger.BlogPostEntry sent back from the server.
270 */
271function handlePostSuccess(newBlogPost) {
272 // Get the div which displays the posted blog entries.
273 var resultDiv = document.getElementById(blogThis.RESULT_DIV);
274 resultDiv.appendChild(
275 document.createTextNode('Your post about this page:'));
276 resultDiv.appendChild(document.createElement('br'));
277
278 // Create a link to the blog post with the post's title as the anchor
279 // text.
280 var titleElement = document.createElement('a');
281 titleElement['href'] = newBlogPost.entry.getHtmlLink().href;
282 titleElement.appendChild(
283 document.createTextNode(newBlogPost.entry.getTitle().getText()));
284
285 var bodyElement = document.createElement('<div>');
286 // Displays the source HTML of the post's body. To display the actual
287 // HTML (render it instead of displaying the source text) you could
288 // set the innerHTML of the body element instead of creating a text
289 // node.
290 bodyElement.innerHTML = newBlogPost.entry.getContent().getText();
291
292 // Display the tags for this entry in a paragraph below the body.
293 var tagsElement = document.createElement('p');
294 var myTagsList = [];
295 var categories = newBlogPost.entry.getCategories();
296 for (var i = 0, category; category = newBlogPost.entry.getCategories()[i]; ++i) {
297 myTagsList.push(category.term);
298 }
299 tagsElement.appendChild(document.createTextNode(myTagsList.join(', ')));
300
301 resultDiv.appendChild(titleElement);
302 resultDiv.appendChild(bodyElement);
303 resultDiv.appendChild(tagsElement);
304
305 var xhr = new XMLHttpRequest();
306 xhr.open('POST','http://dev.a11y.in/scrape',true)
307 xhr.send('url='+newBlogPost.entry.getHtmlLink().href);
308};
  
1#This is a samply config file. Create a file named conf.py,in this directory, and decalre the following variables there.
2#DO NOT EDIT THIS FILE. This file is not read for config changes
3APPURL = ('http://foo/bar',) # The path which points to "alipi" directory.
4JQUERYURL = ('http://foo.jquery',) #URL for jquery.
5PASSWD = ('password',)
6BLOGURL = ('http://something.blogspot.com',)
7EMAIL = ('johnDoe@gmail.com',)
8DEPLOYURL = ('http://127.0.0.1:5000/',)
  
1//A sample configuration file for JS variables. Copy this file to "config.js"
2var config = {
3 'hostname': "127.0.0.1",
4 'deploy': "http://127.0.0.1:5000",
5 'root': "http://localhost"
6}
  
1@media screen and (min-width:1000px) {
2
3#renarrated_overlay { position:fixed; left:0.5%; width:99%; text-align:center; font-weight:normal; z-index:2147483645; display:block; }
4
5#edit-current { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
6#see-narration { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
7#see-links { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
8#blog-filter { right:-3px; min-width:225px; max-width:225px; font-size:17px; font-weight:400; font-style:italic;
9 -moz-border-radius-bottomright:0px; -webkit-border-bottom-right-radius:0px; border-bottom-right-radius:0px;
10 -moz-border-radius-topright:0px; -webkit-border-top-right-radius:0px; border-top-right-radius:0px; -moz-margin-start:7px;
11 text-align:center; display:none; }
12@-moz-document domain(127.0.0.1), domain(dev.a11y.in), domain(y.a11y.in) {
13 #go { top:11px !important; }
14}
15#go { top:6px; height:25px; text-align:justify; display:none;
16 -moz-border-radius-bottomleft:0px; -webkit-border-bottom-left-radius:0px; border-bottom-left-radius:0px;
17 -moz-border-radius-topleft:0px; -webkit-border-top-left-radius:0px; -khtml-border-top-left-radius:0px; border-top-left-radius:0px; }
18
19#share { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
20#orig-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
21#info { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
22
23#outter-down-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
24#outter-up-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
25
26#pub_overlay { position:fixed; left:10%; width:80%; text-align:center; z-index:2147483645; display:none; }
27#pub_overlay .ui-button { margin-left:10px; }
28
29#icon-down { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
30#icon-up { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
31#exit-mode { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
32#help-window { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
33#undo-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
34#publish-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
35
36#element_edit_overlay { position:fixed; text-align:center; z-index:2147483645; display:none; }
37
38#edit-text { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
39#add-audio { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
40#replace-image { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
41#delete-image { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
42#close-element { position:absolute; top:-5px; left:-2px; width:10px; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
43#cant-edit { width: 450px; margin:15px; font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
44
45#editoroverlay { min-width:90%; text-align:justify; display: none; }
46#editoroverlay a { color:#1C94C4; }
47
48#adv-reference { position: absolute; top:15%; left:2%; min-width:48%; max-width:48%; border:solid 3px; padding:10px; font-size:16px;
49 font-weight:400; font-style:normal; color:#aaa; overflow:show; background:none; text-align:justify; display:none; }
50
51#reference { position: absolute; top: 15%; left:2%; min-width:46%; max-width:46%; min-height:10%; border:solid 3px; padding:10px; font-size:17px;
52 font-weight:400; font-style:normal; text-align:justify; color:#aaa; overflow:show; background:none; text-align:justify; }
53
54#editor { position:absolute; top:15%; left:52%; min-width:45%; max-width:45%; min-height:10%; border:3px solid #aaa; padding:10px; font-size:17px;
55 font-weight:400; font-style:normal; text-align:justify; color:#000; background-color:#ffe; text-align:justify; }
56
57#ref-lab { position:absolute; top:5%; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
58#edit-lab { position:absolute; top:5%; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
59
60#close-adv { position:absolute; top:7%; right:51%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
61#adv-ref { position:absolute; top:7%; right:51%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
62
63#mag-demag { position:absolute; bottom:5%; left:10%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
64#mag { position:absolute; left:3%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
65#demag { position:absolute; left:30%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
66#add-link { position:absolute; left:54%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
67
68#save-changes { position:relative; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
69
70.highlightElement { box-shadow: 0 0 20px #000; }
71.highlightOnSelect { box-shadow: 0 0 50px #000; }
72
73.barOnBottom { bottom:0px; }
74.barOnTop { top:0px; }
75
76#tar-lab1 { position:absolute; top:5%; left:110px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
77#tar-lab2 { position:absolute; top:20%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
78#tar-lab3 { position:absolute; top:35%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
79#tar-lab4 { position:absolute; top:50%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
80#tar-lab5 { position:absolute; top:65%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
81#tar-lab6 { position:relative; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
82#tar-lab7 { position:relative; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
83#tar-p { position:absolute; top:90%; left:210px; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
84#blogset { position:absolute; top:80%; right:100px; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
85
86
87#loc-select { position:absolute; top:25%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
88#loc-img { position:absolute; top:25.5%; left:440px; height:20px; width:25px; font-size:17px; font-weight:400; font-style:italic;
89 color:#000; text-align:justify; display:none; }
90#lang-select { position:absolute; top:40%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
91#lang-img { position:absolute; top:41%; left:440px; height:18px; width:25px; font-size:17px; font-weight:400; font-style:italic;
92 color:#000; text-align:justify; display:none; }
93#style-select { position:absolute; top:55%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
94#auth-select { position:absolute; top:70%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
95
96#our-check { position:relative; }
97#your-check { position:relative; margin-left:25px; }
98
99}
100/****************************************************************************************************************************/
101
102@media screen and (max-width:1000px) {
103
104#renarrated_overlay { position:fixed; clear:both; width:99%; left:0.5%; text-align:center; z-index:2147483645; font-size:80%; display:block; }
105/* #renarrated_overlay .ui-button { padding:0.1em 0.8em 0.2em 0.8em; } */
106
107#edit-current { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
108#see-narration { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
109#see-links { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
110#blog-filter { right:-3px; min-width:150px; max-width:150px; font-weight:200; font-style:italic; text-align:justify; display:none;
111 -moz-border-radius-bottomright:0px; -webkit-border-bottom-right-radius:0px; border-bottom-right-radius:0px;
112 -moz-border-radius-topright:0px; -webkit-border-top-right-radius:0px; border-top-right-radius:0px; }
113#go { top:5px; height:18px; -moz-border-radius-bottomleft:0px; -webkit-border-bottom-left-radius:0px; -khtml-border-bottom-left-radius:0px;
114 border-bottom-left-radius:0px; -moz-border-radius-topleft:0px; -webkit-border-top-left-radius:0px; -khtml-border-top-left-radius:0px;
115 border-top-left-radius:0px; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
116@-moz-document domain(127.0.0.1), domain(dev.a11y.in), domain(y.a11y.in) {
117 #go { height:23px !important; top:4px !important; }
118}
119#share { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
120#orig-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
121#info { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
122
123#outter-down-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
124#outter-up-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
125
126
127#pub_overlay { position:fixed; left:3%; width:96%; text-align:center; z-index:2147483645; font-size:14px; font-weight:200; font-style:italic;
128 display:none; }
129#pub_overlay .ui-button { margin-left:10px; }
130#icon-down { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
131#icon-up { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
132#exit-mode { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
133#help-window { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
134#undo-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
135#publish-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
136
137#element_edit_overlay { position:fixed; text-align:center; z-index:2147483645; font-size:14px; font-weight:200; font-style:italic;
138 text-align:justify; display:none; }
139#element_edit_overlay .ui-button { text-align:justify; font-size:14px; font-weight:200; font-style:italic; }
140
141#edit-text { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
142#add-audio { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
143#replace-image { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
144#delete-image { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
145#close-element { position:absolute; top:-5px; left:-2px; width:10px; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
146#cant-edit { width: 450px; margin:15px; display:none; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
147
148#editoroverlay { min-width:90%; display: none; }
149#editoroverlay a { color:#1C94C4; }
150
151#adv-reference { position: absolute; top: 24%; left:2%; min-width:48%; max-width:48%; border:solid 2px; padding:10px; font-size:13px;
152 text-align:justify; color:#aaa; font-weight:normal; overflow:show; background:none; display:none; }
153#reference { position: absolute; top: 24%; left:2%; min-width:46%; max-width:46%; min-height:10%; border:solid 2px; padding:10px; font-size:14px;
154 text-align:justify; color:#aaa; font-weight:normal; overflow:show; background:none; }
155
156#editor { position:absolute; top:15%; left:52%; min-width:45%; max-width:45%; min-height:10%; border:2px solid; padding:10px; color:#000;
157 background-color:#ffe; font-size:14px; font-weight:200; font-style:normal; text-align:justify; }
158
159#ref-lab { position:absolute; top:5%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; color:#aaa; }
160#edit-lab { position:absolute; top:5%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; color:#aaa; }
161
162#close-adv { position:absolute; top:10%; right:50%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
163#adv-ref { position:absolute; top:10%; right:50%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
164
165#mag-demag { position:absolute; bottom:8%; left:10%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
166#mag { position:absolute; left:3%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
167#demag { position:absolute; left:30%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
168#add-link { position:absolute; left:54%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
169
170#save-changes { position:relative; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
171
172.highlightElement { box-shadow: 0 0 20px #000; }
173.highlightOnSelect { box-shadow: 0 0 50px #000; }
174
175.barOnBottom { bottom:0px; }
176.barOnTop { top:0px; }
177
178#tar-lab1 { position:absolute; top:5%; left:110px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
179#tar-lab2 { position:absolute; top:20%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
180#tar-lab3 { position:absolute; top:35%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
181#tar-lab4 { position:absolute; top:50%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
182#tar-lab5 { position:absolute; top:65%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
183#tar-lab6 { position:relative; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
184#tar-lab7 { position:relative; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
185#tar-p { position:absolute; top:90%; left:210px; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
186#blogset { position:absolute; top:80%; left:125px; right:80px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
187
188#loc-select { position:absolute; top:25%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
189#loc-img { position:absolute; top:25.5%; left:440px; height:20px; width:25px; color:#000; font-size:14px; font-weight:200; font-style:italic;
190 text-align:justify; display:none; }
191#lang-select { position:absolute; top:40%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
192#lang-img { position:absolute; top:41%; left:440px; height:18px; width:25px; color:#000; font-size:14px; font-weight:200; font-style:italic;
193 text-align:justify; display:none; }
194#style-select { position:absolute; top:55%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
195#auth-select { position:absolute; top:70%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
196
197#our-check { position:relative; }
198#your-check { position:relative; margin-left:25px;}
199
200}
201/**************************************************************
202************************************************************************************************************/
203
204#infovis { position:absolute; top:3%; left:0%; width:60%; height:95%; overflow:hidden; }
205#infovis-canvaswidget { height:95% }
206#infovis-canvas { height:95% }
207
208#infonar { position:relative; top:2%; left:0; width:35%; height:90%; overflow:show; }
209#narrations-div { position:fixed; top:5%; bottom:2%; right:0.1%; width:30%; height:93%; overflow:show; background-color: rgba(0,0,0,0.5);
210 z-index:999999999; }
211/*TOOLTIPS*/
212.tip { color: #fff; width: 140px; background-color: rgba(0,0,0,1); border:1px solid #ccc; -moz-box-shadow:#555 2px 2px 8px;
213 -webkit-box-shadow:#555 2px 2px 8px; -o-box-shadow:#555 2px 2px 8px; box-shadow:#555 2px 2px 8px; opacity:1; font-size:12px;
214 font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; padding:7px; }
  
1<!doctype html>
2<html>
3 <head>
4 <style>
5 span
6 {color:#0000FF;
7 font-weight:bold;
8 line-height:1.5em;
9 }
10 </style>
11 <body>
12 <!-- <button id="prev" style="left:5%;">Previous</button> -->
13 <!-- <button id="next" style="right:5%;">Next</button> -->
14 <div id="delay" style="top:10%; text-align:center;font-size:25px; font-weight:bold; display:block;">Collecting data, Please have patience</div>
15 <div id="info_content"></div>
16 </body>
17 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
18 <!-- <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script> -->
19 <script type="text/javascript">
20 var responseJSON = [];
21 var infoFullJSON = [];
22 function onLoad()
23 {
24 $('#delay').delay(2000).hide();
25
26 var JSON1 = [];
27 $.each(infoFullJSON, function(i, val) { JSON1.push(val) })
28 var html;
29 for(var j = 0; j < JSON1.length; j++)
30 {
31 html = $('#info_content').html() + '<pre><span>&lt;alipi&gt;</span>'+
32 '<span>\n\t&lt;language&gt;</span>'+JSON1[j]['lang']+'<span>&lt;/language&gt;</span>'+
33 '<span>\n\t&lt;location&gt;</span>'+JSON1[j]['location']+'<span>&lt;/location&gt;</span>'+
34 '<span>\n\t&lt;author&gt;</span>'+JSON1[j]['author']+'<span>&lt;/author&gt;</span>'+
35 '<span>\n\t&lt;elementType&gt;</span>'+JSON1[j]['elementtype']+'<span>&lt;/elementType&gt;</span>'+
36 '<span>\n\t&lt;blog&gt;</span>'+JSON1[j]['blog']+'<span>&lt;/blog&gt;</span>'+
37 '<span>\n\t&lt;blogxpath&gt;</span>'+JSON1[j]['bxpath']+'<span>&lt;/blogxpath&gt;</span>'+
38 '<span>\n\t&lt;xpath&gt;</span>'+JSON1[j]['xpath']+'<span>&lt;/xpath&gt;</span>'+
39 '<span>\n\t&lt;data&gt;</span>'+JSON1[j]['data']+'<span>&lt;/data&gt;<span>'+
40 '<span>\n&lt;/alipi&gt;<span></pre>';
41 $('#info_content').html(html);
42 }
43 <!-- $('#info_content').children().hide(); -->
44 <!-- $($('#info_content').children()[0]).show(); -->
45 }
46
47 <!-- $(window).click(function() { -->
48 <!-- $('#info_content').cycle({ -->
49 <!-- fx: 'fadeZoom', -->
50 <!-- timeout: 0, -->
51 <!-- next: '#next', -->
52 <!-- prev: '#prev', -->
53 <!-- slideExpr: 'pre' -->
54 <!-- }); -->
55 <!-- }); -->
56
57 <!-- $(window).ready('http://127.0.0.1:5000/blank', function() { -->
58 <!-- $('#info_content').children().hide(); -->
59 <!-- $('#info_content').children()[0].show(); -->
60 <!-- }); -->
61 </script>
62</html>
  
1<!doctype html>
2<html>
3<title>Directory of Alipi</title>
4<body>
5<div>
6<p>List of links narrated</p>
7{% if name %}
8{% for i in name %}
9{% if i['about'] != 'undefined' %}
10<p><a href="{{i['about']}}">{{ i['about'] }}</a> in <a href="http://y.a11y.in/web?foruri={{ mymodule(i['about']) }}&lang={{i['lang']}}&interactive=1">{{i['lang']}}</a></p>
11<p style="padding:5px">Narrations contributed at:</p>
12{% for x in mylist(myset(i['na'])) %}
13<p><a href="{{x}}" style="padding:5px">{{x}}</a></p>
14{% endfor %}
15{% endif %}
16{% endfor %}
17{% else %}
18<p>Hello world</p>
19{% endif %}
20</div>
21</body>
22</html>
  
1<!doctype html>
2<title>Error</title>
3<body>
4<p>Please check the URL you entered, maybe you have misspelled it.</p>
5</body>
6</html>
  
1<!doctype html>
2<head>
3 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
4 <script type="text/javascript" src="http://localhost/server/config.js"></script>
5 <script type="text/javascript">
6 $.getJSON(config.deploy+"/feed", function(data)
7 {
8 d = $.makeArray(data);
9 d.reverse();
10 str = "";
11 console.log(d[0]);
12 $.each(data, function(i, val)
13 {
14 if(val['about'] != undefined && val['about'] != 'undefined' && val['author'] != 'undefined' )
15 {
16 if(val['location']!='location')
17 {
18 str += "<p>\n<b>@" +val['author']+"</b> has "+val['type']+" for <b>"+val['about']+"#"+val['xpath']+"</b> at <b>"+val['blog']+"#"+val['bxpath']+"</b> for <b>"+val['location']+"</b> in <b>"+val['lang']+"</b>\n</p>";
19 }
20 else
21 str += "<p>\n<b>@" +val['author']+"</b> has "+val['type']+" for <b>"+val['about']+"#"+val['xpath']+"</b> at <b>"+val['blog']+"#"+val['bxpath']+"</b> for <b>"+val['lang']+"</b>\n</p>";
22 }
23 });
24 $("#feeds").html(str);
25 });
26 </script>
27</head>
28<body style="text-wrap:normal">
29 @<input type="text" id="t1" name="author" value="author" /> says <input type="text" id="t2" name="about" value="about" /> <input type="text" id="t3" name="xpath" value="xpath" /> has <select id="selected" onchange="checkVal();"><option>re-narrations</option><option>5el</option></select> at <input type="text" id="t4" name="blog" value="blog" /> <input type="text" id="t5" name="bxpath" value="bxpath" /> in <input type="text" name="lang" value="language" id="t6" /> <span id="remove">targetting</span> <input type="text" name="loc" value="location" id="t7"/> <input type="submit" id="post" name="alipi" value="Feed" onclick="postForm();" /> <input type="submit" name="alipi" value="Test the feed" onclick="doDemo();" />
30<div id="feeds">
31</div>
32<script type="text/javascript">
33 function postForm()
34 {
35 var arr = {};
36 arr['author'] = $('#t1').val();
37 arr['about'] = $('#t2').val();
38 arr['xpath'] = $('#t3').val();
39 arr['blog'] = $('#t4').val();
40 arr['bxpath'] = $('#t5').val();
41 arr['type'] = $("#selected").val();
42 arr['lang'] = $('#t6').val();
43 arr['location'] = $('#t7').val();
44 $.post(config.deploy+"/feeds/write", arr, function(data)
45 {
46 alert("Posted");
47 });
48}
49function checkVal(){
50 if($("#selected").val() == "5el")
51 {
52 $("#t7, #remove").hide();
53 $("#t6").val("tags");
54 }
55 else
56 {
57 $("#t7, #remove").show();
58 $("#t6").val("language");
59 }
60 }
61function doDemo()
62{
63 window.open(config.deploy+"/demo?foruri="+encodeURIComponent($('#t2').val())+"&xpath="+encodeURIComponent($('#t3').val())+"&blog="+encodeURIComponent($('#t4').val())+"&bxpath="+encodeURIComponent($('#t5').val()));
64}
65</script>
66</body>
67</html>
alipi/ui.js
(1023 / 0)
  
1//-*-coding: utf-8 -*-
2var a11ypi = {
3 auth : " ",
4 loc:" ",
5 elementTagName: " ",
6 elementId: " ",
7 flag : 0,
8 fflag : 0,
9 showbox : 0,
10 showlinks : 0,
11 blog_flag: false,
12 target : false,
13 pageHtml:'',
14 d: {},
15 responseJSON:'',
16 testContext : function()
17 {
18 if(document.getElementById('social_overlay') != null)
19 document.body.removeChild(document.getElementById('social_overlay'));
20 $(document).ready(function(){$('body *').contents().filter(function()
21 {
22 try{
23 if(this.nodeType == 3 && !($(this).hasClass('alipi')))
24 {
25 return (this.nodeType == 3) && this.nodeValue.match(/\S/);}}
26 catch(err)
27 {
28 }}).parent().attr('m4pageedittype','text')});
29
30 vimg = document.getElementsByTagName('img');
31 for(i=0; i<vimg.length; i++)
32 {
33 vimg[i].setAttribute('m4pageedittype','image');
34 }
35 },
36
37 createMenu: function(type) {
38 var xyz = '';
39 if(type === '1.0')
40 xyz = document.getElementById("show-box");
41 else
42 xyz = document.getElementById("show-comment");
43 xyz.innerHTML = '';
44 a = a11ypi.getParams();
45 for(var i in a11ypi.showbox)
46 {
47 if(a11ypi.showbox[i]['type'] == type)
48 {
49 var para = document.createElement("p");
50 var newel = document.createElement("a");
51 newel.textContent = a11ypi.showbox[i]['lang'];
52 if(type === '1.0')
53 $(newel).attr("href",config.deploy+"/?foruri="+a['foruri']+"&lang="+a11ypi.showbox[i]['lang']+"&interactive=1"+"&type="+type);
54 else
55 $(newel).attr("href",config.deploy+"/?foruri="+a['foruri']+"&tags="+a11ypi.showbox[i]['lang']+"&interactive=0"+"&type="+type);
56 para.appendChild(newel);
57 xyz.appendChild(para);
58 }
59 }
60 },
61
62 ajax: function() {
63 if(a11ypi.flag == '0')
64 {
65 a11ypi.flag = 1;
66 a = a11ypi.getParams();
67 $.getJSON(config.deploy+'/menu?', {"url":a['foruri']}, function(data)
68 {
69 a11ypi.showbox = data;
70 $('#see-narration').show();
71 $("#blog-filter").show(); a11ypi.blogFilter();
72 $("#go").show();
73 });
74
75 req = {"about":decodeURIComponent(a['foruri']), "lang":a['lang']};
76 $.getJSON(config.deploy+'/info?', req, function(data)
77 {
78 a11ypi.responseJSON = data;
79 });
80 }
81 },
82 ajax1: function() {
83 if(a11ypi.fflag == '0')
84 {
85 a11ypi.fflag = 1;
86 var xhr = new XMLHttpRequest();
87 xhr.onreadystatechange = function()
88 {
89 if(xhr.readyState == 4)
90 {
91 if(xhr.responseText == "empty")
92 {
93 // a11ypi.clearMenu();
94 }
95 else
96 {
97 a11ypi.createMenuFilter(JSON.parse(xhr.responseText));
98 }
99 }
100 }
101 xhr.open("POST",config.root+"/menu",true);
102 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
103 a = a11ypi.getParams();
104 data = 'url='+a['foruri']+'&option='+a['blog'];
105 xhr.send(data) ;
106 }
107
108 },
109
110 getURL: function(e) {
111 window.location = window.location.href + "&lang=" + e.value;
112 window.reload();
113 },
114 ren: function()
115 {
116 a = a11ypi.getParams();
117 var url = decodeURIComponent(a['foruri']);
118 var type;
119 if(a['type'])
120 type = a['type'];
121 else
122 type = '1.0'
123 var lang = '';
124
125 if( type != '1.0')
126 lang = a['tags'];
127 else
128 lang = a['lang'];
129
130 $.getJSON(config.deploy+"/replace?",{"url":url,"lang":lang,"type":type},function(data)
131 {
132 for(var i=0;i<data['r'].length;i++)
133 {
134 for(var x in data['r'][i]['narration'])
135 {
136 // path = data['r'][i]['narration'][x]['xpath'];
137 // newContent = data['r'][i]['narration'][x]['data'];
138 // elementType = data['r'][i]['narration'][x]['elementtype'];
139
140 a11ypi.evaluate(data['r'][i]['narration'][x]);
141 }
142 }
143 });
144 },
145 evaluate: function(a)
146 {
147 try{
148 var nodes = document.evaluate(a['xpath'], document, null, XPathResult.ANY_TYPE,null);
149
150 }
151 catch(e)
152 {
153 console.log(e);
154 }
155 if(a['type'] == '1.0')
156 {
157 try{
158 var result = nodes.iterateNext();
159 while (result)
160 {
161 if (a['elementtype'] == 'image')
162 {
163 if(a['data'] != '')
164 {
165 result.setAttribute('src',a['data'].split(',')[1]); //A hack to display images properly, the size has been saved in the database.
166 width = a['data'].split(',')[0].split('x')[0];
167 height = a['data'].split(',')[0].split('x')[1];
168 result.setAttribute('width',width);
169 result.setAttribute('height', height);
170 result.setAttribute('class','blink');
171 }
172 else
173 $(result).hide();
174 }
175 else if(a['elementtype'] == 'audio/ogg')
176 {
177 a['data'] = decodeURIComponent(a['data']);
178 audio = '<audio controls="controls" src="'+a['data']+'" style="display:table;"></audio>';
179 $(result).before(audio);
180 result.setAttribute('class','blink');
181 }
182 else{
183 result.innerHTML = a['data'];
184 result.setAttribute('class','blink');
185 }
186 result=nodes.iterateNext();
187 }
188 }
189 catch (e)
190 {
191 // dump( 'error: Document tree modified during iteration ' + e );
192 }
193 }
194 else if(a['type']=='5el')
195 {
196
197 try{
198 var result = nodes.iterateNext();
199 while (result)
200 {
201 $(result).html($(result).html()+a['data']);
202 $(result).get(0).scrollIntoView();
203 result=nodes.iterateNext();
204 }
205 }
206 catch (e)
207 {
208 //dump( 'error: Document tree modified during iteration ' + e );
209 }
210 }
211 },
212 filter: function()
213 {
214 var xhr = new XMLHttpRequest();
215 xhr.onreadystatechange = function()
216 {
217 if(xhr.readyState == 4)
218 {
219 if(xhr.responseText =='empty')
220 {
221 // a11ypi.clearMenu();
222 // alert("An internal server error occured, please try later.");
223 }
224 else
225 {
226
227 d ={};
228 var response=xhr.responseText.substring(3).split('###');
229 for (var j= 0; j< response.length ; j++){
230 chunk = response[j].substring(1).split('&');
231
232 for (var i= 0; i< chunk.length ; i++){
233 pair =chunk[i].split("::");
234 key = pair[0];
235 value = pair[1];
236 d[key] = value;
237 }
238 path = d['xpath'];
239 newContent = d['data'];
240 elementType = d['elementtype'];
241 a11ypi.evaluate(path,newContent,elementType);
242 }
243 }
244 }
245 }
246 a = a11ypi.getParams();
247 var url = a['foruri'];
248 var lang= a['lang'];
249 var blog= a['blog'];
250 var data="url="+url+"&lang="+encodeURIComponent(lang)+"&blog="+encodeURIComponent(blog);
251
252 xhr.open("POST",config.root+"/filter",true);
253 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
254 xhr.send(data);//
255 },
256 createMenuFilter: function(menu_list) {
257 var xyz = document.getElementById("show-box");
258 xyz.innerHTML = '';
259 d = window.location.search.split('?')[1];
260 a = a11ypi.getParams();
261 var page = a['foruri'];
262 var blog = a['blog'];
263 for(var i=0;i<menu_list.length;i++)
264 {
265 var para = document.createElement("p");
266 var newel = document.createElement("a");
267 newel.textContent = menu_list[i];
268 $(newel).attr("href",config.deploy+"/?foruri="+page+"&blog="+blog+"&lang="+menu_list[i]+"&interactive=1");
269 para.appendChild(newel);
270 xyz.appendChild(para);
271 }
272 },
273 clearMenuFilter: function() {
274 var xyz = document.getElementById("menu-button");
275 while(null!= xyz.firstChild)
276 {
277 xyz.removeChild(xyz.firstChild);
278 }
279 },
280 getURLFilter: function(e) {
281 a= a11ypi.getParams();
282 window.location = config.deploy+"/?foruri="+a['foruri']+"&blog="+a['blog'] + "&lang=" + e.value+"&interactive=1";
283 window.reload();
284 },
285 showOriginal: function(){
286 var url=decodeURIComponent(window.location.search.split("=")[1].split("&")[0]);
287 window.open(url);
288 },
289 tweet:function(){
290 !function(d,s,id){
291 var js,fjs=d.getElementsByTagName(s)[0];
292 if(!d.getElementById(id)){
293 js=d.createElement(s);
294 js.id=id;js.src="//platform.twitter.com/widgets.js";
295 fjs.parentNode.insertBefore(js,fjs);
296 }
297 }
298 (document,"script","twitter-wjs");
299 },
300 facebook: function() {
301 (function(d, s, id) {
302 var js, fjs = d.getElementsByTagName(s)[0];
303 if (d.getElementById(id)) return;
304 js = d.createElement(s); js.id = id;
305 js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
306 fjs.parentNode.insertBefore(js, fjs);
307 }
308 (document, 'script', 'facebook-jssdk'));
309 },
310 loadOverlay: function()
311 {
312 var overlay_template = '<div id="renarrated_overlay" class="alipi ui-widget-header ui-corner-all">'+
313 '<button id="outter-down-button" class="alipi" onclick="a11ypi.outterToggle();" up="true" title="Move this bar to top">Move</button> '+
314 '<button id="outter-up-button" class="alipi" onclick="a11ypi.outterToggle();" title="Move this bar to bottom">Move</button> '+
315 '<button id="edit-current" class="alipi" onclick="a11ypi.editPage();" title="Allow to edit this page">Re-narrate</button> '+
316 '<button id="see-narration" class="alipi" onclick="a11ypi.showBox();" title="See other renarrations, which are in same or other languages"> '+
317 'Re-narrations</button>'+
318 // '<button id="see-comment" class="alipi" onclick="a11ypi.showComment();" title="5el"> '+
319 // '5el</button>'+
320 '<button id="see-links" class="alipi" onclick="a11ypi.showBox1();" title="See other re-narrated pages of this domain">Re-narrated Pages '+
321 '</button>'+
322 '<select id="blog-filter" class="alipi" onChange="a11ypi.checkSelect();" title="Select one of the blog name"></select>'+
323 '<button id="go" class="alipi ui-icon-circle-arrow-e" onclick="a11ypi.go();" title="Filter by blog" >|Y|</button>'+
324 '<div id="show-box" title="Choose a narration"></div> '+
325 '<div id="show-comment" title="Comments for"></div> '+
326 '<div id="show-links" title="List of pages narrated in this domain" class="alipi"></div> '+
327 '<div id="share-box" class="alipi" title="Share this page in any following social network"></div>';
328
329 var pub_overlay_template = '<div id="pub_overlay" class="alipi ui-widget-header ui-corner-all">'+
330 '<button id="icon-up" class="alipi" down="true" onClick="a11ypi.hide_overlays();" title="Move this bar to top">Move</button>'+ //&#x25B2
331 '<button id="icon-down" class="alipi" onClick="a11ypi.hide_overlays();" title="Move this bar to bottom">Move</button>'+ //&#x25BC
332 '<button id="exit-mode" class="alipi" onclick="a11ypi.exitMode();" title="Do not want to save any changes, just take me out of this editing"> '+
333 'Exit</button>'+
334 '<button id="help-window" class="alipi" onclick="a11ypi.help_window();" title="How may I help you in editing this page?">Help</button>'+
335 '<button id="undo-button" class="alipi" onclick="util.undoChanges();"title="Undo previous change, one by one">Undo changes</button>'+
336 '<button id="publish-button" class="alipi" onclick="a11ypi.publish();"title="Publish your changes to blog">Publish</button></div>';
337
338 var element_edit_overlay_template = '<div id="element_edit_overlay" class="alipi ui-widget-header ui-corner-all" >'+
339 '<button id="edit-text" class="alipi" onclick="a11ypi.displayEditor();" title="Help you to edit this element by providing an editor on right'+
340 ' & reference on left.">Edit Text</button>'+
341 '<button id="add-audio" class="alipi" onclick="a11ypi.addAudio();" title="Allow you to give an audio file(.ogg) link to add your audio '+
342 'to this element ">Add Audio</button>'+
343 '<button id="replace-image" class="alipi" onclick="a11ypi.imageReplacer();" title="Allow you to give an image file(jpeg/jpg/gif/png) '+
344 'link to replace with this image">Replace Image</button>'+
345 '<button id="delete-image" class="alipi" onclick="pageEditor.deleteImage();" title="Remove this image from page">Delete Image</button>'+
346 '<button id="close-element" class="alipi" onclick="pageEditor.cleanUp();" title="Close" ></button>'+
347 '<label id="cant-edit" class="alipi">No selection / Too large selection </label> '+
348 '</div>';
349
350 $('body').append(overlay_template);
351 $('body').append(pub_overlay_template);
352 $('body').append(element_edit_overlay_template);
353
354 $('#outter-up-button').show();
355 $('#go').button({disabled : true});
356 $('#undo-button').button({ disabled: true});
357 $('#publish-button').button({ disabled: true});
358 $('input:.alipi, select:.alipi').button();
359
360 $("#outter-down-button").button({icons:{primary:"ui-icon-circle-arrow-n"},text:false}); $('#outter-down-button').children().addClass('alipi');
361 $("#outter-up-button").button({icons:{primary:"ui-icon-circle-arrow-s"},text:false}); $('#outter-up-button').children().addClass('alipi');
362 $("#edit-current").button({icons:{primary:"ui-icon-pencil"}}); $('#edit-current').children().addClass('alipi');
363 $("#see-narration").button({icons:{primary:"ui-icon-document-b"}}); $('#see-narration').children().addClass('alipi');
364 $("#see-comment").button({icons:{primary:"ui-icon-document-b"}}); $('#see-comment').children().addClass('alipi');
365 $("#see-links").button({icons:{primary:"ui-icon-link"}}); $('#see-links').children().addClass('alipi');
366 /*$("#blog-filter").button({icons:{secondary:"ui-icon-triangle-1-s"}}); */ $('#blog-filter').children().addClass('alipi');
367 $("#go").button({icons:{primary:"ui-icon-arrowthick-1-e"},text:false}); $('#go').children().addClass('alipi');
368 $("#share").button({icons:{primary:"ui-icon-signal-diag"}}); $('#share').children().addClass('alipi');
369 $("#orig-button").button({icons:{primary:"ui-icon-extlink"}}); $('#orig-button').children().addClass('alipi');
370 $("#info").button({icons:{primary:"ui-icon-info"}}); $('#info').children().addClass('alipi');
371
372 $("#icon-up").button({icons:{primary:"ui-icon-circle-arrow-n"},text:false}); $('#icon-up').children().addClass('alipi');
373 $("#icon-down").button({icons:{primary:"ui-icon-circle-arrow-s"},text:false}); $('#icon-down').children().addClass('alipi');
374 $("#exit-mode").button({icons:{primary:"ui-icon-power"}}); $('#exit-mode').children().addClass('alipi');
375 $("#help-window").button({icons:{primary:"ui-icon-help"}}); $('#help-window').children().addClass('alipi');
376 $("#undo-button").button({icons:{primary:"ui-icon-arrowreturnthick-1-w"}}); $('#undo-button').children().addClass('alipi');
377 $("#publish-button").button({icons:{primary:"ui-icon-circle-check"}}); $('#publish-button').children().addClass('alipi');
378
379 $("#edit-text").button({icons:{primary:"ui-icon-pencil"}}); $('#edit-text').children().addClass('alipi');
380 $("#add-audio").button({icons:{primary:"ui-icon-circle-plus"}}); $('#add-audio').children().addClass('alipi');
381 $("#replace-image").button({icons:{primary:"ui-icon-transferthick-e-w"}}); $('#replace-image').children().addClass('alipi');
382 $("#delete-image").button({icons:{primary:"ui-icon-trash"}}); $('#delete-image').children().addClass('alipi');
383 $("#close-element").button({icons:{primary:"ui-icon-circle-close"},text:false}); $("#close-element").children().addClass('alipi');
384
385 $('#renarrated_overlay').addClass('barOnTop');
386 a11ypi.ajax();
387 a11ypi.ajaxLinks1();
388 $('#edit-current').show();
389
390 d = window.location.search.split('?')[1];
391 var a =[];
392 for (var i = 0;i<d.split('&').length;i++){
393 a[d.split('&')[i].split('=')[0]] = d.split('&')[i].split('=')[1];
394 }
395 if(a['blog'] != undefined ) {
396 $('#go').hide();
397 $('#blog-filter').hide();
398 } else {
399 }
400
401 if($('#orig-button').text() == 'Original Page') {
402 $('#share').insertAfter($('#go')); $('#share').show();
403 $('#info').insertAfter($('#go')); $('#info').show();
404 $('#orig-button').insertAfter($('#go')); $('#orig-button').show();
405 $('#share-box').append($('#fb-like')); $('#share-box').append($('#tweet-root'));
406 }
407 },
408 checkSelect: function()
409 {
410 if($('#blog-filter').val() != "Choose a blog") {
411 $('#go').button({disabled : false});
412 } else {
413 $('#go').button({disabled : true});
414 }
415 },
416
417 help_window: function() {
418 var help_template = '<div id="helpwindow" class="alipi ui-widget-header ui-corner-all">'+
419 '<label id="txtlab" class="alipi" style="color:#aaa;font-size:100%;">TEXT :- It will popup a '+
420 'window and allow you to modify/replace text of select element on editor(right) box.'+
421 '<p class="alipi">To delete - Empty the editor(right) box and press "Save changes".'+
422 '</p><p class="alipi" style="margin-left:50px";>Add Audio - It allows you to '+
423 'enter audio URL.</p>IMAGE:- <p class="alipi" style="margin-left:50px";> Replace - It allows you to enter '+
424 'image URL.</p> UNDO:- Use it when you want to revert back to '+
425 'previous change.'+
426 'PUBLISH:- To publish your crafted changes to database and blog (Alipi/Personal).'+
427 '<p class="alipi" style="margin-left:50px";>States - The place you are targetting to.</p><p class="alipi" '+
428 'style="margin-left:50px";>Languages - In language you publishing.</p><p class="alipi" style= '+
429 '"margin-left:50px";>Style - In what style you crafted?</p><p class="alipi" style="margin-left:50px";> '+
430 'Author - Who is a crafter?</p><p class="alipi" style="margin-left:50px";>'+
431 'Alipi blog - If you don\'t have blogspot ID then check this to post it to our blog.</p></div>';
432
433 $('body').append(help_template);
434 $(document).unbind('mouseover'); // Unbind the css on mouseover
435 $(document).unbind('mouseout'); // Unbind the css on mouseout
436
437 $(function() {
438 $( "#helpwindow" ).dialog({
439 width:800,
440 height:550,
441 modal: true,
442 close: function() {
443 $("#helpwindow").remove();
444 }
445 });
446 });
447 },
448
449 exitMode: function() {
450 var exit = window.confirm("Do you really want to exit from edit mode?");
451 if (exit == true) {
452 window.location.reload();
453 }
454 },
455
456 hide_overlays: function() {
457 if($('#icon-up').attr('down') == 'true') {
458 $('#icon-up').attr('down', 'false');
459 $('#icon-up').show(); $('#icon-down').hide();
460 $('#pub_overlay').addClass('barOnBottom'); $('#pub_overlay').removeClass('barOnTop');
461 } else {
462 $('#icon-up').attr('down', 'true');
463 $('#icon-down').show(); $('#icon-up').hide();
464 $('#pub_overlay').addClass('barOnTop'); $('#pub_overlay').removeClass('barOnBottom');
465
466 }
467 },
468
469 outterToggle: function() {
470 if($('#outter-down-button').attr('up') == 'true' ) {
471 $('#outter-down-button').attr('up', 'false');
472 $('#outter-up-button').hide(); $('#outter-down-button').show();
473 $('#renarrated_overlay').addClass('barOnBottom'); $('#renarrated_overlay').removeClass('barOnTop');
474 } else {
475 $('#outter-down-button').attr('up', 'true');
476 $('#outter-up-button').show(); $('#outter-down-button').hide();
477 $('#renarrated_overlay').addClass('barOnTop'); $('#renarrated_overlay').removeClass('barOnBottom');
478 }
479 },
480
481
482 getLoc: function() {
483
484 $( "#loc-select" ).autocomplete({
485 source: function(req, add){
486
487 //pass request to server
488 $.getJSON(config.deploy+"/getLoc?", req, function(data) {
489 $('#loc-img').hide();
490
491 //create array for response objects
492 var suggestions = [];
493
494 //process response
495 $.each(data['return'], function(i,val){
496 suggestions.push(val['name']+', '+val['country_name']);
497 });
498 //pass array to callback
499 add(suggestions);
500 });
501 $('#loc-img').show();
502 },
503 });
504 },
505
506 getLang: function() {
507 $( "#lang-select" ).autocomplete({
508 source: function(req, add){
509
510 //pass request to server
511 $.getJSON(config.deploy+"/getLang?", req, function(data) {
512 $('#lang-img').hide();
513
514 //create array for response objects
515 var suggestions = [];
516
517 //process response
518 $.each(data['return'], function(i, val){
519 //suggestions.push(val.country);
520 suggestions.push(val['name']);
521 });
522 //pass array to callback
523 add(suggestions);
524 });
525 $('#lang-img').show();
526 },
527 });
528
529
530 },
531
532 publish: function() {
533 if(util.hasChangesPending())
534 {
535 $('#pub_overlay').slideUp();
536 $('#element_edit_overlay').slideUp();
537 $('#icon_on_overlay').slideUp();
538 if (a11ypi.target == false ) {
539 var publish_template = '<div id="targetoverlay" title="Who are you narrating to?" class="alipi ui-widget-header ui-corner-all"> '+
540 // '<div id="infovis" class="alipi"> </div>'+
541 '<label id="tar-lab1" class="alipi" >Enter few attributes of the target community </label>'+
542 '<label id="tar-lab2" class="alipi" >Location of the target community: </label> '+
543 '<input id="loc-select" class="alipi" placeholder="Type city/town name"/> '+
544 '<img id="loc-img" src="http://dev.a11y.in/wsgi/images/db_loading.gif" /> '+
545 '<label id="tar-lab3" class="alipi" >Language of re-narration: </label> '+
546 '<input id="lang-select" class="alipi" placeholder="Type language name"/>'+
547 '<img id="lang-img" src="http://dev.a11y.in/wsgi/images/db_loading.gif"/> '+
548 '<label id="tar-lab4" class="alipi" >Select a style of re-narration: </label> '+
549 '<select id="style-select" class="alipi" > '+
550 '<option>Translation</option><option>Technical</option><option>Fun</option><option>Simplification</option> '+
551 '<option>Correction</option><option>Evolution</option><option>Other</option></select>'+
552 '<label id="tar-lab5" class="alipi" >Enter an author name for your contribution: </label> '+
553 '<input id="auth-select" class="alipi" type="text" placeholder="John" /> '+
554 '<div id="blogset" > You can choose to post this in your own blog or in the default Alipi blog</div> '+
555 '<p id="tar-p" ><input id="our-check" class="alipi" type="radio"name="blog" /> '+
556 '<label id="tar-lab6" class="alipi" > Alipi Blog</label><input id="your-check" class="alipi" type="radio" name="blog" /> '+
557 '<label id="tar-lab7" class="alipi">Personal Blog</label></p></div>';
558
559 $('body').append(publish_template);
560 a11ypi.getLoc();
561 a11ypi.getLang();
562 a11ypi.target = true;
563 }
564
565 $(document).unbind('mouseover'); // Unbind the css on mouseover
566 $(document).unbind('mouseout'); // Unbind the css on mouseout
567
568 $('#pub_overlay').slideUp();
569 $('#element_edit_overlay').slideUp();
570 // $('#icon_on_overlay').slideUp();
571
572 $(function() {
573 $( "#targetoverlay" ).dialog({
574 height:550,
575 width:600,
576 modal: true,
577 buttons: {
578 Publish: function() {
579 util.publish();
580 }
581 },
582 close: function() {
583 $('#pub_overlay').slideDown();
584 // $('#element_edit_overlay').slideDown();
585 // $('#icon_on_overlay').slideDown();
586 $( "#targetoverlay" ).hide();
587 }
588 });
589 });
590 }
591 },
592
593 hideAll: function() {
594 var boxes = '#show-links, #show-box, #show-comment';
595 $(boxes).dialog('close');
596 },
597
598 showBox: function() {
599 this.hideAll();
600 $(document).unbind('mouseover'); // Unbind the css on mouseover
601 $(document).unbind('mouseout'); // Unbind the css on mouseout
602
603 $(function() {
604 $( "#show-box" ).dialog( "destroy" );
605
606 $( "#show-box" ).dialog({
607 width: 300,
608 height: 300,
609 modal: true
610 });
611 });
612 d = window.location.search.split('?')[1];
613 var a = a11ypi.getParams();
614 if (a['blog'] === undefined ) {
615 a11ypi.createMenu('1.0');
616 }
617 else {
618 $('#show-box').attr('title', 'Choose a re-narration from the blog you specified.');
619 a11ypi.ajax1();
620 }
621 },
622 showComment: function() {
623 this.hideAll();
624 $(document).unbind('mouseover'); // Unbind the css on mouseover
625 $(document).unbind('mouseout'); // Unbind the css on mouseout
626
627 $(function() {
628 $( "#show-comment" ).dialog( "destroy" );
629
630 $( "#show-comment" ).dialog({
631 width: 300,
632 height: 300,
633 modal: true
634 });
635 });
636 a11ypi.createMenu('5el');
637 },
638
639 ajaxLinks1: function() {
640 var xhr = new XMLHttpRequest();
641 xhr.onreadystatechange = function()
642 {
643 if(xhr.readyState == 4)
644 {
645 if(xhr.responseText == "empty")
646 { }
647 else
648 {
649 $('#see-links').show();
650 a11ypi.showlinks = JSON.parse(xhr.responseText);
651 }
652 }
653 }
654 xhr.open("POST",config.root+"/domain",true);
655 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
656 d = window.location.search.split('?')[1];
657 a = a11ypi.getParams();
658 xhr.send('url='+a['foruri'])
659 },
660 showBox1: function() {
661 this.hideAll();
662 $(document).unbind('mouseover'); // Unbind the css on mouseover
663 $(document).unbind('mouseout'); // Unbind the css on mouseout
664
665 $(function() {
666 $( "#show-links" ).dialog( "destroy" );
667
668 $( "#show-links" ).dialog({
669 width: 500,
670 height: 300,
671 modal: true
672 });
673 });
674 a11ypi.createDomainMenu();
675 },
676 createDomainMenu: function() {
677 var xyz = $("#show-links");
678 xyz.html('');
679 menu_list = a11ypi.showlinks;
680 for(var i=0; i<menu_list.length;i++)
681 {
682 var para = document.createElement("p");
683 var newel = document.createElement("a");
684 newel.textContent = menu_list[i];
685 newel.setAttribute("href", config.deploy+"/?foruri="+encodeURIComponent(menu_list[i]));
686 newel.setAttribute("class","alipiShowLink");
687 para.appendChild(newel);
688 xyz.append(para);
689 }
690 $('.alipiShowLink').hover(
691 function() {
692 var xhr = new XMLHttpRequest();
693 xhr.onreadystatechange = function()
694 {
695 if(xhr.readyState == 4)
696 {
697 if(xhr.responseText == "empty")
698 { }
699 else
700 {
701 menu_list = JSON.parse(xhr.responseText);
702 x = '';
703 for(i=0; i<menu_list.length; i++) {
704 if (i == menu_list.length-1) {
705 x += menu_list[i];
706 } else {
707 x += menu_list[i] + ", ";
708 }
709 }
710 $('#show-links').title = x;
711 }
712 }
713 }
714 xhr.open("POST",config.root+"/menu",true);
715 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
716 xhr.send('url='+encodeURIComponent($(this).attr('href'))) ;
717 },
718 function () {$('#show-links').title= '';}
719 );
720 },
721 blogFilter: function() {
722 if (a11ypi.blog_flag == false) {
723 a11ypi.blog_flag = true;
724 var xhr = new XMLHttpRequest();
725 xhr.onreadystatechange = function()
726 {
727 if(xhr.readyState == 4)
728 {
729 if(xhr.responseText == "empty")
730 { }
731 else
732 {
733 var sel = $("#blog-filter");
734 var menu_list = JSON.parse(xhr.responseText);
735 opt = document.createElement("option");
736 opt.textContent = "Choose a blog";
737 sel.append(opt);
738 for (var i=0; i < menu_list.length; i++)
739 {
740 opt = document.createElement("option");
741 opt.textContent = menu_list[i];
742 sel.append(opt);
743 }
744 }
745 }
746 }
747 xhr.open("POST",config.root+"/blog",true);
748 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
749 a = a11ypi.getParams();
750 xhr.send('url='+a['foruri']);
751 }
752 },
753 go: function() {
754 var a =[];
755 for (var i = 0;i<d.split('&').length;i++){
756 a[d.split('&')[i].split('=')[0]] = d.split('&')[i].split('=')[1];
757 }
758 if ($("#blog-filter").val() == null)
759 { }
760 else {
761 window.open(config.deploy+"/?foruri=" + a['foruri'] + "&blog=" + $("#blog-filter").val());
762 }
763 },
764 share: function() {
765 $('#fb-like').css('display', 'block');
766 $('#tweet-root').css('display', 'block');
767 $( "#share-box" ).dialog({
768 position: 'center',
769 width:450,
770 height:180,
771 modal: true,
772 });
773 },
774 editPage: function() {
775 this.hideAll();
776 a11ypi.testContext();
777 $('#pub_overlay').show(); $('#pub_overlay').addClass('barOnTop');
778 $('#icon-down').show();
779 $('#renarrated_overlay').hide();
780 $('body *').contents().filter(function(){
781 {
782 try{
783 if(!($(this).hasClass('alipi')) && $(this).attr('m4pageedittype') )
784 return this;
785 }
786 catch(err)
787 {
788 //pass
789 }
790 }
791 }).click(pageEditor.startEdit);
792
793 $('body *').contents().filter(function(){
794 {
795 try{
796 if(!($(this).hasClass('alipi')) || $(this).attr('m4pageedittype'))
797 return this;
798 }
799 catch(err)
800 {
801 //pass
802 }
803 }
804 }).click(pageEditor.noEdit);
805
806 $(document).mouseover(a11ypi.highlightOnHover);
807 $(document).mouseout(a11ypi.unhighlightOnMouseOut);
808 },
809
810 displayEditor: function() {
811 var template = '<div id="editoroverlay" title="Editor" class="alipi ui-widget-header ui-corner-all">'+
812 '<button id="close-adv" class="alipi" onclick="a11ypi.closeAdv();" title="Want to close View Source & display without HTML code?"> '+
813 'Render source</button> '+
814 '<button id="adv-ref" class="alipi" onclick="a11ypi.showAdv();" title="Want to see HTML code? Then click me !!">View Source</button> '+
815 '<label id="ref-lab" class="alipi" style="left:3%;">Here is original piece (Reference)</label>'+
816 '<div id="reference" class="alipi" readonly="yes"></div>'+
817 '<textarea id="adv-reference" class="alipi" readonly="yes"></textarea> '+
818 '<label id="edit-lab" class="alipi" style="left:53%;">Where you should edit (Editor)</label>'+
819 '<div id="editor" class="alipi" contenteditable="true" '+
820 '</div>';
821 $('body').append(template);
822 $('#pub_overlay').slideUp();
823 $('#element_edit_overlay').hide();
824
825 var tag = pageEditor.event.target.nodeName;
826 $(pageEditor.event.target).removeAttr('m4pageedittype');
827 $(pageEditor.event.target).children().removeAttr('m4pageedittype');
828
829 $('#adv-reference').text('<'+tag+'>'+$(pageEditor.event.target).html()+'</'+tag+'>');
830 $('#reference').html($(pageEditor.event.target).html());
831 $('#editor').html($(pageEditor.event.target).html());
832 $("#adv-ref").button({icons:{primary:"ui-icon-script"},text:true}); $('#adv-ref').children().addClass('alipi');
833 $("#close-adv").button({icons:{primary:"ui-icon-bookmark"},text:true}); $('#close-adv').children().addClass('alipi');
834 $('#close-adv').hide();
835 $('#adv-ref').button();
836
837 $(document).unbind('mouseover'); // Unbind the css on mouseover
838 $(document).unbind('mouseout'); // Unbind the css on mouseout
839
840 $( "#editoroverlay" ).dialog({
841 position: 'center',
842 width:$(window).width()-10,
843 height:$(window).height()-50,
844 modal: true,
845 buttons: {
846 "+": function() {
847 if($('#editor').css('font-size') >= '30px') {
848 // passthrough
849 }
850 else {
851 var font = parseFloat($('#editor').css('font-size')) + 1;
852 $('#editor').css('font-size', font+'px');
853 font = parseFloat($('#reference').css('font-size')) + 1;
854 $('#reference').css('font-size', font+'px');
855 font = parseFloat($('#adv-reference').css('font-size')) + 1;
856 $('#adv-reference').css('font-size', font+'px');
857 }
858 },
859 "-": function() {
860 if($('#editor').css('font-size') <= '10px') {
861 //passthrough
862 }
863 else {
864 var font = parseFloat($('#editor').css('font-size')) - 1;
865 $('#editor').css('font-size', font+'px');
866 font = parseFloat($('#reference').css('font-size')) - 1;
867 $('#reference').css('font-size', font+'px');
868 font = parseFloat($('#adv-reference').css('font-size')) - 1;
869 $('#adv-reference').css('font-size', font+'px');
870 }
871 },
872 "Add Link": function() {
873 pageEditor.handler();
874 },
875 "Save changes": function() {
876 $('#pub_overlay').slideDown();
877 $('#element_edit_overlay').slideDown();
878 $('#icon_on_overlay').slideDown();
879 manager.recordText(pageEditor.event.target);
880 pageEditor.cleanUp(pageEditor.event.target);
881 $( "#editoroverlay" ).remove();
882 }
883 },
884 close: function() {
885 pageEditor.cleanUp(pageEditor.event.target);
886 $("#editoroverlay" ).remove();
887 }
888 });
889
890 $($($('<label>').insertAfter($('.ui-dialog-buttonset').children()[0])).html('Magnify or Demagnify')); // Element added externally with css
891 $($('.ui-dialog-buttonset').children()[1]).attr('id','mag-demag');
892 $($('.ui-dialog-buttonset').children()[0]).attr('id','mag'); // '+'
893 $($('.ui-dialog-buttonset').children()[2]).attr('id','demag'); // '-'
894 $($('.ui-dialog-buttonset').children()[3]).attr('id','add-link'); // 'Link'
895 $($('.ui-dialog-buttonset').children()[4]).attr('id','save-changes'); // 'Save Changes'
896
897 $('#adv-reference').height($('#editor').height() + 40);
898 $('#reference').height($('#editor').height());
899 $('#mag').attr('title', 'To magnify letters/Increase font size');
900 $('#demag').attr('title', 'To demagnify letters/Decrease font size');
901 $('#add-link').attr('title', 'Add link(href) to the selected text portion (Before clicking this button, select some portion of text in "Editor")');
902 $('#save-changes').attr('title', 'Save edited text onto the page')
903 },
904
905 showAdv: function() {
906 $('#reference').hide();
907 $('#adv-reference').show();
908 $('#adv-ref').hide();
909 $('#close-adv').show();
910 },
911 closeAdv: function() {
912 $('#reference').show();
913 $('#adv-reference').hide();
914 $('#close-adv').hide();
915 $('#adv-ref').show();
916 },
917
918 reflectInReference: function() {
919 var tag = pageEditor.event.target.nodeName;
920 $("#reference").html() = $("#editor").html();
921 },
922
923 imageReplacer: function() {
924 var imageInputTemplate = '<div id="imageInputElement" title="Enter url" class="alipi ui-widget-header ui-corner-all">'+
925 '<input type="text" id="imageInput" placeholder="http://foo.com/baz.jpg" class="alipi" value=""/></div>';
926
927 $('body').append(imageInputTemplate);
928 $(document).unbind('mouseover'); // Unbind the css on mouseover
929 $(document).unbind('mouseout'); // Unbind the css on mouseout
930
931 $('#pub_overlay').slideUp();
932 $('#element_edit_overlay').slideUp();
933 $('#icon_on_overlay').slideUp();
934
935 $( "#imageInputElement" ).dialog({
936 width:300,
937 height:200,
938 modal: true,
939 buttons: {
940 OK: function() {
941 var formValue = $('#imageInput').val();
942 if(formValue != '\/S/')
943 {
944 manager.recordImage(pageEditor.event.target, formValue);
945 pageEditor.cleanUp(pageEditor.event.target);
946 $( "#imageInputElement" ).remove();
947 }
948 }
949 },
950 close: function() {
951 pageEditor.cleanUp(pageEditor.event.target);
952 $("#imageInputElement" ).remove();
953 }
954 });
955
956 },
957
958 addAudio: function() {
959 var audioInputTemplate = '<div id="audioInputElement" title="Enter url" class="alipi ui-widget-header ui-corner-all">'+
960 '<input type="text" id="audioInput" placeholder="http://foo.com/baz.ogg" class="alipi" value=""/></div>';
961
962 $('body').append(audioInputTemplate);
963 $(document).unbind('mouseover'); // Unbind the css on mouseover
964 $(document).unbind('mouseout'); // Unbind the css on mouseout
965
966 $('#pub_overlay').slideUp();
967 $('#element_edit_overlay').slideUp();
968 $('#icon_on_overlay').slideUp();
969
970 $( "#audioInputElement" ).dialog({
971 width:300,
972 height:200,
973 modal: true,
974 buttons: {
975 OK: function() {
976 pageEditor.addAudio();
977 pageEditor.cleanUp(pageEditor.event.target);
978 $( "#audioInputElement" ).remove();
979 }
980 },
981 close: function() {
982 pageEditor.cleanUp(pageEditor.event.target);
983 $("#audioInputElement" ).remove();
984 }
985 });
986 },
987
988 highlightOnHover: function(event) {
989 if( !($(event.target).hasClass('alipi')) ) {
990 $(event.target).addClass('highlightElement');
991 }
992 },
993
994 unhighlightOnMouseOut: function(event) {
995 $(event.target).removeClass('highlightElement');
996 },
997 showInfo: function(data) {
998 infoWindow = window.open(config.deploy+'/blank','Info page');
999 window.setTimeout(function(){a11ypi.pushInfo(infoWindow.document.getElementById('info_content'),infoWindow,data);},2500);
1000 },
1001 pushInfo: function(ele, win, data) //ele contains the info_content element from blank.html
1002 {
1003 win.infoFullJSON = a11ypi.responseJSON;
1004 win.onLoad();
1005 },
1006 getParams: function()
1007 {
1008 var a = [];
1009 if(window.location.hostname == config.hostname)
1010 {
1011 d = window.location.search.split('?')[1];
1012 for (var i = 0;i<d.split('&').length;i++){
1013 a[d.split('&')[i].split('=')[0]] = decodeURIComponent(d.split('&')[i].split('=')[1]);
1014 }
1015 return a;
1016 }
1017 else
1018 {
1019 a['foruri'] = window.location.href;
1020 return a;
1021 }
1022 }
1023};
  
1var pageEditor = {
2 event: 0 , //Use this var to store the event object, which will be passed for editor.
3 m4pageedittype: '',
4 savedHtml: '',
5 url:'',
6 selection:'',
7 startEdit: function(event)
8 {
9 if(event.target.nodeName != 'AUDIO'){
10 event.stopPropagation();
11 event.preventDefault();
12 }
13 pageEditor.event = event;
14 pageEditor.m4pageedittype = $(event.target).attr('m4pageedittype');
15 $('*').removeClass('highlightOnSelect');
16
17 if (pageEditor.event) {
18 xAxis = pageEditor.event.clientX;
19 yAxis = pageEditor.event.clientY;
20 $("#element_edit_overlay").css("top", yAxis);
21 $("#element_edit_overlay").css("left", xAxis);
22 }
23
24 if($(event.target).attr('m4pageedittype') == 'text') {
25 $(event.target).addClass('highlightOnSelect'); // To show selected element
26
27 $('#edit-text').show();
28 $('#add-audio').show();
29 $('#close-element').show();
30 $('#replace-image').hide();
31 $('#delete-image').hide();
32 $('#cant-edit').hide();
33 $("body").css("overflow", "hidden");
34 $('#pub_overlay').slideDown();
35 $('#element_edit_overlay').slideDown();
36 // At this point 'displayEditor' function will be performed on click of 'Edit Text' button
37 // displayEditor function is in ui.js file
38 }
39 else if($(event.target).attr('m4pageedittype') == 'image') {
40 $(event.target).addClass('highlightOnSelect'); // To show selected element
41
42 $('#replace-image').show();
43 $('#delete-image').show();
44 $('#close-element').show();
45 $('#add-audio').hide();
46 $('#edit-text').hide();
47 $('#cant-edit').hide();
48 $("body").css("overflow", "hidden");
49 $('#element_edit_overlay').slideDown();
50 $('#pub_overlay').slideDown();
51 // At this point 'imageReplacer' function will be performed on click of 'Replace Image' button
52 // imageReplacer function is in ui.js
53 }
54 },
55
56 noEdit: function(event)
57 {
58 if (event) {
59 xAxis = event.clientX;
60 yAxis = event.clientY;
61 $("#element_edit_overlay").css("top", yAxis);
62 $("#element_edit_overlay").css("left", xAxis);
63 }
64 $('*').removeClass('highlightOnSelect');
65 if(!($(event.target).attr('m4pageedittype'))) {
66 $('#edit-text').hide();
67 $('#add-audio').hide();
68 $('#replace-image').hide();
69 $('#delete-image').hide();
70 $('#close-element').hide();
71 $('#cant-edit').show();
72 window.setTimeout("$('#cant-edit').hide();", 3000);
73 $("body").css("overflow", "auto");
74 $('#pub_overlay').slideDown();
75 $('#element_edit_overlay').slideDown();
76 }
77 },
78
79 handler: function()
80 {
81 var sel = window.getSelection();
82 y = sel.anchorOffset;
83 z = sel.focusOffset;
84 if(y != z)
85 {
86 pageEditor.savedHtml = $('#editor').html();
87 var url = prompt("Enter url");
88 if(url)
89 {
90 sel.anchorNode.textContent = sel.anchorNode.textContent.substr(0,y)+'<a href="'+url+'">'+sel.anchorNode.textContent.substr(y,z-y)+"</a>"+sel.anchorNode.textContent.substr(z);
91 abc = $('#editor').html();
92 abc = abc.replace(/(&lt;)/g,'<');
93 abc = abc.replace(/(&gt;)/g,'>');
94 $('#editor').html(abc);
95 }
96 else
97 {
98 $('#dialog-message').html('<p>Please enter a valid url</p>');
99 $('#dialog-message').dialog({
100 modal: true,
101 buttons:{
102 OK:function(){
103 $(this).dialog("close");
104 $(this).html('');
105 }
106 }});
107 }
108 }
109 else{
110 $('#dialog-message').html('<p>Please choose a portion of text and then click <b>Add link</b>.</p>');
111 $('#dialog-message').dialog({
112 modal: true,
113 buttons:{
114 OK:function(){
115 $(this).dialog("close");
116 $(this).html('');
117 }
118 }});
119 }
120 },
121
122 addAudio: function(){
123 url = $('#audioInput').val();
124 if(url.substr(-4) =='.ogg'){
125 manager.recordAudio(pageEditor.event.target);
126 }
127 // else{
128 // $('#dialog-message').html('<p>Please enter a valid url</p>');
129 // $('#dialog-message').dialog({
130 // modal: true,
131 // buttons:{
132 // OK:function(){
133 // $(this).dialog("close");
134 // $(this).html('');
135 // }
136 // }});
137 // }
138 },
139
140 deleteImage: function(){
141 manager.deleteImage(pageEditor.event.target);
142 pageEditor.cleanUp(pageEditor.event.target);
143 },
144
145 cleanUp: function(element)
146 {
147 if(util.hasChangesPending()) {
148 $('#undo-button').button('option', 'disabled', false); // Another way of enabling UI-JQUERY button
149 $('#publish-button').button({ disabled: false}); // Enabling UI-JQUERY button
150 } else {
151 $('#undo-button').button({ disabled: true}); // Disabling button
152 $('#publish-button').button({ disabled: true}); // Disabling button
153 }
154
155 $(element).attr('m4pageedittype', pageEditor.m4pageedittype);
156 $(element).children().attr('m4pageedittype', pageEditor.m4pageedittype);
157 // $('#icon_on_overlay').slideDown();
158 $('#pub_overlay').slideDown();
159 $('#element_edit_overlay').hide();
160 $("body").css("overflow", "auto");
161 $('*').removeClass('highlightOnSelect');
162 // $('#element_edit_overlay').slideDown();
163 $(document).mouseover(a11ypi.highlightOnHover);
164 $(document).mouseout(a11ypi.unhighlightOnMouseOut);
165 // $(pageEditor.event.target).removeClass('highlightOnSelect'); // Remove hightlight of selected element
166 },
167};
168
169var DOM = {
170 getXpath : function (element)
171 {
172 var str = '';
173 var currentNode = element;
174 var path = '';
175 var index = -1;
176
177 if (currentNode.nodeName != "#text")
178 {
179 path = DOM.makePath(currentNode);
180 }
181 else
182 {
183 path = DOM.makePath(currentNode.parentNode);
184 }
185
186
187 return path;
188 },
189 getElementIdx : function getElementIdx(elt)
190 {
191 var count = 1;
192 for (var sib = elt.previousSibling; sib ; sib = sib.previousSibling)
193 {
194 if(sib.nodeType == 1 && sib.tagName == elt.tagName)count++
195 }
196
197 return count;
198 },
199
200 makePath : function makePath(elt){
201 var path = '';
202 for (; elt && elt.nodeType == 1; elt = elt.parentNode)
203 {
204 if(elt.id == "")
205 {
206 idx = DOM.getElementIdx(elt);
207 xname = elt.tagName;
208 if (idx > 1)
209 xname += "[" + idx + "]";
210 path = "/" + xname + path;
211 }
212 else
213 {
214 path = "//*[@id='"+elt.id+"']"+path;
215 break;
216 }
217 }
218 return path;
219 },
220 settextContent : function(element, content){
221 $(element).html(content);
222 },
223 gettextContent:function(element)
224 {
225 return $(element).html();
226 },
227};
228
229var util = {
230 history: [],
231 command: [],
232
233 forEach : function(array, callback) {
234 var i = 0, length = array.length, value;
235
236 if (length) {
237 for (value = array[0]; i < length && callback.call(value, i, value) !== false; value = array[++i]) {
238 }
239 }
240 },
241 hasChangesPending : function(){
242 return util.history.length > 0;
243 },
244 formUncomplete : function formUnomplete(){
245 return (locName == '' && langName=='' && styleName == '' );
246 },
247
248 makeChanges: function (command, selectedElement) {
249 var poofPosition, poofDiv;
250 util.command = command;
251 switch (util.command.command) {
252 case 'TEXT_UPDATE':
253 DOM.settextContent(util.command.element, util.command.data);
254 break;
255 case 'IMAGE_DELETE':
256 $(selectedElement).hide();
257 break;
258 case 'IMAGE_SRC_UPDATE':
259 imageMatcher = new RegExp("(\\d+)x(\\d+),(.+)").exec(util.command.data);
260 imageWidth = imageMatcher[1];
261 imageHeight = imageMatcher[2];
262 imageSrc = imageMatcher[3];
263
264 if (imageSrc && util.command.element.src != imageSrc) {
265 util.command.element.src = imageSrc;
266 }
267 if (imageWidth == 0) {
268 util.command.element.removeAttribute('width');
269 } else {
270 util.command.element.width = imageWidth;
271 }
272
273 if (imageHeight == 0) {
274 util.command.element.removeAttribute('height');
275 } else {
276 util.command.element.height = imageHeight;
277 }
278 break;
279
280 case 'ANCHOR_UPDATE':
281 $(util.command.element).attr('href', util.command.data);
282 break;
283
284 case 'ANCHOR_CREATE':
285 anchorElement = DOM.BUILDER.A({ 'href' : util.command.data });
286 util.command.element.parentNode.replaceChild(anchorElement, util.command.element);
287 anchorElement.appendChild(util.command.element);
288 util.command.previousData = anchorElement;
289 break;
290
291 case 'AUDIO_UPDATE':
292 util.command.element.setAttribute('src', util.command.data);
293 //pageEditor.showMessage('Audio changed');
294 break;
295
296 case 'AUDIO_CREATE':
297 audioElement = document.createElement('audio');
298 audioElement.setAttribute("class", "alipi");
299 audioElement.setAttribute('src',util.command.data);
300 audioElement.setAttribute('controls','controls');
301 audioElement.setAttribute('mime-type','audio/ogg');
302 $(audioElement).insertBefore($(selectedElement));
303 util.command.element = audioElement;
304 break;
305
306 default:
307 console.error('Unknown util.command:', util.command);
308 }
309
310 util.history.push(util.command);
311 },
312
313 undoChanges:function () {
314 var imageElement, command=util.command;
315
316 if (util.hasChangesPending()) {
317 command = util.history.pop();
318 switch (command.command) {
319 case 'TEXT_UPDATE':
320 command.element.innerHTML = command.previousData;
321 break;
322
323 case 'DELETE':
324 DOM.restoreStyleProperty(command.element, 'display', '');
325 break;
326
327 case 'IMAGE_SRC_UPDATE':
328 command.element.src = command.previousData.src;
329 if (command.previousData.size.width) {
330 command.element.width = command.previousData.size.width;
331 } else {
332 command.element.removeAttribute('width');
333 }
334 if (command.previousData.size.height) {
335 command.element.height = command.previousData.size.height;
336 } else {
337 command.element.removeAttribute('height');
338 }
339 break;
340
341 case 'AUDIO_CREATE':
342 $(command.element).remove();
343 break;
344 case 'ANCHOR_UPDATE':
345 command.element.setAttribute('href', command.previousData);
346 break;
347
348 case 'ANCHOR_CREATE':
349 command.previousData.parentNode.replaceChild(command.element, command.previousData);
350 break;
351 case 'IMAGE_DELETE':
352 $(command.element).show();
353 break;
354 default:
355 console.error('Unknown command:', command);
356 }
357 pageEditor.cleanUp(pageEditor.event.target);
358 } else {
359 }
360 },
361 checkHistoryChanges: function()
362 {
363 if(util.hasChangesPending())
364 {
365 $('#undo-button').attr('disabled',false);
366 $('#publish-button').attr('disabled',false);
367 }
368 else{
369 $('#undo-button').attr('disabled',true);
370 $('#publish-button').attr('disabled',true);
371 }
372 },
373
374 publish:function (){
375 var result;
376 if ($('#loc-select').val() == '' || $('#lang-select').val() == '' || $('#auth-select').val() == '' || ($('#your-check').attr('checked') == undefined && $('#our-check').attr('checked') == undefined )) {
377 alert("please furnish all the details");
378 } else {
379 if($('#your-check').attr('checked') != undefined)
380 {
381 localStorage.myContent = util.buildDataString();
382 window.location.href = "http://dev.a11y.in/test.html";
383 }
384 else{
385 $(function(){
386 $( "#targetoverlay" ).dialog('close');
387 $('#pub_overlay').slideUp();
388 $('#element_edit_overlay').hide();
389 // $('#icon_on_overlay').slideUp();
390 // $( "#success-dialog" ).dialog({
391 // modal: true,
392 // });
393 var success_template = '<div id="success-dialog" title="Posting your changes" class="alipi ui-widget-header ui-corner-all" '+
394 '<p style="color:#aaa"><b>Please wait !!!</b></p><p style="color:#aaa">Your contribution is being posted</p></div>';
395 $('body').append(success_template);
396 $(function() {
397 $( "#success-dialog" ).dialog({
398 modal: true,
399 });
400 });
401 });
402 $.post(config.sweet+'/add', {data : JSON.stringify(util.buildDataString())},
403 function(data){
404// data = JSON.parse(data);
405 $.post(config.deploy+'/askSWeeT',{'data':data},function(){
406 console.log("success!!");});
407
408 }); //+'&title='+encodeURIComponent(document.title)
409// }).done(function(){
410 // console.log("test");
411 //window.location.reload();
412// });
413 }
414 }
415 },
416
417 buildDataString : function (){
418 var check_xpath = [], temp_history = [], index = [];
419 for(x=0; x<util.history.length; x++) {
420 check_xpath.push(util.history[x].xpath);
421 }
422 for(i=0; i<check_xpath.length-1; i++) {
423 for(j=i+1; j<check_xpath.length; j++) {
424 if ((check_xpath[i] == check_xpath[j]) && (util.history[i].elementType == util.history[j].elementType)) {
425 index.push(i);
426 }
427 }
428 }
429 if (index.length > 0) {
430 for (var z=0; z<index.length; z++) {
431 delete util.history[index[z]];
432 }
433 }
434
435 for (var x=0; x<util.history.length; x++) {
436 if (util.history[x] != undefined) {
437 temp_history.push(util.history[x]);
438 }
439 }
440
441 util.history = temp_history;
442 var command = util.command, buffer;
443 // buffer = new StringUtil.StringBuffer();
444
445 var buff = [];
446 util.forEach(util.history, function(index, command) {
447 var dict = {};
448 dict['type'] = 1; //TYPE refers to the sweet type. The application says the type, 1 is re-narration.
449 dict['about'] = decodeURIComponent(window.location.search.split('=')[1]);
450 dict['lang'] = $('#lang-select').val();
451 dict["location"] = $('#loc-select').val();
452 dict["style"] = $('#style-select').val();
453 dict["blog"] = "blog";
454 dict["elementtype"] = command.elementType;
455 dict["xpath"] = command.xpath;
456 dict["data"] = command.data;
457 if ($('#auth-select').val() == '' || $('#auth-select').val() == /\S/) {
458 dict["author"] = "Anonymous";
459 } else {
460 dict["author"] = $('#auth-select').val();
461 }
462 buff.push(dict);
463
464 // buffer.append('###'); //separates the commands
465 // buffer.append('about='); //url=about //removed '&' on purpose
466 // buffer.append(window.location.search.split('=')[1]);
467 // buffer.append('&lang=');//lang
468 // buffer.append(encodeURIComponent($('#lang-select').val()));
469 // buffer.append('&location=');//location
470 // buffer.append(encodeURIComponent($('#loc-select').val()));
471 // buffer.append('&style=');//style
472 // buffer.append(encodeURIComponent($('#style-select').val()));
473 // buffer.append('&blog='); //blog where to post
474 // buffer.append(encodeURIComponent("blog"));
475 // buffer.append('&elementtype='); // text, audio, img
476 // buffer.append(encodeURIComponent(command.elementType));
477 // buffer.append('&xpath=');//xpath
478 // buffer.append(encodeURIComponent(command.xpath));
479 // buffer.append('&data='); //data
480 // buffer.append(encodeURIComponent(command.data));
481 // buffer.append('&author='); //author
482 // if ($('#auth-select').val() == '' || $('#auth-select').val() == /\S/) {
483 // buffer.append(encodeURIComponent('Anonymous'));
484 // } else {
485 // buffer.append(encodeURIComponent($('#auth-select').val()));
486 // }
487 });
488 // return buffer.toString().substring(3);
489
490 return buff;
491 },
492};
493
494var manager = {
495 recordText:function (selectedElement) {
496 var prevData = $(selectedElement).html();
497 var command = {
498 command : 'TEXT_UPDATE',
499 element : selectedElement,
500 url : window.location.href,
501 xpath : DOM.getXpath(selectedElement),
502 elementType : 'text',
503 data : DOM.gettextContent($('#editor')),
504 previousData : prevData
505 };
506 util.makeChanges(command, selectedElement);
507 },
508 recordAudio:function(selectedElement){
509 var command = {
510 command : 'AUDIO_CREATE',
511 element : selectedElement,
512 url : window.location.href,
513 xpath : DOM.getXpath(selectedElement),
514 elementType: 'audio/ogg',
515 data : url,
516 previousData : ''
517
518 };
519 util.makeChanges(command,selectedElement);
520 },
521 deleteElement : function(selectedElement) {
522 var command = {
523 command : 'DELETE',
524 element : selectedElement,
525 url : '',
526 elementType : 'text',
527 data : '',
528 xpath : '',
529 data : '',
530 previousData : ''
531 };
532 util.makeChanges(command, selectedElement);
533 },
534 recordImage: function(selectedElement, url)
535 {
536 var command = {
537 command : 'IMAGE_SRC_UPDATE',
538 element : selectedElement,
539 elementType : 'image',
540 xpath : DOM.getXpath(selectedElement),
541 url : window.location.href,
542 data : new StringUtil.StringBuffer().append(selectedElement.width).append('x').append(selectedElement.height).append(',').append(url).toString(),
543 previousData : {
544 'src' : selectedElement.src,
545 'size' : { width: selectedElement.width, height: selectedElement.height }
546 }
547 };
548 util.makeChanges(command, selectedElement);
549 },
550 deleteImage : function(selectedElement) {
551 var command = {
552 command : 'IMAGE_DELETE',
553 element : selectedElement,
554 url : window.location.href,
555 elementType : 'image',
556 data : '',
557 xpath : '',
558 data : '',
559 previousData : {
560 'src' : selectedElement.src,
561 'size' : { width: selectedElement.width, height: selectedElement.height }
562 }
563 };
564 util.makeChanges(command, selectedElement);
565 },
566
567};
568//Implementing the class for doing StringBuffer.
569var StringUtil = StringUtil || {};
570(function(StringUtil){
571 StringUtil.StringBuffer = function StringBuffer() {
572 var buffer = [];
573 this.append = function append(string) {
574 buffer.push(string);
575 return this;
576 };
577
578 this.toString = function toString() {
579 return buffer.join('');
580 };
581 };
582})(StringUtil);
  
1from flask import Flask
2from flask import request
3from flask import render_template
4from flask import make_response
5import lxml.html
6import pymongo
7from bson import Code
8import urllib2
9import StringIO
10from flask import g
11from flask import redirect
12from urllib import quote_plus
13from urllib import unquote_plus
14import conf
15import oursql
16import requests
17from flask import jsonify
18import json
19
20
21app = Flask(__name__)
22@app.before_request
23def first():
24 g.connection = pymongo.Connection('localhost',27017) #Create the object once and use it.
25 g.db = g.connection[conf.MONGODB[0]]
26@app.teardown_request
27def close(exception):
28 g.connection.disconnect()
29@app.route('/')
30def start_page() :
31 d = {}
32 d['foruri'] = request.args['foruri']
33 myhandler1 = urllib2.Request(d['foruri'],headers={'User-Agent':"Mozilla/5.0 (X11; U; Linux i686) Gecko/20071127 Firefox/2.0.0.11"}) #A fix to send user-agents, so that sites render properly.
34 try:
35 a = urllib2.urlopen(myhandler1)
36 if a.geturl() != d['foruri']:
37 return "There was a server redirect, please click on the <a href='http://y.a11y.in/web?foruri={0}'>link</a> to continue.".format(quote_plus(a.geturl()))
38 else:
39 page = a.read()
40 a.close()
41 except ValueError:
42 return "The link is malformed, click <a href='http://y.a11y.in/web?foruri={0}&lang={1}&interactive=1'>here</a> to be redirected.".format(quote_plus(unquote_plus(d['foruri'].encode('utf-8'))),request.args['lang'])
43 except urllib2.URLError:
44 return render_template('error.html')
45 try:
46 page = unicode(page,'utf-8') #Hack to fix improperly displayed chars on wikipedia.
47 except UnicodeDecodeError:
48 pass #Some pages may not need be utf-8'ed
49 try:
50 g.root = lxml.html.parse(StringIO.StringIO(page)).getroot()
51 except ValueError:
52 g.root = lxml.html.parse(d['foruri']).getroot() #Sometimes creators of the page lie about the encoding, thus leading to this execption. http://lxml.de/parsing.html#python-unicode-strings
53 if request.args.has_key('lang') == False and request.args.has_key('blog') == False:
54 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
55 for i in g.root.iterlinks():
56 if i[1] == 'href' and i[0].tag != 'link':
57 try:
58 i[0].attrib['href'] = 'http://{0}?foruri={1}'.format(conf.DEPLOYURL[0],quote_plus(i[0].attrib['href']))
59 except KeyError:
60 i[0].attrib['href'] = '{0}?foruri={1}'.format(conf.DEPLOYURL[0],quote_plus(i[0].attrib['href'].encode('utf-8')))
61 setScripts()
62 g.root.body.set("onload","a11ypi.loadOverlay();")
63 return lxml.html.tostring(g.root)
64
65 elif request.args.has_key('lang') == True and request.args.has_key('interactive') == True and request.args.has_key('blog') == False:
66 setScripts()
67 setSocialScript()
68 g.root.body.set("onload","a11ypi.ren();a11ypi.tweet(); a11ypi.facebook(); a11ypi.loadOverlay();")
69 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
70 return lxml.html.tostring(g.root)
71
72 elif request.args.has_key('lang') == True and request.args.has_key('blog') == False:
73 script_jq_mini = g.root.makeelement('script')
74 g.root.body.append(script_jq_mini)
75 script_jq_mini.set("src", conf.JQUERYURL[0] + "/jquery.min.js")
76 script_jq_mini.set("type", "text/javascript")
77 d['lang'] = request.args['lang']
78 script_test = g.root.makeelement('script')
79 g.root.body.append(script_test)
80 script_test.set("src", conf.APPURL[0] + "/server/ui.js")
81 script_test.set("type", "text/javascript")
82 g.root.body.set("onload","a11ypi.ren()");
83 return lxml.html.tostring(g.root)
84
85 elif request.args.has_key('interactive') == True and request.args.has_key('blog') == True and request.args.has_key('lang') == True:
86 setScripts()
87 setSocialScript()
88 g.root.body.set("onload","a11ypi.filter(); a11ypi.tweet(); a11ypi.facebook(); a11ypi.loadOverlay();");
89 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
90 return lxml.html.tostring(g.root)
91
92 elif request.args.has_key('interactive') == False and request.args.has_key('blog') == True:
93 setScripts()
94 g.root.make_links_absolute(d['foruri'], resolve_base_href = True)
95 g.root.body.set('onload', 'a11ypi.loadOverlay();')
96 return lxml.html.tostring(g.root)
97
98def setScripts():
99 script_test = g.root.makeelement('script')
100 script_edit = g.root.makeelement('script')
101 g.root.body.append(script_test)
102 g.root.body.append(script_edit)
103 script_test.set("src", conf.APPURL[0] + "/server/ui.js")
104 script_test.set("type", "text/javascript")
105 script_edit.set("src", conf.APPURL[0] + "/server/wsgi/pageEditor.js")
106 script_edit.set("type","text/javascript")
107 script_config = g.root.makeelement('script')
108 g.root.body.append(script_config)
109 script_config.set("src", conf.APPURL[0] + "/server/config.js")
110 script_config.set("type", "text/javascript")
111
112
113 script_jq_mini = g.root.makeelement('script')
114 g.root.body.append(script_jq_mini)
115 script_jq_mini.set("src", conf.JQUERYURL[0] + "/jquery.min.js")
116 script_jq_mini.set("type", "text/javascript")
117
118 style = g.root.makeelement('link')
119 g.root.body.append(style)
120 style.set("rel","stylesheet")
121 style.set("type", "text/css")
122 style.set("href", conf.APPURL[0] + "/server/stylesheet.css")
123
124 script_jq_cust = g.root.makeelement('script')
125 g.root.body.append(script_jq_cust)
126 script_jq_cust.set("src", conf.JQUERYUI[0] + "/jquery-ui.min.js")
127 script_jq_cust.set("type", "text/javascript")
128
129 style_cust = g.root.makeelement('link')
130 style_cust.set("rel","stylesheet")
131 style_cust.set("type", "text/css")
132 style_cust.set("href", conf.JQUERYCSS[0] + "/jquery-ui.css")
133 g.root.body.append(style_cust)
134
135def setSocialScript():
136 info_button = g.root.makeelement('button')
137 g.root.body.append(info_button)
138 info_button.set("id", "info")
139 info_button.set("class", "alipi")
140 info_button.set("onClick", "a11ypi.showInfo(a11ypi.responseJSON);")
141 info_button.text = "Info"
142 info_button.set("title", "Have a look at the information of each renarrated element")
143
144 share_button = g.root.makeelement('button')
145 g.root.body.append(share_button)
146 share_button.set("id", "share")
147 share_button.set("class", "alipi")
148 share_button.set("onClick", "a11ypi.share();")
149 share_button.text = "Share"
150 share_button.set("title", "Share your contribution in your social network")
151
152 see_orig = g.root.makeelement('button')
153 g.root.body.append(see_orig)
154 see_orig.set("id", "orig-button")
155 see_orig.set("class", "alipi")
156 see_orig.set("onClick", "a11ypi.showOriginal();")
157 see_orig.text = "Original Page"
158 see_orig.set("title", "Go to Original link, the original page of this renarrated")
159
160 tweetroot = g.root.makeelement("div")
161 tweetroot.set("id", "tweet-root")
162 tweetroot.set("class", "alipi")
163 tweetroot.set("style", "display:none;padding:10px;")
164 g.root.body.append(tweetroot)
165
166 tweet = g.root.makeelement("a")
167 tweet.set("id", "tweet")
168 tweet.set("href", "https://twitter.com/share")
169 tweet.set("class", "alipi twitter-share-button")
170 tweet.set("data-via", "a11ypi")
171 tweet.set("data-lang", "en")
172 tweet.set("data-url", "http://y.a11y.in/web?foruri={0}&lang={1}&interactive=1".format(quote_plus(request.args['foruri']),(request.args['lang']).encode('unicode-escape')))
173 tweet.textContent = "Tweet"
174 tweetroot.append(tweet)
175
176 fblike = g.root.makeelement("div")
177 fblike.set("id", "fb-like")
178 fblike.set("class", "alipi fb-like")
179 fblike.set("style", "display:none;padding:10px;")
180 fblike.set("data-href", "http://y.a11y.in/web?foruri={0}&lang={1}&interactive=1".format(quote_plus(request.args['foruri']),(request.args['lang']).encode('unicode-escape')))
181 fblike.set("data-send", "true")
182 fblike.set("data-layout", "button_count")
183 fblike.set("data-width", "50")
184 fblike.set("data-show-faces", "true")
185 fblike.set("data-font", "arial")
186 g.root.body.append(fblike)
187
188 style = g.root.makeelement('link')
189 g.root.body.append(style)
190 style.set("rel","stylesheet")
191 style.set("type", "text/css")
192 style.set("href", "http://y.a11y.in/alipi/stylesheet.css")
193
194
195@app.route('/directory')
196def show_directory():
197 collection = g.db['post']
198 query = collection.group(
199 key = Code('function(doc){return {"about" : doc.about,"lang":doc.lang}}'),
200 condition={"about":{'$regex':'^[/\S/]'}},
201 initial={'na': []},
202 reduce=Code('function(doc,out){out.na.push(doc.blog)}')
203 )
204 query.reverse()
205 return render_template('directory.html', name=query, mymodule = quote_plus, myset=set, mylist= list)
206
207@app.route('/getLoc', methods=['GET'])
208def get_loc():
209
210 term = request.args['term']
211 connection = oursql.Connection(conf.DBHOST[0],conf.DBUSRNAME[0],conf.DBPASSWD[0],db=conf.DBNAME[0])
212 cursor = connection.cursor(oursql.DictCursor)
213 cursor.execute('select l.name, c.country_name from `location` as l, `codes` as c where l.name like ? and l.code=c.code limit ?', (term+'%', 5))
214 r = cursor.fetchall()
215 connection.close()
216 d = {}
217 d['return'] = r
218 response = jsonify(d)
219 response.headers['Access-Control-Allow-Origin'] = '*'
220 return response
221@app.route('/getLang', methods=['GET'])
222def get_lang():
223 term = request.args['term']
224 connection = oursql.Connection(conf.DBHOST[0],conf.DBUSRNAME[0],conf.DBPASSWD[0],db=conf.DBNAME[0])
225 cursor = connection.cursor(oursql.DictCursor)
226 cursor.execute('select * from `languages` as l where l.name like ? limit ?', (term+'%',5))
227 r = cursor.fetchall()
228 connection.close()
229 d = {}
230 d['return'] = r
231 response = jsonify(d)
232 response.headers['Access-Control-Allow-Origin'] = '*'
233 return response
234@app.route('/blank', methods=['GET'])
235def serve_blank():
236 return render_template('blank.html')
237
238@app.route('/info', methods=['GET'])
239def serve_info():
240 coll = g.db['post']
241 d = {}
242 cntr = 0
243 for i in coll.find({"about":unquote_plus(request.args['about']),"lang":request.args['lang']}):
244 i['_id'] = str(i['_id'])
245 d[cntr] = i
246 cntr+=1
247 response = jsonify(d)
248 response.headers['Access-Control-Allow-Origin'] = '*'
249 return response
250
251
252@app.route("/replace", methods=['GET'])
253def replace():
254 collection = g.db['post']
255 lang = request.args['lang']
256 url = request.args['url']
257 query = collection.group(
258 key = Code('function(doc){return {"xpath" : doc.xpath, "about": doc.url}}'),
259 condition={"about" : url, "lang" : lang,"elementtype":"text"},
260 initial={'narration': []},
261 reduce=Code('function(doc,out){out.narration.push(doc);}')
262 )
263
264 print query
265
266 audio_query =collection.group(
267 key = Code('function(doc){return {"xpath" : doc.xpath, "about": doc.url}}'),
268 condition={"about" : url, "lang" : lang, 'elementtype':"audio/ogg"},
269 initial={'narration': []},
270 reduce=Code('function(doc,out){out.narration.push(doc);}')
271 )
272
273 image_query =collection.group(
274 key = Code('function(doc){return {"xpath" : doc.xpath, "about": doc.url}}'),
275 condition={"about" : url, "lang" : lang, 'elementtype':"image"},
276 initial={'narration': []},
277 reduce=Code('function(doc,out){out.narration.push(doc);}')
278 )
279 try:
280 for i in audio_query:
281 query.append(i)
282 except IndexError:
283 pass
284 try:
285 for i in image_query:
286 query.append(i)
287 except IndexError:
288 pass
289
290 for i in query:
291 for y in i['narration']:
292 del(y['_id'])
293 d = {}
294 d['r'] = query
295 response = jsonify(d)
296 response.headers['Access-Control-Allow-Origin'] = '*'
297 return response
298
299@app.route('/feeds', methods=['GET'])
300def serve_feed_temp():
301 return render_template("feeds.html")
302
303@app.route('/feed', methods=['GET'])
304def serve_feed():
305 coll = g.db['post']
306 d = {}
307 cntr = 0
308 for i in coll.find().sort('_id',direction=-1):
309 if i['data'] != '<br/>':
310 i['_id'] = str(i['_id'])
311 d[cntr] = i
312 cntr+=1
313 response = jsonify(d)
314 response.headers['Access-Control-Allow-Origin'] = '*'
315 return response
316
317@app.route('/about', methods=['GET'])
318def serve_authors():
319 coll = g.db['post']
320 d = {}
321 cntr = 0
322 for i in coll.find({"about":unquote_plus(request.args['about'])}):
323 i['_id'] = str(i['_id'])
324 d[cntr] = i
325 cntr+=1
326 response = jsonify(d)
327 response.headers['Access-Control-Allow-Origin'] = '*'
328 return response
329#Retrieve all information about a specific $about and a given $author.
330@app.route('/author', methods=['GET'])
331def serve_author():
332 coll = g.db['post']
333 d = {}
334 cntr = 0
335 for i in coll.find({"about":unquote_plus(request.args['about']),"author":unquote_plus(request.args['author'])}):
336 i['_id'] = str(i['_id'])
337 d[cntr] = i
338 cntr += 1
339 response = jsonify(d)
340 response.headers['Access-Control-Allow-Origin'] = '*'
341 return response
342
343@app.route('/getAllLang', methods=['GET'])
344def get_lang():
345 term = request.args['term']
346 connection = oursql.Connection(conf.DBHOST[0],conf.DBUSRNAME[0],conf.DBPASSWD[0],db=conf.DBNAME[0])
347 cursor = connection.cursor(oursql.DictCursor)
348 cursor.execute('select * from `languages` as l where l.name like ?', (term+'%',))
349 r = cursor.fetchall()
350 connection.close()
351 d = {}
352 d['return'] = r
353 response = jsonify(d)
354 response.headers['Access-Control-Allow-Origin'] = '*'
355 return response
356
357
358@app.route("/askSWeeT",methods=['POST'])
359def askSweet():
360 data = json.loads(request.form['data'])
361 for i in data:
362 response = requests.api.get(conf.SWEETURL[0]+"/query/"+i['id'])
363 collection = g.db['post']
364 rep = response.json()
365 rep['bxpath'] = ''
366 if response.status_code == 200:
367 collection.insert(rep)
368 reply = make_response()
369 return reply
370
371@app.route("/menu",methods=['GET'])
372def menuForDialog():
373 if request.args.has_key('option') == False:
374 collection = g.db['post']
375 c = {}
376 cntr = 0
377 for i in collection.find({"about":request.args['url']}).distinct('lang'):
378 for j in collection.find({"about":request.args['url'],'lang':i}).distinct('type'):
379 d = {}
380 d['lang'] = i
381 d['type'] = j
382 c[cntr] = d
383 cntr += 1
384 return jsonify(c)
385 else:
386 collection = g.db['post']
387 #get the ren languages for the received url
388 langForUrl = collection.group(
389 key = Code('function(doc){return {"about" : doc.about}}'),
390 condition={"about" : d['url'],"blog":{'$regex':'/'+d['option']+'.*/'}},
391 initial={'lang': []},
392 reduce=Code('function(doc, out){if (out.lang.indexOf(doc.lang) == -1) out.lang.push(doc.lang)}') #here xpath for test
393 )
394
395 #send the response
396 if (langForUrl):
397 connection.disconnect()
398 return json.dumps(langForUrl[0]['lang'])
399 else:
400 connection.disconnect()
401 return "empty"
402
403
404@app.route('/info', methods=['GET'])
405def serve_info():
406 coll = g.db['post']
407 d = {}
408 cntr = 0
409 for i in coll.find({"about":unquote_plus(request.args['about']),"lang":request.args['lang']}):
410 i['_id'] = str(i['_id'])
411 d[cntr] = i
412 cntr+=1
413 response = jsonify(d)
414 response.headers['Access-Control-Allow-Origin'] = '*'
415 return response
416
417
418import logging,os
419from logging import FileHandler
420
421fil = FileHandler(os.path.join(os.path.dirname(__file__),'logme'),mode='a')
422fil.setLevel(logging.ERROR)
423app.logger.addHandler(fil)
424
425if __name__ == '__main__':
426 app.run(debug=True, host='0.0.0.0')
  
1<!doctype>
2<head>
3 <style type="text/css" rel="stylesheet">
4 #inputurl {
5 width:85%;
6 height:35px;
7 background-color:#efd;
8 }
9 button {
10 width:12%;
11 background-color:#4d9;
12 height:36px;
13 font-size:20px;
14 font-style:italic;
15}
16</style>
17 <title> Alipi </title>
18 <script type="text/javascript">
19 function wget()
20 {
21 foruri = document.getElementById("inputurl").value;
22 if(foruri.substring(0,7) == "http://") {
23 if(window.location.href == "http://dev.a11y.in/server/")
24 {
25 window.open("http://dev.a11y.in/web?foruri=" + encodeURIComponent(foruri));
26 }
27 else
28 {
29 window.open("http://127.0.0.1:5000/?foruri=" + encodeURIComponent(foruri));
30 }
31 }
32 else if (foruri.substring(0,8) == "https://") {
33 window.open("http://127.0.0.1:5000/?foruri=" + encodeURIComponent(foruri));
34 }
35 else {
36 alert("Please enter 'HTTP' protocoled URL");
37 }
38 }
39</script>
40
41</head>
42<body>
43 <fieldset>
44 <legend> Enter a URL </legend>
45 <input id="inputurl" placeholder="http://a11y.in/" />
46 <button type="submit" onClick="wget()"> Get</button>
47 </fieldset>
48</body>
49</html>
  
1import sys
2import os.path
3sys.path.insert(0, os.path.dirname(__file__))
4from alipi import app as application
  
1/* Copyright (c) 2007 Google Inc.
2 *
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 * http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16/**
17 * @fileoverview Sample code for Blogger's JavaScript client library.
18 * Provides an embeded blog post editor which grabs the title and location
19 * of the current page for promotion on a user's blog.
20 * @author api.jscudder@gmail.com (Jeffrey Scudder)
21 */
22
23// Load the Google data Blogger JavaScript library.
24google.load('gdata', '2.x', {packages: ['blogger']});
25google.setOnLoadCallback(addEditorToPage);
26
27// Global object to hold constants and "global" variables.
28var blogThis = {
29 // URL constants.
30 BLOG_LIST_URL: 'https://www.blogger.com/feeds/default/blogs',
31 AUTH_URL: 'https://www.blogger.com/feeds',
32 // Document element ID constants.
33 SAMPLE_CONTAINER: 'blog_this',
34 POST_BODY_INPUT: 'blog_post_body',
35 EDITOR_DIV: 'blog_this_div',
36 LOGIN_BUTTON: 'login_button',
37 BLOG_SELECTOR: 'available_blogs',
38 TITLE_INPUT: 'blog_post_title',
39 TAGS_INPUT: 'blog_post_tags',
40 RESULT_DIV: 'status_display'
41};
42
43/**
44 * Simple error handler which displays the error in an alert box.
45 * @param {Object} e An error passed in from the google.gdata.service
46 * object when the HTTP call failed.
47 */
48function handleError(e) {
49 var statusDiv = document.getElementById(blogThis.RESULT_DIV);
50 statusDiv.appendChild(document.createTextNode('Error: ' +
51 (e.cause ? e.cause.statusText : e.message)));
52 statusDiv.appendChild(document.createElement('br'));
53};
54
55/**
56 * Performs HTML escapes on special characters like double quotes,
57 * less-than, greater-than, and the ampersand. This function is used
58 * on the page title to ensure that special characters do not lead to
59 * invalid HTML when it is included in the atom:content.
60 * I recommend using something like this on any text that you want
61 * to be treated as plaintext within HTML content.
62 * @param {String} inputString The string which will be scrubbed.
63 * @return {String} The input string with special characters replaced
64 * by their HTML-safe equivalents.
65 */
66function htmlEscape(inputString) {
67 return inputString.replace(/&/g, '&amp;').replace(/"/g, '&quot;'
68 ).replace(/</g, '&lt;').replace(/>/g, '&gt;');
69};
70
71/**
72 * Adds the HTML for the login and blog post editor to the sample
73 * container div. It also populates the contents of the blog post edit form
74 * with a link to the current page. The current page's title is used as the
75 * anchor text.
76 */
77function addEditorToPage() {
78 var sampleContainerDiv = document.getElementById(blogThis.SAMPLE_CONTAINER);
79 sampleContainerDiv.innerHTML = [
80 '<div id="login_button">',
81 ' <input type="button" value="Login" onclick="login();"></input>',
82 '</div>',
83 '<div id="blog_this_div" style="display: none;">',
84 ' Choose blog: <select id="available_blogs">',
85 ' <option value="">Loading...</option>',
86 ' </select><br/>',
87 ' Title:<br/>',
88 ' <input type="text" id="blog_post_title" size="80"></input><br/>',
89 ' Post Body:<br/>',
90 ' <div id="blog_post_body"></div><br/>',
91 ' Labels (comma separated):<br/>',
92 ' <input type="text" id="blog_post_tags" size="80"></input><br/>',
93 ' <input type="button" value="Publish Post" ',
94 ' onclick="insertBlogEntry();"></input>',
95 ' <input type="button" value="Logout" onclick="logout();"></input><br/>',
96 '</div>',
97 '<div id="status_display"></div>'].join('');
98
99 // Create the Blogger client object which talks to the blogger servers.
100 blogThis.service = new google.gdata.blogger.BloggerService(
101 'GoogleInc-blogThisEmbeddedEditor-1')
102 // Get the title and address of the current page.
103 var currentPageUrl = window.location.href;
104 var pageTitle = document.title;
105 // Set the contents of the body input field.
106 var blogPostBody = document.getElementById(blogThis.POST_BODY_INPUT);
107 // blogPostBody.value = ['<a href="', currentPageUrl, '">',htmlEscape(pageTitle), '</a>'].join('');
108 y = localStorage.myContent.split('###');
109 abc = [];
110 for(var i=0;i<y.length;i++)
111 {
112 x=[];
113 for(var j=0;j<y[i].split('&').length;j++)
114 {
115 x[y[i].split('&')[j].split('=')[0]] = y[i].split('&')[j].split('=')[1];
116 }
117 abc.push(x);
118 }
119 postData = '';
120 for (var i = 0;i<abc.length;i++)
121 {
122 if(abc[i].elementtype == 'audio/ogg')
123 {
124 var aud = sprintf('<audio controls="controls" src="%s" about="%s" xpath="%s" alipius="lang:%s,elementtype:%s,location:%s,author:%s,style:%s"></audio>',decodeURIComponent(abc[i].data),decodeURIComponent(abc[i].about),decodeURIComponent(abc[i].xpath),decodeURIComponent(abc[i].lang),decodeURIComponent(abc[i].elementtype),decodeURIComponent(abc[i].location),decodeURIComponent(abc[i].author),decodeURIComponent(abc[i].style));
125 postData = postData + aud + '<br/>';
126 }
127 else if(abc[i].elementtype.match('image'))
128 {
129 var width = decodeURIComponent(abc[i].data).split(',')[0].split('x')[0];
130 var height = decodeURIComponent(abc[i].data).split(',')[0].split('x')[1];
131 var img = sprintf('<img src="%s" about="%s" xpath="%s" alipius="lang:%s,elementtype:%s,location:%s,author:%s,style:%s" height=%s width=%s></img>',decodeURIComponent(abc[i].data).split(',')[1],decodeURIComponent(abc[i].about),decodeURIComponent(abc[i].xpath),decodeURIComponent(abc[i].lang),decodeURIComponent(abc[i].elementtype),decodeURIComponent(abc[i].location),decodeURIComponent(abc[i].author),decodeURIComponent(abc[i].style),height, width);
132 postData =postData + img + '<br/>';
133 }
134 else
135 {
136 var p = sprintf('<p about="%s" xpath="%s" alipius="lang:%s,elementtype:%s,location:%s,author:%s,style:%s">%s</p>',decodeURIComponent(abc[i].about),decodeURIComponent(abc[i].xpath),decodeURIComponent(abc[i].lang),decodeURIComponent(abc[i].elementtype),decodeURIComponent(abc[i].location),decodeURIComponent(abc[i].author),decodeURIComponent(abc[i].style),decodeURIComponent(abc[i].data));
137 postData = postData + p + '<br/>';
138 }
139 }
140 blogPostBody.innerHTML = postData;
141 determineEditorVisibility();
142};
143
144/**
145 * Populates the contents of the blog post edit form with a link to the
146 * current page. The current page's title is used as the anchor text.
147 */
148function initializeBlogPostInput() {
149 // Create the Blogger client object which talks to the blogger servers.
150 blogThis.service = new google.gdata.blogger.BloggerService(
151 'GoogleInc-blogThisEmbeddedEditor-1')
152 // Get the title and address of the current page.
153 var currentPageUrl = window.location.href;
154 var pageTitle = document.title;
155 // Set the contents of the body input field.
156 var blogPostBody = document.getElementById(blogThis.POST_BODY_INPUT);
157 blogPostBody.value = ['<a href="', currentPageUrl, '">',
158 htmlEscape(pageTitle), '</a>'].join('');
159 determineEditorVisibility();
160};
161
162/**
163 * Makes the blog post editor div visible if the user is authenticated. If
164 * the user is not authenticated with Blogger, the editor div is hidden
165 * and the login button is made visible.
166 */
167function determineEditorVisibility() {
168 var blogThisDiv = document.getElementById(blogThis.EDITOR_DIV);
169 var loginButton = document.getElementById(blogThis.LOGIN_BUTTON);
170 if (google.accounts.user.checkLogin(blogThis.AUTH_URL)) {
171 // If the user is logged in, show the blow editor.
172 blogThisDiv.style.display = 'inline';
173 loginButton.style.display = 'none';
174 // Request the feed to populate the editor's blog selection menu.
175 blogThis.service.getBlogFeed(blogThis.BLOG_LIST_URL, receiveBlogList,
176 handleError);
177 } else {
178 // The user cannot get a list of blogs, so display the login button.
179 blogThisDiv.style.display = 'none';
180 loginButton.style.display = 'inline';
181 }
182};
183
184/**
185 * Requests an AuthSub token for interaction with the Calendar service.
186 */
187function login() {
188 var token = google.accounts.user.login(blogThis.AUTH_URL);
189 determineEditorVisibility();
190};
191
192/**
193 * Creates options in the blog editor's drop down blog selector box.
194 * This method receives the results of a query for a list of the current
195 * viewer's blogs.
196 * @param {Object} blogList An object containing a
197 * google.gdata.blogger.BlogFeed.
198 */
199function receiveBlogList(blogList) {
200 // Clear any existing options from the blog selector.
201 var selector = document.getElementById(blogThis.BLOG_SELECTOR);
202 selector.innerHTML = '';
203 // Find the titles and post links for each blog and populate the
204 // blog select options.
205 var numBlogs = blogList.feed.getEntries().length;
206 var newOption;
207 for (var i = 0, entry; entry = blogList.feed.getEntries()[i]; ++i) {
208 newOption = document.createElement('option');
209 newOption.value = entry.getEntryPostLink().href;
210 newOption.appendChild(document.createTextNode(
211 entry.getTitle().getText()));
212 // Add this as an option to the blog selector.
213 selector.appendChild(newOption);
214 }
215};
216
217/**
218 * Revokes the authentication token for this application.
219 * The editor div is then hidden and the login button is displayed.
220 */
221function logout() {
222 google.accounts.user.logout();
223 // Hide the editor div and make the login button visible.
224 var blogThisDiv = document.getElementById(blogThis.EDITOR_DIV);
225 var loginButton = document.getElementById(blogThis.LOGIN_BUTTON);
226 blogThisDiv.style.display = 'none';
227 loginButton.style.display = 'inline';
228};
229
230/**
231 * Reads the contents of the blog post editor and sends it to the Blogger
232 * servers as a new blog post.
233 */
234function insertBlogEntry() {
235 // Find the target blog and the post URL.
236 var blogSelector = document.getElementById(blogThis.BLOG_SELECTOR);
237 var targetUrl = blogSelector.options[blogSelector.selectedIndex].value;
238 // Create event.
239 var blogPost = new google.gdata.blogger.PostEntry();
240 // Add title - from the input field.
241 var title = document.getElementById(blogThis.TITLE_INPUT).value;
242 blogPost.setTitle(google.gdata.atom.Text.create(title));
243 // Get the body from the input field.
244 var body = document.getElementById(blogThis.POST_BODY_INPUT).innerHTML;
245 // Set the content to be the body of the input form and tell the server
246 // to interpret it as html.
247 blogPost.setContent(google.gdata.atom.Text.create(body, 'html'));
248 // Read the tags from the input form and add them as categories to
249 // the blog post entry.
250 var tags = document.getElementById(blogThis.TAGS_INPUT).value;
251 var tagList = tags.split(',');
252 for (var i = 0, tag; tag = tagList[i]; ++i) {
253 blogPost.addCategory(new google.gdata.atom.Category(
254 {'scheme':'http://www.blogger.com/atom/ns#',
255 // Remove leading and trailing whitespace from the tag text.
256 // If the tag begins or ends with whitespace, the Blogger server
257 // will remove the whitespace but send back 2 category elements,
258 // one with the original term, and another with the stripped term.
259 'term':tag.replace(/^\s+/g, '').replace(/\s+$/g, '')}));
260 }
261 blogThis.service.insertEntry(targetUrl, blogPost, handlePostSuccess,
262 handleError);
263};
264
265/**
266 * Displays the contents of the new blog post after the Blogger server
267 * responds to the POST request.
268 * @param {Object} newBlogPost An object containing the
269 * google.gdata.blogger.BlogPostEntry sent back from the server.
270 */
271function handlePostSuccess(newBlogPost) {
272 // Get the div which displays the posted blog entries.
273 var resultDiv = document.getElementById(blogThis.RESULT_DIV);
274 resultDiv.appendChild(
275 document.createTextNode('Your post about this page:'));
276 resultDiv.appendChild(document.createElement('br'));
277
278 // Create a link to the blog post with the post's title as the anchor
279 // text.
280 var titleElement = document.createElement('a');
281 titleElement['href'] = newBlogPost.entry.getHtmlLink().href;
282 titleElement.appendChild(
283 document.createTextNode(newBlogPost.entry.getTitle().getText()));
284
285 var bodyElement = document.createElement('<div>');
286 // Displays the source HTML of the post's body. To display the actual
287 // HTML (render it instead of displaying the source text) you could
288 // set the innerHTML of the body element instead of creating a text
289 // node.
290 bodyElement.innerHTML = newBlogPost.entry.getContent().getText();
291
292 // Display the tags for this entry in a paragraph below the body.
293 var tagsElement = document.createElement('p');
294 var myTagsList = [];
295 var categories = newBlogPost.entry.getCategories();
296 for (var i = 0, category; category = newBlogPost.entry.getCategories()[i]; ++i) {
297 myTagsList.push(category.term);
298 }
299 tagsElement.appendChild(document.createTextNode(myTagsList.join(', ')));
300
301 resultDiv.appendChild(titleElement);
302 resultDiv.appendChild(bodyElement);
303 resultDiv.appendChild(tagsElement);
304
305 var xhr = new XMLHttpRequest();
306 xhr.open('POST','http://dev.a11y.in/scrape',true)
307 xhr.send('url='+newBlogPost.entry.getHtmlLink().href);
308};
  
1#This is a samply config file. Create a file named conf.py,in this directory, and decalre the following variables there.
2#DO NOT EDIT THIS FILE. This file is not read for config changes
3APPURL = ('http://foo/bar',) # The path which points to "alipi" directory.
4JQUERYURL = ('http://foo.jquery',) #URL for jquery.
5PASSWD = ('password',)
6BLOGURL = ('http://something.blogspot.com',)
7EMAIL = ('johnDoe@gmail.com',)
8DEPLOYURL = ('http://127.0.0.1:5000/',)
  
1//A sample configuration file for JS variables. Copy this file to "config.js"
2var config = {
3 'hostname': "127.0.0.1",
4 'deploy': "http://127.0.0.1:5000",
5 'root': "http://localhost"
6}
  
1@media screen and (min-width:1000px) {
2
3#renarrated_overlay { position:fixed; left:0.5%; width:99%; text-align:center; font-weight:normal; z-index:2147483645; display:block; }
4
5#edit-current { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
6#see-narration { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
7#see-links { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
8#blog-filter { right:-3px; min-width:225px; max-width:225px; font-size:17px; font-weight:400; font-style:italic;
9 -moz-border-radius-bottomright:0px; -webkit-border-bottom-right-radius:0px; border-bottom-right-radius:0px;
10 -moz-border-radius-topright:0px; -webkit-border-top-right-radius:0px; border-top-right-radius:0px; -moz-margin-start:7px;
11 text-align:center; display:none; }
12@-moz-document domain(127.0.0.1), domain(dev.a11y.in), domain(y.a11y.in) {
13 #go { top:11px !important; }
14}
15#go { top:6px; height:25px; text-align:justify; display:none;
16 -moz-border-radius-bottomleft:0px; -webkit-border-bottom-left-radius:0px; border-bottom-left-radius:0px;
17 -moz-border-radius-topleft:0px; -webkit-border-top-left-radius:0px; -khtml-border-top-left-radius:0px; border-top-left-radius:0px; }
18
19#share { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
20#orig-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
21#info { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
22
23#outter-down-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
24#outter-up-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
25
26#pub_overlay { position:fixed; left:10%; width:80%; text-align:center; z-index:2147483645; display:none; }
27#pub_overlay .ui-button { margin-left:10px; }
28
29#icon-down { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
30#icon-up { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
31#exit-mode { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
32#help-window { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
33#undo-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
34#publish-button { font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
35
36#element_edit_overlay { position:fixed; text-align:center; z-index:2147483645; display:none; }
37
38#edit-text { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
39#add-audio { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
40#replace-image { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
41#delete-image { font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
42#close-element { position:absolute; top:-5px; left:-2px; width:10px; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
43#cant-edit { width: 450px; margin:15px; font-size:17px; font-weight:400; font-style:italic; text-align:justify; display:none; }
44
45#editoroverlay { min-width:90%; text-align:justify; display: none; }
46#editoroverlay a { color:#1C94C4; }
47
48#adv-reference { position: absolute; top:15%; left:2%; min-width:48%; max-width:48%; border:solid 3px; padding:10px; font-size:16px;
49 font-weight:400; font-style:normal; color:#aaa; overflow:show; background:none; text-align:justify; display:none; }
50
51#reference { position: absolute; top: 15%; left:2%; min-width:46%; max-width:46%; min-height:10%; border:solid 3px; padding:10px; font-size:17px;
52 font-weight:400; font-style:normal; text-align:justify; color:#aaa; overflow:show; background:none; text-align:justify; }
53
54#editor { position:absolute; top:15%; left:52%; min-width:45%; max-width:45%; min-height:10%; border:3px solid #aaa; padding:10px; font-size:17px;
55 font-weight:400; font-style:normal; text-align:justify; color:#000; background-color:#ffe; text-align:justify; }
56
57#ref-lab { position:absolute; top:5%; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
58#edit-lab { position:absolute; top:5%; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
59
60#close-adv { position:absolute; top:7%; right:51%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
61#adv-ref { position:absolute; top:7%; right:51%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
62
63#mag-demag { position:absolute; bottom:5%; left:10%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
64#mag { position:absolute; left:3%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
65#demag { position:absolute; left:30%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
66#add-link { position:absolute; left:54%; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
67
68#save-changes { position:relative; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
69
70.highlightElement { box-shadow: 0 0 20px #000; }
71.highlightOnSelect { box-shadow: 0 0 50px #000; }
72
73.barOnBottom { bottom:0px; }
74.barOnTop { top:0px; }
75
76#tar-lab1 { position:absolute; top:5%; left:110px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
77#tar-lab2 { position:absolute; top:20%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
78#tar-lab3 { position:absolute; top:35%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
79#tar-lab4 { position:absolute; top:50%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
80#tar-lab5 { position:absolute; top:65%; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
81#tar-lab6 { position:relative; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
82#tar-lab7 { position:relative; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
83#tar-p { position:absolute; top:90%; left:210px; font-size:17px; font-weight:400; font-style:italic; text-align:justify; }
84#blogset { position:absolute; top:80%; right:100px; left:125px; font-size:17px; font-weight:400; font-style:italic; color:#aaa; text-align:justify; }
85
86
87#loc-select { position:absolute; top:25%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
88#loc-img { position:absolute; top:25.5%; left:440px; height:20px; width:25px; font-size:17px; font-weight:400; font-style:italic;
89 color:#000; text-align:justify; display:none; }
90#lang-select { position:absolute; top:40%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
91#lang-img { position:absolute; top:41%; left:440px; height:18px; width:25px; font-size:17px; font-weight:400; font-style:italic;
92 color:#000; text-align:justify; display:none; }
93#style-select { position:absolute; top:55%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
94#auth-select { position:absolute; top:70%; left:210px; width:256px; font-size:17px; font-weight:400; font-style:italic; color:#000; text-align:justify; }
95
96#our-check { position:relative; }
97#your-check { position:relative; margin-left:25px; }
98
99}
100/****************************************************************************************************************************/
101
102@media screen and (max-width:1000px) {
103
104#renarrated_overlay { position:fixed; clear:both; width:99%; left:0.5%; text-align:center; z-index:2147483645; font-size:80%; display:block; }
105/* #renarrated_overlay .ui-button { padding:0.1em 0.8em 0.2em 0.8em; } */
106
107#edit-current { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
108#see-narration { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
109#see-links { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
110#blog-filter { right:-3px; min-width:150px; max-width:150px; font-weight:200; font-style:italic; text-align:justify; display:none;
111 -moz-border-radius-bottomright:0px; -webkit-border-bottom-right-radius:0px; border-bottom-right-radius:0px;
112 -moz-border-radius-topright:0px; -webkit-border-top-right-radius:0px; border-top-right-radius:0px; }
113#go { top:5px; height:18px; -moz-border-radius-bottomleft:0px; -webkit-border-bottom-left-radius:0px; -khtml-border-bottom-left-radius:0px;
114 border-bottom-left-radius:0px; -moz-border-radius-topleft:0px; -webkit-border-top-left-radius:0px; -khtml-border-top-left-radius:0px;
115 border-top-left-radius:0px; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
116@-moz-document domain(127.0.0.1), domain(dev.a11y.in), domain(y.a11y.in) {
117 #go { height:23px !important; top:4px !important; }
118}
119#share { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
120#orig-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
121#info { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
122
123#outter-down-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
124#outter-up-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
125
126
127#pub_overlay { position:fixed; left:3%; width:96%; text-align:center; z-index:2147483645; font-size:14px; font-weight:200; font-style:italic;
128 display:none; }
129#pub_overlay .ui-button { margin-left:10px; }
130#icon-down { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
131#icon-up { font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
132#exit-mode { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
133#help-window { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
134#undo-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
135#publish-button { font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
136
137#element_edit_overlay { position:fixed; text-align:center; z-index:2147483645; font-size:14px; font-weight:200; font-style:italic;
138 text-align:justify; display:none; }
139#element_edit_overlay .ui-button { text-align:justify; font-size:14px; font-weight:200; font-style:italic; }
140
141#edit-text { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
142#add-audio { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
143#replace-image { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
144#delete-image { text-align:justify; font-size:14px; font-weight:200; font-style:italic; text-align:justify; display:none; }
145#close-element { position:absolute; top:-5px; left:-2px; width:10px; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
146#cant-edit { width: 450px; margin:15px; display:none; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
147
148#editoroverlay { min-width:90%; display: none; }
149#editoroverlay a { color:#1C94C4; }
150
151#adv-reference { position: absolute; top: 24%; left:2%; min-width:48%; max-width:48%; border:solid 2px; padding:10px; font-size:13px;
152 text-align:justify; color:#aaa; font-weight:normal; overflow:show; background:none; display:none; }
153#reference { position: absolute; top: 24%; left:2%; min-width:46%; max-width:46%; min-height:10%; border:solid 2px; padding:10px; font-size:14px;
154 text-align:justify; color:#aaa; font-weight:normal; overflow:show; background:none; }
155
156#editor { position:absolute; top:15%; left:52%; min-width:45%; max-width:45%; min-height:10%; border:2px solid; padding:10px; color:#000;
157 background-color:#ffe; font-size:14px; font-weight:200; font-style:normal; text-align:justify; }
158
159#ref-lab { position:absolute; top:5%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; color:#aaa; }
160#edit-lab { position:absolute; top:5%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; color:#aaa; }
161
162#close-adv { position:absolute; top:10%; right:50%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
163#adv-ref { position:absolute; top:10%; right:50%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
164
165#mag-demag { position:absolute; bottom:8%; left:10%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
166#mag { position:absolute; left:3%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
167#demag { position:absolute; left:30%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
168#add-link { position:absolute; left:54%; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
169
170#save-changes { position:relative; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
171
172.highlightElement { box-shadow: 0 0 20px #000; }
173.highlightOnSelect { box-shadow: 0 0 50px #000; }
174
175.barOnBottom { bottom:0px; }
176.barOnTop { top:0px; }
177
178#tar-lab1 { position:absolute; top:5%; left:110px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
179#tar-lab2 { position:absolute; top:20%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
180#tar-lab3 { position:absolute; top:35%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
181#tar-lab4 { position:absolute; top:50%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
182#tar-lab5 { position:absolute; top:65%; left:125px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
183#tar-lab6 { position:relative; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
184#tar-lab7 { position:relative; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
185#tar-p { position:absolute; top:90%; left:210px; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
186#blogset { position:absolute; top:80%; left:125px; right:80px; color:#aaa; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
187
188#loc-select { position:absolute; top:25%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
189#loc-img { position:absolute; top:25.5%; left:440px; height:20px; width:25px; color:#000; font-size:14px; font-weight:200; font-style:italic;
190 text-align:justify; display:none; }
191#lang-select { position:absolute; top:40%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
192#lang-img { position:absolute; top:41%; left:440px; height:18px; width:25px; color:#000; font-size:14px; font-weight:200; font-style:italic;
193 text-align:justify; display:none; }
194#style-select { position:absolute; top:55%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
195#auth-select { position:absolute; top:70%; left:210px; width:256px; color:#000; font-size:14px; font-weight:200; font-style:italic; text-align:justify; }
196
197#our-check { position:relative; }
198#your-check { position:relative; margin-left:25px;}
199
200}
201/**************************************************************
202************************************************************************************************************/
203
204#infovis { position:absolute; top:3%; left:0%; width:60%; height:95%; overflow:hidden; }
205#infovis-canvaswidget { height:95% }
206#infovis-canvas { height:95% }
207
208#infonar { position:relative; top:2%; left:0; width:35%; height:90%; overflow:show; }
209#narrations-div { position:fixed; top:5%; bottom:2%; right:0.1%; width:30%; height:93%; overflow:show; background-color: rgba(0,0,0,0.5);
210 z-index:999999999; }
211/*TOOLTIPS*/
212.tip { color: #fff; width: 140px; background-color: rgba(0,0,0,1); border:1px solid #ccc; -moz-box-shadow:#555 2px 2px 8px;
213 -webkit-box-shadow:#555 2px 2px 8px; -o-box-shadow:#555 2px 2px 8px; box-shadow:#555 2px 2px 8px; opacity:1; font-size:12px;
214 font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; padding:7px; }
  
1<!doctype html>
2<html>
3 <head>
4 <style>
5 span
6 {color:#0000FF;
7 font-weight:bold;
8 line-height:1.5em;
9 }
10 </style>
11 <body>
12 <!-- <button id="prev" style="left:5%;">Previous</button> -->
13 <!-- <button id="next" style="right:5%;">Next</button> -->
14 <div id="delay" style="top:10%; text-align:center;font-size:25px; font-weight:bold; display:block;">Collecting data, Please have patience</div>
15 <div id="info_content"></div>
16 </body>
17 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
18 <!-- <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script> -->
19 <script type="text/javascript">
20 var responseJSON = [];
21 var infoFullJSON = [];
22 function onLoad()
23 {
24 $('#delay').delay(2000).hide();
25
26 var JSON1 = [];
27 $.each(infoFullJSON, function(i, val) { JSON1.push(val) })
28 var html;
29 for(var j = 0; j < JSON1.length; j++)
30 {
31 html = $('#info_content').html() + '<pre><span>&lt;alipi&gt;</span>'+
32 '<span>\n\t&lt;language&gt;</span>'+JSON1[j]['lang']+'<span>&lt;/language&gt;</span>'+
33 '<span>\n\t&lt;location&gt;</span>'+JSON1[j]['location']+'<span>&lt;/location&gt;</span>'+
34 '<span>\n\t&lt;author&gt;</span>'+JSON1[j]['author']+'<span>&lt;/author&gt;</span>'+
35 '<span>\n\t&lt;elementType&gt;</span>'+JSON1[j]['elementtype']+'<span>&lt;/elementType&gt;</span>'+
36 '<span>\n\t&lt;blog&gt;</span>'+JSON1[j]['blog']+'<span>&lt;/blog&gt;</span>'+
37 '<span>\n\t&lt;blogxpath&gt;</span>'+JSON1[j]['bxpath']+'<span>&lt;/blogxpath&gt;</span>'+
38 '<span>\n\t&lt;xpath&gt;</span>'+JSON1[j]['xpath']+'<span>&lt;/xpath&gt;</span>'+
39 '<span>\n\t&lt;data&gt;</span>'+JSON1[j]['data']+'<span>&lt;/data&gt;<span>'+
40 '<span>\n&lt;/alipi&gt;<span></pre>';
41 $('#info_content').html(html);
42 }
43 <!-- $('#info_content').children().hide(); -->
44 <!-- $($('#info_content').children()[0]).show(); -->
45 }
46
47 <!-- $(window).click(function() { -->
48 <!-- $('#info_content').cycle({ -->
49 <!-- fx: 'fadeZoom', -->
50 <!-- timeout: 0, -->
51 <!-- next: '#next', -->
52 <!-- prev: '#prev', -->
53 <!-- slideExpr: 'pre' -->
54 <!-- }); -->
55 <!-- }); -->
56
57 <!-- $(window).ready('http://127.0.0.1:5000/blank', function() { -->
58 <!-- $('#info_content').children().hide(); -->
59 <!-- $('#info_content').children()[0].show(); -->
60 <!-- }); -->
61 </script>
62</html>
  
1<!doctype html>
2<html>
3<title>Directory of Alipi</title>
4<body>
5<div>
6<p>List of links narrated</p>
7{% if name %}
8{% for i in name %}
9{% if i['about'] != 'undefined' %}
10<p><a href="{{i['about']}}">{{ i['about'] }}</a> in <a href="http://y.a11y.in/web?foruri={{ mymodule(i['about']) }}&lang={{i['lang']}}&interactive=1">{{i['lang']}}</a></p>
11<p style="padding:5px">Narrations contributed at:</p>
12{% for x in mylist(myset(i['na'])) %}
13<p><a href="{{x}}" style="padding:5px">{{x}}</a></p>
14{% endfor %}
15{% endif %}
16{% endfor %}
17{% else %}
18<p>Hello world</p>
19{% endif %}
20</div>
21</body>
22</html>
  
1<!doctype html>
2<title>Error</title>
3<body>
4<p>Please check the URL you entered, maybe you have misspelled it.</p>
5</body>
6</html>
  
1<!doctype html>
2<head>
3 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
4 <script type="text/javascript" src="http://localhost/server/config.js"></script>
5 <script type="text/javascript">
6 $.getJSON(config.deploy+"/feed", function(data)
7 {
8 d = $.makeArray(data);
9 d.reverse();
10 str = "";
11 console.log(d[0]);
12 $.each(data, function(i, val)
13 {
14 if(val['about'] != undefined && val['about'] != 'undefined' && val['author'] != 'undefined' )
15 {
16 if(val['location']!='location')
17 {
18 str += "<p>\n<b>@" +val['author']+"</b> has "+val['type']+" for <b>"+val['about']+"#"+val['xpath']+"</b> at <b>"+val['blog']+"#"+val['bxpath']+"</b> for <b>"+val['location']+"</b> in <b>"+val['lang']+"</b>\n</p>";
19 }
20 else
21 str += "<p>\n<b>@" +val['author']+"</b> has "+val['type']+" for <b>"+val['about']+"#"+val['xpath']+"</b> at <b>"+val['blog']+"#"+val['bxpath']+"</b> for <b>"+val['lang']+"</b>\n</p>";
22 }
23 });
24 $("#feeds").html(str);
25 });
26 </script>
27</head>
28<body style="text-wrap:normal">
29 @<input type="text" id="t1" name="author" value="author" /> says <input type="text" id="t2" name="about" value="about" /> <input type="text" id="t3" name="xpath" value="xpath" /> has <select id="selected" onchange="checkVal();"><option>re-narrations</option><option>5el</option></select> at <input type="text" id="t4" name="blog" value="blog" /> <input type="text" id="t5" name="bxpath" value="bxpath" /> in <input type="text" name="lang" value="language" id="t6" /> <span id="remove">targetting</span> <input type="text" name="loc" value="location" id="t7"/> <input type="submit" id="post" name="alipi" value="Feed" onclick="postForm();" /> <input type="submit" name="alipi" value="Test the feed" onclick="doDemo();" />
30<div id="feeds">
31</div>
32<script type="text/javascript">
33 function postForm()
34 {
35 var arr = {};
36 arr['author'] = $('#t1').val();
37 arr['about'] = $('#t2').val();
38 arr['xpath'] = $('#t3').val();
39 arr['blog'] = $('#t4').val();
40 arr['bxpath'] = $('#t5').val();
41 arr['type'] = $("#selected").val();
42 arr['lang'] = $('#t6').val();
43 arr['location'] = $('#t7').val();
44 $.post(config.deploy+"/feeds/write", arr, function(data)
45 {
46 alert("Posted");
47 });
48}
49function checkVal(){
50 if($("#selected").val() == "5el")
51 {
52 $("#t7, #remove").hide();
53 $("#t6").val("tags");
54 }
55 else
56 {
57 $("#t7, #remove").show();
58 $("#t6").val("language");
59 }
60 }
61function doDemo()
62{
63 window.open(config.deploy+"/demo?foruri="+encodeURIComponent($('#t2').val())+"&xpath="+encodeURIComponent($('#t3').val())+"&blog="+encodeURIComponent($('#t4').val())+"&bxpath="+encodeURIComponent($('#t5').val()));
64}
65</script>
66</body>
67</html>
server/ui.js
(0 / 1023)
  
1//-*-coding: utf-8 -*-
2var a11ypi = {
3 auth : " ",
4 loc:" ",
5 elementTagName: " ",
6 elementId: " ",
7 flag : 0,
8 fflag : 0,
9 showbox : 0,
10 showlinks : 0,
11 blog_flag: false,
12 target : false,
13 pageHtml:'',
14 d: {},
15 responseJSON:'',
16 testContext : function()
17 {
18 if(document.getElementById('social_overlay') != null)
19 document.body.removeChild(document.getElementById('social_overlay'));
20 $(document).ready(function(){$('body *').contents().filter(function()
21 {
22 try{
23 if(this.nodeType == 3 && !($(this).hasClass('alipi')))
24 {
25 return (this.nodeType == 3) && this.nodeValue.match(/\S/);}}
26 catch(err)
27 {
28 }}).parent().attr('m4pageedittype','text')});
29
30 vimg = document.getElementsByTagName('img');
31 for(i=0; i<vimg.length; i++)
32 {
33 vimg[i].setAttribute('m4pageedittype','image');
34 }
35 },
36
37 createMenu: function(type) {
38 var xyz = '';
39 if(type === '1.0')
40 xyz = document.getElementById("show-box");
41 else
42 xyz = document.getElementById("show-comment");
43 xyz.innerHTML = '';
44 a = a11ypi.getParams();
45 for(var i in a11ypi.showbox)
46 {
47 if(a11ypi.showbox[i]['type'] == type)
48 {
49 var para = document.createElement("p");
50 var newel = document.createElement("a");
51 newel.textContent = a11ypi.showbox[i]['lang'];
52 if(type === '1.0')
53 $(newel).attr("href",config.deploy+"/?foruri="+a['foruri']+"&lang="+a11ypi.showbox[i]['lang']+"&interactive=1"+"&type="+type);
54 else
55 $(newel).attr("href",config.deploy+"/?foruri="+a['foruri']+"&tags="+a11ypi.showbox[i]['lang']+"&interactive=0"+"&type="+type);
56 para.appendChild(newel);
57 xyz.appendChild(para);
58 }
59 }
60 },
61
62 ajax: function() {
63 if(a11ypi.flag == '0')
64 {
65 a11ypi.flag = 1;
66 a = a11ypi.getParams();
67 $.getJSON(config.deploy+'/menu?', {"url":decodeURIComponent(a['foruri'])}, function(data)
68 {
69 a11ypi.showbox = data;
70 $('#see-narration').show();
71 $("#blog-filter").show(); a11ypi.blogFilter();
72 $("#go").show();
73 });
74
75 req = {"about":decodeURIComponent(a['foruri']), "lang":a['lang']};
76 $.getJSON(config.deploy+'/info?', req, function(data)
77 {
78 a11ypi.responseJSON = data;
79 });
80 }
81 },
82 ajax1: function() {
83 if(a11ypi.fflag == '0')
84 {
85 a11ypi.fflag = 1;
86 var xhr = new XMLHttpRequest();
87 xhr.onreadystatechange = function()
88 {
89 if(xhr.readyState == 4)
90 {
91 if(xhr.responseText == "empty")
92 {
93 // a11ypi.clearMenu();
94 }
95 else
96 {
97 a11ypi.createMenuFilter(JSON.parse(xhr.responseText));
98 }
99 }
100 }
101 xhr.open("POST",config.root+"/menu",true);
102 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
103 a = a11ypi.getParams();
104 data = 'url='+a['foruri']+'&option='+a['blog'];
105 xhr.send(data) ;
106 }
107
108 },
109
110 getURL: function(e) {
111 window.location = window.location.href + "&lang=" + e.value;
112 window.reload();
113 },
114 ren: function()
115 {
116 a = a11ypi.getParams();
117 var url = decodeURIComponent(a['foruri']);
118 var type;
119 if(a['type'])
120 type = a['type'];
121 else
122 type = '1.0'
123 var lang = '';
124
125 if( type != '1.0')
126 lang = a['tags'];
127 else
128 lang = a['lang'];
129
130 $.getJSON(config.deploy+"/replace?",{"url":url,"lang":lang,"type":type},function(data)
131 {
132 for(var i=0;i<data['r'].length;i++)
133 {
134 for(var x in data['r'][i]['narration'])
135 {
136 // path = data['r'][i]['narration'][x]['xpath'];
137 // newContent = data['r'][i]['narration'][x]['data'];
138 // elementType = data['r'][i]['narration'][x]['elementtype'];
139
140 a11ypi.evaluate(data['r'][i]['narration'][x]);
141 }
142 }
143 });
144 },
145 evaluate: function(a)
146 {
147 try{
148 var nodes = document.evaluate(a['xpath'], document, null, XPathResult.ANY_TYPE,null);
149
150 }
151 catch(e)
152 {
153 console.log(e);
154 }
155 if(a['type'] == '1.0')
156 {
157 try{
158 var result = nodes.iterateNext();
159 while (result)
160 {
161 if (a['elementtype'] == 'image')
162 {
163 if(a['data'] != '')
164 {
165 result.setAttribute('src',a['data'].split(',')[1]); //A hack to display images properly, the size has been saved in the database.
166 width = a['data'].split(',')[0].split('x')[0];
167 height = a['data'].split(',')[0].split('x')[1];
168 result.setAttribute('width',width);
169 result.setAttribute('height', height);
170 result.setAttribute('class','blink');
171 }
172 else
173 $(result).hide();
174 }
175 else if(a['elementtype'] == 'audio/ogg')
176 {
177 a['data'] = decodeURIComponent(a['data']);
178 audio = '<audio controls="controls" src="'+a['data']+'" style="display:table;"></audio>';
179 $(result).before(audio);
180 result.setAttribute('class','blink');
181 }
182 else{
183 result.innerHTML = a['data'];
184 result.setAttribute('class','blink');
185 }
186 result=nodes.iterateNext();
187 }
188 }
189 catch (e)
190 {
191 // dump( 'error: Document tree modified during iteration ' + e );
192 }
193 }
194 else if(a['type']=='5el')
195 {
196
197 try{
198 var result = nodes.iterateNext();
199 while (result)
200 {
201 $(result).html($(result).html()+a['data']);
202 $(result).get(0).scrollIntoView();
203 result=nodes.iterateNext();
204 }
205 }
206 catch (e)
207 {
208 //dump( 'error: Document tree modified during iteration ' + e );
209 }
210 }
211 },
212 filter: function()
213 {
214 var xhr = new XMLHttpRequest();
215 xhr.onreadystatechange = function()
216 {
217 if(xhr.readyState == 4)
218 {
219 if(xhr.responseText =='empty')
220 {
221 // a11ypi.clearMenu();
222 // alert("An internal server error occured, please try later.");
223 }
224 else
225 {
226
227 d ={};
228 var response=xhr.responseText.substring(3).split('###');
229 for (var j= 0; j< response.length ; j++){
230 chunk = response[j].substring(1).split('&');
231
232 for (var i= 0; i< chunk.length ; i++){
233 pair =chunk[i].split("::");
234 key = pair[0];
235 value = pair[1];
236 d[key] = value;
237 }
238 path = d['xpath'];
239 newContent = d['data'];
240 elementType = d['elementtype'];
241 a11ypi.evaluate(path,newContent,elementType);
242 }
243 }
244 }
245 }
246 a = a11ypi.getParams();
247 var url = a['foruri'];
248 var lang= a['lang'];
249 var blog= a['blog'];
250 var data="url="+url+"&lang="+encodeURIComponent(lang)+"&blog="+encodeURIComponent(blog);
251
252 xhr.open("POST",config.root+"/filter",true);
253 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
254 xhr.send(data);//
255 },
256 createMenuFilter: function(menu_list) {
257 var xyz = document.getElementById("show-box");
258 xyz.innerHTML = '';
259 d = window.location.search.split('?')[1];
260 a = a11ypi.getParams();
261 var page = a['foruri'];
262 var blog = a['blog'];
263 for(var i=0;i<menu_list.length;i++)
264 {
265 var para = document.createElement("p");
266 var newel = document.createElement("a");
267 newel.textContent = menu_list[i];
268 $(newel).attr("href",config.deploy+"/?foruri="+page+"&blog="+blog+"&lang="+menu_list[i]+"&interactive=1");
269 para.appendChild(newel);
270 xyz.appendChild(para);
271 }
272 },
273 clearMenuFilter: function() {
274 var xyz = document.getElementById("menu-button");
275 while(null!= xyz.firstChild)
276 {
277 xyz.removeChild(xyz.firstChild);
278 }
279 },
280 getURLFilter: function(e) {
281 a= a11ypi.getParams();
282 window.location = config.deploy+"/?foruri="+a['foruri']+"&blog="+a['blog'] + "&lang=" + e.value+"&interactive=1";
283 window.reload();
284 },
285 showOriginal: function(){
286 var url=decodeURIComponent(window.location.search.split("=")[1].split("&")[0]);
287 window.open(url);
288 },
289 tweet:function(){
290 !function(d,s,id){
291 var js,fjs=d.getElementsByTagName(s)[0];
292 if(!d.getElementById(id)){
293 js=d.createElement(s);
294 js.id=id;js.src="//platform.twitter.com/widgets.js";
295 fjs.parentNode.insertBefore(js,fjs);
296 }
297 }
298 (document,"script","twitter-wjs");
299 },
300 facebook: function() {
301 (function(d, s, id) {
302 var js, fjs = d.getElementsByTagName(s)[0];
303 if (d.getElementById(id)) return;
304 js = d.createElement(s); js.id = id;
305 js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
306 fjs.parentNode.insertBefore(js, fjs);
307 }
308 (document, 'script', 'facebook-jssdk'));
309 },
310 loadOverlay: function()
311 {
312 var overlay_template = '<div id="renarrated_overlay" class="alipi ui-widget-header ui-corner-all">'+
313 '<button id="outter-down-button" class="alipi" onclick="a11ypi.outterToggle();" up="true" title="Move this bar to top">Move</button> '+
314 '<button id="outter-up-button" class="alipi" onclick="a11ypi.outterToggle();" title="Move this bar to bottom">Move</button> '+
315 '<button id="edit-current" class="alipi" onclick="a11ypi.editPage();" title="Allow to edit this page">Re-narrate</button> '+
316 '<button id="see-narration" class="alipi" onclick="a11ypi.showBox();" title="See other renarrations, which are in same or other languages"> '+
317 'Re-narrations</button>'+
318 // '<button id="see-comment" class="alipi" onclick="a11ypi.showComment();" title="5el"> '+
319 // '5el</button>'+
320 '<button id="see-links" class="alipi" onclick="a11ypi.showBox1();" title="See other re-narrated pages of this domain">Re-narrated Pages '+
321 '</button>'+
322 '<select id="blog-filter" class="alipi" onChange="a11ypi.checkSelect();" title="Select one of the blog name"></select>'+
323 '<button id="go" class="alipi ui-icon-circle-arrow-e" onclick="a11ypi.go();" title="Filter by blog" >|Y|</button>'+
324 '<div id="show-box" title="Choose a narration"></div> '+
325 '<div id="show-comment" title="Comments for"></div> '+
326 '<div id="show-links" title="List of pages narrated in this domain" class="alipi"></div> '+
327 '<div id="share-box" class="alipi" title="Share this page in any following social network"></div>';
328
329 var pub_overlay_template = '<div id="pub_overlay" class="alipi ui-widget-header ui-corner-all">'+
330 '<button id="icon-up" class="alipi" down="true" onClick="a11ypi.hide_overlays();" title="Move this bar to top">Move</button>'+ //&#x25B2
331 '<button id="icon-down" class="alipi" onClick="a11ypi.hide_overlays();" title="Move this bar to bottom">Move</button>'+ //&#x25BC
332 '<button id="exit-mode" class="alipi" onclick="a11ypi.exitMode();" title="Do not want to save any changes, just take me out of this editing"> '+
333 'Exit</button>'+
334 '<button id="help-window" class="alipi" onclick="a11ypi.help_window();" title="How may I help you in editing this page?">Help</button>'+
335 '<button id="undo-button" class="alipi" onclick="util.undoChanges();"title="Undo previous change, one by one">Undo changes</button>'+
336 '<button id="publish-button" class="alipi" onclick="a11ypi.publish();"title="Publish your changes to blog">Publish</button></div>';
337
338 var element_edit_overlay_template = '<div id="element_edit_overlay" class="alipi ui-widget-header ui-corner-all" >'+
339 '<button id="edit-text" class="alipi" onclick="a11ypi.displayEditor();" title="Help you to edit this element by providing an editor on right'+
340 ' & reference on left.">Edit Text</button>'+
341 '<button id="add-audio" class="alipi" onclick="a11ypi.addAudio();" title="Allow you to give an audio file(.ogg) link to add your audio '+
342 'to this element ">Add Audio</button>'+
343 '<button id="replace-image" class="alipi" onclick="a11ypi.imageReplacer();" title="Allow you to give an image file(jpeg/jpg/gif/png) '+
344 'link to replace with this image">Replace Image</button>'+
345 '<button id="delete-image" class="alipi" onclick="pageEditor.deleteImage();" title="Remove this image from page">Delete Image</button>'+
346 '<button id="close-element" class="alipi" onclick="pageEditor.cleanUp();" title="Close" ></button>'+
347 '<label id="cant-edit" class="alipi">No selection / Too large selection </label> '+
348 '</div>';
349
350 $('body').append(overlay_template);
351 $('body').append(pub_overlay_template);
352 $('body').append(element_edit_overlay_template);
353
354 $('#outter-up-button').show();
355 $('#go').button({disabled : true});
356 $('#undo-button').button({ disabled: true});
357 $('#publish-button').button({ disabled: true});
358 $('input:.alipi, select:.alipi').button();
359
360 $("#outter-down-button").button({icons:{primary:"ui-icon-circle-arrow-n"},text:false}); $('#outter-down-button').children().addClass('alipi');
361 $("#outter-up-button").button({icons:{primary:"ui-icon-circle-arrow-s"},text:false}); $('#outter-up-button').children().addClass('alipi');
362 $("#edit-current").button({icons:{primary:"ui-icon-pencil"}}); $('#edit-current').children().addClass('alipi');
363 $("#see-narration").button({icons:{primary:"ui-icon-document-b"}}); $('#see-narration').children().addClass('alipi');
364 $("#see-comment").button({icons:{primary:"ui-icon-document-b"}}); $('#see-comment').children().addClass('alipi');
365 $("#see-links").button({icons:{primary:"ui-icon-link"}}); $('#see-links').children().addClass('alipi');
366 /*$("#blog-filter").button({icons:{secondary:"ui-icon-triangle-1-s"}}); */ $('#blog-filter').children().addClass('alipi');
367 $("#go").button({icons:{primary:"ui-icon-arrowthick-1-e"},text:false}); $('#go').children().addClass('alipi');
368 $("#share").button({icons:{primary:"ui-icon-signal-diag"}}); $('#share').children().addClass('alipi');
369 $("#orig-button").button({icons:{primary:"ui-icon-extlink"}}); $('#orig-button').children().addClass('alipi');
370 $("#info").button({icons:{primary:"ui-icon-info"}}); $('#info').children().addClass('alipi');
371
372 $("#icon-up").button({icons:{primary:"ui-icon-circle-arrow-n"},text:false}); $('#icon-up').children().addClass('alipi');
373 $("#icon-down").button({icons:{primary:"ui-icon-circle-arrow-s"},text:false}); $('#icon-down').children().addClass('alipi');
374 $("#exit-mode").button({icons:{primary:"ui-icon-power"}}); $('#exit-mode').children().addClass('alipi');
375 $("#help-window").button({icons:{primary:"ui-icon-help"}}); $('#help-window').children().addClass('alipi');
376 $("#undo-button").button({icons:{primary:"ui-icon-arrowreturnthick-1-w"}}); $('#undo-button').children().addClass('alipi');
377 $("#publish-button").button({icons:{primary:"ui-icon-circle-check"}}); $('#publish-button').children().addClass('alipi');
378
379 $("#edit-text").button({icons:{primary:"ui-icon-pencil"}}); $('#edit-text').children().addClass('alipi');
380 $("#add-audio").button({icons:{primary:"ui-icon-circle-plus"}}); $('#add-audio').children().addClass('alipi');
381 $("#replace-image").button({icons:{primary:"ui-icon-transferthick-e-w"}}); $('#replace-image').children().addClass('alipi');
382 $("#delete-image").button({icons:{primary:"ui-icon-trash"}}); $('#delete-image').children().addClass('alipi');
383 $("#close-element").button({icons:{primary:"ui-icon-circle-close"},text:false}); $("#close-element").children().addClass('alipi');
384
385 $('#renarrated_overlay').addClass('barOnTop');
386 a11ypi.ajax();
387 a11ypi.ajaxLinks1();
388 $('#edit-current').show();
389
390 d = window.location.search.split('?')[1];
391 var a =[];
392 for (var i = 0;i<d.split('&').length;i++){
393 a[d.split('&')[i].split('=')[0]] = d.split('&')[i].split('=')[1];
394 }
395 if(a['blog'] != undefined ) {
396 $('#go').hide();
397 $('#blog-filter').hide();
398 } else {
399 }
400
401 if($('#orig-button').text() == 'Original Page') {
402 $('#share').insertAfter($('#go')); $('#share').show();
403 $('#info').insertAfter($('#go')); $('#info').show();
404 $('#orig-button').insertAfter($('#go')); $('#orig-button').show();
405 $('#share-box').append($('#fb-like')); $('#share-box').append($('#tweet-root'));
406 }
407 },
408 checkSelect: function()
409 {
410 if($('#blog-filter').val() != "Choose a blog") {
411 $('#go').button({disabled : false});
412 } else {
413 $('#go').button({disabled : true});
414 }
415 },
416
417 help_window: function() {
418 var help_template = '<div id="helpwindow" class="alipi ui-widget-header ui-corner-all">'+
419 '<label id="txtlab" class="alipi" style="color:#aaa;font-size:100%;">TEXT :- It will popup a '+
420 'window and allow you to modify/replace text of select element on editor(right) box.'+
421 '<p class="alipi">To delete - Empty the editor(right) box and press "Save changes".'+
422 '</p><p class="alipi" style="margin-left:50px";>Add Audio - It allows you to '+
423 'enter audio URL.</p>IMAGE:- <p class="alipi" style="margin-left:50px";> Replace - It allows you to enter '+
424 'image URL.</p> UNDO:- Use it when you want to revert back to '+
425 'previous change.'+
426 'PUBLISH:- To publish your crafted changes to database and blog (Alipi/Personal).'+
427 '<p class="alipi" style="margin-left:50px";>States - The place you are targetting to.</p><p class="alipi" '+
428 'style="margin-left:50px";>Languages - In language you publishing.</p><p class="alipi" style= '+
429 '"margin-left:50px";>Style - In what style you crafted?</p><p class="alipi" style="margin-left:50px";> '+
430 'Author - Who is a crafter?</p><p class="alipi" style="margin-left:50px";>'+
431 'Alipi blog - If you don\'t have blogspot ID then check this to post it to our blog.</p></div>';
432
433 $('body').append(help_template);
434 $(document).unbind('mouseover'); // Unbind the css on mouseover
435 $(document).unbind('mouseout'); // Unbind the css on mouseout
436
437 $(function() {
438 $( "#helpwindow" ).dialog({
439 width:800,
440 height:550,
441 modal: true,
442 close: function() {
443 $("#helpwindow").remove();
444 }
445 });
446 });
447 },
448
449 exitMode: function() {
450 var exit = window.confirm("Do you really want to exit from edit mode?");
451 if (exit == true) {
452 window.location.reload();
453 }
454 },
455
456 hide_overlays: function() {
457 if($('#icon-up').attr('down') == 'true') {
458 $('#icon-up').attr('down', 'false');
459 $('#icon-up').show(); $('#icon-down').hide();
460 $('#pub_overlay').addClass('barOnBottom'); $('#pub_overlay').removeClass('barOnTop');
461 } else {
462 $('#icon-up').attr('down', 'true');
463 $('#icon-down').show(); $('#icon-up').hide();
464 $('#pub_overlay').addClass('barOnTop'); $('#pub_overlay').removeClass('barOnBottom');
465
466 }
467 },
468
469 outterToggle: function() {
470 if($('#outter-down-button').attr('up') == 'true' ) {
471 $('#outter-down-button').attr('up', 'false');
472 $('#outter-up-button').hide(); $('#outter-down-button').show();
473 $('#renarrated_overlay').addClass('barOnBottom'); $('#renarrated_overlay').removeClass('barOnTop');
474 } else {
475 $('#outter-down-button').attr('up', 'true');
476 $('#outter-up-button').show(); $('#outter-down-button').hide();
477 $('#renarrated_overlay').addClass('barOnTop'); $('#renarrated_overlay').removeClass('barOnBottom');
478 }
479 },
480
481
482 getLoc: function() {
483
484 $( "#loc-select" ).autocomplete({
485 source: function(req, add){
486
487 //pass request to server
488 $.getJSON(config.deploy+"/getLoc?", req, function(data) {
489 $('#loc-img').hide();
490
491 //create array for response objects
492 var suggestions = [];
493
494 //process response
495 $.each(data['return'], function(i,val){
496 suggestions.push(val['name']+', '+val['country_name']);
497 });
498 //pass array to callback
499 add(suggestions);
500 });
501 $('#loc-img').show();
502 },
503 });
504 },
505
506 getLang: function() {
507 $( "#lang-select" ).autocomplete({
508 source: function(req, add){
509
510 //pass request to server
511 $.getJSON(config.deploy+"/getLang?", req, function(data) {
512 $('#lang-img').hide();
513
514 //create array for response objects
515 var suggestions = [];
516
517 //process response
518 $.each(data['return'], function(i, val){
519 //suggestions.push(val.country);
520 suggestions.push(val['name']);
521 });
522 //pass array to callback
523 add(suggestions);
524 });
525 $('#lang-img').show();
526 },
527 });
528
529
530 },
531
532 publish: function() {
533 if(util.hasChangesPending())
534 {
535 $('#pub_overlay').slideUp();
536 $('#element_edit_overlay').slideUp();
537 $('#icon_on_overlay').slideUp();
538 if (a11ypi.target == false ) {
539 var publish_template = '<div id="targetoverlay" title="Who are you narrating to?" class="alipi ui-widget-header ui-corner-all"> '+
540 // '<div id="infovis" class="alipi"> </div>'+
541 '<label id="tar-lab1" class="alipi" >Enter few attributes of the target community </label>'+
542 '<label id="tar-lab2" class="alipi" >Location of the target community: </label> '+
543 '<input id="loc-select" class="alipi" placeholder="Type city/town name"/> '+
544 '<img id="loc-img" src="http://dev.a11y.in/wsgi/images/db_loading.gif" /> '+
545 '<label id="tar-lab3" class="alipi" >Language of re-narration: </label> '+
546 '<input id="lang-select" class="alipi" placeholder="Type language name"/>'+
547 '<img id="lang-img" src="http://dev.a11y.in/wsgi/images/db_loading.gif"/> '+
548 '<label id="tar-lab4" class="alipi" >Select a style of re-narration: </label> '+
549 '<select id="style-select" class="alipi" > '+
550 '<option>Translation</option><option>Technical</option><option>Fun</option><option>Simplification</option> '+
551 '<option>Correction</option><option>Evolution</option><option>Other</option></select>'+
552 '<label id="tar-lab5" class="alipi" >Enter an author name for your contribution: </label> '+
553 '<input id="auth-select" class="alipi" type="text" placeholder="John" /> '+
554 '<div id="blogset" > You can choose to post this in your own blog or in the default Alipi blog</div> '+
555 '<p id="tar-p" ><input id="our-check" class="alipi" type="radio"name="blog" /> '+
556 '<label id="tar-lab6" class="alipi" > Alipi Blog</label><input id="your-check" class="alipi" type="radio" name="blog" /> '+
557 '<label id="tar-lab7" class="alipi">Personal Blog</label></p></div>';
558
559 $('body').append(publish_template);
560 a11ypi.getLoc();
561 a11ypi.getLang();
562 a11ypi.target = true;
563 }
564
565 $(document).unbind('mouseover'); // Unbind the css on mouseover
566 $(document).unbind('mouseout'); // Unbind the css on mouseout
567
568 $('#pub_overlay').slideUp();
569 $('#element_edit_overlay').slideUp();
570 // $('#icon_on_overlay').slideUp();
571
572 $(function() {
573 $( "#targetoverlay" ).dialog({
574 height:550,
575 width:600,
576 modal: true,
577 buttons: {
578 Publish: function() {
579 util.publish();
580 }
581 },
582 close: function() {
583 $('#pub_overlay').slideDown();
584 // $('#element_edit_overlay').slideDown();
585 // $('#icon_on_overlay').slideDown();
586 $( "#targetoverlay" ).hide();
587 }
588 });
589 });
590 }
591 },
592
593 hideAll: function() {
594 var boxes = '#show-links, #show-box, #show-comment';
595 $(boxes).dialog('close');
596 },
597
598 showBox: function() {
599 this.hideAll();
600 $(document).unbind('mouseover'); // Unbind the css on mouseover
601 $(document).unbind('mouseout'); // Unbind the css on mouseout
602
603 $(function() {
604 $( "#show-box" ).dialog( "destroy" );
605
606 $( "#show-box" ).dialog({
607 width: 300,
608 height: 300,
609 modal: true
610 });
611 });
612 d = window.location.search.split('?')[1];
613 var a = a11ypi.getParams();
614 if (a['blog'] === undefined ) {
615 a11ypi.createMenu('1.0');
616 }
617 else {
618 $('#show-box').attr('title', 'Choose a re-narration from the blog you specified.');
619 a11ypi.ajax1();
620 }
621 },
622 showComment: function() {
623 this.hideAll();
624 $(document).unbind('mouseover'); // Unbind the css on mouseover
625 $(document).unbind('mouseout'); // Unbind the css on mouseout
626
627 $(function() {
628 $( "#show-comment" ).dialog( "destroy" );
629
630 $( "#show-comment" ).dialog({
631 width: 300,
632 height: 300,
633 modal: true
634 });
635 });
636 a11ypi.createMenu('5el');
637 },
638
639 ajaxLinks1: function() {
640 var xhr = new XMLHttpRequest();
641 xhr.onreadystatechange = function()
642 {
643 if(xhr.readyState == 4)
644 {
645 if(xhr.responseText == "empty")
646 { }
647 else
648 {
649 $('#see-links').show();
650 a11ypi.showlinks = JSON.parse(xhr.responseText);
651 }
652 }
653 }
654 xhr.open("POST",config.root+"/domain",true);
655 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
656 d = window.location.search.split('?')[1];
657 a = a11ypi.getParams();
658 xhr.send('url='+a['foruri'])
659 },
660 showBox1: function() {
661 this.hideAll();
662 $(document).unbind('mouseover'); // Unbind the css on mouseover
663 $(document).unbind('mouseout'); // Unbind the css on mouseout
664
665 $(function() {
666 $( "#show-links" ).dialog( "destroy" );
667
668 $( "#show-links" ).dialog({
669 width: 500,
670 height: 300,
671 modal: true
672 });
673 });
674 a11ypi.createDomainMenu();
675 },
676 createDomainMenu: function() {
677 var xyz = $("#show-links");
678 xyz.html('');
679 menu_list = a11ypi.showlinks;
680 for(var i=0; i<menu_list.length;i++)
681 {
682 var para = document.createElement("p");
683 var newel = document.createElement("a");
684 newel.textContent = menu_list[i];
685 newel.setAttribute("href", config.deploy+"/?foruri="+encodeURIComponent(menu_list[i]));
686 newel.setAttribute("class","alipiShowLink");
687 para.appendChild(newel);
688 xyz.append(para);
689 }
690 $('.alipiShowLink').hover(
691 function() {
692 var xhr = new XMLHttpRequest();
693 xhr.onreadystatechange = function()
694 {
695 if(xhr.readyState == 4)
696 {
697 if(xhr.responseText == "empty")
698 { }
699 else
700 {
701 menu_list = JSON.parse(xhr.responseText);
702 x = '';
703 for(i=0; i<menu_list.length; i++) {
704 if (i == menu_list.length-1) {
705 x += menu_list[i];
706 } else {
707 x += menu_list[i] + ", ";
708 }
709 }
710 $('#show-links').title = x;
711 }
712 }
713 }
714 xhr.open("POST",config.root+"/menu",true);
715 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
716 xhr.send('url='+encodeURIComponent($(this).attr('href'))) ;
717 },
718 function () {$('#show-links').title= '';}
719 );
720 },
721 blogFilter: function() {
722 if (a11ypi.blog_flag == false) {
723 a11ypi.blog_flag = true;
724 var xhr = new XMLHttpRequest();
725 xhr.onreadystatechange = function()
726 {
727 if(xhr.readyState == 4)
728 {
729 if(xhr.responseText == "empty")
730 { }
731 else
732 {
733 var sel = $("#blog-filter");
734 var menu_list = JSON.parse(xhr.responseText);
735 opt = document.createElement("option");
736 opt.textContent = "Choose a blog";
737 sel.append(opt);
738 for (var i=0; i < menu_list.length; i++)
739 {
740 opt = document.createElement("option");
741 opt.textContent = menu_list[i];
742 sel.append(opt);
743 }
744 }
745 }
746 }
747 xhr.open("POST",config.root+"/blog",true);
748 xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
749 a = a11ypi.getParams();
750 xhr.send('url='+a['foruri']);
751 }
752 },
753 go: function() {
754 var a =[];
755 for (var i = 0;i<d.split('&').length;i++){
756 a[d.split('&')[i].split('=')[0]] = d.split('&')[i].split('=')[1];
757 }
758 if ($("#blog-filter").val() == null)
759 { }
760 else {
761 window.open(config.deploy+"/?foruri=" + a['foruri'] + "&blog=" + $("#blog-filter").val());
762 }
763 },
764 share: function() {
765 $('#fb-like').css('display', 'block');
766 $('#tweet-root').css('display', 'block');
767 $( "#share-box" ).dialog({
768 position: 'center',
769 width:450,
770 height:180,
771 modal: true,
772 });
773 },
774 editPage: function() {
775 this.hideAll();
776 a11ypi.testContext();
777 $('#pub_overlay').show(); $('#pub_overlay').addClass('barOnTop');
778 $('#icon-down').show();
779 $('#renarrated_overlay').hide();
780 $('body *').contents().filter(function(){
781 {
782 try{
783 if(!($(this).hasClass('alipi')) && $(this).attr('m4pageedittype') )
784 return this;
785 }
786 catch(err)
787 {
788 //pass
789 }
790 }
791 }).click(pageEditor.startEdit);
792
793 $('body *').contents().filter(function(){
794 {
795 try{
796 if(!($(this).hasClass('alipi')) || $(this).attr('m4pageedittype'))
797 return this;
798 }
799 catch(err)
800 {
801 //pass
802 }
803 }
804 }).click(pageEditor.noEdit);
805
806 $(document).mouseover(a11ypi.highlightOnHover);
807 $(document).mouseout(a11ypi.unhighlightOnMouseOut);
808 },
809
810 displayEditor: function() {
811 var template = '<div id="editoroverlay" title="Editor" class="alipi ui-widget-header ui-corner-all">'+
812 '<button id="close-adv" class="alipi" onclick="a11ypi.closeAdv();" title="Want to close View Source & display without HTML code?"> '+
813 'Render source</button> '+
814 '<button id="adv-ref" class="alipi" onclick="a11ypi.showAdv();" title="Want to see HTML code? Then click me !!">View Source</button> '+
815 '<label id="ref-lab" class="alipi" style="left:3%;">Here is original piece (Reference)</label>'+
816 '<div id="reference" class="alipi" readonly="yes"></div>'+
817 '<textarea id="adv-reference" class="alipi" readonly="yes"></textarea> '+
818 '<label id="edit-lab" class="alipi" style="left:53%;">Where you should edit (Editor)</label>'+
819 '<div id="editor" class="alipi" contenteditable="true" '+
820 '</div>';
821 $('body').append(template);
822 $('#pub_overlay').slideUp();
823 $('#element_edit_overlay').hide();
824
825 var tag = pageEditor.event.target.nodeName;
826 $(pageEditor.event.target).removeAttr('m4pageedittype');
827 $(pageEditor.event.target).children().removeAttr('m4pageedittype');
828
829 $('#adv-reference').text('<'+tag+'>'+$(pageEditor.event.target).html()+'</'+tag+'>');
830 $('#reference').html($(pageEditor.event.target).html());
831 $('#editor').html($(pageEditor.event.target).html());
832 $("#adv-ref").button({icons:{primary:"ui-icon-script"},text:true}); $('#adv-ref').children().addClass('alipi');
833 $("#close-adv").button({icons:{primary:"ui-icon-bookmark"},text:true}); $('#close-adv').children().addClass('alipi');
834 $('#close-adv').hide();
835 $('#adv-ref').button();
836
837 $(document).unbind('mouseover'); // Unbind the css on mouseover
838 $(document).unbind('mouseout'); // Unbind the css on mouseout
839
840 $( "#editoroverlay" ).dialog({
841 position: 'center',
842 width:$(window).width()-10,
843 height:$(window).height()-50,
844 modal: true,
845 buttons: {
846 "+": function() {
847 if($('#editor').css('font-size') >= '30px') {
848 // passthrough
849 }
850 else {
851 var font = parseFloat($('#editor').css('font-size')) + 1;
852 $('#editor').css('font-size', font+'px');
853 font = parseFloat($('#reference').css('font-size')) + 1;
854 $('#reference').css('font-size', font+'px');
855 font = parseFloat($('#adv-reference').css('font-size')) + 1;
856 $('#adv-reference').css('font-size', font+'px');
857 }
858 },
859 "-": function() {
860 if($('#editor').css('font-size') <= '10px') {
861 //passthrough
862 }
863 else {
864 var font = parseFloat($('#editor').css('font-size')) - 1;
865 $('#editor').css('font-size', font+'px');
866 font = parseFloat($('#reference').css('font-size')) - 1;
867 $('#reference').css('font-size', font+'px');
868 font = parseFloat($('#adv-reference').css('font-size')) - 1;
869 $('#adv-reference').css('font-size', font+'px');
870 }
871 },
872 "Add Link": function() {
873 pageEditor.handler();
874 },
875 "Save changes": function() {
876 $('#pub_overlay').slideDown();
877 $('#element_edit_overlay').slideDown();
878 $('#icon_on_overlay').slideDown();
879 manager.recordText(pageEditor.event.target);
880 pageEditor.cleanUp(pageEditor.event.target);
881 $( "#editoroverlay" ).remove();
882 }
883 },
884 close: function() {
885 pageEditor.cleanUp(pageEditor.event.target);
886 $("#editoroverlay" ).remove();
887 }
888 });
889
890 $($($('<label>').insertAfter($('.ui-dialog-buttonset').children()[0])).html('Magnify or Demagnify')); // Element added externally with css
891 $($('.ui-dialog-buttonset').children()[1]).attr('id','mag-demag');
892 $($('.ui-dialog-buttonset').children()[0]).attr('id','mag'); // '+'
893 $($('.ui-dialog-buttonset').children()[2]).attr('id','demag'); // '-'
894 $($('.ui-dialog-buttonset').children()[3]).attr('id','add-link'); // 'Link'
895 $($('.ui-dialog-buttonset').children()[4]).attr('id','save-changes'); // 'Save Changes'
896
897 $('#adv-reference').height($('#editor').height() + 40);
898 $('#reference').height($('#editor').height());
899 $('#mag').attr('title', 'To magnify letters/Increase font size');
900 $('#demag').attr('title', 'To demagnify letters/Decrease font size');
901 $('#add-link').attr('title', 'Add link(href) to the selected text portion (Before clicking this button, select some portion of text in "Editor")');
902 $('#save-changes').attr('title', 'Save edited text onto the page')
903 },
904
905 showAdv: function() {
906 $('#reference').hide();
907 $('#adv-reference').show();
908 $('#adv-ref').hide();
909 $('#close-adv').show();
910 },
911 closeAdv: function() {
912 $('#reference').show();
913 $('#adv-reference').hide();
914 $('#close-adv').hide();
915 $('#adv-ref').show();
916 },
917
918 reflectInReference: function() {
919 var tag = pageEditor.event.target.nodeName;
920 $("#reference").html() = $("#editor").html();
921 },
922
923 imageReplacer: function() {
924 var imageInputTemplate = '<div id="imageInputElement" title="Enter url" class="alipi ui-widget-header ui-corner-all">'+
925 '<input type="text" id="imageInput" placeholder="http://foo.com/baz.jpg" class="alipi" value=""/></div>';
926
927 $('body').append(imageInputTemplate);
928 $(document).unbind('mouseover'); // Unbind the css on mouseover
929 $(document).unbind('mouseout'); // Unbind the css on mouseout
930
931 $('#pub_overlay').slideUp();
932 $('#element_edit_overlay').slideUp();
933 $('#icon_on_overlay').slideUp();
934
935 $( "#imageInputElement" ).dialog({
936 width:300,
937 height:200,
938 modal: true,
939 buttons: {
940 OK: function() {
941 var formValue = $('#imageInput').val();
942 if(formValue != '\/S/')
943 {
944 manager.recordImage(pageEditor.event.target, formValue);
945 pageEditor.cleanUp(pageEditor.event.target);
946 $( "#imageInputElement" ).remove();
947 }
948 }
949 },
950 close: function() {
951 pageEditor.cleanUp(pageEditor.event.target);
952 $("#imageInputElement" ).remove();
953 }
954 });
955
956 },
957
958 addAudio: function() {
959 var audioInputTemplate = '<div id="audioInputElement" title="Enter url" class="alipi ui-widget-header ui-corner-all">'+
960 '<input type="text" id="audioInput" placeholder="http://foo.com/baz.ogg" class="alipi" value=""/></div>';
961
962 $('body').append(audioInputTemplate);
963 $(document).unbind('mouseover'); // Unbind the css on mouseover
964 $(document).unbind('mouseout'); // Unbind the css on mouseout
965
966 $('#pub_overlay').slideUp();
967 $('#element_edit_overlay').slideUp();
968 $('#icon_on_overlay').slideUp();
969
970 $( "#audioInputElement" ).dialog({
971 width:300,
972 height:200,
973 modal: true,
974 buttons: {
975 OK: function() {
976 pageEditor.addAudio();
977 pageEditor.cleanUp(pageEditor.event.target);
978 $( "#audioInputElement" ).remove();
979 }
980 },
981 close: function() {
982 pageEditor.cleanUp(pageEditor.event.target);
983 $("#audioInputElement" ).remove();
984 }
985 });
986 },
987
988 highlightOnHover: function(event) {
989 if( !($(event.target).hasClass('alipi')) ) {
990 $(event.target).addClass('highlightElement');
991 }
992 },
993
994 unhighlightOnMouseOut: function(event) {
995 $(event.target).removeClass('highlightElement');
996 },
997 showInfo: function(data) {
998 infoWindow = window.open(config.deploy+'/blank','Info page');
999 window.setTimeout(function(){a11ypi.pushInfo(infoWindow.document.getElementById('info_content'),infoWindow,data);},2500);
1000 },
1001 pushInfo: function(ele, win, data) //ele contains the info_content element from blank.html
1002 {
1003 win.infoFullJSON = a11ypi.responseJSON;
1004 win.onLoad();
1005 },
1006 getParams: function()
1007 {
1008 var a = [];
1009 if(window.location.hostname == config.hostname)
1010 {
1011 d = window.location.search.split('?')[1];
1012 for (var i = 0;i<d.split('&').length;i++){
1013 a[d.split('&')[i].split('=')[0]] = decodeURIComponent(d.split('&')[i].split('=')[1]);
1014 }
1015 return a;
1016 }
1017 else
1018 {
1019 a['foruri'] = window.location.href;
1020 return a;
1021 }
1022 }
1023};
  
1var pageEditor = {
2 event: 0 , //Use this var to store the event object, which will be passed for editor.
3 m4pageedittype: '',
4 savedHtml: '',
5 url:'',
6 selection:'',
7 startEdit: function(event)
8 {
9 if(event.target.nodeName != 'AUDIO'){
10 event.stopPropagation();
11 event.preventDefault();
12 }
13 pageEditor.event = event;
14 pageEditor.m4pageedittype = $(event.target).attr('m4pageedittype');
15 $('*').removeClass('highlightOnSelect');
16
17 if (pageEditor.event) {
18 xAxis = pageEditor.event.clientX;
19 yAxis = pageEditor.event.clientY;
20 $("#element_edit_overlay").css("top", yAxis);
21 $("#element_edit_overlay").css("left", xAxis);
22 }
23
24 if($(event.target).attr('m4pageedittype') == 'text') {
25 $(event.target).addClass('highlightOnSelect'); // To show selected element
26
27 $('#edit-text').show();
28 $('#add-audio').show();
29 $('#close-element').show();
30 $('#replace-image').hide();
31 $('#delete-image').hide();
32 $('#cant-edit').hide();
33 $("body").css("overflow", "hidden");
34 $('#pub_overlay').slideDown();
35 $('#element_edit_overlay').slideDown();
36 // At this point 'displayEditor' function will be performed on click of 'Edit Text' button
37 // displayEditor function is in ui.js file
38 }
39 else if($(event.target).attr('m4pageedittype') == 'image') {
40 $(event.target).addClass('highlightOnSelect'); // To show selected element
41
42 $('#replace-image').show();
43 $('#delete-image').show();
44 $('#close-element').show();
45 $('#add-audio').hide();
46 $('#edit-text').hide();
47 $('#cant-edit').hide();
48 $("body").css("overflow", "hidden");
49 $('#element_edit_overlay').slideDown();
50 $('#pub_overlay').slideDown();
51 // At this point 'imageReplacer' function will be performed on click of 'Replace Image' button
52 // imageReplacer function is in ui.js
53 }
54 },
55
56 noEdit: function(event)
57 {
58 if (event) {
59 xAxis = event.clientX;
60 yAxis = event.clientY;
61 $("#element_edit_overlay").css("top", yAxis);
62 $("#element_edit_overlay").css("left", xAxis);
63 }
64 $('*').removeClass('highlightOnSelect');
65 if(!($(event.target).attr('m4pageedittype'))) {
66 $('#edit-text').hide();
67 $('#add-audio').hide();
68 $('#replace-image').hide();
69 $('#delete-image').hide();
70 $('#close-element').hide();
71 $('#cant-edit').show();
72 window.setTimeout("$('#cant-edit').hide();", 3000);
73 $("body").css("overflow", "auto");
74 $('#pub_overlay').slideDown();
75 $('#element_edit_overlay').slideDown();
76 }
77 },
78
79 handler: function()
80 {
81 var sel = window.getSelection();
82 y = sel.anchorOffset;
83 z = sel.focusOffset;
84 if(y != z)
85 {
86 pageEditor.savedHtml = $('#editor').html();
87 var url = prompt("Enter url");
88 if(url)
89 {
90 sel.anchorNode.textContent = sel.anchorNode.textContent.substr(0,y)+'<a href="'+url+'">'+sel.anchorNode.textContent.substr(y,z-y)+"</a>"+sel.anchorNode.textContent.substr(z);
91 abc = $('#editor').html();
92 abc = abc.replace(/(&lt;)/g,'<');
93 abc = abc.replace(/(&gt;)/g,'>');
94 $('#editor').html(abc);
95 }
96 else
97 {
98 $('#dialog-message').html('<p>Please enter a valid url</p>');
99 $('#dialog-message').dialog({
100 modal: true,
101 buttons:{
102 OK:function(){
103 $(this).dialog("close");
104 $(this).html('');
105 }
106 }});
107 }
108 }
109 else{
110 $('#dialog-message').html('<p>Please choose a portion of text and then click <b>Add link</b>.</p>');
111 $('#dialog-message').dialog({
112 modal: true,
113 buttons:{
114 OK:function(){
115 $(this).dialog("close");
116 $(this).html('');
117 }
118 }});
119 }
120 },
121
122 addAudio: function(){
123 url = $('#audioInput').val();
124 if(url.substr(-4) =='.ogg'){
125 manager.recordAudio(pageEditor.event.target);
126 }
127 // else{
128 // $('#dialog-message').html('<p>Please enter a valid url</p>');
129 // $('#dialog-message').dialog({
130 // modal: true,
131 // buttons:{
132 // OK:function(){
133 // $(this).dialog("close");
134 // $(this).html('');
135 // }
136 // }});
137 // }
138 },
139
140 deleteImage: function(){
141 manager.deleteImage(pageEditor.event.target);
142 pageEditor.cleanUp(pageEditor.event.target);
143 },
144
145 cleanUp: function(element)
146 {
147 if(util.hasChangesPending()) {
148 $('#undo-button').button('option', 'disabled', false); // Another way of enabling UI-JQUERY button
149 $('#publish-button').button({ disabled: false}); // Enabling UI-JQUERY button
150 } else {
151 $('#undo-button').button({ disabled: true}); // Disabling button
152 $('#publish-button').button({ disabled: true}); // Disabling button
153 }
154
155 $(element).attr('m4pageedittype', pageEditor.m4pageedittype);
156 $(element).children().attr('m4pageedittype', pageEditor.m4pageedittype);
157 // $('#icon_on_overlay').slideDown();
158 $('#pub_overlay').slideDown();
159 $('#element_edit_overlay').hide();
160 $("body").css("overflow", "auto");
161 $('*').removeClass('highlightOnSelect');
162 // $('#element_edit_overlay').slideDown();
163 $(document).mouseover(a11ypi.highlightOnHover);
164 $(document).mouseout(a11ypi.unhighlightOnMouseOut);
165 // $(pageEditor.event.target).removeClass('highlightOnSelect'); // Remove hightlight of selected element
166 },
167};
168
169var DOM = {
170 getXpath : function (element)
171 {
172 var str = '';
173 var currentNode = element;
174 var path = '';
175 var index = -1;
176
177 if (currentNode.nodeName != "#text")
178 {
179 path = DOM.makePath(currentNode);
180 }
181 else
182 {
183 path = DOM.makePath(currentNode.parentNode);
184 }
185
186
187 return path;
188 },
189 getElementIdx : function getElementIdx(elt)
190 {
191 var count = 1;
192 for (var sib = elt.previousSibling; sib ; sib = sib.previousSibling)
193 {
194 if(sib.nodeType == 1 && sib.tagName == elt.tagName)count++
195 }
196
197 return count;
198 },
199
200 makePath : function makePath(elt){
201 var path = '';
202 for (; elt && elt.nodeType == 1; elt = elt.parentNode)
203 {
204 if(elt.id == "")
205 {
206 idx = DOM.getElementIdx(elt);
207 xname = elt.tagName;
208 if (idx > 1)
209 xname += "[" + idx + "]";
210 path = "/" + xname + path;
211 }
212 else
213 {
214 path = "//*[@id='"+elt.id+"']"+path;
215 break;
216 }
217 }
218 return path;
219 },
220 settextContent : function(element, content){
221 $(element).html(content);
222 },
223 gettextContent:function(element)
224 {
225 return $(element).html();
226 },
227};
228
229var util = {
230 history: [],
231 command: [],
232
233 forEach : function(array, callback) {
234 var i = 0, length = array.length, value;
235
236 if (length) {
237 for (value = array[0]; i < length && callback.call(value, i, value) !== false; value = array[++i]) {
238 }
239 }
240 },
241 hasChangesPending : function(){
242 return util.history.length > 0;
243 },
244 formUncomplete : function formUnomplete(){
245 return (locName == '' && langName=='' && styleName == '' );
246 },
247
248 makeChanges: function (command, selectedElement) {
249 var poofPosition, poofDiv;
250 util.command = command;
251 switch (util.command.command) {
252 case 'TEXT_UPDATE':
253 DOM.settextContent(util.command.element, util.command.data);
254 break;
255 case 'IMAGE_DELETE':
256 $(selectedElement).hide();
257 break;
258 case 'IMAGE_SRC_UPDATE':
259 imageMatcher = new RegExp("(\\d+)x(\\d+),(.+)").exec(util.command.data);
260 imageWidth = imageMatcher[1];
261 imageHeight = imageMatcher[2];
262 imageSrc = imageMatcher[3];
263
264 if (imageSrc && util.command.element.src != imageSrc) {
265 util.command.element.src = imageSrc;
266 }
267 if (imageWidth == 0) {
268 util.command.element.removeAttribute('width');
269 } else {
270 util.command.element.width = imageWidth;
271 }
272
273 if (imageHeight == 0) {
274 util.command.element.removeAttribute('height');
275 } else {
276 util.command.element.height = imageHeight;
277 }
278 break;
279
280 case 'ANCHOR_UPDATE':
281 $(util.command.element).attr('href', util.command.data);
282 break;
283
284 case 'ANCHOR_CREATE':
285 anchorElement = DOM.BUILDER.A({ 'href' : util.command.data });
286 util.command.element.parentNode.replaceChild(anchorElement, util.command.element);
287 anchorElement.appendChild(util.command.element);
288 util.command.previousData = anchorElement;
289 break;
290
291 case 'AUDIO_UPDATE':
292 util.command.element.setAttribute('src', util.command.data);
293 //pageEditor.showMessage('Audio changed');
294 break;
295
296 case 'AUDIO_CREATE':
297 audioElement = document.createElement('audio');
298 audioElement.setAttribute("class", "alipi");
299 audioElement.setAttribute('src',util.command.data);
300 audioElement.setAttribute('controls','controls');
301 audioElement.setAttribute('mime-type','audio/ogg');
302 $(audioElement).insertBefore($(selectedElement));
303 util.command.element = audioElement;
304 break;
305
306 default:
307 console.error('Unknown util.command:', util.command);
308 }
309
310 util.history.push(util.command);
311 },
312
313 undoChanges:function () {
314 var imageElement, command=util.command;
315
316 if (util.hasChangesPending()) {
317 command = util.history.pop();
318 switch (command.command) {
319 case 'TEXT_UPDATE':
320 command.element.innerHTML = command.previousData;
321 break;
322
323 case 'DELETE':
324 DOM.restoreStyleProperty(command.element, 'display', '');
325 break;
326
327 case 'IMAGE_SRC_UPDATE':
328 command.element.src = command.previousData.src;
329 if (command.previousData.size.width) {
330 command.element.width = command.previousData.size.width;
331 } else {
332 command.element.removeAttribute('width');
333 }
334 if (command.previousData.size.height) {
335 command.element.height = command.previousData.size.height;
336 } else {
337 command.element.removeAttribute('height');
338 }
339 break;
340
341 case 'AUDIO_CREATE':
342 $(command.element).remove();
343 break;
344 case 'ANCHOR_UPDATE':
345 command.element.setAttribute('href', command.previousData);
346 break;
347
348 case 'ANCHOR_CREATE':
349 command.previousData.parentNode.replaceChild(command.element, command.previousData);
350 break;
351 case 'IMAGE_DELETE':
352 $(command.element).show();
353 break;
354 default:
355 console.error('Unknown command:', command);
356 }
357 pageEditor.cleanUp(pageEditor.event.target);
358 } else {
359 }
360 },
361 checkHistoryChanges: function()
362 {
363 if(util.hasChangesPending())
364 {
365 $('#undo-button').attr('disabled',false);
366 $('#publish-button').attr('disabled',false);
367 }
368 else{
369 $('#undo-button').attr('disabled',true);
370 $('#publish-button').attr('disabled',true);
371 }
372 },
373
374 publish:function (){
375 var result;
376 if ($('#loc-select').val() == '' || $('#lang-select').val() == '' || $('#auth-select').val() == '' || ($('#your-check').attr('checked') == undefined && $('#our-check').attr('checked') == undefined )) {
377 alert("please furnish all the details");
378 } else {
379 if($('#your-check').attr('checked') != undefined)
380 {
381 localStorage.myContent = util.buildDataString();
382 window.location.href = "http://dev.a11y.in/test.html";
383 }
384 else{
385 $(function(){
386 $( "#targetoverlay" ).dialog('close');
387 $('#pub_overlay').slideUp();
388 $('#element_edit_overlay').hide();
389 // $('#icon_on_overlay').slideUp();
390 // $( "#success-dialog" ).dialog({
391 // modal: true,
392 // });
393 var success_template = '<div id="success-dialog" title="Posting your changes" class="alipi ui-widget-header ui-corner-all" '+
394 '<p style="color:#aaa"><b>Please wait !!!</b></p><p style="color:#aaa">Your contribution is being posted</p></div>';
395 $('body').append(success_template);
396 $(function() {
397 $( "#success-dialog" ).dialog({
398 modal: true,
399 });
400 });
401 });
402 $.post(config.sweet+'/add', {data : JSON.stringify(util.buildDataString())},
403 function(data){
404// data = JSON.parse(data);
405 $.post(config.deploy+'/askSWeeT',{'data':data},function(){
406 console.log("success!!");});
407
408 }); //+'&title='+encodeURIComponent(document.title)
409// }).done(function(){
410 // console.log("test");
411 //window.location.reload();
412// });
413 }
414 }
415 },
416
417 buildDataString : function (){
418 var check_xpath = [], temp_history = [], index = [];
419 for(x=0; x<util.history.length; x++) {
420 check_xpath.push(util.history[x].xpath);
421 }
422 for(i=0; i<check_xpath.length-1; i++) {
423 for(j=i+1; j<check_xpath.length; j++) {
424 if ((check_xpath[i] == check_xpath[j]) && (util.history[i].elementType == util.history[j].elementType)) {
425 index.push(i);
426 }
427 }
428 }
429 if (index.length > 0) {
430 for (var z=0; z<index.length; z++) {
431 delete util.history[index[z]];
432 }
433 }
434
435 for (var x=0; x<util.history.length; x++) {
436 if (util.history[x] != undefined) {
437 temp_history.push(util.history[x]);
438 }
439 }
440
441 util.history = temp_history;
442 var command = util.command, buffer;
443 // buffer = new StringUtil.StringBuffer();
444
445 var buff = [];
446 util.forEach(util.history, function(index, command) {
447 var dict = {};
448 dict['type'] = 1; //TYPE refers to the sweet type. The application says the type, 1 is re-narration.
449 dict['about'] = window.location.search.split('=')[1];
450 dict['lang'] = $('#lang-select').val();
451 dict["location"] = $('#loc-select').val();
452 dict["style"] = $('#style-select').val();
453 dict["blog"] = "blog";
454 dict["elementtype"] = command.elementType;
455 dict["xpath"] = command.xpath;
456 dict["data"] = command.data;
457 if ($('#auth-select').val() == '' || $('#auth-select').val() == /\S/) {
458 dict["author"] = "Anonymous";
459 } else {
460 dict["author"] = $('#auth-select').val();
461 }
462 buff.push(dict);
463
464 // buffer.append('###'); //separates the commands
465 // buffer.append('about='); //url=about //removed '&' on purpose
466 // buffer.append(window.location.search.split('=')[1]);
467 // buffer.append('&lang=');//lang
468 // buffer.append(encodeURIComponent($('#lang-select').val()));
469 // buffer.append('&location=');//location
470 // buffer.append(encodeURIComponent($('#loc-select').val()));
471 // buffer.append('&style=');//style
472 // buffer.append(encodeURIComponent($('#style-select').val()));
473 // buffer.append('&blog='); //blog where to post
474 // buffer.append(encodeURIComponent("blog"));
475 // buffer.append('&elementtype='); // text, audio, img
476 // buffer.append(encodeURIComponent(command.elementType));
477 // buffer.append('&xpath=');//xpath
478 // buffer.append(encodeURIComponent(command.xpath));
479 // buffer.append('&data='); //data
480 // buffer.append(encodeURIComponent(command.data));
481 // buffer.append('&author='); //author
482 // if ($('#auth-select').val() == '' || $('#auth-select').val() == /\S/) {
483 // buffer.append(encodeURIComponent('Anonymous'));
484 // } else {
485 // buffer.append(encodeURIComponent($('#auth-select').val()));
486 // }
487 });
488 // return buffer.toString().substring(3);
489
490 return buff;
491 },
492};
493
494var manager = {
495 recordText:function (selectedElement) {
496 var prevData = $(selectedElement).html();
497 var command = {
498 command : 'TEXT_UPDATE',
499 element : selectedElement,
500 url : window.location.href,
501 xpath : DOM.getXpath(selectedElement),
502 elementType : 'text',
503 data : DOM.gettextContent($('#editor')),
504 previousData : prevData
505 };
506 util.makeChanges(command, selectedElement);
507 },
508 recordAudio:function(selectedElement){
509 var command = {
510 command : 'AUDIO_CREATE',
511 element : selectedElement,
512 url : window.location.href,
513 xpath : DOM.getXpath(selectedElement),
514 elementType: 'audio/ogg',
515 data : url,
516 previousData : ''
517
518 };
519 util.makeChanges(command,selectedElement);
520 },
521 deleteElement : function(selectedElement) {
522 var command = {
523 command : 'DELETE',
524 element : selectedElement,
525 url : '',
526 elementType : 'text',
527 data : '',
528 xpath : '',
529 data : '',
530 previousData : ''
531 };
532 util.makeChanges(command, selectedElement);
533 },
534 recordImage: function(selectedElement, url)
535 {
536 var command = {
537 command : 'IMAGE_SRC_UPDATE',
538 element : selectedElement,
539 elementType : 'image',
540 xpath : DOM.getXpath(selectedElement),
541 url : window.location.href,
542 data : new StringUtil.StringBuffer().append(selectedElement.width).append('x').append(selectedElement.height).append(',').append(url).toString(),
543 previousData : {
544 'src' : selectedElement.src,
545 'size' : { width: selectedElement.width, height: selectedElement.height }
546 }
547 };
548 util.makeChanges(command, selectedElement);
549 },
550 deleteImage : function(selectedElement) {
551 var command = {
552 command : 'IMAGE_DELETE',
553 element : selectedElement,
554 url : window.location.href,
555 elementType : 'image',
556 data : '',
557 xpath : '',
558 data : '',
559 previousData : {
560 'src' : selectedElement.src,
561 'size' : { width: selectedElement.width, height: selectedElement.height }
562 }
563 };
564 util.makeChanges(command, selectedElement);
565 },
566
567};
568//Implementing the class for doing StringBuffer.
569var StringUtil = StringUtil || {};
570(function(StringUtil){
571 StringUtil.StringBuffer = function StringBuffer() {
572 var buffer = [];
573 this.append = function append(string) {
574 buffer.push(string);
575 return this;
576 };
577
578 this.toString = function toString() {
579 return buffer.join('');
580 };
581 };
582})(StringUtil);