Add hypothes.is protocol V06.000
authorymh <ymh.work@gmail.com>
Wed, 19 Sep 2018 18:09:27 +0200
changeset 1436 b3d23c1b791e
parent 1435 228471fbc9fa
child 1437 0f40b01221a0
Add hypothes.is protocol
web/client.php
web/common.php
web/marathon-serpentine-2018/config.php
web/polemicaltimeline.php
web/res/css/tweetcast.css
--- a/web/client.php	Fri Sep 14 15:44:27 2018 +0200
+++ b/web/client.php	Wed Sep 19 18:09:27 2018 +0200
@@ -11,6 +11,7 @@
 
 include_once 'common.php';
 
+
 /**
  * Do we already have a valid Access Token or need to go get one?
  */
@@ -52,7 +53,15 @@
     $_SESSION['TWITTER_REDIRECT_URL'] = isset($_REQUEST['auth_redirect']) ? $_REQUEST['auth_redirect'] : $_SERVER['HTTP_REFERER'];
 };
 
-$annotations = get_default_annotations_config($config, $translate);
+$defaultAnnotations = get_default_annotations_config($config, $translate);
+$annotations = array();
+foreach ($defaultAnnotations as $annot_cat => $annot_def) {
+    if($annot_cat !== 'default' && !isset($annot_def['colors_class'])) {
+        $annot_def['colors_class'] = 'tweetButton_'.md5($annot_cat);
+    }
+    $annotations[$annot_cat] = $annot_def;
+}
+
 
 ?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
@@ -91,6 +100,41 @@
        width: <?php echo($videoWidth); ?>px;
        height: <?php echo($videoHeight); ?>px;
     }
+    <?php
+    foreach ($annotations as $annot_cat => $annot_def) {
+        if($annot_cat === 'default') {
+            continue;
+        }
+        $hVal = intval(($annot_def['colors']['h']<1.0)?floatval($annot_def['colors']['h']) * 360.0:$annot_def['colors']['h']);
+        $sVal = intval(floatval($annot_def['colors']['s']) * 100.0);
+
+        $baseColor = "hsl($hVal, ${sVal}%, 90%)";
+        $borderColor = "hsl($hVal, ${sVal}%, 60%)";
+        $selectedColor = "hsl($hVal, 15%, 70%)";
+        $selectedBorderColor = "hsl($hVal, 15%, 60%)";
+        $gradientColor = "hsl($hVal, ${sVal}%, 50%)";
+    ?>
+    .tweetButton.<?php echo($annot_def['colors_class']) ?> {
+        background: <?php echo($baseColor); ?>;
+        border: solid <?php echo($borderColor); ?> 1px;
+        background-image: -webkit-linear-gradient(top, <?php echo($baseColor); ?>, <?php echo($gradientColor); ?>);
+        background-image: -moz-linear-gradient(top, <?php echo($baseColor); ?>, <?php echo($gradientColor); ?>);
+        background-image: -ms-linear-gradient(top, <?php echo($baseColor); ?>, <?php echo($gradientColor); ?>);
+        background-image: -o-linear-gradient(top, <?php echo($baseColor); ?>, <?php echo($gradientColor); ?>);
+        background-image: linear-gradient(to bottom, <?php echo($baseColor); ?>, <?php echo($gradientColor); ?>);
+    }
+    .tweetButton.<?php echo($annot_def['colors_class']) ?>.selected,.tweetButton:active.<?php echo($annot_def['colors_class']) ?>:active,.tweetButton:hover.<?php echo($annot_def['colors_class']) ?>:hover.selected {
+        background: <?php echo($selectedColor); ?>;
+        border: solid <?php echo($selectedBorderColor); ?> 1px;
+    }
+    .tweetButton.<?php echo($annot_def['colors_class']) ?>:hover {
+        background-image: -webkit-linear-gradient(top, <?php echo($gradientColor); ?>, <?php echo($baseColor); ?>);
+        background-image: -moz-linear-gradient(top, <?php echo($gradientColor); ?>, <?php echo($baseColor); ?>);
+        background-image: -ms-linear-gradient(top, <?php echo($gradientColor); ?>, <?php echo($baseColor); ?>);
+        background-image: -o-linear-gradient(top, <?php echo($gradientColor); ?>, <?php echo($baseColor); ?>);
+        background-image: linear-gradient(to bottom, <?php echo($gradientColor); ?>, <?php echo($baseColor); ?>);
+    }
+    <?php } ?>
     </style>
 
     <script type="text/javascript">
