User:Frank Ralf/JavaScript1 - Revision history

Mudrd8mz: Text replacement - "`" to ""`


2021-07-14T20:36:04Z
Text replacement - "<code php>" to "<syntaxhighlight lang="php">"

				
				
				
				
				
				← Older revision
				Revision as of 20:36, 14 July 2021
				
Line 17:
Line 17:
That is the original code. There's a lot of DOM traversal and node counting going on due to browser incompatibilities. That is the original code. There's a lot of DOM traversal and node counting going on due to browser incompatibilities.



<code php> <syntaxhighlight lang="php">
<script type="text/javascript"> <script type="text/javascript">
     var teacherslist=document.getElementById('pe_teachers')      var teacherslist=document.getElementById('pe_teachers')
Line 54:
Line 54:
Using Moodle's default JavaScript library [[Development:YUI| YUI]] we can overcome those browser inconsistencies. We also move the inline "onclick" event handler to the JavaScript. (Note that the required YUI libraries are already part of a standard Moodle installation.)  For attaching the event handler we had to add an ID to the select checkbox. Using Moodle's default JavaScript library [[Development:YUI| YUI]] we can overcome those browser inconsistencies. We also move the inline "onclick" event handler to the JavaScript. (Note that the required YUI libraries are already part of a standard Moodle installation.)  For attaching the event handler we had to add an ID to the select checkbox.



<code php> <syntaxhighlight lang="php">
require_js(array( require_js(array(
         'yui_yahoo',          'yui_yahoo',
Line 95:
Line 95:
(Note that the required jQuery library is not part of a standard Moodle installation so you have to provide it yourself.)    (Note that the required jQuery library is not part of a standard Moodle installation so you have to provide it yourself.)   



<code php> <syntaxhighlight lang="php">
require_js(array( require_js(array(
         'jquery/jquery-1.3.2.min.js',          'jquery/jquery-1.3.2.min.js',
Line 129:
Line 129:
=== YUI === === YUI ===



<code php> <syntaxhighlight lang="php">
require_js('yui_dom-event'); require_js('yui_dom-event');



Line 152:
Line 152:
=== jQuery === === jQuery ===



<code php> <syntaxhighlight lang="php">
require_js('jquery/jquery-1.3.2.min.js'); require_js('jquery/jquery-1.3.2.min.js');



Line 171:
Line 171:



: You're right, Tim, the show() part is not very precise and would behave like you suggest. But that could easily be amended by defining the context of the form items more precisely, thus restricting the scope to the fieldset at hand: --[[User:Frank Ralf|Frank Ralf]] 16:15, 20 July 2009 (UTC)    : You're right, Tim, the show() part is not very precise and would behave like you suggest. But that could easily be amended by defining the context of the form items more precisely, thus restricting the scope to the fieldset at hand: --[[User:Frank Ralf|Frank Ralf]] 16:15, 20 July 2009 (UTC)   
:<code php>$('#pe_teachers .fitem').show('slow');</syntaxhighlight> :<syntaxhighlight lang="php">$('#pe_teachers .fitem').show('slow');</syntaxhighlight>



== Fair comparison - Next round == == Fair comparison - Next round ==
Line 182:
Line 182:
[[Image:JavaScript1 Teacher list.png]] [[Image:JavaScript1 Teacher list.png]]



<code php> <syntaxhighlight lang="php">
$mform =& $this->_form;   $mform =& $this->_form;  



Line 207:
Line 207:
Actually, I cheated a bit with the first version by giving the checkbox for the "Show only selected" option an ID. This is a bit problematic because in the HTML the ID is rendered as "id_showselected", which you might not suspect.   Actually, I cheated a bit with the first version by giving the checkbox for the "Show only selected" option an ID. This is a bit problematic because in the HTML the ID is rendered as "id_showselected", which you might not suspect.  



<code php> <syntaxhighlight lang="php">
$mform->addElement( $mform->addElement(
     'checkbox',      'checkbox',
Line 223:
Line 223:
So here's is the refactored code which matches the jQuery version more closely: So here's is the refactored code which matches the jQuery version more closely:



<code php> <syntaxhighlight lang="php">
<script type="text/javascript"> <script type="text/javascript">
YAHOO.util.Event.onDOMReady(function() { YAHOO.util.Event.onDOMReady(function() {
Line 249:
Line 249:
* The ''toggle()'' method provides animation as '''feedback''' for the user to see what's going on with the form. This kind of feedback is lacking from the YUI version (We leave adding this as an exercise for the reader). * The ''toggle()'' method provides animation as '''feedback''' for the user to see what's going on with the form. This kind of feedback is lacking from the YUI version (We leave adding this as an exercise for the reader).



<code php> <syntaxhighlight lang="php">
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
Line 268:
Line 268:
* '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if we reload the page while the selectbox is checked. * '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if we reload the page while the selectbox is checked.



<code php> <syntaxhighlight lang="php">
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function() {
Line 288:
Line 288:



OK, that latest comparison looks quite favourable to jQuery. However, this is a very simple example, and that is always dangerous. For example compare "Hello world" in PHP and Java: OK, that latest comparison looks quite favourable to jQuery. However, this is a very simple example, and that is always dangerous. For example compare "Hello world" in PHP and Java:
<code php> <syntaxhighlight lang="php">
<?php echo "Hello world!" ?> <?php echo "Hello world!" ?>

`Mudrd8mz: Text replacement - "`" to ""

