def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "preview")
html += u'<input type="hidden" name="passrate" id="passrate-'+self.idevice.id+'" value="'+self.idevice.passRate+'" />'
for element in self.questionElements:
html += element.renderPreview()
html += '<div class="block iDevice_buttons">'+lb
html += '<p><input type="submit" name="submitScore" value="' + c_("SUBMIT ANSWERS")+'" /></p>'
html += '</div>'+lb
if not self.idevice.score == -1:
message = c_("Your score is ") + unicode(self.idevice.score) + "%"
html += '<script type="text/javascript">alert("'+ message+ '")</script>'
self.idevice.score = -1
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
log.debug("renderPreview")
resources = "%s/%s/resources" % (G.application.exeAppUri,
self.package.name)
appletcode = self.idevice.appletCode
appletcode = appletcode.replace('>', '>')
appletcode = appletcode.replace('<', '<')
appletcode = appletcode.replace('"', '"')
appletcode = appletcode.replace('\xC2\x82', '‚')
appletcode = appletcode.replace('<applet',
'<applet codebase="%s"' % resources)
appletcode = appletcode.replace('<APPLET',
'<applet codebase="%s"' % resources)
if self.idevice.type == "jclic":
appletcode = appletcode.replace(
'activitypack" value="',
'activitypack" value="%s/' % resources)
if self.idevice.type == "geogebra":
# according to self.port (config.py)
appletcode = appletcode.replace('filename" value="',
'filename" value="%s/' % resources)
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "preview")
html += '<div class="iDevice_content">' + lb
html += appletcode + lb
html += '</div>' + lb
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "view")
html += '<div class="iDevice_content">'+lb
html += '<div class="image_text" style="width:'+str(self.idevice.imageMagnifier.width)+'px;float:'+self.idevice.float+';'
if self.idevice.float == 'left':
html += 'margin:0 20px 20px 0'
if self.idevice.float == 'right':
html += 'margin:0 0 20px 20px'
html += '">'
html += lb
html += self.imageMagnifierElement.renderView()
if self.idevice.caption != '':
html = html.replace(' alt="" ',' alt="'+self.idevice.caption.replace('"','"')+'" ', 1)
html += '<strong>'+self.idevice.caption+'</strong>'
html += '</div>'+lb
text = self.textElement.renderView()
if text:
text = text.replace('"block iDevice_content"', '"iDevice_text"', 1)
html += text
else:
html += ' '
html += '</div>'+lb # /.iDevice_content
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
log.debug("renderPreview")
#resources = "http://127.0.0.1:%s/%s/resources" % (self.config.port, self.package.name)
resources = "/%s/resources" % (self.package.name)
appletcode = self.idevice.appletCode
appletcode = appletcode.replace('>', '>')
appletcode = appletcode.replace('<', '<')
appletcode = appletcode.replace('"', '"')
appletcode = appletcode.replace('\xC2\x82','‚')
appletcode = appletcode.replace('<applet','<applet codebase="%s"' % resources)
appletcode = appletcode.replace('<APPLET','<applet codebase="%s"' % resources)
if self.idevice.type == "jclic":
appletcode = appletcode.replace('activitypack" value="', 'activitypack" value="%s/' % resources)
if self.idevice.type == "geogebra":
# according to self.port (config.py)
appletcode = appletcode.replace('filename" value="', 'filename" value="%s/' % resources)
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "preview")
html += '<div class="iDevice_content">'+lb
html += appletcode+lb
html += '</div>'+lb
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "preview")
html += u'<input type="hidden" name="passrate" id="passrate-' + self.idevice.id + '" value="' + self.idevice.passRate + '" />'
for element in self.questionElements:
html += element.renderPreview()
html += '<div class="block iDevice_buttons">' + lb
html += '<p><input type="submit" name="submitScore" value="' + c_(
"SUBMIT ANSWERS") + '" /></p>'
html += '</div>' + lb
if not self.idevice.score == -1:
message = c_("Your score is %d%%") % self.idevice.score
html += '<script type="text/javascript">alert("' + message + '")</script>'
self.idevice.score = -1
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style, preview=False):
"""
Returns an XHTML string for viewing this block
"""
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "view")
html += '<form name="quizForm%s" id="quizForm%s" action="#" class="quiz-test-form">' % (
self.idevice.id, self.idevice.id)
html += lb
html += u'<input type="hidden" name="passrate" id="passrate-' + self.idevice.id + '" value="' + self.idevice.passRate + '" />' + lb
for element in self.questionElements:
if preview:
html += element.renderPreview()
else:
html += element.renderView()
html += '<div class="block iDevice_buttons">' + lb
html += '<p><input type="submit" name="submitB" value="' + c_(
"SUBMIT ANSWERS") + '" /> ' + common.javaScriptIsRequired(
) + '</p>' + lb
html += '</div>' + lb
html += '<div id="quizFormScore' + self.id + '"></div>' + lb
html += '</form>' + lb
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
html = common.ideviceHeader(self, style, "view")
# JRJ: Si hay instrucciones añadimos un
# (if there are instructions let's add a )
aux =self.instructionElement.renderView()
if re.search(">[\n|\r|\t]*</div>", aux):
html += aux
else:
html += aux + " "
# html += self.instructionElement.renderPreview()
# JRJ: si es la última pregunta no añadimos br
# (if it's the last question we won't add br)
for element in self.questionElements:
html += "<div class=\"question\">\n"
html += element.renderQuestion(False)
html += element.renderFeedbackView(False)
html += element.renderNoscript(False)
if element == self.questionElements[len(self.questionElements) - 1]:
html += "</div>\n"
else:
html += "</div><div> </div>\n"
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block during editing
"""
html = common.ideviceHeader(self, style, "preview")
html += self.renderViewContent()
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block during editing
"""
html = common.ideviceHeader(self, style, "preview")
html += self.renderViewContent()
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block during editing
"""
html = common.ideviceHeader(self, style, "preview")
for element in self.elements:
html += element.renderPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
html = common.ideviceHeader(self, style, "view")
for element in self.questionElements:
html += element.renderView()
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
html = common.ideviceHeader(self, style, "view")
for element in self.questionElements:
html += element.renderView()
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
log.debug("renderPreview")
html = common.ideviceHeader(self, style, "preview")
html += self.articleElement.renderPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block,
i.e. when exported as a webpage or SCORM package
"""
html = common.ideviceHeader(self, style, "view")
html += self.renderViewContent()
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block during editing
"""
html = common.ideviceHeader(self, style, "preview")
for element in self.elements:
html += element.renderPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
log.debug("renderPreview")
html = common.ideviceHeader(self, style, "preview")
html += self.articleElement.renderPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block,
i.e. when exported as a webpage or SCORM package
"""
html = common.ideviceHeader(self, style, "view")
html += self.renderViewContent()
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
#html = u"<div class=\"iDevice "
#html += u"emphasis"+unicode(self.idevice.emphasis)+"\">\n"
html = common.ideviceHeader(self, style, "view")
html += self._renderGame(False)
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
if hasattr(self.idevice, 'parent') and self.idevice.parent and not self.idevice.parent.edit:
return u""
html = common.ideviceHeader(self, style, "preview")
html += self.contentElement.renderPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
# html = u"<div class=\"iDevice "
# html += u"emphasis"+unicode(self.idevice.emphasis)+"\">\n"
html = common.ideviceHeader(self, style, "view")
html += self._renderGame(False)
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
if hasattr(self.idevice, 'parent'
) and self.idevice.parent and not self.idevice.parent.edit:
return u""
html = common.ideviceHeader(self, style, "preview")
html += self.contentElement.renderPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
content = self.rssElement.renderView()
content = re.sub(r'src="/.*?/resources/', 'src="', content)
html = common.ideviceHeader(self, style, "view")
html += content
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
html = common.ideviceHeader(self, style, "preview")
for element in self.questionElements:
html += element.renderPreview("/images/panel-amusements.png","/images/stock-stop.png")
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
html = common.ideviceHeader(self, style, "view")
html += u"<div class=\"media\">"
html += self.mediaElement.renderView()
html += "</div>"
html += self.textElement.renderView()
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
html = common.ideviceHeader(self, style, "view")
html += u"<div class=\"media\">"
html += self.mediaElement.renderView()
html += "</div>"
html += self.textElement.renderView()
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
html = common.ideviceHeader(self, style, "preview")
for element in self.questionElements:
html += element.renderPreview("/images/panel-amusements.png",
"/images/stock-stop.png")
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
#html = u"<div class=\"iDevice "
#html += u"emphasis"+unicode(self.idevice.emphasis)+"\" "
#html += u"ondblclick=\"submitLink('edit',"+self.id+", 0);\">\n"
html = common.ideviceHeader(self, style, "preview")
html += self._renderGame(True)
#html += self.renderViewButtons()
#html += "</div>\n"
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
# html = u"<div class=\"iDevice "
# html += u"emphasis"+unicode(self.idevice.emphasis)+"\" "
# html += u"ondblclick=\"submitLink('edit',"+self.id+", 0);\">\n"
html = common.ideviceHeader(self, style, "preview")
html += self._renderGame(True)
# html += self.renderViewButtons()
# html += "</div>\n"
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
html = common.ideviceHeader(self, style, "preview")
html += self.instructionElement.renderPreview()
for element in self.questionElements:
html += element.renderQuestionPreview()
html += element.renderFeedbackPreview()
html += common.ideviceFooter(self, style, "preview")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
html = common.ideviceHeader(self, style, "preview")
aux = self.questionElements[len(self.questionElements) - 1]
for element in self.questionElements:
if element == aux:
html += element.renderPreview()
else:
html += element.renderPreview() + "<br/>"
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
content = self.articleElement.renderView()
# content = re.sub(r'src="resources/', 'src="', content)
content = re.sub(r'src="http://127.0.0.1:\d+/newPackage.*/resources/', 'src="', content)
content = re.sub(r'src="/newPackage.*/resources/', 'src="', content)
content = re.sub(r'src=\'/newPackage.*/resources/', 'src="', content)
content = re.sub(r'src=\"/newPackage.*/resources/', 'src="', content)
html = common.ideviceHeader(self, style, "view")
html += content
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
content = self.articleElement.renderView()
# content = re.sub(r'src="resources/', 'src="', content)
content = re.sub(r'src="http://127.0.0.1:\d+/newPackage.*/resources/',
'src="', content)
content = re.sub(r'src="/newPackage.*/resources/', 'src="', content)
content = re.sub(r'src=\'/newPackage.*/resources/', 'src="', content)
content = re.sub(r'src=\"/newPackage.*/resources/', 'src="', content)
html = common.ideviceHeader(self, style, "view")
html += content
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
html = common.ideviceHeader(self, style, "view")
html += self.instructionElement.renderView()
for element in self.questionElements:
html += '<div class="question">\n'
html += element.renderQuestionView()
html += element.renderFeedbackView()
html += "</div>\n"
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
html = common.ideviceHeader(self, style, "view")
aux = self.questionElements[len(self.questionElements) - 1]
for element in self.questionElements:
if element == aux:
html += element.renderView("panel-amusements.png","stock-stop.png")
else:
html += element.renderView("panel-amusements.png","stock-stop.png") + "<br/>"
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
lb = "\n" #Line breaks
dT = common.getExportDocType()
figureTag = "div"
if dT == "HTML5":
figureTag = "figure"
html = common.ideviceHeader(self, style, "view")
html += '<div class="iDevice_content">' + lb
html += '<' + figureTag + ' class="image_text" style="width:' + str(
self.idevice.imageMagnifier.width
) + 'px;float:' + self.idevice.float + ';'
if self.idevice.float == 'left':
html += 'margin:0 20px 20px 0'
if self.idevice.float == 'right':
html += 'margin:0 0 20px 20px'
html += '">'
html += lb
html += self.imageMagnifierElement.renderView()
if self.idevice.caption != '':
html = html.replace(
' alt="" ',
' alt="' + self.idevice.caption.replace('"', '"') + '" ',
1)
if dT == "HTML5":
html += '<figcaption style="font-weight:bold">' + self.idevice.caption + '</figcaption>' + lb
else:
html += '<strong>' + self.idevice.caption + '</strong>' + lb
html += '</' + figureTag + '>' + lb
text = self.textElement.renderView()
if text:
text = text.replace('"block iDevice_content"', '"iDevice_text"', 1)
html += text
else:
html += ' '
html += '</div>' + lb # /.iDevice_content
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
html = common.ideviceHeader(self, style, "view")
aux = self.questionElements[len(self.questionElements) - 1]
for element in self.questionElements:
if element == aux:
html += element.renderView("panel-amusements.png",
"stock-stop.png")
else:
html += element.renderView("panel-amusements.png",
"stock-stop.png") + "<br/>"
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
appletcode = self.idevice.appletCode
appletcode = appletcode.replace('>', '>')
appletcode = appletcode.replace('<', '<')
appletcode = appletcode.replace('"', '"')
appletcode = appletcode.replace(' ', '')
appletcode = appletcode.replace('\xC2\x82','‚')
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "view")
html += '<div class="iDevice_content">'+lb
html += appletcode+lb
html += '</div>'+lb
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
log.debug("renderView")
appletcode = self.idevice.appletCode
appletcode = appletcode.replace('>', '>')
appletcode = appletcode.replace('<', '<')
appletcode = appletcode.replace('"', '"')
appletcode = appletcode.replace(' ', '')
appletcode = appletcode.replace('\xC2\x82', '‚')
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "view")
html += '<div class="iDevice_content">' + lb
html += appletcode + lb
html += '</div>' + lb
html += common.ideviceFooter(self, style, "view")
return html
def renderView(self, style, preview=False):
"""
Returns an XHTML string for viewing this block
"""
lb = "\n" #Line breaks
html = common.ideviceHeader(self, style, "view")
html += '<form name="quizForm%s" id="quizForm%s" action="javascript:calcScore2();">' % (self.idevice.id, self.idevice.id)
html += lb
html += u'<input type="hidden" name="passrate" id="passrate-'+self.idevice.id+'" value="'+self.idevice.passRate+'" />'+lb
for element in self.questionElements:
if preview:
html += element.renderPreview()
else:
html += element.renderView()
html += '<div class="block iDevice_buttons">'+lb
html += '<p><input type="submit" name="submitB" value="' + c_("SUBMIT ANSWERS")+'" /> '+common.javaScriptIsRequired()+'</p>'+lb
html += '</div>'+lb
html += '</form>'+lb
html += common.ideviceFooter(self, style, "view")
return html
def renderPreview(self, style):
"""
Returns an XHTML string for previewing this block
"""
lb = "\n" #Line breaks
dT = common.getExportDocType()
figureTag = "div"
if dT == "HTML5":
figureTag = "figure"
html = common.ideviceHeader(self, style, "preview")
html += '<div class="iDevice_content">'+lb
html += '<'+figureTag+' class="image_text" style="width:'+str(self.idevice.imageMagnifier.width)+'px;float:'+self.idevice.float+';'
if self.idevice.float == 'left':
html += 'margin:0 20px 20px 0'
if self.idevice.float == 'right':
html += 'margin:0 0 20px 20px'
html += '">'+lb
html += self.imageMagnifierElement.renderPreview()
if self.idevice.caption != '':
html = html.replace(' alt="" ',' alt="'+self.idevice.caption.replace('"','"')+'" ', 1)
if dT == "HTML5":
html += '<figcaption style="font-weight:bold">'+self.idevice.caption+'</figcaption>'+lb
else:
html += '<strong>'+self.idevice.caption+'</strong>'+lb
html += '</'+figureTag+'>'+lb
text = self.textElement.renderPreview()
if text:
text = text.replace('"block iDevice_content"', '"iDevice_text"', 1)
html += text
else:
html += ' '
html += '</div>'+lb # /.iDevice_content
html += common.ideviceFooter(self, style, "preview")
return html
def renderView(self, style):
"""
Returns an XHTML string for viewing this block
"""
lb = "\n" #Line breaks
dT = common.getExportDocType()
sectionTag = "div"
if dT == "HTML5":
sectionTag = "section"
html = common.ideviceHeader(self, style, "view")
html += self.instructionElement.renderView()
for element in self.questionElements:
html += "<"+sectionTag+" class=\"question\">"+lb
html += element.renderQuestionView()
html += element.renderFeedbackView()
html += "</"+sectionTag+">"+lb
html += common.ideviceFooter(self, style, "view")
return html
def _renderGame(self, style, mode="view"):
previewMode = False
resourcePath = ""
if mode == "preview":
previewMode = True
resourcePath = "resources/"
html = common.ideviceHeader(self, style, mode)
html += \
"""
<script src="%(resourcePath)sjquery-ui-1.10.3.custom.min.js" type="text/javascript"> </script>
<script src="%(resourcePath)sclickinorder.js" type="text/javascript"> </script>
<script type="text/javascript">
var clickInOrderGame%(gameId)s = new ClickInOrder('%(gameId)s');
""" % { 'gameId' : str(self.id), 'resourcePath': resourcePath }
if self.questionOrderChoiceElement.renderView() == "1":
html += "clickInOrderGame%(gameId)s.randomizeQuestions = true;\n" % {
'gameId': str(self.id)
}
if self.timerChoiceElement.renderView() == "1":
html += "clickInOrderGame%(gameId)s.timerMode = %(timerMode)s;\n" % \
{"gameId" : str(self.id), "timerMode" : self.timerChoiceElement.renderView() }
for clickableAreaElement in self.clickableAreaElements:
hideDelayStr = clickableAreaElement.textElements[
'hideDelay'].renderView()
if len(hideDelayStr) < 1:
hideDelayStr = "0"
html += "clickInOrderGame%(gameId)s.addClickableArea(\"%(clickableId)s\", %(hideDelay)s, %(bounds)s);\n" \
% {'gameId' : str(self.id), 'clickableId' : str(clickableAreaElement.id), \
'hideDelay' : int(hideDelayStr),\
'bounds' : "new Array(" + clickableAreaElement.textElements['left'].renderView() + "," \
+ clickableAreaElement.textElements['top'].renderView() + ","
+ clickableAreaElement.textElements['width'].renderView() + ","
+ clickableAreaElement.textElements['height'].renderView() +")"}
html += "</script>\n"
if previewMode == True:
html += self.mainTextAreaElements['Instructions'].renderPreview()
else:
html += self.mainTextAreaElements['Instructions'].renderView()
html += '<div id="clickableAreaGameCompleteFeedback' + self.id + '" style="position: absolute; z-index: 3">'
if previewMode == True:
html += self.mainTextAreaElements[
'CompleteFeedback'].renderPreview()
else:
html += self.mainTextAreaElements['CompleteFeedback'].renderView()
html += "</div>"
html += '<div id="clickableAreaPositiveFeedback' + self.id + '" style="position: absolute; z-index: 1">'
if previewMode == True:
html += self.mainTextAreaElements[
'PositiveFeedback'].renderPreview()
else:
html += self.mainTextAreaElements['PositiveFeedback'].renderView()
html += "</div>"
html += '<div id="clickableAreaNegativeFeedback' + self.id + '" style="position: absolute; z-index: 2">'
if previewMode == True:
html += self.mainTextAreaElements[
'NegativeFeedback'].renderPreview()
else:
html += self.mainTextAreaElements['NegativeFeedback'].renderView()
html += "</div>"
if self.timerChoiceElement.renderView() == "1":
html += '<input id="clickinordertimer' + self.id + '" style="' + \
self.mainTextElements['timerStyle'].renderView() + ' "/>\n'
for clickableAreaElement in self.clickableAreaElements:
posStyleTopLeft = "position: absolute; margin-left: %(left)spx; margin-top: %(top)spx; z-index: 2; " \
% { 'left' : clickableAreaElement.textElements['left'].renderView(), \
'top' : clickableAreaElement.textElements['top'].renderView() }
posStyleWidthHeight = "height: %(height)spx; width: %(width)spx; " % \
{ 'width' : clickableAreaElement.textElements['width'].renderView(), \
'height' : clickableAreaElement.textElements['height'].renderView() }
divDictArgs = { 'gameId' : str(self.id), \
'clickableAreaId' : str(clickableAreaElement.id), \
'posStyle' : posStyleTopLeft, \
'posStyleWH' : posStyleWidthHeight }
html += """<div id="clickableArea_%(gameId)s_%(clickableAreaId)s" style="%(posStyle)s %(posStyleWH)s "
onclick="clickInOrderGame%(gameId)s.checkClick(\'%(clickableAreaId)s\')"> </div>""" \
% divDictArgs
html += '<div id="clickableAreaShowMe_%(gameId)s_%(clickableAreaId)s" style="%(posStyle)s">' \
% divDictArgs
if previewMode == True:
html += clickableAreaElement.textAreaElements[
'ShowMe'].renderPreview()
else:
html += clickableAreaElement.textAreaElements[
'ShowMe'].renderView()
html += '</div>'
#the click to start area
gameSizeArgs = { 'gameId' : str(self.id), \
'width' : self.mainTextElements['width'].renderView() ,\
'height' : self.mainTextElements['height'].renderView()}
html += """<div id=\"clickinordercontainer%(gameId)s\" style=\"width: %(width)spx; height: %(height)spx; overflow: hidden;\"
>""" \
% gameSizeArgs
html += """<div id="clickinorderstartarea%(gameId)s\" onclick="clickInOrderGame%(gameId)s.startGame()"
style=\"width: %(width)spx; height: %(height)spx; position: absolute;\">""" \
% gameSizeArgs
if previewMode == True:
html += self.mainTextAreaElements[
'ClickToStartArea'].renderPreview()
else:
html += self.mainTextAreaElements['ClickToStartArea'].renderView()
html += "</div>"
#the main area
html += """<div id="clickinordermainarea%(gameId)s" onclick="clickInOrderGame%(gameId)s.validateClick"
style=\"width: %(width)spx; height: %(height)spx; position: absolute;\">""" \
% gameSizeArgs
if previewMode == True:
html += self.mainTextAreaElements['MainArea'].renderPreview()
else:
html += self.mainTextAreaElements['MainArea'].renderView()
html += "</div>"
html += "</div>"
#the hints
html += "<div id=\"clickInOrderHints" + self.id + "\" style=\"" \
+ "width: " + self.mainTextElements['hintWidth'].renderView() + "px; " \
+ "height: " + self.mainTextElements['hintHeight'].renderView() + "px; " \
+ self.mainTextElements['hintAreaStyle'].renderView() + "\">\n"
for clickableAreaElement in self.clickableAreaElements:
html += "<div id=\"clickableAreaInstruction_%(gameId)s_%(clickableAreaId)s\" style=\"position: absolute\">" \
% { 'gameId' : str(self.id), 'clickableAreaId' : str(clickableAreaElement.id) }
if previewMode == True:
html += clickableAreaElement.textAreaElements[
'Hint'].renderPreview()
else:
html += clickableAreaElement.textAreaElements[
'Hint'].renderView()
html += "</div>\n"
html += "</div>"
html += '<input id="clickinordercounter' + self.id + '" style="' + \
self.mainTextElements['elementCounterStyle'].renderView() +' " value="1"/>\n'
html += "<script type=\"text/javascript\">clickInOrderGame%(gameId)s.init();</script>\n" % {
'gameId': str(self.id)
}
html += common.ideviceFooter(self, style, mode)
return html
def _renderGame(self, style, mode = "view"):
hangmanGameId = "hangman" + self.id
resPath = ""
if mode == "preview":
resPath = "/scripts/"
html = u"<script src='" + resPath + "hangman.js' type='text/javascript'></script>\n"
html += common.ideviceHeader(self, style, mode)
html += "<div id='hangman%(gameId)smessageStore' style='display: none'>" % {"gameId" : hangmanGameId}
html += self._renderHTMLElement(mode, self.wrongGuessTextElement, "hmwrong" + hangmanGameId)
html += self._renderHTMLElement(mode, self.lostLevelTextElement, "hmlost" + hangmanGameId)
html += self._renderHTMLElement(mode, self.levelPassedTextElement, "hmpassed" + hangmanGameId)
html += self._renderHTMLElement(mode, self.gameWonTextElement, "hmwon" + hangmanGameId)
html += "</div>"
#Go through the images and find out the max height and maxwidth
imgMaxHeight = 0
imgMaxWidth = 0
for imgElement in self.chanceImageElements:
if imgElement.field.imageResource and imgElement.field.imageResource is not None:
if(int(imgElement.field.width) > imgMaxWidth):
imgMaxWidth = int(imgElement.field.width)
if(imgElement.field.height > imgMaxHeight):
imgMaxHeight = int(imgElement.field.height)
#Makes a javascript array of the list of words that the user has given
#This assigned as data-hangman-words
num_words = len(self.wordElements)
word_attr = "["
for wordIndex, word in enumerate(self.wordElements):
word_attr += "["%(word)s", "%(hint)s"]" % {
"word" : word.renderView(),
"hint" : self.hintElements[wordIndex].renderView(),
}
if wordIndex < num_words -1:
word_attr += ","
word_attr += "]"
"""Make main element to hold values for the exercise """
html += """<div class='exehangmanblock' id=\"exe%(id)s\"
data-hangman-id=\"%(id)s\"
data-hangman-words=\"%(words)s\"
data-buttonstyle-before="%(button_style_before)s"
data-buttonstyle-correct="%(button_style_correct)s"
data-buttonstyle-wrong="%(button_style_wrong)s"
data-alphabet="%(alphabet)s">
""" % {
"id" : hangmanGameId, "words" : word_attr,
"button_style_before" :
self.letterButtonStyleElement.renderView(),
"button_style_correct" :
self.rightLetterButtonStyleElement.renderView(),
"button_style_wrong" :
self.wrongLetterButtonStyleElement.renderView(),
"alphabet":
self.alphabetElement.renderView()
}
html += "<div class=\"hangmanimage_series\">"
#render view of these images
for imgElement in self.chanceImageElements:
if imgElement.field.imageResource and imgElement.field.imageResource is not None:
img_str = None
if mode == "view":
img_str = imgElement.renderView()
else:
img_str = imgElement.renderPreview()
#make it stay within what it should do on a phone
img_str = img_str[:4] + " style='max-width: 100%' " + img_str[4:]
html += img_str
html += "</div>"
messageTopMargin = (imgMaxHeight - 30) / 2
gameWidth = max(600, imgMaxWidth)
game_area_dict = { "gameId" : hangmanGameId, "width" : gameWidth, "height": imgMaxHeight, \
"messagetopmargin" : messageTopMargin, 'hintStyle' : self.hintFieldStyleElement.renderView(), \
'wordStyle' : self.wordAreaStyleElement.renderView(), 'resetText' : self.resetButtonTextElement.renderView(), \
'resetStyle' : self.resetButtonStyleElement.renderView() }
game_area_str ="""
<div id="%(gameId)s_gamearea" style='width: %(width)dpx; max-width: 100%%; overflow-x: hidden; margin-bottom: 130px;' class='exehangman_gamearea'>
<div class='exehangman_alertarea' id="%(gameId)s_alertarea"
style='position: absolute; z-index: 10; text-align: center; border: 1px; background-color: white; width: %(width)dpx; margin-top: %(messagetopmargin)dpx; visibility: hidden'>
 
</div>
<div id="%(gameId)s_imgarea" style='height: %(height)dpx; z-index: 1;' class='exehangman_imgarea'>
</div>
<input type='text' id='%(gameId)s_hintarea' style='%(hintStyle)s width: %(width)dpx; max-width: 100%%;' class='exehangman_hintarea'/>
<input type='text' id='%(gameId)s_wordarea' style='%(wordStyle)s width: %(width)dpx; max-width: 100%%' class='exehangman_wordarea'/>
<div id="%(gameId)s_letterarea" class='exehangman_letterarea'>
</div>
<input class='exehangman_resetbutton' type='button' value='%(resetText)s' style='%(resetStyle)s' onclick='restartLevel("%(gameId)s")'/>
</div>
"""
gameAreaHTML = game_area_str % game_area_dict
html += gameAreaHTML
return html
def renderPreview(self, style):
html = common.ideviceHeader(self, style, "preview")
html += self.renderHTML(preview_mode = True)
html += common.ideviceFooter(self, style, "preview")
return html
def _renderGame(self, style, mode = "view"):
hangmanGameId = "hangman" + self.id
resPath = ""
if mode == "preview":
resPath = "/templates/"
html = u"<script src='" + resPath + "hangman.js' type='text/javascript'></script>\n"
html += common.ideviceHeader(self, style, mode)
html += "<div id='hangman%(gameId)smessageStore' style='display: none'>" % {"gameId" : hangmanGameId}
html += self._renderHTMLElement(mode, self.wrongGuessTextElement, "hmwrong" + hangmanGameId)
html += self._renderHTMLElement(mode, self.lostLevelTextElement, "hmlost" + hangmanGameId)
html += self._renderHTMLElement(mode, self.levelPassedTextElement, "hmpassed" + hangmanGameId)
html += self._renderHTMLElement(mode, self.gameWonTextElement, "hmwon" + hangmanGameId)
html += "</div>"
html += u"<script type='text/javascript'>\n"
#Go through the images and find out the max height and maxwidth
imgMaxHeight = 0
imgMaxWidth = 0
for imgElement in self.chanceImageElements:
if imgElement.field.imageResource and imgElement.field.imageResource is not None:
if(int(imgElement.field.width) > imgMaxWidth):
imgMaxWidth = int(imgElement.field.width)
if(imgElement.field.height > imgMaxHeight):
imgMaxHeight = int(imgElement.field.height)
#Makes a javascript array of the list of words that the user has given
html += "hangman_words['%s'] = new Array();\n" % hangmanGameId
html += "hangman_buttonStyles['%s'] = new Array();\n" % hangmanGameId
for wordIndex, word in enumerate(self.wordElements):
html += u"hangman_words['%(gameId)s'][%(index)d] = new Array('%(word)s', '%(hint)s');\n" % \
{"index" : wordIndex, "word" : word.renderView(), \
"hint" : self.hintElements[wordIndex].renderView(), \
"gameId" : hangmanGameId }
#make the style for the buttons
html += "hangman_buttonStyles['%(gameId)s'][HANGMAN_BEFORE_GUESS] = \"%(style)s\";\n" \
% {"gameId" : hangmanGameId, "style" : self.letterButtonStyleElement.renderView()}
html += "hangman_buttonStyles['%(gameId)s'][HANGMAN_CORRECT_GUESS] = \"%(style)s\";\n" \
% {"gameId" : hangmanGameId, "style" : self.rightLetterButtonStyleElement.renderView()}
html += "hangman_buttonStyles['%(gameId)s'][HANGMAN_WRONG_GUESS] = \"%(style)s\";\n" \
% {"gameId" : hangmanGameId, "style" : self.wrongLetterButtonStyleElement.renderView()}
#Makes a javscript string of the alphabet that the user can guess from
html += u"hangman_alphabet['%(gameId)s'] = '%(alphabet)s';\n" % \
{"alphabet" : self.alphabetElement.renderView(), \
"gameId" : hangmanGameId }
#Makes an array of the ids of the divs that hold the chance images
html += u"hangman_chanceimgids['%s'] = new Array();\n" % hangmanGameId
for imgIndex, imgElement in enumerate(self.chanceImageElements):
html += "hangman_chanceimgids['%(gameId)s'][%(index)d] = '%(imgdivid)s';\n" % \
{"index" : imgIndex, "imgdivid" : "hangman" + self.id + "img" + imgElement.id, \
"gameId" : hangmanGameId }
#Make the messages for this game
html += u"playerMessages['%s'] = new Array();\n" % hangmanGameId
messagesStr = """
playerMessages['%(gameid)s']['wrongguess'] =
document.getElementById('hmwrong%(gameid)s').innerHTML;
playerMessages['%(gameid)s']['lostlevel'] =
document.getElementById('hmlost%(gameid)s').innerHTML;
playerMessages['%(gameid)s']['levelpassed'] =
document.getElementById('hmpassed%(gameid)s').innerHTML;
playerMessages['%(gameid)s']['gamewon'] =
document.getElementById('hmwon%(gameid)s').innerHTML;
</script>
""" % {"gameid" : hangmanGameId }
html += messagesStr
html += "<div id='hangman" + self.id + "_img'>"
#render view of these images
for imgElement in self.chanceImageElements:
if imgElement.field.imageResource and imgElement.field.imageResource is not None:
html += "<div id='hangman" + self.id + "img" + imgElement.id + "' style='display: none'>"
if mode == "view":
html += imgElement.renderView()
else:
html += imgElement.renderPreview()
html += "</div>"
html += "</div>"
messageTopMargin = (imgMaxHeight - 30) / 2
gameWidth = max(600, imgMaxWidth)
gameAreaHTML = """
<div id="%(gameId)s_gamearea" style='width: %(width)dpx;' class='exehangman_gamearea'>
<div class='exehangman_alertarea' id="%(gameId)s_alertarea" style='position: absolute; z-index: 10; text-align: center; border: 1px; background-color: white; width: %(width)dpx; margin-top: %(messagetopmargin)dpx; visibility: hidden'>
 
</div>
<div id="%(gameId)s_imgarea" style='height: %(height)dpx; z-index: 1;' class='exehangman_imgarea'>
</div>
<input type='text' style='%(hintStyle)s' id='%(gameId)s_hintarea' style='width: %(width)dpx' class='exehangman_hintarea'/>
<input type='text' style='%(wordStyle)s' id='%(gameId)s_wordarea' style='width: %(width)dpx' class='exehangman_wordarea'/>
<div id="%(gameId)s_letterarea" class='exehangman_letterarea'>
</div>
<input class='exehangman_resetbutton' type='button' value='%(resetText)s' style='%(resetStyle)s' onclick='restartLevel("%(gameId)s")'/>
</div>
""" % { "gameId" : hangmanGameId, "width" : gameWidth, "height": imgMaxHeight, \
"messagetopmargin" : messageTopMargin, 'hintStyle' : self.hintFieldStyleElement.renderView(), \
'wordStyle' : self.wordAreaStyleElement.renderView(), 'resetText' : self.resetButtonTextElement.renderView(), \
'resetStyle' : self.resetButtonStyleElement.renderView() }
html += gameAreaHTML
html += "<script type='text/javascript'>setupGame('%s');</script>" % hangmanGameId
return html
def renderView(self, style):
html = common.ideviceHeader(self, style, "view")
html += self.content_element.renderPreview()
html += common.ideviceFooter(self, style, "view")
return html
def _renderGame(self, style, mode = "view"):
hangmanGameId = "hangman" + self.id
resPath = ""
if mode == "preview":
resPath = "resources/"
html = u"<script src='" + resPath + "hangman.js' type='text/javascript'></script>\n"
html += common.ideviceHeader(self, style, mode)
html += "<div id='hangman%(gameId)smessageStore' style='display: none'>" % {"gameId" : hangmanGameId}
html += self._renderHTMLElement(mode, self.wrongGuessTextElement, "hmwrong" + hangmanGameId)
html += self._renderHTMLElement(mode, self.lostLevelTextElement, "hmlost" + hangmanGameId)
html += self._renderHTMLElement(mode, self.levelPassedTextElement, "hmpassed" + hangmanGameId)
html += self._renderHTMLElement(mode, self.gameWonTextElement, "hmwon" + hangmanGameId)
html += "</div>"
html += u"<script type='text/javascript'>\n"
#Go through the images and find out the max height and maxwidth
imgMaxHeight = 0
imgMaxWidth = 0
for imgElement in self.chanceImageElements:
if imgElement.field.imageResource and imgElement.field.imageResource is not None:
if(int(imgElement.field.width) > imgMaxWidth):
imgMaxWidth = int(imgElement.field.width)
if(imgElement.field.height > imgMaxHeight):
imgMaxHeight = int(imgElement.field.height)
#Makes a javascript array of the list of words that the user has given
html += "hangman_words['%s'] = new Array();\n" % hangmanGameId
html += "hangman_buttonStyles['%s'] = new Array();\n" % hangmanGameId
for wordIndex, word in enumerate(self.wordElements):
html += u"hangman_words['%(gameId)s'][%(index)d] = new Array('%(word)s', '%(hint)s');\n" % \
{"index" : wordIndex, "word" : word.renderView(), \
"hint" : self.hintElements[wordIndex].renderView(), \
"gameId" : hangmanGameId }
#make the style for the buttons
html += "hangman_buttonStyles['%(gameId)s'][HANGMAN_BEFORE_GUESS] = \"%(style)s\";\n" \
% {"gameId" : hangmanGameId, "style" : self.letterButtonStyleElement.renderView()}
html += "hangman_buttonStyles['%(gameId)s'][HANGMAN_CORRECT_GUESS] = \"%(style)s\";\n" \
% {"gameId" : hangmanGameId, "style" : self.rightLetterButtonStyleElement.renderView()}
html += "hangman_buttonStyles['%(gameId)s'][HANGMAN_WRONG_GUESS] = \"%(style)s\";\n" \
% {"gameId" : hangmanGameId, "style" : self.wrongLetterButtonStyleElement.renderView()}
#Makes a javscript string of the alphabet that the user can guess from
html += u"hangman_alphabet['%(gameId)s'] = '%(alphabet)s';\n" % \
{"alphabet" : self.alphabetElement.renderView(), \
"gameId" : hangmanGameId }
#Makes an array of the ids of the divs that hold the chance images
html += u"hangman_chanceimgids['%s'] = new Array();\n" % hangmanGameId
for imgIndex, imgElement in enumerate(self.chanceImageElements):
html += "hangman_chanceimgids['%(gameId)s'][%(index)d] = '%(imgdivid)s';\n" % \
{"index" : imgIndex, "imgdivid" : "hangman" + self.id + "img" + imgElement.id, \
"gameId" : hangmanGameId }
#Make the messages for this game
html += u"playerMessages['%s'] = new Array();\n" % hangmanGameId
messagesStr = """
playerMessages['%(gameid)s']['wrongguess'] =
document.getElementById('hmwrong%(gameid)s').innerHTML;
playerMessages['%(gameid)s']['lostlevel'] =
document.getElementById('hmlost%(gameid)s').innerHTML;
playerMessages['%(gameid)s']['levelpassed'] =
document.getElementById('hmpassed%(gameid)s').innerHTML;
playerMessages['%(gameid)s']['gamewon'] =
document.getElementById('hmwon%(gameid)s').innerHTML;
</script>
""" % {"gameid" : hangmanGameId }
html += messagesStr
html += "<div id='hangman" + self.id + "_img'>"
#render view of these images
for imgElement in self.chanceImageElements:
if imgElement.field.imageResource and imgElement.field.imageResource is not None:
html += "<div id='hangman" + self.id + "img" + imgElement.id + "' style='display: none'>"
if mode == "view":
html += imgElement.renderView()
else:
html += imgElement.renderPreview()
html += "</div>"
html += "</div>"
messageTopMargin = (imgMaxHeight - 30) / 2
gameWidth = max(600, imgMaxWidth)
gameAreaHTML = """
<div id="%(gameId)s_gamearea" style='width: %(width)dpx;' class='exehangman_gamearea'>
<div class='exehangman_alertarea' id="%(gameId)s_alertarea" style='position: absolute; z-index: 10; text-align: center; border: 1px; background-color: white; width: %(width)dpx; margin-top: %(messagetopmargin)dpx; visibility: hidden'>
 
</div>
<div id="%(gameId)s_imgarea" style='height: %(height)dpx; z-index: 1;' class='exehangman_imgarea'>
</div>
<input type='text' style='%(hintStyle)s' id='%(gameId)s_hintarea' style='width: %(width)dpx' class='exehangman_hintarea'/>
<input type='text' style='%(wordStyle)s' id='%(gameId)s_wordarea' style='width: %(width)dpx' class='exehangman_wordarea'/>
<div id="%(gameId)s_letterarea" class='exehangman_letterarea'>
</div>
<input class='exehangman_resetbutton' type='button' value='%(resetText)s' style='%(resetStyle)s' onclick='restartLevel("%(gameId)s")'/>
</div>
""" % { "gameId" : hangmanGameId, "width" : gameWidth, "height": imgMaxHeight, \
"messagetopmargin" : messageTopMargin, 'hintStyle' : self.hintFieldStyleElement.renderView(), \
'wordStyle' : self.wordAreaStyleElement.renderView(), 'resetText' : self.resetButtonTextElement.renderView(), \
'resetStyle' : self.resetButtonStyleElement.renderView() }
html += gameAreaHTML
html += "<script type='text/javascript'>setupGame('%s');</script>" % hangmanGameId
return html
def _renderForGame(self, style, previewMode = False):
"""
Renders the block as the script and XHTML elements that will be needed in order
to make this run as a game
"""
viewModeStr = "view"
scriptPrefix = ""
if previewMode == True:
scriptPrefix = "resources/"
viewModeStr = "preview"
html = "<script src='%sjquery-ui-1.10.3.custom.min.js' type='text/javascript'></script>\n" % scriptPrefix
html += "<script src='%splacetheobjects.js' type='text/javascript'></script>\n" % scriptPrefix
html += common.ideviceHeader(self, style, viewModeStr)
#this shows the instructions
html += self.contentElement.renderView()
"""
Here we make the droppable target divs
"""
for placeableObjectElement in self.placableObjectElements:
borderStr = ""
if previewMode == True:
borderStr = "border: 1px solid red;"
tolerance = int(placeableObjectElement.toleranceElement.renderView())
html += """<div id='%(droppableid)s' class='placeTheObjectTargetClass%(gameId)s' style='position: absolute;
margin-left: %(marginleft)dpx; margin-top: %(margintop)dpx;
width: %(width)dpx; height: %(height)dpx; %(borderstr)s '>
</div>
""" % { "droppableid" : self._makeObjectDivId("droppable", placeableObjectElement), \
"marginleft" : int(placeableObjectElement.targetXElement.renderView()) - tolerance, \
"margintop" : int(placeableObjectElement.targetYElement.renderView()) - tolerance, \
"width": int(placeableObjectElement.widthElement.renderView()) + (tolerance * 2), \
"height": int(placeableObjectElement.heightElement.renderView()) + (tolerance * 2), \
"borderstr": borderStr, "gameId" : str(self.id) }
"""+ve/-ve feedback areas"""
html += "<div id='placetheobjects_" + self.id +"_positivefeedback'" \
+" style='position: absolute; z-index: 1; '>"
if previewMode == True:
html += self.positiveResponseElement.renderPreview()
else:
html += self.positiveResponseElement.renderView()
html += "</div>"
html += "<div id='placetheobjects_" + self.id + "_negativefeedback' " \
+ "style='position: absolute; z-index: 1;'>"
if previewMode == True:
html += self.negativeResponseElement.renderPreview()
else:
html += self.negativeResponseElement.renderView()
html += "</div>"
"""What to click to start the game"""
html += "<div id='placetheobjects_" + self.id + "_clicktostart' style='position: " \
+ "absolute; cursor: pointer; z-index: 3' onclick='startPlaceGame(\"" + self.id + "\")'>"
if previewMode == True:
html += self.clickToStartElement.renderPreview()
else:
html += self.clickToStartElement.renderView()
html += "</div>"
"""
This is the main area background where the elements are going to be dropped...
"""
html += "<div style='z-index: -4;' id='placetheobjects_" + self.id + "_main'>"
if previewMode == True:
html += self.mainAreaElement.renderPreview()
else:
html += self.mainAreaElement.renderView()
html += "</div>"
"""
Here we make the part bin that will contain the elements that will be dragged
and dropped in place
"""
html += "<div id='placetheobjects" + self.id + "_partbin'>\n"
html += "<table cellpadding='2' cellspacing='2'>"
numCols = int(self.partbinNumCols.renderView())
html += "<!-- num cols = " + str(numCols) + "-->"
colCount = 0
elementCount = 0
for placeableObjectElement in self.placableObjectElements:
if elementCount % numCols == 0:
#we need to make a new row...
if elementCount > 0:
html += "</tr>"
html += "<tr>"
idname = self._makeObjectDivId("draggable", placeableObjectElement)
elementDimensions = {"width" : int(placeableObjectElement.widthElement.renderView()), \
"height" : int(placeableObjectElement.heightElement.renderView()) }
html += "<td style='width: %(width)dpx; height: $(height)spx;'>"
html += "<div id='" + idname + "' onclick=\"objectPlacePickupElement('%(gameid)s', '%(draggableid)s')\" style='cursor: pointer; " \
% {"gameid" : str(self.id), "draggableid" : idname}
html += "width: %(width)dpx; height: %(height)dpx; overflow: hidden; z-index: 1;'>\n" \
% elementDimensions
html += placeableObjectElement.mainContentElement.renderView()
html += "</div>\n"
html += "</td>"
elementCount += 1
html += "</tr></table>"
html += "</div>\n"
html += "<!-- Javascript Code Generated by placetheobjectsblock.py - DO NOT MODIFY -->\n"
html += "<script type='text/javascript'>\n"
html +="initPlaceTheObjectsGameData('" + self.id + "');\n"
html += "placeTheObjectsGameData['" + self.id + "']['showtimer'] = '" + str(self.gameTimerShown.field.content) + "';\n"
html += "placeTheObjectsGameData['" + self.id + "']['timelimit'] = '" + str(self.gameTimeLimit.field.content) + "';\n"
for placeableObjectElement in self.placableObjectElements:
draggable_id = self._makeObjectDivId("draggable", placeableObjectElement)
droppable_id = self._makeObjectDivId("droppable", placeableObjectElement)
perItemCode = """
if(exe_isTouchScreenDev == false) {
$(function() {
$("#%(draggableid)s").draggable({
revert : 'invalid',
start: function(event, ui) {
placeObjectReadyTarget("%(droppableid)s");
},
stop: function (event, ui) {
placeObjectHideTarget("%(droppableid)s");
setTimeout('checkObjectPlaceOK("%(gameId)s", "%(draggableid)s")', 300);
}
}
);
$("#%(droppableid)s").droppable({
accept: "#%(draggableid)s",
activeClass: "ui-state-hover",
hoverClass: "ui-state-active",
drop: function(event, ui) {
$("#%(draggableid)s").effect("pulsate", {}, "fast");
objectPlaceOK("%(gameId)s", "%(draggableid)s");
}
});
});
document.getElementById("%(draggableid)s").onclick = null;
}
placeTheObjectsGameData['%(gameId)s']['elements']['%(draggableid)s'] = new Array();
placeTheObjectsGameData['%(gameId)s']['elements']['%(draggableid)s']['status'] = 'notplaced';
placeTheObjectsGameData['%(gameId)s']['elements']['%(draggableid)s']['bounds'] = new Array(%(targetx)s, %(targety)s, %(width)s, %(height)s );
""" % { "draggableid" : draggable_id, "droppableid" : droppable_id, "gameId" : str(self.id), \
"targetx": placeableObjectElement.targetXElement.renderView() , "targety" : placeableObjectElement.targetYElement.renderView(),\
"width" : placeableObjectElement.widthElement.renderView(), "height" : placeableObjectElement.heightElement.renderView() }
html += perItemCode
html += "</script>\n"
html += common.ideviceFooter(self, style, viewModeStr)
return html
def _renderGame(self, style, mode="view"):
previewMode = False
resourcePath = ""
if mode == "preview":
previewMode = True
resourcePath = "resources/"
html = common.ideviceHeader(self, style, mode)
html += \
"""
<script src="%(resourcePath)sjquery-ui-1.10.3.custom.min.js" type="text/javascript"> </script>
<script src="%(resourcePath)sclickinorder.js" type="text/javascript"> </script>
<script type="text/javascript">
var clickInOrderGame%(gameId)s = new ClickInOrder('%(gameId)s');
""" % { 'gameId' : str(self.id), 'resourcePath': resourcePath }
if self.questionOrderChoiceElement.renderView() == "1":
html += "clickInOrderGame%(gameId)s.randomizeQuestions = true;\n" % { 'gameId' : str(self.id) }
if self.timerChoiceElement.renderView() == "1":
html += "clickInOrderGame%(gameId)s.timerMode = %(timerMode)s;\n" % \
{"gameId" : str(self.id), "timerMode" : self.timerChoiceElement.renderView() }
for clickableAreaElement in self.clickableAreaElements:
hideDelayStr = clickableAreaElement.textElements['hideDelay'].renderView()
if len(hideDelayStr) < 1:
hideDelayStr = "0"
html += "clickInOrderGame%(gameId)s.addClickableArea(\"%(clickableId)s\", %(hideDelay)s, %(bounds)s);\n" \
% {'gameId' : str(self.id), 'clickableId' : str(clickableAreaElement.id), \
'hideDelay' : int(hideDelayStr),\
'bounds' : "new Array(" + clickableAreaElement.textElements['left'].renderView() + "," \
+ clickableAreaElement.textElements['top'].renderView() + ","
+ clickableAreaElement.textElements['width'].renderView() + ","
+ clickableAreaElement.textElements['height'].renderView() +")"}
html += "</script>\n"
if previewMode == True:
html += self.mainTextAreaElements['Instructions'].renderPreview()
else:
html += self.mainTextAreaElements['Instructions'].renderView()
html += '<div id="clickableAreaGameCompleteFeedback' + self.id + '" style="position: absolute; z-index: 3">'
if previewMode == True:
html +=self.mainTextAreaElements['CompleteFeedback'].renderPreview()
else:
html += self.mainTextAreaElements['CompleteFeedback'].renderView()
html += "</div>"
html += '<div id="clickableAreaPositiveFeedback' + self.id +'" style="position: absolute; z-index: 1">'
if previewMode == True:
html += self.mainTextAreaElements['PositiveFeedback'].renderPreview()
else:
html += self.mainTextAreaElements['PositiveFeedback'].renderView()
html += "</div>"
html += '<div id="clickableAreaNegativeFeedback' + self.id +'" style="position: absolute; z-index: 2">'
if previewMode == True:
html += self.mainTextAreaElements['NegativeFeedback'].renderPreview()
else:
html += self.mainTextAreaElements['NegativeFeedback'].renderView()
html += "</div>"
if self.timerChoiceElement.renderView() == "1":
html += '<input id="clickinordertimer' + self.id + '" style="' + \
self.mainTextElements['timerStyle'].renderView() + ' "/>\n'
for clickableAreaElement in self.clickableAreaElements:
posStyleTopLeft = "position: absolute; margin-left: %(left)spx; margin-top: %(top)spx; z-index: 2; " \
% { 'left' : clickableAreaElement.textElements['left'].renderView(), \
'top' : clickableAreaElement.textElements['top'].renderView() }
posStyleWidthHeight = "height: %(height)spx; width: %(width)spx; " % \
{ 'width' : clickableAreaElement.textElements['width'].renderView(), \
'height' : clickableAreaElement.textElements['height'].renderView() }
divDictArgs = { 'gameId' : str(self.id), \
'clickableAreaId' : str(clickableAreaElement.id), \
'posStyle' : posStyleTopLeft, \
'posStyleWH' : posStyleWidthHeight }
html += """<div id="clickableArea_%(gameId)s_%(clickableAreaId)s" style="%(posStyle)s %(posStyleWH)s "
onclick="clickInOrderGame%(gameId)s.checkClick(\'%(clickableAreaId)s\')"> </div>""" \
% divDictArgs
html += '<div id="clickableAreaShowMe_%(gameId)s_%(clickableAreaId)s" style="%(posStyle)s">' \
% divDictArgs
if previewMode == True:
html += clickableAreaElement.textAreaElements['ShowMe'].renderPreview()
else:
html += clickableAreaElement.textAreaElements['ShowMe'].renderView()
html += '</div>'
#the click to start area
gameSizeArgs = { 'gameId' : str(self.id), \
'width' : self.mainTextElements['width'].renderView() ,\
'height' : self.mainTextElements['height'].renderView()}
html += """<div id=\"clickinordercontainer%(gameId)s\" style=\"width: %(width)spx; height: %(height)spx; overflow: hidden;\"
>""" \
% gameSizeArgs
html += """<div id="clickinorderstartarea%(gameId)s\" onclick="clickInOrderGame%(gameId)s.startGame()"
style=\"width: %(width)spx; height: %(height)spx; position: absolute;\">""" \
% gameSizeArgs
if previewMode == True:
html += self.mainTextAreaElements['ClickToStartArea'].renderPreview()
else:
html += self.mainTextAreaElements['ClickToStartArea'].renderView()
html += "</div>"
#the main area
html += """<div id="clickinordermainarea%(gameId)s" onclick="clickInOrderGame%(gameId)s.validateClick"
style=\"width: %(width)spx; height: %(height)spx; position: absolute;\">""" \
% gameSizeArgs
if previewMode == True:
html += self.mainTextAreaElements['MainArea'].renderPreview()
else:
html += self.mainTextAreaElements['MainArea'].renderView()
html += "</div>"
html += "</div>"
#the hints
html += "<div id=\"clickInOrderHints" + self.id + "\" style=\"" \
+ "width: " + self.mainTextElements['hintWidth'].renderView() + "px; " \
+ "height: " + self.mainTextElements['hintHeight'].renderView() + "px; " \
+ self.mainTextElements['hintAreaStyle'].renderView() + "\">\n"
for clickableAreaElement in self.clickableAreaElements:
html += "<div id=\"clickableAreaInstruction_%(gameId)s_%(clickableAreaId)s\" style=\"position: absolute\">" \
% { 'gameId' : str(self.id), 'clickableAreaId' : str(clickableAreaElement.id) }
if previewMode == True:
html += clickableAreaElement.textAreaElements['Hint'].renderPreview()
else:
html += clickableAreaElement.textAreaElements['Hint'].renderView()
html += "</div>\n"
html += "</div>"
html += '<input id="clickinordercounter' + self.id + '" style="' + \
self.mainTextElements['elementCounterStyle'].renderView() +' " value="1"/>\n'
html += "<script type=\"text/javascript\">clickInOrderGame%(gameId)s.init();</script>\n" % { 'gameId': str(self.id) }
html += common.ideviceFooter(self, style, mode)
return html