@@ -112,7 +156,6 @@
                 }
             }
         }
-        console.log(annotations);
     </script>
     <?php if (isset($_SESSION['TWITTER_ACCESS_TOKEN'])) { ?>
     <script type="text/javascript" src="<?php echo(registry_url('twcx-main','js'))?>"></script>
--- a/web/common.php	Fri Sep 14 15:44:27 2018 +0200
+++ b/web/common.php	Wed Sep 19 18:09:27 2018 +0200
@@ -433,6 +433,58 @@
                 "polemic_keywords" => array("?","??"),
                 "polemic_color" => "#036AAE"
             )
+        ),
+        "3" => array(
+            "default" => array(
+                "colors" => array(
+                    "h" => 0,
+                    "s" => 0
+                )
+            ),
+            "important" => array( // blue
+                "display_name" => "++ | Important",
+                "keywords" => "\\+\\+",
+                "colors" => array(
+                    "h" => .6,
+                    "s" => .8
+                ),
+                "polemic_cat" => 'OK',
+                "polemic_keywords" => array("++"),
+                "polemic_color" => "#196be6"
+            ),
+            "trouble" => array( // orange
+                "display_name" => "?? | Trouble", 
+                "keywords" => "\\?\\?",
+                "colors" => array(
+                    "h" => .13,
+                    "s" => .8
+                ),
+                "polemic_cat" => 'KO',
+                "polemic_keywords" => array("??"),
+                "polemic_color" => "#e6b919"
+            ),
+            "index" => array( // violet
+                "display_name" => "** | Index",
+                "keywords" => "\\*\\*",
+                "colors" => array(
+                    "h" => .83,
+                    "s" => .8
+                ),
+                "polemic_cat" => 'REF',
+                "polemic_keywords" => array("**","http://"),
+                "polemic_color" => "#e619e6"
+            ),
+            "comments" => array( // green
+                "display_name" => "== | Comment",
+                "keywords" => "\\=\\=",
+                "colors" => array(
+                    "h" => .3,
+                    "s" => .65
+                ),
+                "polemic_cat" => 'Q',
+                "polemic_keywords" => array("=="),
+                "polemic_color" => "#42e619"
+            )
         )
     );
 
--- a/web/marathon-serpentine-2018/config.php	Fri Sep 14 15:44:27 2018 +0200
+++ b/web/marathon-serpentine-2018/config.php	Wed Sep 19 18:09:27 2018 +0200
@@ -3,10 +3,10 @@
     'rep' => basename(__DIR__),
     'title' => "Work Marathon 2018",
     'hashtag' => "#workmarathon",
-	'abstract'   => "«&nbsp;<b>Work Marathon 2018</b>&nbsp;» <br/> <small>September 22nd, from 10am to 10pm @Serpentine Galleries (London)</small> 
+    'abstract'   => "«&nbsp;<b>Work Marathon 2018</b>&nbsp;» <br/> <small>September 22nd, from 10am to 10pm @Serpentine Galleries (London)</small> 
 <br/>«&nbsp;<b>Writing Workshop</b>&nbsp;» <br/> <small>September 23rd, from 9am to 4pm @Goethe-Institut (London)</small>", 
 
-   	'description'=> "<p><b>BERNARD STIEGLER: A MANIFESTO</b></p>
+    'description'=> "<p><b>BERNARD STIEGLER: A MANIFESTO</b></p>
 <p>
 The 2018 Work Marathon will invite artists, sociologists, anthropologists, writers,
 musicians, architects, scientists and philosophers to address cultural, political, physical