2021-07-14T20:04:46Z

Text replacement - "</code>" to "</syntaxhighlight>"

← Older revision		Revision as of 20:04, 14 July 2021
Line 48:		Line 48:
	parentseve_toggleonlyselected(document.getElementsByName('showonlyselected')[0].checked);		parentseve_toggleonlyselected(document.getElementsByName('showonlyselected')[0].checked);
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	== YUI ==		== YUI ==
Line 89:		Line 89:
	YAHOO.util.Event.onDOMReady(addclick);		YAHOO.util.Event.onDOMReady(addclick);
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	== jQuery ==		== jQuery ==
Line 114:		Line 114:

	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	Advantages:		Advantages:
Line 148:		Line 148:
	});		});
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	=== jQuery ===		=== jQuery ===
Line 166:		Line 166:
	});		});
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	Actually, isn't this buggy? $('.fitem').show('slow'); will show every single .fitem on the whole form, even if they are nothing to do with this show/hide button? What would be very bad if you had two independent show/hide widgets on the same form. --[[User:Tim Hunt\|Tim Hunt]] 03:28, 12 July 2009 (UTC)		Actually, isn't this buggy? $('.fitem').show('slow'); will show every single .fitem on the whole form, even if they are nothing to do with this show/hide button? What would be very bad if you had two independent show/hide widgets on the same form. --[[User:Tim Hunt\|Tim Hunt]] 03:28, 12 July 2009 (UTC)

	: You're right, Tim, the show() part is not very precise and would behave like you suggest. But that could easily be amended by defining the context of the form items more precisely, thus restricting the scope to the fieldset at hand: --[[User:Frank Ralf\|Frank Ralf]] 16:15, 20 July 2009 (UTC)		: You're right, Tim, the show() part is not very precise and would behave like you suggest. But that could easily be amended by defining the context of the form items more precisely, thus restricting the scope to the fieldset at hand: --[[User:Frank Ralf\|Frank Ralf]] 16:15, 20 July 2009 (UTC)
	:<code php>$('#pe_teachers .fitem').show('slow');</~~code~~>		:<code php>$('#pe_teachers .fitem').show('slow');</syntaxhighlight>

	== Fair comparison - Next round ==		== Fair comparison - Next round ==
Line 199:		Line 199:
	$mform->closeHeaderBefore('showonlyselected');		$mform->closeHeaderBefore('showonlyselected');
	$mform->addElement('checkbox','showonlyselected','','Show only selected teachers');		$mform->addElement('checkbox','showonlyselected','','Show only selected teachers');
	</~~code~~>		</syntaxhighlight>

	You see we added another checkbox outside of the fieldset to see whether our code affects any other checkboxes which it shouldn't.		You see we added another checkbox outside of the fieldset to see whether our code affects any other checkboxes which it shouldn't.
Line 215:		Line 215:
	array('id'=> 'showselected')		array('id'=> 'showselected')
	);		);
	</~~code~~>		</syntaxhighlight>

	Because the jQuery code selects this form element by its name (''$("input[name = 'showonlyselected']")''), I changed the YUI code accordingly to use ''getElementsByName()'' instead of ''getElementById()''.		Because the jQuery code selects this form element by its name (''$("input[name = 'showonlyselected']")''), I changed the YUI code accordingly to use ''getElementsByName()'' instead of ''getElementById()''.
Line 240:		Line 240:
	});		});
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	=== jQuery ===		=== jQuery ===
Line 257:		Line 257:
	});		});
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	==== Another version ====		==== Another version ====
Line 276:		Line 276:
	});		});
	</script>		</script>
	</~~code~~>		</syntaxhighlight>

	: If you think that reads like plain English then I must be speaking some other language :-P--[[User:Tim Hunt\|Tim Hunt]] 09:57, 22 July 2009 (UTC)		: If you think that reads like plain English then I must be speaking some other language :-P--[[User:Tim Hunt\|Tim Hunt]] 09:57, 22 July 2009 (UTC)
