scheduled_resource 0.0.1

data/lib/assets/javascripts/time_pix.js.coffee

@@ -0,0 +1,103 @@
+class @TimePix            # Ultimately, an angular $service
+  constructor: -> null
+
+  @scroll_container: -> $('#scrolling-container')
+
+  @set_display_parms: => # bound
+    @pixWindow =  parseInt(window.innerWidth) - 110
+    @scroll_container().css( 'width', @pixWindow + 'px' )
+    $('#scrollbar-hider').css('width', @pixWindow + 61 + 'px' )
+
+  
+  @baseTime: 0
+  @timeWindow: (3 * 3600)
+  @pixWindow: 750         # Matching width of #scrolling-container
+
+  # Time range [@tlo..@thi] is where the DOM has data.
+  @tlo: null
+  @thi: null
+
+  # Meta-data about most recent request
+  @meta: {}
+
+  @merge_metadata: (data) ->
+    @meta = data.meta
+    @baseTime ||= @meta['min_time']
+    @tlo = @tlo && Math.min( @tlo, @meta.t1 ) || @meta.t1
+    @thi = @thi && Math.max( @thi, @meta.t2 ) || @meta.t2
+    @inc = @meta.inc
+    @timeWindow = @meta.visible_time if @meta.visible_time
+
+  @next_hi: -> @thi + @timeWindow
+  @next_lo: -> @tlo - @timeWindow
+
+  # Ignoring @baseTime offset
+  @secs_to_pix_scale: (seconds) ->
+    pix = seconds * @pixWindow / @timeWindow
+    # Math.round(pix * 100) / 100
+
+  @pix_to_secs: (pix) ->
+    @baseTime + Math.round(pix * @timeWindow  / @pixWindow)
+
+  @style_geo: (block) ->
+    [s, e] = [block.starttime, block.endtime]             # per margins V
+    "left: #{@secs_to_pix_scale(s - @baseTime)}px; " +
+    "width: #{@secs_to_pix_scale(e-s)-4}px;" 
+
+  @row_kind: (tag) ->  # may/may not belong here.
+    tag.split('_')[0]
+
+
+
+
+  @ux_time_now: ->
+    new Date().valueOf() / 1000
+
+  @ux_time_offset: (uxt) ->
+    uxt - @baseTime
+
+  @ux_time_offset_pix: (uxt) ->
+    @secs_to_pix_scale @ux_time_offset(uxt)
+
+  @scroll_to_ux_time: (uxt) ->
+    sc = @scroll_container()
+    sc.scrollLeft( @ux_time_offset_pix(uxt) )
+
+  @scroll_to_thi: ->
+    @scroll_to_ux_time( @thi - @timeWindow )
+
+  @ux_time_of_pix: (x) ->
+    @pix_to_secs(x) 
+
+  @scroll_to_tlo: =>   # bound
+    @scroll_to_ux_time @tlo
+
+  @set_time_cursor: => # bound
+    cursor = $('#current-time-cursor')
+    now_offset = @ux_time_offset_pix( @ux_time_now() );
+    cursor.css( 'left',  now_offset + 'px' )
+    setTimeout( @set_time_cursor, 15 * 1000 )
+
+
+
+  @scroll_monitor: =>
+    sc = @scroll_container()
+    if @scroll_monitor.old_scroll != sc.scrollLeft()
+      @scroll_monitor.old_scroll = sc.scrollLeft()
+      @scroll_monitor.scroll_timestamp = new Date()
+
+      # Fetch more data if needed
+      l_vis_time = @pix_to_secs sc.scrollLeft()
+      r_vis_time = l_vis_time + @timeWindow
+
+      if      r_vis_time > @thi
+        RsrcListCtrlScope.$apply RsrcListCtrlScope.more_data
+      else if l_vis_time < @tlo
+        RsrcListCtrlScope.$apply RsrcListCtrlScope.less_data
+    else
+      if new Date() - @scroll_monitor.scroll_timestamp > 1000
+        filter_justify_tweaks( sc ) # Try to make scrolled-off content visible
+        @scroll_monitor.scroll_timestamp = new Date()
+
+    setTimeout @scroll_monitor, 100
+

data/lib/assets/javascripts/use_block.js.coffee