@@ -96,31 +96,32 @@
 </p>"
 ,
 
-   	'link' 		 => '',
-	'islive'     => false,
-	// 'islive_embed' => '<iframe width="560" height="315" src="https://www.youtube.com/embed/RtU_mdL2vBM" frameborder="0" allow="autoplay; encrypted-media" modestbranding=1 allowfullscreen></iframe>',
-	'keywords'   => 'Work Marathon, Neganthropocene, Neganthropy, Samrt Cities, Economy of Contribution, Contributive research, Internation, Building Information Modeling, Disruption',
-	'annotation_protocol_version' => "2",
+    'link' 		 => '',
+    'islive'     => false,
+    // 'islive_embed' => '<iframe width="560" height="315" src="https://www.youtube.com/embed/RtU_mdL2vBM" frameborder="0" allow="autoplay; encrypted-media" modestbranding=1 allowfullscreen></iframe>',
+    'keywords'   => 'Work Marathon, Neganthropocene, Neganthropy, Samrt Cities, Economy of Contribution, Contributive research, Internation, Building Information Modeling, Disruption',
+    'annotation_protocol_version' => "2",
 
-   	'partenaires'=> "<a href='http://www.serpentinegalleries.org/'
+    'partenaires'=> "<a href='http://www.serpentinegalleries.org/'
 class='footerLink' target='_blank'> Serpentine Galleries </a><a href='http://www.iri.centrepompidou.fr/' class='footerLink' target='_blank'> IRI </a>",
 
     'client_visual' => "images/Serpentine_Image-Polemic_Tweet_480x320.png", // 501 × 376 pixels
     
- 	'head_logo' => 'images/Serpentine_Image-Polemic_Tweet_171x63.png', // 171 × 63 pixels
- 	
-  	'slide_background' => "images/Serpentine_Image-Polemic_Tweet_606x282.png", // 606 × 282 pixels
+    'head_logo' => 'images/Serpentine_Image-Polemic_Tweet_171x63.png', // 171 × 63 pixels
+     
+    'slide_background' => "images/Serpentine_Image-Polemic_Tweet_606x282.png", // 606 × 282 pixels
     
-  	'archive_img' => "images/Serpentine_Image-Polemic_Tweet_270x150.png", // 270 × 150 pixels
+    'archive_img' => "images/Serpentine_Image-Polemic_Tweet_270x150.png", // 270 × 150 pixels
 
- 	'archive_title' => "Work Marathon 2018",
- 	'archive_description' => "from <a href=\"http://www.iri.centrepompidou.fr/\" target=\"_blank\">IRI</a> at Serpentine Galleries and Goethe-Institut<br/> September 22nd | 10am - 10pm and September 23rd | 9am - 4pm",
+    'archive_title' => "Work Marathon 2018",
+    'archive_description' => "from <a href=\"http://www.iri.centrepompidou.fr/\" target=\"_blank\">IRI</a> at Serpentine Galleries and Goethe-Institut<br/> September 22nd | 10am - 10pm and September 23rd | 9am - 4pm",
+    'annotation_protocol_version' => '3',
 
     // After the event
-	// 'metadata'		=> "fc62350e-69d9-11e1-9089-00145ea4a2be",
-	// 'duration'  	=> 10876600,
-	// 'player'        => "res/metadataplayer/src/js/LdtPlayer.js",
-	// 'div_height'    => 740,
-	// 'player_width'  => 650,
-	// 'player_height' => 500,
+    // 'metadata'		=> "fc62350e-69d9-11e1-9089-00145ea4a2be",
+    // 'duration'  	=> 10876600,
+    // 'player'        => "res/metadataplayer/src/js/LdtPlayer.js",
+    // 'div_height'    => 740,
+    // 'player_width'  => 650,
+    // 'player_height' => 500,
 );