Line 298:		Line 298:
	}		}
	}		}
	</~~code~~>		</syntaxhighlight>
	It would be a mistake to conclude from that that PHP is a better language for building a large system.		It would be a mistake to conclude from that that PHP is a better language for building a large system.

Nakohdo: /* See also */

2009-09-28T15:16:35Z

Nakohdo: /* Next challenge */

2009-07-22T13:02:34Z

Next challenge

← Older revision		Revision as of 13:02, 22 July 2009
Line 308:		Line 308:
	: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)		: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)

	<p class="note">The next challenge will take place on [[User:Frank Ralf/JavaScript2]].		<p class="note">
			The next challenge will take place on [[User:Frank Ralf/JavaScript2]].
	</p>		</p>

	== See also ==		== See also ==
	* [[Javascript FAQ]]		* [[Javascript FAQ]]

Nakohdo: /* Next challenge */

2009-07-22T13:00:50Z

Next challenge

← Older revision		Revision as of 13:00, 22 July 2009
Line 308:		Line 308:
	: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)		: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)

	The next challenge will take place on [[User:Frank Ralf/JavaScript2]].		<p class="note">The next challenge will take place on [[User:Frank Ralf/JavaScript2]].
			</p>

	== See also ==		== See also ==
	* [[Javascript FAQ]]		* [[Javascript FAQ]]

Nakohdo: /* Next challenge */

2009-07-22T12:58:48Z

Next challenge

← Older revision		Revision as of 12:58, 22 July 2009
Line 308:		Line 308:
	: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)		: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)

	The next challenge will take place ~~here~~ on [[~~Frank_Ralf~~/JavaScript2]].		The next challenge will take place on [[User:Frank Ralf/JavaScript2]].

	== See also ==		== See also ==
	* [[Javascript FAQ]]		* [[Javascript FAQ]]

Nakohdo: /* Next challenge */

2009-07-22T12:58:14Z

Next challenge

← Older revision		Revision as of 12:58, 22 July 2009
Line 303:		Line 303:
	If you really want to convince me, I would like to see a conversion of http://cvs.moodle.org/moodle/user/selector/script.js?view=markup (it is used on the assign roles and add group members pages). That is a serious application of JavaScript. However, that is also a lot of code, so it is not really fair to ask for a conversion just as a proof of concept.		If you really want to convince me, I would like to see a conversion of http://cvs.moodle.org/moodle/user/selector/script.js?view=markup (it is used on the assign roles and add group members pages). That is a serious application of JavaScript. However, that is also a lot of code, so it is not really fair to ask for a conversion just as a proof of concept.

	Re: ''"Note that these are no YUI methods but the usual JavaScript DOM ones (and therefor applied to document.). YUI only enhances the JavaScript DOM methods."''		Re: ''"Note that these are no YUI methods but the usual JavaScript DOM ones (and therefor applied to document.). YUI only enhances the JavaScript DOM methods."'' <br />
	That is definitely a strength of YUI. HTML DOM is a widely supported standard. Any in-browser JS should build on that, rather than ignore it.--[[User:Tim Hunt\|Tim Hunt]] 04:52, 21 July 2009 (UTC)		That is definitely a strength of YUI. HTML DOM is a widely supported standard. Any in-browser JS should build on that, rather than ignore it.--[[User:Tim Hunt\|Tim Hunt]] 04:52, 21 July 2009 (UTC)

Nakohdo: /* Next challenge */

2009-07-22T12:56:26Z

Next challenge