@@ -0,0 +1,131 @@
+class @UseBlock
+  constructor: -> nil
+
+
+class @ZTimeHeaderDayUseBlock extends UseBlock
+  constructor: -> nil
+
+  @process: (block) ->
+    @label       block
+    @css_classes block
+    block
+
+  @label: (block) ->
+    block.label  = block.title
+  
+  @css_classes: (block) ->
+    # Could just as well come from server.
+    classes = 'ZTimeHeaderDayRow '
+    block.css_classes = classes
+
+
+
+class @ZTimeHeaderHourUseBlock extends UseBlock
+  constructor: -> nil
+
+  @process: (block) ->
+    @label       block
+    @css_classes block
+    block
+
+  @label: (block) ->
+    block.label  = block.title
+  
+  @css_classes: (block) ->
+    # Could just as well come from server.
+    # classes = 'ZTimeHeaderHourRow '
+    # block.css_classes = classes
+
+
+
+
+
+
+
+# Uses these fields of block: title, subtitle, category, category_type, 
+# Sets these fields of block: label, css_classes
+class @StationUseBlock extends UseBlock
+  constructor: -> nil
+
+  @process: (block) ->
+    @css_classes block
+    @label       block
+    block
+
+  @label: (block) ->
+    block.label  = block.title
+    block.label += ":<br> #{block.subtitle}" if block.subtitle
+    block.label += "<span class='flags'>#{@flags(block)}</span>"
+
+  @flags: (block) ->
+    flags  = ''
+    flags += '  hd'  if block.hdtv
+    flags += '  new' unless block.previouslyshown
+    flags
+
+  @css_classes: (block) ->
+    block.css_classes = @ct_name(block) + " " + @to_css_class(block.category)
+
+
+  @ct_name: (block) ->
+    ct = block.category_type || ''
+    return '' if /unknown/i.test ct
+    "type_#{ct.replace /[^a-z0-9\-_]+/gi, '_'}"
+
+  @to_css_class: (category, clss = null) ->
+    return clss if (clss = @memo[ category ])
+    @memo[ category ] = @css_class_search category
+
+  @css_class_search: (category) ->
+    for key, regex of @categories
+      return ('cat_' + key) if regex.test category
+    'cat_Unknown' 
+
+
+  @memo: {}
+
+  @categories:
+    Action:           /\b(action|adven)/i
+    Adult:            /\b(adult|erot)/i
+    Animals:          /\b(animal|tiere)/i
+    Art_Music:        /\b(art|dance|music|cultur)/i
+    Business:         /\b(biz|busine)/i
+    Children:         /\b(child|infan|animation)/i
+    Comedy:           /\b(comed|entertain|sitcom)/i
+    Crime_Mystery:    /\b(crim|myster)/i
+    Documentary:      /\b(doc)/i
+    Drama:            /\b(drama)/i
+    Educational:      /\b(edu|interests)/i
+    Food:             /\b(food|cook|drink)/i
+    Game:             /\b(game)/i
+    Health_Medical:   /\b(health|medic)/i
+    History:          /\b(hist)/i
+    Horror:           /\b(horror)/i
+    HowTo:            /\b(how|home|house|garden)/i
+    Misc:             /\b(special|variety|info|collect)/i
+    News:             /\b(news|current)/i
+    Reality:          /\b(reality)/i
+    Romance:          /\b(romance)/i
+    SciFi_Fantasy:    /\b(fantasy|sci\\w*\\W*fi)/i
+    Science_Nature:   /\b(science|nature|environm)/i
+    Shopping:         /\b(shop)/i
+    Soaps:            /\b(soaps)/i
+    Spiritual:        /\b(spirit|relig)/i
+    Sports:           /\b(sport)/i
+    Talk:             /\b(talk)/i
+    Travel:           /\b(travel)/i
+    War:              /\b(war)/i
+    Western:          /\b(west)/i
+
+
+# console.log ChannelUseBlock.css_class_search('action')
+# console.log ChannelUseBlock.to_css_class('action')
+
+# block =
+#   category_type: 'series'
+#   category: 'adventure'
+
+# block = {"airdate":0,"category":"Reality","category_type":"series","chanid":1791,"description":"Alexia enlists Troy's help to find her father.","endtime":"2013-03-04T12:00:00-08:00","first":true,"generic":false,"hdtv":false,"last":true,"listingsource":0,"manualid":0,"originalairdate":"2009-03-28","partnumber":0,"parttotal":0,"pid":"","previouslyshown":1,"programid":"EP010679340014","seriesid":"EP01067934","showtype":"Series","stars":0.0,"starttime":"2013-03-04T11:30:00-08:00","stereo":false,"subtitle":"A Daughter's Mission","subtitled":false,"syndicatedepisodenumber":"204","title":"The Locator"}
+
+# console.log ChannelUseBlock.ct_name block
+# console.log ChannelUseBlock.css_classes block

data/lib/assets/stylesheets/scheduled_resource.css.scss