\ No newline at end of file
--- a/web/polemicaltimeline.php	Fri Sep 14 15:44:27 2018 +0200
+++ b/web/polemicaltimeline.php	Wed Sep 19 18:09:27 2018 +0200
@@ -149,23 +149,30 @@
             {
                 type: "Polemic",
                 max_elements: 60,
-<?php if ($protocol_level < 3): ?>
+<?php if ($protocol_level < 4): ?>
                 polemics: []
 <?php elseif (isset($annotations)): ?>
                 polemics : [
 <?php foreach ($annotations as $annot_key => $annot_def): ?>
-    <?php if($annot_key == 'default') { continue; } ?>
+    <?php 
+    $hVal = (isset($annot_def['colors'])&&isset($annot_def['colors']['h']))?floatval($annot_def['colors']['h']):0.17;
+    $hVal = ($hVal<1)?floor($hVal*360.0):$hVal;
+    $sVal = (isset($annot_def['colors'])&&isset($annot_def['colors']['s']))?floatval($annot_def['colors']['s']):1.0;
+
+    $polemicColor = isset($annot_def['polemic_color'])?$annot_def['polemic_color']:rgb2hex(hsl2Rgb($hVal, $sVal, 0.5));
+
+    if($annot_key == 'default') { continue; } ?>
                     {
                         "name" : "<?php echo $annot_def['polemic_cat']; ?>",
                         "keywords" : <?php echo json_encode($annot_def['polemic_keywords']); ?>,
-                        "color" : "<?php echo $annot_def['polemic_color'];?>"
+                        "color" : "<?php echo $polemicColor; ?>"
                     },
 <?php endforeach; ?>
                 ]
 <?php endif; ?>
             },
 <?php endif; ?>
-<?php if ($protocol_level > 1): ?>
+<?php if ($protocol_level > 1 || isset($annotations)): ?>
             {
                 type: "MultiSegments",
                 //annotation_type: "chap"
--- a/web/res/css/tweetcast.css	Fri Sep 14 15:44:27 2018 +0200
+++ b/web/res/css/tweetcast.css	Wed Sep 19 18:09:27 2018 +0200
@@ -231,9 +231,11 @@
     background-position: 0 -24px;
 }
 .tweetButton {
-    float:left; margin: 2px 8px 0 0; width:75px; height:24px; text-decoration: none;
-    background: url('twcx-img/tweetbuttons.png');
+    float:left; margin: 2px 6px 0 0; width:75px; height:22px; text-decoration: none;
     color: #333; text-align:center; cursor: pointer; cursor: hand;
+    -webkit-border-radius: 0.5em;
+    -moz-border-radius: 0.5em;
+    border-radius: 0.5em;
 }
 .twbSyntax {
     font-weight: normal; font-size: 14px;
@@ -244,42 +246,7 @@
 .twbLabel {
     font-weight: bold; font-size: 10px;
 }
-.tweetButton.twbGreen {
-    background-position: 0 0;
-}
-.tweetButton.twbGreen.selected {
-    background-position: 0 -48px;
-}
-.tweetButton.twbGreen:hover {
-    background-position: 0 -24px;
-}
-.tweetButton.twbRed {
-    background-position: -75px 0;
-}
-.tweetButton.twbRed.selected {
-    background-position: -75px -48px;
-}
-.tweetButton.twbRed:hover {
-    background-position: -75px -24px;
-}
-.tweetButton.twbYellow {
-    background-position: -150px 0;
-}
-.tweetButton.twbYellow.selected {
-    background-position: -150px -48px;
-}
-.tweetButton.twbYellow:hover {
-    background-position: -150px -24px;
-}
-.tweetButton.twbBlue {
-    background-position: -225px 0;
-}
-.tweetButton.twbBlue.selected {
-    background-position: -225px -48px;
-}
-.tweetButton.twbBlue:hover {
-    background-position: -225px -24px;
-}
+
 #tweetCounter{
     float: right; background: transparent; border: none; font-size: 13px;
     font-weight:bold; margin: 4px 0 0; padding: 0; color: #666;