|
|
| Line 1: |
Line 1: |
| <noinclude>__NOTOC__ | | <noinclude>__NOTOC__ |
| Showwarning is a simple javascript to display a warning message.
| | This is just a little widget to prove how we code, this text will be visible when you "look" at the widget |
| | |
| The syntax is {{ Widgets:Showwarning | messageid | divid | [ colour <i>optional</i> ]}}
| |
| </noinclude> | | </noinclude> |
| <includeonly> | | <includeonly> |
| <style type="text/css" media="all">
| |
| .prettybox {
| |
| -moz-border-radius: 8px;
| |
| -webkit-border-radius: 8px;
| |
| border-radius: 8px;
| |
| /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
| |
| -moz-box-shadow: 0px 0px 20px #000000;
| |
| -webkit-box-shadow: 0px 0px 20px #000000;
| |
| box-shadow: 0px 0px 20px #000000;
| |
| /*IE 7 AND o8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
| |
| text-align: center;
| |
| margin: 10px;
| |
| padding: 15px;
| |
| }
| |
| </style>
| |
| <script type="text/javascript"> | | <script type="text/javascript"> |
| var colour ='<!--{$colour|escape:'quotes'|default:red}-->'; //If there is no colour well set it to red | | var text = '<!--{$text}-->'; |
| var message = '<!--{$message|escape:'quotes'}-->'; //We should have a message | | var colour = '<!--{$colour}-->'; |
| var divid = '<!--{$divid|escape:'quotes'}-->'; //Remove quotes
| | document.write('So I need to send the message' + text); |
| //Thats all the user input
| | document.write('And I will use the colour' + colour); |
| | | document.write('I wrote something!!!'); |
| var texts = '{ "messages" : [{ "Warning":"This is a warning"}]}';
| |
| var obj = JSON.parse(texts); //Yes, I know, this is a ridiculously problematic way to so something really simple, but we want to change the above to call SMWAPI next iteration.
| |
| document.getElementById(divid).innerHTML = '<H3>' + message + ' from ' + wgSiteName + '<br>' + obj.messages[0].Warning ;
| |
| /*
| |
| wgSiteName is the preset variable we spoke of, and yes, it is a ridicolous way of addressing a JSON object, but this is about how to do MediaWiki javasctipt, not how to use JSON. Now lets do some CSS to our div
| |
| */
| |
| document.getElementById(divid).style.backgroundColor = colour; | |
| //And because we are (kind of) web developing, we'll apply the pretty box css to our box
| |
| document.getElementById(divid).className = 'prettybox' ; | |
| | |
| | |
| </script> | | </script> |
| </includeonly> | | </includeonly> |