← Older revision		Revision as of 12:56, 22 July 2009
Line 303:		Line 303:
	If you really want to convince me, I would like to see a conversion of http://cvs.moodle.org/moodle/user/selector/script.js?view=markup (it is used on the assign roles and add group members pages). That is a serious application of JavaScript. However, that is also a lot of code, so it is not really fair to ask for a conversion just as a proof of concept.		If you really want to convince me, I would like to see a conversion of http://cvs.moodle.org/moodle/user/selector/script.js?view=markup (it is used on the assign roles and add group members pages). That is a serious application of JavaScript. However, that is also a lot of code, so it is not really fair to ask for a conversion just as a proof of concept.

			Re: ''"Note that these are no YUI methods but the usual JavaScript DOM ones (and therefor applied to document.). YUI only enhances the JavaScript DOM methods."''
			That is definitely a strength of YUI. HTML DOM is a widely supported standard. Any in-browser JS should build on that, rather than ignore it.--[[User:Tim Hunt\|Tim Hunt]] 04:52, 21 July 2009 (UTC)

	Re: ~~''"Note that these are no YUI methods but~~ the ~~usual JavaScript DOM ones (~~and ~~therefor applied to document.). YUI only enhances~~ the ~~JavaScript DOM methods~~.~~"'' That is definitely a strength of YUI~~. ~~HTML DOM is a widely supported standard. Any in-browser JS should build on that, rather than ignore it~~.--[[User:~~Tim Hunt~~\|~~Tim Hunt~~]] 04:52, 21 July 2009 (UTC)		: Thanks for the feedback, Tim - and the next challenge... --[[User:Frank Ralf\|Frank Ralf]] 07:48, 21 July 2009 (UTC)

	~~: Thanks for the feedback, Tim - and the~~ next challenge~~... --~~[[~~User:Frank Ralf\|Frank Ralf~~]] ~~07:48, 21 July 2009 (UTC)~~		The next challenge will take place here on [[Frank_Ralf/JavaScript2]].

	== See also ==		== See also ==
	* [[Javascript FAQ]]		* [[Javascript FAQ]]

Nakohdo: /* Another version */

2009-07-22T10:36:30Z

Another version

