User:Jeremy/sandbox: Difference between revisions

From WikiMSK
No edit summary
No edit summary
 
(14 intermediate revisions by the same user not shown)
Line 1: Line 1:
WikiMSK is currently valued at '''{{#expr:{{NUMBEROFEDITS:R}}/1.5/40000*150000/1000 round 10}} thousand dollars'''
<html>
<div class="example">
 
</div>
<script>
// how to use the funciton on line 94
// for questions email felix@demont.is


Assuming
var images10 = [
*3 minutes average edit duration
  "https://c1.staticflickr.com/5/4408/36911638800_7f554b122f_o.jpg",
*8 hour day, 5 day per week, 50 week per year = 40,000 edits per year per person
  "https://c1.staticflickr.com/5/4345/36911638670_a1bbffc14c_o.jpg",
* $75 an hour
  "https://c1.staticflickr.com/5/4359/37166488521_67b51412f5_o.jpg",
* divide by 1.5 because some dits are minor etc
  "https://c1.staticflickr.com/5/4375/36911638530_9a5f5f9299_o.jpg",
  "https://c1.staticflickr.com/5/4417/36495726713_20521b5372_o.jpg",
  "https://c1.staticflickr.com/5/4376/36495726633_8b48fc83d3_o.jpg",
  "https://c1.staticflickr.com/5/4343/36495726613_4f8310a864_o.jpg",
  "https://c1.staticflickr.com/5/4425/36495726553_8fd2411a7f_o.jpg",
  "https://c1.staticflickr.com/5/4394/36495726443_cb6f6b0d9b_o.jpg",
  "https://c1.staticflickr.com/5/4348/36911638180_551e1c2257_o.jpg"
];