@@ -0,0 +1,250 @@
+/* schedule.css.scss
+   Classes for scheduled_resource gem
+    - Mike Cannon (Mon Mar 4 '13)
+                                       (http://github.com/emeyekayee/tv4)
+                                       (michael.j.cannon@gmail.com)
+ */
+
+$bg-color:      #1B3B5F;
+            /*  #21456F; */
+            /*  #002650; */
+$daytime-bg:    #33669E;
+$nitetime-bg:   #102441;
+
+
+body {
+  border:           0;
+  margin:           10px;
+  padding:          0;
+  font-size:        11pt;
+  font-family:      Arial, Helvetica, sans-serif;
+  background:       $bg-color;
+}
+
+h2        {  color: #204882 }
+
+a:link    {  color: white;  text-decoration: none;}
+a:visited {  color: white;  text-decoration: none;}
+
+
+.timespan {
+  position:         absolute;
+  left:             0px;
+}
+
+.flags {
+  color:            #ffff9b;
+}
+
+.blockdiv {
+  position:         absolute;
+  border:           1px solid $bg-color;
+  font-size:        11px;
+  line-height:      1.2;
+  white-space:      nowrap;
+  overflow:         hidden;
+}
+
+#current-time-cursor {
+  border-left:      1px solid rgba(255,0,0,.65);
+  z-index:          1;
+  width:            1px;
+  height:           4000px;
+  position:         absolute;
+}
+
+.text_locator {
+  position:         absolute;
+  left:             2px;
+  right:            4px;
+  overflow:         hidden;
+}
+
+#schedule-container{
+  position:         relative;
+}
+
+#scrolling-container {
+  overflow-x:       scroll;
+  padding-bottom:   1px;
+  vertical-align:   top;
+  width:            750px;
+  border:           1px solid red;
+}
+
+#positioned-container {
+  overflow:         hidden;
+  margin:           1px;
+  margin-top:       0px;
+  width:            140000px;
+  position:         relative;
+}
+
+#labels-container {
+  width:            60px;
+  vertical-align:   top;
+  position:         absolute;
+}
+
+#timespans-container {
+  vertical-align:   top;
+  position:         absolute;
+  left:             65px;
+}
+
+#resource-labels {
+  position:         relative;
+  padding-bottom:   2px;
+  left:             5px;
+  background:       $bg-color;
+  border:           1px solid red;
+}
+
+
+#scrollbar-hider {
+  width:            811px;   /* per #resource-labels + */
+  height:           20px;    /* #scrolling-container   */
+  background:       $bg-color;
+  position:         relative;
+  top:              -20px;
+  left:             5px;
+  border-top:       1px solid red;
+}
+
+.rsrcRow {
+  display:          block;
+  margin:           1px;
+  margin-left:      0px;
+}
+
+.rsrclabel {
+  position:         absolute;
+  width:            56px;
+  border:           1px solid $bg-color;
+  background:       transparent; /* #265990 */
+  font-weight:      bold;
+  text-align:       center;
+  color:            white;
+
+  img {
+    position:         absolute;
+    left:             0;
+    z-index:          0;
+    background:       $bg-color;
+  }
+
+  > .label-text {
+    position:         absolute;
+    z-index:          2;
+    color:            rgba(255,255,255,.65);  /* #fff */
+    text-align:       center;
+    width:            56px;
+  }
+
+  // This is used to shelve a background image (if any) vs foreground label text.
+  > div.filter {
+    position:         absolute;
+    background:       $bg-color;
+    width:            56px;
+    z-index:          1;
+    opacity:          0.5;
+  }
+}
+
+
+
+.ZTimeHeaderHourrow,
+.ZTimeHeaderHourRow,
+.ZTimeHeaderDayrow,
+.ZTimeHeaderDayRow {
+  height:           22px;
+
+  .rsrclabel {
+    height:         22px;
+    width:          56px;
+    div {
+      font-size:    19px;
+      white-space:  nowrap;
+      overflow:     hidden;
+      text-align:   center;
+      color:        rgba(204, 204, 255, 0.5);
+    }
+
+    img {
+      height:       22px;   /* Is "inherit" still a no go for IE ? */
+      width:        56px;
+    }
+
+    > div.filter {
+      height:       22px;
+    }
+  }
+
+  .text_locator {
+    text-align:     center;
+  }
+
+  .blockdiv {
+    height:         18px;
+    padding:        2px;
+    background:     #265990;
+    font-size:      14px;
+  }
+}
+
+
+.ZTimeHeaderHourrow,
+.ZTimeHeaderHourRow {
+  .blockdiv {
+    font-size:      12px;
+    padding-top:     4px;
+  }
+}
+
+
+.ZTimeHeaderDayrow,
+.ZTimeHeaderDayRow {
+  .blockdiv {
+    font-size:      16px;
+  }
+}
+
+
+.blockdiv.ZTimeHeaderDayRow { /* background: $daytime-bg; */
+  background: -webkit-linear-gradient(left,
+                                      $nitetime-bg, $nitetime-bg 24%, $daytime-bg 26%,
+                                      $daytime-bg 74%, $nitetime-bg 76%, $nitetime-bg );
+}
+
+.blockdiv.dayTimeblock  { background: $daytime-bg  }
+.blockdiv.niteTimeblock { background: $nitetime-bg }
+
+
+// This is included as a model for adding a new scheduled resource type.
+// In fact is it what is used for the tv4 example.
+// .Stationrow {
+//   height:           36px;
+
+//   .rsrclabel {
+//     div {
+//       font-size:    16pt;
+//     }
+
+//     img {
+//       height:       36px;       /* Is "inherit" still a no go for IE?  */
+//       width:        56px;
+//     }
+
+//     > div.filter {
+//       height:       36px;
+//     }
+
+//   }
+
+//   .blockdiv {
+//     height:         32px;
+//     padding:        2px;
+//   }
+// }
+
+