← Older revision		Revision as of 10:36, 22 July 2009
Line 266:		Line 266:
	* We use the shortcut $(function() {...} instead of $(document).ready(function() {...}.		* We use the shortcut $(function() {...} instead of $(document).ready(function() {...}.
	* We don't need the class="teacher" anymore on the checkbox items.		* We don't need the class="teacher" anymore on the checkbox items.
	* '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if ~~you~~ reload the page while the selectbox is checked.		* '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if we reload the page while the selectbox is checked.

	<code php>		<code php>

Nakohdo: /* Another version */

2009-07-22T10:35:53Z

Another version

← Older revision		Revision as of 10:35, 22 July 2009
Line 266:		Line 266:
	* We use the shortcut $(function() {...} instead of $(document).ready(function() {...}.		* We use the shortcut $(function() {...} instead of $(document).ready(function() {...}.
	* We don't need the class="teacher" anymore on the checkbox items.		* We don't need the class="teacher" anymore on the checkbox items.
	* [EDIT] We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page.		* '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if you reload the page while the selectbox is checked.

	<code php>		<code php>

← Older revision		Revision as of 20:36, 14 July 2021
Line 17:		Line 17:
	That is the original code. There's a lot of DOM traversal and node counting going on due to browser incompatibilities.		That is the original code. There's a lot of DOM traversal and node counting going on due to browser incompatibilities.

	<~~code~~ php>		<syntaxhighlight lang="php">
	<script type="text/javascript">		<script type="text/javascript">
	var teacherslist=document.getElementById('pe_teachers')		var teacherslist=document.getElementById('pe_teachers')
Line 54:		Line 54:
	Using Moodle's default JavaScript library [[Development:YUI\| YUI]] we can overcome those browser inconsistencies. We also move the inline "onclick" event handler to the JavaScript. (Note that the required YUI libraries are already part of a standard Moodle installation.) For attaching the event handler we had to add an ID to the select checkbox.		Using Moodle's default JavaScript library [[Development:YUI\| YUI]] we can overcome those browser inconsistencies. We also move the inline "onclick" event handler to the JavaScript. (Note that the required YUI libraries are already part of a standard Moodle installation.) For attaching the event handler we had to add an ID to the select checkbox.

	<~~code~~ php>		<syntaxhighlight lang="php">
	require_js(array(		require_js(array(
	'yui_yahoo',		'yui_yahoo',
Line 95:		Line 95:
	(Note that the required jQuery library is not part of a standard Moodle installation so you have to provide it yourself.)		(Note that the required jQuery library is not part of a standard Moodle installation so you have to provide it yourself.)

	<~~code~~ php>		<syntaxhighlight lang="php">
	require_js(array(		require_js(array(
	'jquery/jquery-1.3.2.min.js',		'jquery/jquery-1.3.2.min.js',
Line 129:		Line 129:
	=== YUI ===		=== YUI ===

	<~~code~~ php>		<syntaxhighlight lang="php">
	require_js('yui_dom-event');		require_js('yui_dom-event');

Line 152:		Line 152:
	=== jQuery ===		=== jQuery ===

	<~~code~~ php>		<syntaxhighlight lang="php">
	require_js('jquery/jquery-1.3.2.min.js');		require_js('jquery/jquery-1.3.2.min.js');

Line 171:		Line 171:

	: You're right, Tim, the show() part is not very precise and would behave like you suggest. But that could easily be amended by defining the context of the form items more precisely, thus restricting the scope to the fieldset at hand: --[[User:Frank Ralf\|Frank Ralf]] 16:15, 20 July 2009 (UTC)		: You're right, Tim, the show() part is not very precise and would behave like you suggest. But that could easily be amended by defining the context of the form items more precisely, thus restricting the scope to the fieldset at hand: --[[User:Frank Ralf\|Frank Ralf]] 16:15, 20 July 2009 (UTC)
	:<~~code~~ php>$('#pe_teachers .fitem').show('slow');</syntaxhighlight>		:<syntaxhighlight lang="php">$('#pe_teachers .fitem').show('slow');</syntaxhighlight>

	== Fair comparison - Next round ==		== Fair comparison - Next round ==
Line 182:		Line 182:
	[[Image:JavaScript1 Teacher list.png]]		[[Image:JavaScript1 Teacher list.png]]

	<~~code~~ php>		<syntaxhighlight lang="php">
	$mform =& $this->_form;		$mform =& $this->_form;

Line 207:		Line 207:
	Actually, I cheated a bit with the first version by giving the checkbox for the "Show only selected" option an ID. This is a bit problematic because in the HTML the ID is rendered as "id_showselected", which you might not suspect.		Actually, I cheated a bit with the first version by giving the checkbox for the "Show only selected" option an ID. This is a bit problematic because in the HTML the ID is rendered as "id_showselected", which you might not suspect.

	<~~code~~ php>		<syntaxhighlight lang="php">
	$mform->addElement(		$mform->addElement(
	'checkbox',		'checkbox',
Line 223:		Line 223:
	So here's is the refactored code which matches the jQuery version more closely:		So here's is the refactored code which matches the jQuery version more closely:

	<~~code~~ php>		<syntaxhighlight lang="php">
	<script type="text/javascript">		<script type="text/javascript">
	YAHOO.util.Event.onDOMReady(function() {		YAHOO.util.Event.onDOMReady(function() {
Line 249:		Line 249:
	* The ''toggle()'' method provides animation as '''feedback''' for the user to see what's going on with the form. This kind of feedback is lacking from the YUI version (We leave adding this as an exercise for the reader).		* The ''toggle()'' method provides animation as '''feedback''' for the user to see what's going on with the form. This kind of feedback is lacking from the YUI version (We leave adding this as an exercise for the reader).

	<~~code~~ php>		<syntaxhighlight lang="php">
	<script type="text/javascript">		<script type="text/javascript">
	$(document).ready(function() {		$(document).ready(function() {
Line 268:		Line 268:
	* '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if we reload the page while the selectbox is checked.		* '''EDIT''': We make the solution more robust by ensuring that the selectbox is unchecked when (re-)loading the page. Actually we are not checking the "checked" state of the selectbox anymore but only toggle the selectbox and the form items in parallel. That might get out of synch if we reload the page while the selectbox is checked.

	<~~code~~ php>		<syntaxhighlight lang="php">
	<script type="text/javascript">		<script type="text/javascript">
	$(function() {		$(function() {
Line 288:		Line 288:

	OK, that latest comparison looks quite favourable to jQuery. However, this is a very simple example, and that is always dangerous. For example compare "Hello world" in PHP and Java:		OK, that latest comparison looks quite favourable to jQuery. However, this is a very simple example, and that is always dangerous. For example compare "Hello world" in PHP and Java:
	<~~code~~ php>		<syntaxhighlight lang="php">
	<?php echo "Hello world!" ?>		<?php echo "Hello world!" ?>

← Older revision		Revision as of 15:16, 28 September 2009
Line 314:		Line 314:
	== See also ==		== See also ==
	* [[Javascript FAQ]]		* [[Javascript FAQ]]
			* [http://www.netbeans.org/kb/docs/web/js-toolkits-jquery.html "Using jQuery to Enhance the Appearance and Usability of a Web Page"] for NetBeans 6.7
			* [http://www.netbeans.org/kb/65/web/jquery-structured-document.html "Using jQuery to Enhance the Appearance and Usability of a Structured Document"] for NetBeans 6.5

User:Frank Ralf/JavaScript1 - Revision history

Mudrd8mz: Text replacement - "" to ""

Mudrd8mz: Text replacement - "" to ""

Nakohdo: /* See also */

Nakohdo: /* Next challenge */

Nakohdo: /* Next challenge */

Nakohdo: /* Next challenge */

Nakohdo: /* Next challenge */

Nakohdo: /* Next challenge */

Nakohdo: /* Another version */

Nakohdo: /* Another version */

Mudrd8mz: Text replacement - "`" to ""`

`Mudrd8mz: Text replacement - "`" to ""