{| id="condition" class="infobox side noexcerpt"
var images19 = [
{{#if: {{{image|}}} | {{!-}}
  "https://wikimsk.org/w/img_auth.php/b/b7/MRI_T2_Lumbar_Spine_L1_Transpedicular_Axial.jpg",
{{!}} {{#if: {{{image|}}}| colspan="2" class="infobox-image"{{!}}[[File:{{{image|}}}]]  }}
  "https://wikimsk.org/w/img_auth.php/thumb/b/bb/MRI_T2_Lumbar_Spine_L1_Subpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L1_Subpedicular_Axial.jpg",
}}
  "https://wikimsk.org/w/img_auth.php/thumb/f/f9/MRI_T2_Lumbar_Spine_L1-L2_Transarticular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L1-L2_Transarticular_Axial.jpg",
{{#if: {{{caption|}}} | {{!-}}
"https://wikimsk.org/w/img_auth.php/thumb/b/be/MRI_T2_Lumbar_Spine_L2_Transpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L2_Transpedicular_Axial.jpg",
{{!}} {{#if: {{{caption|}}}| colspan="2" class="infobox-image"{{!}}<em><center>{{{caption|}}}</center></em>  }}
"https://wikimsk.org/w/img_auth.php/thumb/f/f1/MRI_T2_Lumbar_Spine_L2_Subpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L2_Subpedicular_Axial.jpg",
}}
"https://wikimsk.org/w/img_auth.php/thumb/4/40/MRI_T2_Lumbar_Spine_L2-L3_Transarticular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L2-L3_Transarticular_Axial.jpg",
|-
"https://wikimsk.org/w/img_auth.php/thumb/2/27/MRI_T2_Lumbar_Spine_L3_Transpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L3_Transpedicular_Axial.jpg",
! colspan="2" class="title"|{{PAGENAME}} [[File:Edit.png{{!}}link=https://wikimsk.org/w/index.php?title={{PAGENAME}}&action=formedit]]
"https://wikimsk.org/w/img_auth.php/thumb/e/e9/MRI_T2_Lumbar_Spine_L3_Subpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L3_Subpedicular_Axial.jpg",
|-
"https://wikimsk.org/w/img_auth.php/thumb/0/00/MRI_T2_Lumbar_Spine_L3-L4_Transarticular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L3-L4_Transarticular_Axial.jpg",
|asdfasfd
"https://wikimsk.org/w/img_auth.php/thumb/c/cc/MRI_T2_Lumbar_Spine_L4_Transpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L4_Transpedicular_Axial.jpg",
|-
"https://wikimsk.org/w/img_auth.php/thumb/5/59/MRI_T2_Lumbar_Spine_L4_Subpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L4_Subpedicular_Axial.jpg",
{{#if: {{{definition|}}} | {{!-}}
"https://wikimsk.org/w/img_auth.php/thumb/4/49/MRI_T2_Lumbar_Spine_L4-L5_Transarticular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L4-L5_Transarticular_Axial.jpg",
! Definition
"https://wikimsk.org/w/img_auth.php/thumb/a/ab/MRI_T2_Lumbar_Spine_L5_Transpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L5_Transpedicular_Axial.jpg",
{{!}} {{#if: {{{definition|}}}|[[Has condition definition::{{{definition}}}]]}}
"https://wikimsk.org/w/img_auth.php/thumb/1/13/MRI_T2_Lumbar_Spine_L5_Subpedicular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L5_Subpedicular_Axial.jpg",
}}
"https://wikimsk.org/w/img_auth.php/thumb/9/94/MRI_T2_Lumbar_Spine_L5-S1_Transarticular_Axial.jpg/600px-MRI_T2_Lumbar_Spine_L5-S1_Transarticular_Axial.jpg"
|-
];
{{#if: {{{epidemiology|}}} | {{!-}}
 
! Epidemiology
images = images10;
{{!}} {{#if: {{{epidemiology|}}}|[[Has condition epidemiology::{{{epidemiology}}}]]}}
images2 = images19;
}}
 
|-
function ImageStack (options) {
{{#if: {{{causes|}}} | {{!-}}
 
! Causes
  var self = this;
{{!}} {{#if: {{{causes|}}}|[[Has condition causes::{{{causes}}}]]}}
   
}}
  self.img_array = options.images;
|-
 
{{#if: {{{pathophysiology|}}} | {{!-}}
  self.stack = document.createElement('div');
! Pathophysiology
  self.stack.style.overflow = 'auto';
{{!}} {{#if: {{{pathophysiology|}}}|[[Has condition pathophysiology::{{{pathophysiology}}}]]}}
  self.stack.style.maxWidth = '100%';
}}
  self.stack.style.height = options.height;
|-
  self.stack.style.width = options.width;
{{#if: {{{classification|}}} | {{!-}}
  self.stack.style.backgroundSize = 'cover'
! Classification
  self.stack.style.position = 'relative';
{{!}} {{#if: {{{classification|}}}|[[Has condition classification::{{{classification}}}]]}}
 
}}
  var typeRegex = /(\D+)/
|-
  var sizeType = options.height.match(typeRegex)[0]
{{#if: {{{primaryprevention|}}} | {{!-}}
 
! Primary Prevention
  var numberRegex = /(\d+)/
{{!}} {{#if: {{{primaryprevention|}}}|[[Has condition primary prevention::{{{primaryprevention}}}]]}}
  self.height_number = Number( options.height.match(numberRegex)[0] )
}}
   
|-
  self.wrapper = document.createElement('div');
{{#if: {{{secondaryprevention|}}} | {{!-}}
 
! Secondary Prevention
  for (var i = 0; i < self.img_array.length; i++) {
{{!}} {{#if: {{{secondaryprevention|}}}|[[Has condition secondary prevention::{{{secondaryprevention}}}]]}}
   
}}
    var image = document.createElement('img');
|-
    image.src = self.img_array[i];
{{#if: {{{riskfactors|}}} | {{!-}}
   
! Risk Factors
    image.style.display = 'none';
{{!}} {{#if: {{{riskfactors|}}}|[[Has condition risk factors::{{{riskfactors}}}]]}}
    image.style.position = 'absolute';
}}
    image.style.width = options.width;
|-
    image.style.height = options.height;
{{#if: {{{clinicalfeatures|}}} | {{!-}}
    image.style.top = 0;
! Clinical Features
    image.style.left = 0;
{{!}} {{#if: {{{clinicalfeatures|}}}|[[Has condition clinical features::{{{clinicalfeatures}}}]]}}
    image.dataset.iid = i;
}}
   
|-
    self.wrapper.appendChild(image);
{{#if: {{{history|}}} | {{!-}}
   
! History
  }
{{!}} {{#if: {{{history|}}}|[[Has condition history::{{{history}}}]]}}
   
}}
  self.image_elements = self.wrapper.querySelectorAll('img');
|-
 
{{#if: {{{examination|}}} | {{!-}}
  self.scrollobject = document.createElement('div');
! Examination
  self.scrollobject.style.width = '100%';
{{!}} {{#if: {{{examination|}}}|[[Has condition examination::{{{examination}}}]]}}
  self.scrollobject.style.position = 'absolute';
}}
  self.scrollobject.style.zIndex = '2';
|-
  if (self.img_array.length > 15){
{{#if: {{{diagnosis|}}} | {{!-}}
  self.img_count = self.img_array.length;
! Diagnosis
  } else {
{{!}} {{#if: {{{diagnosis|}}}|[[Has condition diagnosis::{{{diagnosis}}}]]}}
  self.img_count = 15;
}}
  }
|-
  self.scrollobject_height = Math.floor( 0.1 * self.img_count * self.height_number );
{{#if: {{{tests|}}} | {{!-}}
 
! Tests
  self.scrollobject.style.height = self.scrollobject_height + sizeType;
{{!}} {{#if: {{{tests|}}}|[[Has condition tests::{{{tests}}}]]}}
 
}}
  self.scrollUpdate = function (e) {
|-
   
{{#if: {{{ddx|}}} | {{!-}}
    self.height_number = self.stack.getBoundingClientRect().height
! DDX
    self.scrollobject_height = Math.floor( 0.1 * self.img_count * self.height_number );
{{!}} {{#if: {{{ddx|}}}|[[Has condition ddx::{{{ddx}}}]]}}
   
}}
    var sT = self.stack.scrollTop
|-
    var hn05 = self.img_array.length - 1
{{#if: {{{taxonomy|}}} | {{!-}}
    var hh = (self.scrollobject_height - self.height_number) / hn05
! Taxonomy
    scrollval = Math.floor(sT / (hh))
{{!}} {{#if: {{{taxonomy|}}}|[[Has condition taxonomy::{{{taxonomy}}}]]}}
   
}}
    self.currentimg = self.image_elements[scrollval].src
|-
   
{{#if: {{{validity|}}} | {{!-}}
    self.stack.style.backgroundImage = 'url(' + self.currentimg + ')';
! Validity
   
{{!}} {{#if: {{{validity|}}}|[[Has condition validity::{{{validity}}}]]}}
  }
}}
 
|-
  self.stack.addEventListener('scroll', self.scrollUpdate);
{{#if: {{{treatment|}}} | {{!-}}
 
! Treatment
  self.currentimg = self.image_elements[0].src
{{!}} {{#if: {{{treatment|}}}|[[Has condition treatment::{{{treatment}}}]]}}
  self.stack.style.backgroundImage = 'url(' + self.currentimg + ')';
}}
 
|-
  /*
{{#if: {{{prognosis|}}} | {{!-}}
 
! Prognosis
  window.addEventListener('resize', function () {
{{!}} {{#if: {{{prognosis|}}}|[[Has condition prognosis::{{{prognosis}}}]]}}
    var stackRect = self.stack.getBoundingClientRect()
}}
   
|-
    console.log(stackRect)
|}
   
    self.height_number = stackRect.height
    self.scrollobject_height = Math.floor( 0.1 * self.img_array.length * self.height_number );
   
    self.stack.style.width = stackRect.width + 'px'
    self.stack.style.eight = stackRect.width + 'px'
  })
 
  */
     
  self.stack.appendChild(self.wrapper);
  self.stack.appendChild(self.scrollobject);
 
  return self.stack;
 
}
 
/*
 
The function ImageStack returns a Element Node, which can be appended to an already existing element or modified, however someone wants to change it.
 
The parameters should have to be a height of the element, the width of the elment, and a list (Array) to all the images.
 
*/
 
var stack = new ImageStack({
  images: images2,
  height: '350px',
  width: '350px'
});
 
var stack2 = new ImageStack({
  images: images,
  height: '30rem',
  width: '30rem'
});
 
// append the stack to the .example element
 
document.querySelector('.example').appendChild(stack);
document.querySelector('.example').appendChild(stack2);
</script>
</html>

Latest revision as of 22:17, 24 October 2022